feat: add filters on domain table

This commit is contained in:
Maël Gangloff
2024-12-03 23:24:00 +01:00
parent dc3879c4c5
commit 8870a7c75e
2 changed files with 32 additions and 10 deletions

View File

@@ -31,7 +31,8 @@ export function TrackedDomainTable() {
<Tag color={eppStatusCodeToColor(s)}>{s}</Tag>
</Tooltip>
),
updatedAt: new Date(d.updatedAt).toLocaleString()
updatedAt: new Date(d.updatedAt).toLocaleString(),
domain: d
}
}))
})
@@ -48,15 +49,36 @@ export function TrackedDomainTable() {
},
{
title: t`Expiration date`,
dataIndex: 'expirationDate'
dataIndex: 'expirationDate',
sorter: (a: { domain: Domain }, b: { domain: Domain }) => {
const expirationDate1 = a.domain.events.find(e => e.action === 'expiration' && !e.deleted)?.date
const expirationDate2 = b.domain.events.find(e => e.action === 'expiration' && !e.deleted)?.date
if (expirationDate1 === undefined || expirationDate2 === undefined) return 0
return new Date(expirationDate1).getTime() - new Date(expirationDate2).getTime()
}
},
{
title: t`Status`,
dataIndex: 'status'
dataIndex: 'status',
showSorterTooltip: {target: 'full-header'},
filters: [...new Set(dataTable.map((d: any) => d.domain.status).flat())].map(s => ({
text: <Tooltip
placement='bottomLeft'
title={s in rdapStatusCodeDetailTranslated ? rdapStatusCodeDetailTranslated[s as keyof typeof rdapStatusCodeDetailTranslated] : undefined}>
<Tag color={eppStatusCodeToColor(s)}>{s}</Tag>
</Tooltip>,
value: s,
})),
onFilter: (value, record: { domain: Domain }) => record.domain.status.includes(value as string)
},
{
title: t`Updated at`,
dataIndex: 'updatedAt'
dataIndex: 'updatedAt',
sorter: (a: { domain: Domain }, b: {
domain: Domain
}) => new Date(a.domain.updatedAt).getTime() - new Date(b.domain.updatedAt).getTime()
}
]

View File

@@ -99,12 +99,6 @@ export default function WatchlistPage() {
return <Flex gap="middle" align="center" justify="center" vertical>
{contextHolder}
<Card loading={connectors === undefined} title={t`Create a Watchlist`} style={{width: '100%'}}>
{connectors &&
<WatchlistForm form={form} onFinish={onCreateWatchlist} connectors={connectors} isCreation={true}/>
}
</Card>
<Divider/>
<Card title={
<>
<Tag icon={<AimOutlined/>} color="cyan-inverse"/>
@@ -115,6 +109,12 @@ export default function WatchlistPage() {
<TrackedDomainTable/>
</Card>
<Divider/>
<Card loading={connectors === undefined} title={t`Create a Watchlist`} style={{width: '100%'}}>
{connectors &&
<WatchlistForm form={form} onFinish={onCreateWatchlist} connectors={connectors} isCreation={true}/>
}
</Card>
<Divider/>
{connectors && watchlists && watchlists.length > 0 &&
<WatchlistsList watchlists={watchlists} onDelete={refreshWatchlists}
connectors={connectors}