feat: add createdAt to Connector and Watchlist

This commit is contained in:
Maël Gangloff
2024-08-04 17:16:00 +02:00
parent 7cf2375952
commit a864696df7
5 changed files with 57 additions and 53 deletions

View File

@@ -1,32 +1,24 @@
import {Card, Divider, Popconfirm, Table, theme} from "antd"; import {Card, Divider, Popconfirm, theme, Typography} from "antd";
import {t} from "ttag"; import {t} from "ttag";
import {DeleteFilled} from "@ant-design/icons"; import {DeleteFilled} from "@ant-design/icons";
import React from "react"; import React from "react";
import {Connector, deleteConnector} from "../../utils/api/connectors"; import {Connector, deleteConnector} from "../../utils/api/connectors";
import useBreakpoint from "../../hooks/useBreakpoint";
const {useToken} = theme; const {useToken} = theme;
type ConnectorElement = Connector & { id: string } export type ConnectorElement = Connector & { id: string, createdAt: string }
export function ConnectorsList({connectors, onDelete}: { connectors: ConnectorElement[], onDelete: () => void }) { export function ConnectorsList({connectors, onDelete}: { connectors: ConnectorElement[], onDelete: () => void }) {
const {token} = useToken() const {token} = useToken()
const sm = useBreakpoint('sm')
const columns = [
{
title: t`Provider`,
dataIndex: 'provider'
}
]
return <> return <>
{connectors.map(connector => {connectors.map(connector =>
<> <>
<Card title={t`Connector`} <Card title={<Typography.Text
title={new Date(connector.createdAt).toLocaleString()}>{t`Connector ${connector.provider}`}</Typography.Text>}
size='small' size='small'
style={{width: '100%'}}
extra={<Popconfirm title={t`Delete the Connector`} extra={<Popconfirm title={t`Delete the Connector`}
description={t`Are you sure to delete this Connector?`} description={t`Are you sure to delete this Connector?`}
onConfirm={() => deleteConnector(connector.id).then(onDelete)} onConfirm={() => deleteConnector(connector.id).then(onDelete)}
@@ -34,16 +26,6 @@ export function ConnectorsList({connectors, onDelete}: { connectors: ConnectorEl
cancelText={t`No`} cancelText={t`No`}
><DeleteFilled style={{color: token.colorError}}/></Popconfirm>}> ><DeleteFilled style={{color: token.colorError}}/></Popconfirm>}>
<Card.Meta description={connector.id} style={{marginBottom: '1em'}}/> <Card.Meta description={connector.id} style={{marginBottom: '1em'}}/>
<Table
columns={columns}
pagination={false}
dataSource={[
{
provider: connector.provider
}
]}
{...(sm ? {scroll: {y: 'max-content'}} : {scroll: {y: 240}})}
/>
</Card> </Card>
<Divider/> <Divider/>
</> </>

View File

@@ -1,7 +1,7 @@
import {Card, Divider, Popconfirm, Table, Tag, theme} from "antd"; import {Card, Divider, Popconfirm, Table, Tag, theme, Typography} from "antd";
import {t} from "ttag"; import {t} from "ttag";
import {deleteWatchlist} from "../../utils/api"; import {deleteWatchlist} from "../../utils/api";
import {DeleteFilled} from "@ant-design/icons"; import {DeleteFilled, DisconnectOutlined, LinkOutlined} from "@ant-design/icons";
import React from "react"; import React from "react";
import useBreakpoint from "../../hooks/useBreakpoint"; import useBreakpoint from "../../hooks/useBreakpoint";
import {actionToColor, domainEvent} from "../search/EventTimeline"; import {actionToColor, domainEvent} from "../search/EventTimeline";
@@ -10,7 +10,6 @@ import punycode from "punycode/punycode";
const {useToken} = theme; const {useToken} = theme;
export function WatchlistsList({watchlists, onDelete}: { watchlists: Watchlist[], onDelete: () => void }) { export function WatchlistsList({watchlists, onDelete}: { watchlists: Watchlist[], onDelete: () => void }) {
const {token} = useToken() const {token} = useToken()
const sm = useBreakpoint('sm') const sm = useBreakpoint('sm')
@@ -32,8 +31,20 @@ export function WatchlistsList({watchlists, onDelete}: { watchlists: Watchlist[]
{watchlists.map(watchlist => {watchlists.map(watchlist =>
<> <>
<Card <Card
title={t`Watchlist` + (watchlist.name ? ` (${watchlist.name})` : '')} title={<>
{
watchlist.connector ?
<Tag icon={<LinkOutlined/>} color="lime-inverse" title={watchlist.connector.id}/> :
<Tag icon={<DisconnectOutlined/>} color="default"
title={t`This Watchlist is not linked to a Connector.`}/>
}
<Typography.Text title={new Date(watchlist.createdAt).toLocaleString()}>
{t`Watchlist` + (watchlist.name ? ` (${watchlist.name})` : '')}
</Typography.Text>
</>
}
size='small' size='small'
style={{width: '100%'}}
extra={<Popconfirm extra={<Popconfirm
title={t`Delete the Watchlist`} title={t`Delete the Watchlist`}
description={t`Are you sure to delete this Watchlist?`} description={t`Are you sure to delete this Watchlist?`}
@@ -49,6 +60,7 @@ export function WatchlistsList({watchlists, onDelete}: { watchlists: Watchlist[]
size='small' size='small'
columns={columns} columns={columns}
pagination={false} pagination={false}
style={{width: '100%'}}
dataSource={[{ dataSource={[{
domains: watchlist.domains.map(d => <Tag>{punycode.toUnicode(d.ldhName)}</Tag>), domains: watchlist.domains.map(d => <Tag>{punycode.toUnicode(d.ldhName)}</Tag>),
events: watchlist.triggers?.filter(t => t.action === 'email') events: watchlist.triggers?.filter(t => t.action === 'email')

View File

@@ -4,9 +4,7 @@ import {t} from "ttag";
import {Connector, getConnectors, postConnector} from "../../utils/api/connectors"; import {Connector, getConnectors, postConnector} from "../../utils/api/connectors";
import {ConnectorForm} from "../../components/tracking/ConnectorForm"; import {ConnectorForm} from "../../components/tracking/ConnectorForm";
import {AxiosError} from "axios"; import {AxiosError} from "axios";
import {ConnectorsList} from "../../components/tracking/ConnectorsList"; import {ConnectorElement, ConnectorsList} from "../../components/tracking/ConnectorsList";
type ConnectorElement = Connector & { id: string }
export default function ConnectorsPage() { export default function ConnectorsPage() {
const [form] = Form.useForm() const [form] = Form.useForm()

View File

@@ -13,7 +13,12 @@ export type Watchlist = {
token: string, token: string,
domains: { ldhName: string }[], domains: { ldhName: string }[],
triggers?: { event: EventAction, action: string }[], triggers?: { event: EventAction, action: string }[],
connector?: string connector?: {
id: string
provider: string
createdAt: string
}
createdAt: string
} }
export default function WatchlistPage() { export default function WatchlistPage() {

View File

@@ -128,7 +128,7 @@ msgid "At least one domain name"
msgstr "" msgstr ""
#: assets/components/tracking/WatchlistForm.tsx:93 #: assets/components/tracking/WatchlistForm.tsx:93
#: assets/components/tracking/WatchlistsList.tsx:22 #: assets/components/tracking/WatchlistsList.tsx:21
msgid "Domain names" msgid "Domain names"
msgstr "" msgstr ""
@@ -141,7 +141,7 @@ msgid "Add a Domain name"
msgstr "" msgstr ""
#: assets/components/tracking/WatchlistForm.tsx:135 #: assets/components/tracking/WatchlistForm.tsx:135
#: assets/components/tracking/WatchlistsList.tsx:26 #: assets/components/tracking/WatchlistsList.tsx:25
msgid "Tracked events" msgid "Tracked events"
msgstr "" msgstr ""
@@ -149,7 +149,6 @@ msgstr ""
msgid "At least one trigger" msgid "At least one trigger"
msgstr "" msgstr ""
#: assets/components/tracking/ConnectorsList.tsx:28
#: assets/components/tracking/WatchlistForm.tsx:159 #: assets/components/tracking/WatchlistForm.tsx:159
#: assets/components/tracking/WatchlistForm.tsx:173 #: assets/components/tracking/WatchlistForm.tsx:173
msgid "Connector" msgid "Connector"
@@ -172,7 +171,6 @@ msgid "Reset"
msgstr "" msgstr ""
#: assets/components/tracking/ConnectorForm.tsx:37 #: assets/components/tracking/ConnectorForm.tsx:37
#: assets/components/tracking/ConnectorsList.tsx:20
msgid "Provider" msgid "Provider"
msgstr "" msgstr ""
@@ -222,33 +220,42 @@ msgid ""
"names via the Provider's API" "names via the Provider's API"
msgstr "" msgstr ""
#: assets/components/tracking/WatchlistsList.tsx:35 #: assets/components/tracking/WatchlistsList.tsx:39
msgid "This Watchlist is not linked to a Connector."
msgstr ""
#: assets/components/tracking/WatchlistsList.tsx:42
msgid "Watchlist" msgid "Watchlist"
msgstr "" msgstr ""
#: assets/components/tracking/WatchlistsList.tsx:38 #: assets/components/tracking/WatchlistsList.tsx:49
msgid "Delete the Watchlist" msgid "Delete the Watchlist"
msgstr "" msgstr ""
#: assets/components/tracking/WatchlistsList.tsx:39 #: assets/components/tracking/WatchlistsList.tsx:50
msgid "Are you sure to delete this Watchlist?" msgid "Are you sure to delete this Watchlist?"
msgstr "" msgstr ""
#: assets/components/tracking/ConnectorsList.tsx:33 #: assets/components/tracking/ConnectorsList.tsx:25
#: assets/components/tracking/WatchlistsList.tsx:41 #: assets/components/tracking/WatchlistsList.tsx:52
msgid "Yes" msgid "Yes"
msgstr "" msgstr ""
#: assets/components/tracking/ConnectorsList.tsx:34 #: assets/components/tracking/ConnectorsList.tsx:26
#: assets/components/tracking/WatchlistsList.tsx:42 #: assets/components/tracking/WatchlistsList.tsx:53
msgid "No" msgid "No"
msgstr "" msgstr ""
#: assets/components/tracking/ConnectorsList.tsx:30 #: assets/components/tracking/ConnectorsList.tsx:19
#, javascript-format
msgid "Connector ${ connector.provider }"
msgstr ""
#: assets/components/tracking/ConnectorsList.tsx:22
msgid "Delete the Connector" msgid "Delete the Connector"
msgstr "" msgstr ""
#: assets/components/tracking/ConnectorsList.tsx:31 #: assets/components/tracking/ConnectorsList.tsx:23
msgid "Are you sure to delete this Connector?" msgid "Are you sure to delete this Connector?"
msgstr "" msgstr ""
@@ -328,11 +335,11 @@ msgid "Found !"
msgstr "" msgstr ""
#: assets/pages/search/DomainSearchPage.tsx:24 #: assets/pages/search/DomainSearchPage.tsx:24
#: assets/pages/tracking/ConnectorsPage.tsx:23 #: assets/pages/tracking/ConnectorsPage.tsx:21
#: assets/pages/tracking/ConnectorsPage.tsx:31 #: assets/pages/tracking/ConnectorsPage.tsx:29
#: assets/pages/tracking/WatchlistPage.tsx:44 #: assets/pages/tracking/WatchlistPage.tsx:49
#: assets/pages/tracking/WatchlistPage.tsx:52 #: assets/pages/tracking/WatchlistPage.tsx:57
#: assets/pages/tracking/WatchlistPage.tsx:62 #: assets/pages/tracking/WatchlistPage.tsx:67
msgid "An error occurred" msgid "An error occurred"
msgstr "" msgstr ""
@@ -436,19 +443,19 @@ msgstr ""
msgid "Roles" msgid "Roles"
msgstr "" msgstr ""
#: assets/pages/tracking/ConnectorsPage.tsx:20 #: assets/pages/tracking/ConnectorsPage.tsx:18
msgid "Connector created !" msgid "Connector created !"
msgstr "" msgstr ""
#: assets/pages/tracking/ConnectorsPage.tsx:41 #: assets/pages/tracking/ConnectorsPage.tsx:39
msgid "Create a Connector" msgid "Create a Connector"
msgstr "" msgstr ""
#: assets/pages/tracking/WatchlistPage.tsx:41 #: assets/pages/tracking/WatchlistPage.tsx:46
msgid "Watchlist created !" msgid "Watchlist created !"
msgstr "" msgstr ""
#: assets/pages/tracking/WatchlistPage.tsx:67 #: assets/pages/tracking/WatchlistPage.tsx:72
msgid "Create a Watchlist" msgid "Create a Watchlist"
msgstr "" msgstr ""