feat: add watchlist name

assets/components/tracking/WatchlistsList.tsx

@@ -6,6 +6,7 @@ import React from "react";
 import useBreakpoint from "../../hooks/useBreakpoint";
 import {actionToColor, domainEvent} from "../search/EventTimeline";
 import {Watchlist} from "../../pages/tracking/WatchlistPage";
+import punycode from "punycode/punycode";
 
 const {useToken} = theme;
 
@@ -31,7 +32,7 @@ export function WatchlistsList({watchlists, onDelete}: { watchlists: Watchlist[]
         {watchlists.map(watchlist =>
             <>
                 <Card
-                    title={t`Watchlist`}
+                    title={t`Watchlist` + (watchlist.name ? ` (${watchlist.name})` : '')}
                     size='small'
                     extra={<Popconfirm
                         title={t`Delete the Watchlist`}
@@ -49,7 +50,7 @@ export function WatchlistsList({watchlists, onDelete}: { watchlists: Watchlist[]
                         columns={columns}
                         pagination={false}
                         dataSource={[{
-                            domains: watchlist.domains.map(d => <Tag>{d.ldhName}</Tag>),
+                            domains: watchlist.domains.map(d => <Tag>{punycode.toUnicode(d.ldhName)}</Tag>),
                             events: watchlist.triggers?.filter(t => t.action === 'email')
                                 .map(t => <Tag color={actionToColor(t.event)}>
                                         {domainEventTranslated[t.event as keyof typeof domainEventTranslated]}

assets/pages/tracking/WatchlistPage.tsx

@@ -9,6 +9,7 @@ import {Connector, getConnectors} from "../../utils/api/connectors";
 
 
 export type Watchlist = {
+    name?: string
     token: string,
     domains: { ldhName: string }[],
     triggers?: { event: EventAction, action: string }[],
@@ -23,12 +24,14 @@ export default function WatchlistPage() {
     const [connectors, setConnectors] = useState<(Connector & { id: string })[] | null>()
 
     const onCreateWatchlist = (values: {
+        name?: string
         domains: string[],
         emailTriggers: string[]
         connector?: string
     }) => {
         const domainsURI = values.domains.map(d => '/api/domains/' + d)
         postWatchlist({
+            name: values.name,
             domains: domainsURI,
             triggers: values.emailTriggers.map(t => ({event: t, action: 'email'})),
             connector: values.connector !== undefined ? '/api/connectors/' + values.connector : undefined

assets/utils/api/index.ts

@@ -65,6 +65,7 @@ export interface User {
 }
 
 export interface Watchlist {
+    name?: string
     domains: string[],
     triggers: { event: EventAction, action: TriggerAction }[],
     connector?: string

translations/translations.pot

@@ -128,7 +128,7 @@ msgid "At least one domain name"
 msgstr ""
 
 #: assets/components/tracking/WatchlistForm.tsx:93
-#: assets/components/tracking/WatchlistsList.tsx:21
+#: assets/components/tracking/WatchlistsList.tsx:22
 msgid "Domain names"
 msgstr ""
 
@@ -141,7 +141,7 @@ msgid "Add a Domain name"
 msgstr ""
 
 #: assets/components/tracking/WatchlistForm.tsx:135
-#: assets/components/tracking/WatchlistsList.tsx:25
+#: assets/components/tracking/WatchlistsList.tsx:26
 msgid "Tracked events"
 msgstr ""
 
@@ -222,25 +222,25 @@ msgid ""
 "names via the Provider's API"
 msgstr ""
 
-#: assets/components/tracking/WatchlistsList.tsx:34
+#: assets/components/tracking/WatchlistsList.tsx:35
 msgid "Watchlist"
 msgstr ""
 
-#: assets/components/tracking/WatchlistsList.tsx:37
+#: assets/components/tracking/WatchlistsList.tsx:38
 msgid "Delete the Watchlist"
 msgstr ""
 
-#: assets/components/tracking/WatchlistsList.tsx:38
+#: assets/components/tracking/WatchlistsList.tsx:39
 msgid "Are you sure to delete this Watchlist?"
 msgstr ""
 
 #: assets/components/tracking/ConnectorsList.tsx:33
-#: assets/components/tracking/WatchlistsList.tsx:40
+#: assets/components/tracking/WatchlistsList.tsx:41
 msgid "Yes"
 msgstr ""
 
 #: assets/components/tracking/ConnectorsList.tsx:34
-#: assets/components/tracking/WatchlistsList.tsx:41
+#: assets/components/tracking/WatchlistsList.tsx:42
 msgid "No"
 msgstr ""
 
@@ -259,9 +259,9 @@ msgstr ""
 #: assets/pages/search/DomainSearchPage.tsx:24
 #: assets/pages/tracking/ConnectorsPage.tsx:23
 #: assets/pages/tracking/ConnectorsPage.tsx:31
-#: assets/pages/tracking/WatchlistPage.tsx:41
+#: assets/pages/tracking/WatchlistPage.tsx:44
-#: assets/pages/tracking/WatchlistPage.tsx:49
+#: assets/pages/tracking/WatchlistPage.tsx:52
-#: assets/pages/tracking/WatchlistPage.tsx:59
+#: assets/pages/tracking/WatchlistPage.tsx:62
 msgid "An error occurred"
 msgstr ""
 
@@ -383,11 +383,11 @@ msgstr ""
 msgid "Create a Connector"
 msgstr ""
 
-#: assets/pages/tracking/WatchlistPage.tsx:38
+#: assets/pages/tracking/WatchlistPage.tsx:41
 msgid "Watchlist created !"
 msgstr ""
 
-#: assets/pages/tracking/WatchlistPage.tsx:64
+#: assets/pages/tracking/WatchlistPage.tsx:67
 msgid "Create a Watchlist"
 msgstr ""