56 lines
1.6 KiB
TypeScript
56 lines
1.6 KiB
TypeScript
import type { FC } from 'react';
|
|
|
|
import { Link } from 'react-router-dom';
|
|
|
|
import { RelativeTimestamp } from '@/mastodon/components/relative_timestamp';
|
|
import type { StatusHeaderProps } from '@/mastodon/components/status/header';
|
|
import {
|
|
StatusDisplayName,
|
|
StatusEditedAt,
|
|
StatusVisibility,
|
|
} from '@/mastodon/components/status/header';
|
|
import type { Account } from '@/mastodon/models/account';
|
|
|
|
export const AccountStatusHeader: FC<StatusHeaderProps> = ({
|
|
status,
|
|
account,
|
|
children,
|
|
avatarSize = 48,
|
|
wrapperProps,
|
|
onHeaderClick,
|
|
}) => {
|
|
const statusAccount = status.get('account') as Account | undefined;
|
|
const editedAt = status.get('edited_at') as string;
|
|
|
|
return (
|
|
/* eslint-disable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */
|
|
<div
|
|
onClick={onHeaderClick}
|
|
onAuxClick={onHeaderClick}
|
|
{...wrapperProps}
|
|
className='status__info'
|
|
/* eslint-enable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */
|
|
>
|
|
<Link
|
|
to={`/@${statusAccount?.acct}/${status.get('id') as string}`}
|
|
className='status__relative-time'
|
|
>
|
|
<StatusVisibility visibility={status.get('visibility')} />
|
|
<RelativeTimestamp
|
|
timestamp={status.get('created_at') as string}
|
|
noFuture
|
|
/>
|
|
{editedAt && <StatusEditedAt editedAt={editedAt} />}
|
|
</Link>
|
|
|
|
<StatusDisplayName
|
|
statusAccount={statusAccount}
|
|
friendAccount={account}
|
|
avatarSize={avatarSize}
|
|
/>
|
|
|
|
{children}
|
|
</div>
|
|
);
|
|
};
|