matty/ncd-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pl-fe: status ui changes

Browse Source 
Signed-off-by: nicole mikołajczyk <git@mkljczk.pl>
This commit is contained in:
nicole mikołajczyk
2025-10-13 18:43:07 +02:00
parent 8374f3bfc7
commit 914a57e951
2 changed files with 30 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
packages/pl-fe/src/components/account.tsx
View File

@ -102,7 +102,6 @@ interface IAccount {
withDate?: boolean;
withLinkToProfile?: boolean;
withRelationship?: boolean;
showEdit?: boolean;
approvalStatus?: StatusApprovalStatus | null;
emoji?: string;
emojiUrl?: string;
@ -130,7 +129,6 @@ const Account = ({
withDate = false,
withLinkToProfile = true,
withRelationship = true,
showEdit = false,
approvalStatus,
emoji,
emojiUrl,
@ -383,14 +381,6 @@ const Account = ({
</>
)}
{showEdit ? (
<>
<Text tag='span' theme='muted' size='sm'>&middot;</Text>
<Icon className='size-4 text-gray-700 dark:text-gray-600' src={require('@phosphor-icons/core/regular/pencil-simple.svg')} />
</>
) : null}
{actionType === 'muting' && account.mute_expires_at ? (
<>
<Text tag='span' theme='muted' size='sm'>&middot;</Text>

49
packages/pl-fe/src/components/status.tsx
View File

@ -23,6 +23,7 @@ import { useStatusMetaStore } from 'pl-fe/stores/status-meta';
import { textForScreenReader } from 'pl-fe/utils/status';
import EventPreview from './event-preview';
import RelativeTimestamp from './relative-timestamp';
import StatusActionBar from './status-action-bar';
import StatusContent from './status-content';
import StatusLanguagePicker from './status-language-picker';
@ -383,25 +384,35 @@ const Status: React.FC<IStatus> = (props) => {
>
{statusInfo}
<AccountContainer
key={actualStatus.account_id}
id={actualStatus.account_id}
timestamp={actualStatus.created_at}
timestampUrl={statusUrl}
action={accountAction}
hideActions={!accountAction}
showEdit={!!actualStatus.edited_at}
showAccountHoverCard={hoverable}
withLinkToProfile={hoverable}
approvalStatus={actualStatus.approval_status}
avatarSize={avatarSize}
items={(
<>
<StatusTypeIcon visibility={actualStatus.visibility} />
<StatusLanguagePicker status={actualStatus} />
</>
)}
/>
<div className='flex'>
<div className='grow'>
<AccountContainer
key={actualStatus.account_id}
id={actualStatus.account_id}
action={accountAction}
hideActions={!accountAction}
showAccountHoverCard={hoverable}
withLinkToProfile={hoverable}
approvalStatus={actualStatus.approval_status}
avatarSize={avatarSize}
/>
</div>
<div className='flex flex-row-reverse items-center gap-1 self-baseline'>
<Link to={statusUrl} className='hover:underline' onClick={(event) => event.stopPropagation()}>
<RelativeTimestamp timestamp={actualStatus.created_at} theme='muted' size='sm' className='whitespace-nowrap' />
</Link>
<StatusTypeIcon visibility={actualStatus.visibility} />
<StatusLanguagePicker status={actualStatus} />
{!!actualStatus.edited_at && (
<>
<Text tag='span' theme='muted' size='sm'>&middot;</Text>
<Icon className='size-4 text-gray-700 dark:text-gray-600' src={require('@phosphor-icons/core/regular/pencil-simple.svg')} />
</>
)}
</div>
</div>
<div className='status__content-wrapper'>
<StatusReplyMentions status={actualStatus} hoverable={hoverable} />