|
|
|
@ -7,7 +7,7 @@ import { deactivateUserModal, deleteUserModal } from 'soapbox/actions/moderation
|
|
|
|
|
import snackbar from 'soapbox/actions/snackbar';
|
|
|
|
|
import Avatar from 'soapbox/components/avatar';
|
|
|
|
|
import HoverRefWrapper from 'soapbox/components/hover-ref-wrapper';
|
|
|
|
|
import { Accordion, Button, HStack } from 'soapbox/components/ui';
|
|
|
|
|
import { Accordion, Button, Stack, HStack, Text } from 'soapbox/components/ui';
|
|
|
|
|
import DropdownMenu from 'soapbox/containers/dropdown-menu-container';
|
|
|
|
|
import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
|
|
|
|
|
import { makeGetReport } from 'soapbox/selectors';
|
|
|
|
@ -82,49 +82,68 @@ const Report: React.FC<IReport> = ({ id }) => {
|
|
|
|
|
const reporterAcct = account.acct as string;
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div className='admin-report' key={report.id}>
|
|
|
|
|
<div className='admin-report__avatar'>
|
|
|
|
|
<HoverRefWrapper accountId={targetAccount.id as string} inline>
|
|
|
|
|
<Link to={`/@${acct}`} title={acct}>
|
|
|
|
|
<Avatar account={targetAccount} size={32} />
|
|
|
|
|
</Link>
|
|
|
|
|
</HoverRefWrapper>
|
|
|
|
|
</div>
|
|
|
|
|
<div className='admin-report__content'>
|
|
|
|
|
<h4 className='admin-report__title'>
|
|
|
|
|
<HStack space={3} className='p-3' key={report.id}>
|
|
|
|
|
<HoverRefWrapper accountId={targetAccount.id} inline>
|
|
|
|
|
<Link to={`/@${acct}`} title={acct}>
|
|
|
|
|
<Avatar account={targetAccount} size={32} />
|
|
|
|
|
</Link>
|
|
|
|
|
</HoverRefWrapper>
|
|
|
|
|
|
|
|
|
|
<Stack space={3} grow>
|
|
|
|
|
<Text tag='h4' weight='bold' truncate>
|
|
|
|
|
<FormattedMessage
|
|
|
|
|
id='admin.reports.report_title'
|
|
|
|
|
defaultMessage='Report on {acct}'
|
|
|
|
|
values={{ acct: (
|
|
|
|
|
<HoverRefWrapper accountId={account.id as string} inline>
|
|
|
|
|
<HoverRefWrapper accountId={account.id} inline>
|
|
|
|
|
<Link to={`/@${acct}`} title={acct}>@{acct}</Link>
|
|
|
|
|
</HoverRefWrapper>
|
|
|
|
|
) }}
|
|
|
|
|
/>
|
|
|
|
|
</h4>
|
|
|
|
|
<div className='admin-report__statuses'>
|
|
|
|
|
{statusCount > 0 && (
|
|
|
|
|
<Accordion
|
|
|
|
|
headline={`Reported posts (${statusCount})`}
|
|
|
|
|
expanded={accordionExpanded}
|
|
|
|
|
onToggle={handleAccordionToggle}
|
|
|
|
|
>
|
|
|
|
|
{statuses.map(status => <ReportStatus report={report} status={status} key={status.id} />)}
|
|
|
|
|
</Accordion>
|
|
|
|
|
)}
|
|
|
|
|
</div>
|
|
|
|
|
<div className='admin-report__quote'>
|
|
|
|
|
</Text>
|
|
|
|
|
|
|
|
|
|
{statusCount > 0 && (
|
|
|
|
|
<Accordion
|
|
|
|
|
headline={`Reported posts (${statusCount})`}
|
|
|
|
|
expanded={accordionExpanded}
|
|
|
|
|
onToggle={handleAccordionToggle}
|
|
|
|
|
>
|
|
|
|
|
<Stack space={4}>
|
|
|
|
|
{statuses.map(status => (
|
|
|
|
|
<ReportStatus
|
|
|
|
|
key={status.id}
|
|
|
|
|
report={report}
|
|
|
|
|
status={status}
|
|
|
|
|
/>
|
|
|
|
|
))}
|
|
|
|
|
</Stack>
|
|
|
|
|
</Accordion>
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
|
|
<Stack>
|
|
|
|
|
{(report.comment || '').length > 0 && (
|
|
|
|
|
<blockquote className='md' dangerouslySetInnerHTML={{ __html: report.comment }} />
|
|
|
|
|
<Text
|
|
|
|
|
tag='blockquote'
|
|
|
|
|
dangerouslySetInnerHTML={{ __html: report.comment }}
|
|
|
|
|
/>
|
|
|
|
|
)}
|
|
|
|
|
<span className='byline'>
|
|
|
|
|
—
|
|
|
|
|
<HoverRefWrapper accountId={account.id as string} inline>
|
|
|
|
|
<Link to={`/@${reporterAcct}`} title={reporterAcct}>@{reporterAcct}</Link>
|
|
|
|
|
|
|
|
|
|
<HStack space={1}>
|
|
|
|
|
<Text theme='muted' tag='span'>—</Text>
|
|
|
|
|
|
|
|
|
|
<HoverRefWrapper accountId={account.id} inline>
|
|
|
|
|
<Link
|
|
|
|
|
to={`/@${reporterAcct}`}
|
|
|
|
|
title={reporterAcct}
|
|
|
|
|
className='text-primary-600 dark:text-accent-blue hover:underline'
|
|
|
|
|
>
|
|
|
|
|
@{reporterAcct}
|
|
|
|
|
</Link>
|
|
|
|
|
</HoverRefWrapper>
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</HStack>
|
|
|
|
|
</Stack>
|
|
|
|
|
</Stack>
|
|
|
|
|
|
|
|
|
|
<HStack space={2} alignItems='start'>
|
|
|
|
|
<Button onClick={handleCloseReport}>
|
|
|
|
|
<FormattedMessage id='admin.reports.actions.close' defaultMessage='Close' />
|
|
|
|
@ -132,7 +151,7 @@ const Report: React.FC<IReport> = ({ id }) => {
|
|
|
|
|
|
|
|
|
|
<DropdownMenu items={menu} src={require('@tabler/icons/dots-vertical.svg')} />
|
|
|
|
|
</HStack>
|
|
|
|
|
</div>
|
|
|
|
|
</HStack>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|