[Glitch] Makes RelativeTimestamp default to not showing the future
Port e71d6fa34478e0a44d726b57d949f0a05d3b41db to glitch-soc Signed-off-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
parent
3072de056a
commit
3ed2f28301
@ -278,7 +278,7 @@ export const Account: React.FC<AccountProps> = ({
|
|||||||
if (account?.mute_expires_at) {
|
if (account?.mute_expires_at) {
|
||||||
muteTimeRemaining = (
|
muteTimeRemaining = (
|
||||||
<>
|
<>
|
||||||
· <RelativeTimestamp timestamp={account.mute_expires_at} />
|
· <RelativeTimestamp hasFuture timestamp={account.mute_expires_at} />
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -149,11 +149,7 @@ export const AccountListItem: React.FC<Props> = ({
|
|||||||
}
|
}
|
||||||
>
|
>
|
||||||
{account.last_status_at ? (
|
{account.last_status_at ? (
|
||||||
<RelativeTimestamp
|
<RelativeTimestamp long timestamp={account.last_status_at} />
|
||||||
long
|
|
||||||
timestamp={account.last_status_at}
|
|
||||||
noFuture
|
|
||||||
/>
|
|
||||||
) : (
|
) : (
|
||||||
'-'
|
'-'
|
||||||
)}
|
)}
|
||||||
|
|||||||
@ -70,7 +70,7 @@ export const Poll: React.FC<PollProps> = ({ pollId, disabled, status }) => {
|
|||||||
if (expired) {
|
if (expired) {
|
||||||
return intl.formatMessage(messages.closed);
|
return intl.formatMessage(messages.closed);
|
||||||
}
|
}
|
||||||
return <RelativeTimestamp timestamp={poll.expires_at} />;
|
return <RelativeTimestamp hasFuture timestamp={poll.expires_at} />;
|
||||||
}, [expired, intl, poll]);
|
}, [expired, intl, poll]);
|
||||||
const votesCount = useMemo(() => {
|
const votesCount = useMemo(() => {
|
||||||
if (!poll) {
|
if (!poll) {
|
||||||
|
|||||||
@ -23,16 +23,16 @@ export const RelativeTimestamp: FC<{
|
|||||||
timestamp: string;
|
timestamp: string;
|
||||||
long?: boolean;
|
long?: boolean;
|
||||||
noTime?: boolean;
|
noTime?: boolean;
|
||||||
noFuture?: boolean;
|
hasFuture?: boolean;
|
||||||
}> = ({ timestamp, long = false, noTime = false, noFuture = false }) => {
|
}> = ({ timestamp, long = false, noTime = false, hasFuture = false }) => {
|
||||||
const intl = useIntl();
|
const intl = useIntl();
|
||||||
|
|
||||||
const [now, setNow] = useState(() => Date.now());
|
const [now, setNow] = useState(() => Date.now());
|
||||||
|
|
||||||
const date = useMemo(() => {
|
const date = useMemo(() => {
|
||||||
const date = new Date(timestamp);
|
const date = new Date(timestamp);
|
||||||
return noFuture ? new Date(Math.min(date.getTime(), now)) : date;
|
return !hasFuture ? new Date(Math.min(date.getTime(), now)) : date;
|
||||||
}, [noFuture, now, timestamp]);
|
}, [hasFuture, now, timestamp]);
|
||||||
const ts = date.getTime();
|
const ts = date.getTime();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|||||||
@ -11,7 +11,7 @@ const meta = {
|
|||||||
timestamp: new Date(Date.now() - DAY * 3).toISOString(),
|
timestamp: new Date(Date.now() - DAY * 3).toISOString(),
|
||||||
long: false,
|
long: false,
|
||||||
noTime: false,
|
noTime: false,
|
||||||
noFuture: false,
|
hasFuture: false,
|
||||||
},
|
},
|
||||||
argTypes: {
|
argTypes: {
|
||||||
timestamp: {
|
timestamp: {
|
||||||
@ -44,10 +44,10 @@ export const DateOnly: Story = {
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
export const NoFuture: Story = {
|
export const HasFuture: Story = {
|
||||||
args: {
|
args: {
|
||||||
timestamp: new Date(Date.now() + DAY * 3).toISOString(),
|
timestamp: new Date(Date.now() + DAY * 3).toISOString(),
|
||||||
noFuture: true,
|
hasFuture: true,
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@ -400,7 +400,6 @@ class StatusActionBar extends ImmutablePureComponent {
|
|||||||
<a href={status.get('url')} className='status__relative-time' target='_blank' rel='noopener'>
|
<a href={status.get('url')} className='status__relative-time' target='_blank' rel='noopener'>
|
||||||
<RelativeTimestamp
|
<RelativeTimestamp
|
||||||
timestamp={status.get('created_at')}
|
timestamp={status.get('created_at')}
|
||||||
noFuture
|
|
||||||
/>{status.get('edited_at') && <abbr title={intl.formatMessage(messages.edited, { date: intl.formatDate(status.get('edited_at'), { year: 'numeric', month: 'short', day: '2-digit', hour: '2-digit', minute: '2-digit' }) })}> *</abbr>}
|
/>{status.get('edited_at') && <abbr title={intl.formatMessage(messages.edited, { date: intl.formatDate(status.get('edited_at'), { year: 'numeric', month: 'short', day: '2-digit', hour: '2-digit', minute: '2-digit' }) })}> *</abbr>}
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -36,10 +36,7 @@ export const AccountStatusHeader: FC<StatusHeaderProps> = ({
|
|||||||
className='status__relative-time'
|
className='status__relative-time'
|
||||||
>
|
>
|
||||||
<StatusVisibility visibility={status.get('visibility')} />
|
<StatusVisibility visibility={status.get('visibility')} />
|
||||||
<RelativeTimestamp
|
<RelativeTimestamp timestamp={status.get('created_at') as string} />
|
||||||
timestamp={status.get('created_at') as string}
|
|
||||||
noFuture
|
|
||||||
/>
|
|
||||||
{editedAt && <StatusEditedAt editedAt={editedAt} />}
|
{editedAt && <StatusEditedAt editedAt={editedAt} />}
|
||||||
</Link>
|
</Link>
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user