diff --git a/apps/remix/app/components/tables/admin-organisation-stats-table.tsx b/apps/remix/app/components/tables/admin-organisation-stats-table.tsx index 88c7c60b3..d3233bacf 100644 --- a/apps/remix/app/components/tables/admin-organisation-stats-table.tsx +++ b/apps/remix/app/components/tables/admin-organisation-stats-table.tsx @@ -57,11 +57,13 @@ const getPeriodDivisor = (period: string): number => { return new Date(Date.UTC(year, month, 0)).getUTCDate(); }; +export type OrganisationStatsDisplayMode = 'usage' | 'quotas' | 'averages'; + type AdminOrganisationStatsTableProps = { - showDailyAverages?: boolean; + displayMode?: OrganisationStatsDisplayMode; }; -export const AdminOrganisationStatsTable = ({ showDailyAverages = true }: AdminOrganisationStatsTableProps) => { +export const AdminOrganisationStatsTable = ({ displayMode = 'usage' }: AdminOrganisationStatsTableProps) => { const { t } = useLingui(); const [searchParams, setSearchParams] = useSearchParams(); @@ -127,15 +129,19 @@ export const AdminOrganisationStatsTable = ({ showDailyAverages = true }: AdminO }; const renderUsageCell = (used: number, quota: number | null) => { - if (showDailyAverages) { - return ~{formatPerDay(used)}/day; + if (displayMode === 'averages') { + return formatPerDay(used); } - return ( - - {used} / {quota === null ? '∞' : quota} - - ); + if (displayMode === 'quotas') { + return ( + + {used}/{quota === null ? '∞' : quota} + + ); + } + + return {used}; }; const sortableHeader = (label: string, column: OrderByColumn) => ( @@ -162,7 +168,7 @@ export const AdminOrganisationStatsTable = ({ showDailyAverages = true }: AdminO header: t`Organisation`, accessorKey: 'organisationName', cell: ({ row }) => ( - + {row.original.organisationName} ), @@ -170,12 +176,12 @@ export const AdminOrganisationStatsTable = ({ showDailyAverages = true }: AdminO { header: t`Claim`, accessorKey: 'originalClaimId', - cell: ({ row }) => {row.original.originalClaimId ?? '—'}, + cell: ({ row }) => {row.original.originalClaimId ?? '—'}, }, { header: t`Period`, accessorKey: 'period', - cell: ({ row }) => {row.original.period}, + cell: ({ row }) => {row.original.period}, }, { header: () => sortableHeader(t`Documents`, 'documentCount'), @@ -208,14 +214,14 @@ export const AdminOrganisationStatsTable = ({ showDailyAverages = true }: AdminO // Without this, changing a filter (e.g. claimId) wouldn't refresh the memoised handler, // and sorting would merge onto stale params and drop the active filter. // eslint-disable-next-line react-hooks/exhaustive-deps - }, [t, orderByColumn, orderByDirection, period, showDailyAverages, searchParams]); + }, [t, orderByColumn, orderByDirection, period, displayMode, searchParams]); return (