pl-fe: improve mute expiration handling

Signed-off-by: nicole mikołajczyk <git@mkljczk.pl>
This commit is contained in:
nicole mikołajczyk
2025-10-27 12:01:06 +01:00
parent be918fbb80
commit d94c19fd9d
5 changed files with 17 additions and 22 deletions

View File

@ -108,6 +108,7 @@ interface IAccount {
note?: string;
items?: React.ReactNode;
disabled?: boolean;
muteExpiresAt?: string | null;
}
const Account = ({
@ -135,6 +136,7 @@ const Account = ({
note,
items,
disabled,
muteExpiresAt,
}: IAccount) => {
const overflowRef = useRef<HTMLDivElement>(null);
const actionRef = useRef<HTMLDivElement>(null);
@ -381,11 +383,11 @@ const Account = ({
</>
)}
{actionType === 'muting' && account.mute_expires_at ? (
{actionType === 'muting' && muteExpiresAt ? (
<>
<Text tag='span' theme='muted' size='sm'>&middot;</Text>
<Text theme='muted' size='sm'><RelativeTimestamp timestamp={account.mute_expires_at} futureDate /></Text>
<Text theme='muted' size='sm'><RelativeTimestamp timestamp={muteExpiresAt} futureDate /></Text>
</>
) : null}

View File

@ -1,17 +1,5 @@
import type { Account as BaseAccount } from 'pl-api';
import type { Account } from 'pl-api';
const normalizeAccount = (account: BaseAccount) => {
const missingAvatar: string = require('pl-fe/assets/images/avatar-missing.png');
const missingHeader: string = require('pl-fe/assets/images/header-missing.png');
return {
mute_expires_at: null,
...account,
avatar: account.avatar || account.avatar_static || missingAvatar,
header: account.header || account.header_static || missingHeader,
};
};
type Account = ReturnType<typeof normalizeAccount>;
const normalizeAccount = (account: Account) => account;
export { normalizeAccount, type Account };

View File

@ -35,8 +35,8 @@ const MutesPage: React.FC = () => {
<FormattedMessage id='empty_column.mutes' defaultMessage="You haven't muted any users yet." />
}
>
{data.map((accountId) =>
<AccountContainer key={accountId} id={accountId} actionType='muting' />,
{data.map(([accountId, muteExpiresAt]) =>
<AccountContainer key={accountId} id={accountId} actionType='muting' muteExpiresAt={muteExpiresAt} />,
)}
</ScrollableList>
</Stack>

View File

@ -1,5 +1,5 @@
import { makePaginatedResponseQuery } from '../utils/make-paginated-response-query';
import { minifyAccountList } from '../utils/minify-list';
import { minifyAccountList, minifyMutedAccountList } from '../utils/minify-list';
const useBlocks = makePaginatedResponseQuery(
['accountsLists', 'blocked'],
@ -8,7 +8,7 @@ const useBlocks = makePaginatedResponseQuery(
const useMutes = makePaginatedResponseQuery(
['accountsLists', 'muted'],
(client) => client.filtering.getMutes({ with_relationships: true }).then(minifyAccountList),
(client) => client.filtering.getMutes({ with_relationships: true }).then(minifyMutedAccountList),
);
export { useBlocks, useMutes };

View File

@ -3,7 +3,7 @@ import { store } from 'pl-fe/store';
import { queryClient } from '../client';
import type { Account, AdminAccount, AdminReport, PaginatedResponse, Status } from 'pl-api';
import type { Account, AdminAccount, AdminReport, MutedAccount, PaginatedResponse, Status } from 'pl-api';
const minifyList = <T1, T2>({ previous, next, items, ...response }: PaginatedResponse<T1>, minifier: (value: T1) => T2, importer?: (items: Array<T1>) => void): PaginatedResponse<T2> => {
importer?.(items);
@ -26,6 +26,11 @@ const minifyAccountList = (response: PaginatedResponse<Account>): PaginatedRespo
store.dispatch(importEntities({ accounts }) as any);
});
const minifyMutedAccountList = (response: PaginatedResponse<MutedAccount>): PaginatedResponse<[string, string | null]> =>
minifyList(response, (account) => [account.id, account.mute_expires_at], (accounts) => {
store.dispatch(importEntities({ accounts }) as any);
});
const minifyAdminAccount = ({ account, ...adminAccount }: AdminAccount) => {
store.dispatch(importEntities({ accounts: [account] }) as any);
queryClient.setQueryData(['admin', 'accounts', adminAccount.id], adminAccount);
@ -70,4 +75,4 @@ const minifyAdminReportList = (response: PaginatedResponse<AdminReport>) =>
}
});
export { minifyList, minifyAccountList, minifyStatusList, minifyAdminAccount, minifyAdminAccountList, minifyAdminReport, minifyAdminReportList };
export { minifyList, minifyAccountList, minifyMutedAccountList, minifyStatusList, minifyAdminAccount, minifyAdminAccountList, minifyAdminReport, minifyAdminReportList };