From 84e0fed184e0ce0a10d03a5e92250e7dcdce7d8d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ma=C3=ABl=20Gangloff?= Date: Sat, 17 Aug 2024 18:22:24 +0200 Subject: [PATCH 1/5] feat: update entity diagram --- .../diagram/ViewDiagramWatchlistButton.tsx | 64 +++---------------- .../tracking/diagram/WatchlistToEdges.tsx | 36 +++++++++++ .../tracking/diagram/WatchlistToNodes.tsx | 52 +++++++++++++++ src/Service/RDAPService.php | 2 + 4 files changed, 99 insertions(+), 55 deletions(-) create mode 100644 assets/components/tracking/diagram/WatchlistToEdges.tsx create mode 100644 assets/components/tracking/diagram/WatchlistToNodes.tsx diff --git a/assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx b/assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx index 94498e2..e724f0d 100644 --- a/assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx +++ b/assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx @@ -2,72 +2,26 @@ import {Button, Flex, Modal, Space, Typography} from "antd" import {t} from "ttag" import React, {useEffect, useState} from "react" import {ApartmentOutlined} from "@ant-design/icons" -import vCard from "vcf"; import '@xyflow/react/dist/style.css' import {Background, Controls, MiniMap, ReactFlow, useEdgesState, useNodesState} from "@xyflow/react"; -import {getWatchlist, Watchlist} from "../../../utils/api"; -import {translateRoles} from "../../search/EntitiesList"; +import {getWatchlist} from "../../../utils/api"; import {getLayoutedElements} from "./getLayoutedElements"; +import {watchlistToNodes} from "./WatchlistToNodes"; +import {watchlistToEdges} from "./WatchlistToEdges"; - -function watchlistToNodes(watchlist: Watchlist) { - const domains = watchlist.domains.map(d => ({ - id: d.ldhName, - data: {label: {d.ldhName}}, - style: { - width: 200 - } - })) - const entities = [...new Set(watchlist.domains - .map(d => d.entities - .filter(e => !e.roles.includes('registrar')) - .map(e => e.entity - ) - ).flat())].map(e => { - const jCard = vCard.fromJSON(e.jCard) - let label = e.handle - if (jCard.data.fn !== undefined && !Array.isArray(jCard.data.fn)) label = jCard.data.fn.valueOf() - - return { - id: e.handle, - data: {label}, - style: { - width: 200 - } - } - }) - - return [...domains, ...entities] -} - -const rolesToColor = (roles: string[]) => roles.includes('registrant') ? 'green' : - roles.includes('administrative') ? 'blue' : - roles.includes('technical') ? 'orange' : 'violet' - -function watchlistToEdges(watchlist: Watchlist) { - const domainRole = translateRoles() - - return watchlist.domains - .map(d => d.entities - .filter(e => !e.roles.includes('registrar')) - .map(e => ({ - id: `${d.ldhName}-${e.entity.handle}`, - source: e.roles.includes('technical') ? d.ldhName : e.entity.handle, - target: e.roles.includes('technical') ? e.entity.handle : d.ldhName, - style: {stroke: rolesToColor(e.roles), strokeWidth: 3}, - label: e.roles.map(r => Object.keys(domainRole).includes(r) ? domainRole[r as keyof typeof domainRole] : r).join(', '), - animated: e.roles.includes('registrant'), - })) - ).flat(2) +export type DiagramConfig = { + tld?: boolean + nameserver?: boolean + entities?: boolean } export function ViewDiagramWatchlistButton({token}: { token: string }) { const [open, setOpen] = useState(false) const [loading, setLoading] = useState(false) - const [nodes, setNodes, onNodesChange] = useNodesState([]); - const [edges, setEdges, onEdgesChange] = useEdgesState([]); + const [nodes, setNodes, onNodesChange] = useNodesState([]) + const [edges, setEdges, onEdgesChange] = useEdgesState([]) useEffect(() => { if (!open) return diff --git a/assets/components/tracking/diagram/WatchlistToEdges.tsx b/assets/components/tracking/diagram/WatchlistToEdges.tsx new file mode 100644 index 0000000..714ed70 --- /dev/null +++ b/assets/components/tracking/diagram/WatchlistToEdges.tsx @@ -0,0 +1,36 @@ +import {Watchlist} from "../../../utils/api"; +import {translateRoles} from "../../search/EntitiesList"; + +const rolesToColor = (roles: string[]) => roles.includes('registrant') ? 'green' : + roles.includes('administrative') ? 'blue' : + roles.includes('technical') ? 'orange' : 'violet' + + +export function watchlistToEdges(watchlist: Watchlist) { + const domainRole = translateRoles() + + const entitiesEdges = watchlist.domains + .map(d => d.entities + .filter(e => !e.roles.includes('registrar')) // + .map(e => ({ + id: `e-${d.ldhName}-${e.entity.handle}`, + source: e.roles.includes('registrant') ? e.entity.handle : d.ldhName, + target: e.roles.includes('registrant') ? d.ldhName : e.entity.handle, + style: {stroke: rolesToColor(e.roles), strokeWidth: 3}, + label: e.roles.map(r => Object.keys(domainRole).includes(r) ? domainRole[r as keyof typeof domainRole] : r).join(', '), + animated: e.roles.includes('registrant'), + })) + ).flat() + + const nameserversEdges = watchlist.domains + .map(d => d.nameservers + .map(ns => ({ + id: `ns-${d.ldhName}-${ns.ldhName}`, + source: d.ldhName, + target: ns.ldhName, + style: {stroke: 'grey', strokeWidth: 3}, + label: 'DNS' + }))).flat() + + return [...entitiesEdges, ...nameserversEdges] +} diff --git a/assets/components/tracking/diagram/WatchlistToNodes.tsx b/assets/components/tracking/diagram/WatchlistToNodes.tsx new file mode 100644 index 0000000..4a2a4d8 --- /dev/null +++ b/assets/components/tracking/diagram/WatchlistToNodes.tsx @@ -0,0 +1,52 @@ +import {Watchlist} from "../../../utils/api"; +import vCard from "vcf"; +import React from "react"; +import {t} from 'ttag' + +export function watchlistToNodes(watchlist: Watchlist) { + const domains = watchlist.domains.map(d => ({ + id: d.ldhName, + data: {label: {d.ldhName}}, + style: { + width: 200 + }, + parentId: d.tld.tld, + extent: 'parent' + })) + const entities = [...new Set(watchlist.domains + .map(d => d.entities + .filter(e => !e.roles.includes('registrar')) // + .map(e => { + const jCard = vCard.fromJSON(e.entity.jCard) + let label = e.entity.handle + if (jCard.data.fn !== undefined && !Array.isArray(jCard.data.fn)) label = jCard.data.fn.valueOf() + + return { + id: e.entity.handle, + data: {label}, + style: { + width: 200 + }, + parentId: d.tld.tld, + extent: 'parent' + } + })).flat())] + + const tlds = [...new Set(watchlist.domains.map(d => d.tld))].map(tld => ({ + id: tld.tld, + data: {label: t`.${tld.tld} Registry`}, + style: { + width: 200 + } + })) + + const nameservers = [...new Set(watchlist.domains.map(d => d.nameservers))].flat().map(ns => ({ + id: ns.ldhName, + data: {label: ns.ldhName}, + style: { + width: 200 + } + })) + + return [...domains, ...entities, ...nameservers] +} \ No newline at end of file diff --git a/src/Service/RDAPService.php b/src/Service/RDAPService.php index c917ff5..ff14969 100644 --- a/src/Service/RDAPService.php +++ b/src/Service/RDAPService.php @@ -278,6 +278,8 @@ readonly class RDAPService } if (array_key_exists('nameservers', $res) && is_array($res['nameservers'])) { + $domain->getNameservers()->clear(); + foreach ($res['nameservers'] as $rdapNameserver) { $nameserver = $this->nameserverRepository->findOneBy([ 'ldhName' => strtolower($rdapNameserver['ldhName']), From 06671c2a8be5c89a81f8d8dd8fd4b6c12d3f9b86 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ma=C3=ABl=20Gangloff?= Date: Sat, 17 Aug 2024 18:26:33 +0200 Subject: [PATCH 2/5] chore: update translations.pot --- translations/translations.pot | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/translations/translations.pot b/translations/translations.pot index 448db88..fb1c62b 100644 --- a/translations/translations.pot +++ b/translations/translations.pot @@ -235,11 +235,16 @@ msgstr "" msgid "No" msgstr "" -#: assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx:86 +#: assets/components/tracking/diagram/WatchlistToNodes.tsx:37 +#, javascript-format +msgid ".${ tld.tld } Registry" +msgstr "" + +#: assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx:40 msgid "View the Watchlist Entity Diagram" msgstr "" -#: assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx:91 +#: assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx:45 msgid "Watchlist Entity Diagram" msgstr "" From 5a18fbfaa26b086bf4cf8beb8ae06f44e5617ba9 Mon Sep 17 00:00:00 2001 From: Weblate Date: Sat, 17 Aug 2024 16:26:55 +0000 Subject: [PATCH 3/5] Update translation files Updated by "Update PO files to match POT (msgmerge)" add-on in Weblate. --- translations/de.po | 9 +++++++-- translations/fr.po | 9 +++++++-- 2 files changed, 14 insertions(+), 4 deletions(-) diff --git a/translations/de.po b/translations/de.po index 858fb9a..af88a47 100644 --- a/translations/de.po +++ b/translations/de.po @@ -246,11 +246,16 @@ msgstr "Ja" msgid "No" msgstr "Nein" -#: assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx:86 +#: assets/components/tracking/diagram/WatchlistToNodes.tsx:37 +#, javascript-format +msgid ".${ tld.tld } Registry" +msgstr "" + +#: assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx:40 msgid "View the Watchlist Entity Diagram" msgstr "Sehen Sie sich das Watchlist-Entitätsdiagramm an" -#: assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx:91 +#: assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx:45 msgid "Watchlist Entity Diagram" msgstr "Watchlist-Entitäten Diagramm" diff --git a/translations/fr.po b/translations/fr.po index 8db7cd0..73c5cf6 100644 --- a/translations/fr.po +++ b/translations/fr.po @@ -246,11 +246,16 @@ msgstr "Oui" msgid "No" msgstr "Non" -#: assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx:86 +#: assets/components/tracking/diagram/WatchlistToNodes.tsx:37 +#, javascript-format +msgid ".${ tld.tld } Registry" +msgstr "" + +#: assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx:40 msgid "View the Watchlist Entity Diagram" msgstr "Afficher le diagramme d'entités de la Watchlist" -#: assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx:91 +#: assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx:45 msgid "Watchlist Entity Diagram" msgstr "Diagramme d'entités de la Watchlist" From 2ac9849f866032737ebb9d1d90f0ba1cd39aa19a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ma=C3=ABl=20Gangloff?= Date: Sat, 17 Aug 2024 20:33:37 +0200 Subject: [PATCH 4/5] fix: cookie expiration date same as the token --- assets/pages/tracking/WatchlistPage.tsx | 6 +++--- src/Security/JWTAuthenticator.php | 2 +- src/Security/OAuthAuthenticator.php | 2 +- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/assets/pages/tracking/WatchlistPage.tsx b/assets/pages/tracking/WatchlistPage.tsx index 79c716b..02aac57 100644 --- a/assets/pages/tracking/WatchlistPage.tsx +++ b/assets/pages/tracking/WatchlistPage.tsx @@ -1,6 +1,6 @@ import React, {useEffect, useState} from "react"; import {Card, Divider, Flex, Form, message} from "antd"; -import {EventAction, getWatchlists, putWatchlist, postWatchlist} from "../../utils/api"; +import {EventAction, getWatchlists, postWatchlist, putWatchlist} from "../../utils/api"; import {AxiosError} from "axios"; import {t} from 'ttag' import {WatchlistForm} from "../../components/tracking/watchlist/WatchlistForm"; @@ -35,7 +35,7 @@ export default function WatchlistPage() { emailTriggers: string[] connector?: string }) => { - const domainsURI = values.domains.map(d => '/api/domains/' + d) + const domainsURI = values.domains.map(d => '/api/domains/' + d.toLowerCase()) postWatchlist({ name: values.name, domains: domainsURI, @@ -57,7 +57,7 @@ export default function WatchlistPage() { emailTriggers: string[] connector?: string }) => { - const domainsURI = values.domains.map(d => '/api/domains/' + d) + const domainsURI = values.domains.map(d => '/api/domains/' + d.toLowerCase()) return putWatchlist({ token: values.token, diff --git a/src/Security/JWTAuthenticator.php b/src/Security/JWTAuthenticator.php index bcd0fb0..2972003 100644 --- a/src/Security/JWTAuthenticator.php +++ b/src/Security/JWTAuthenticator.php @@ -43,7 +43,7 @@ class JWTAuthenticator implements AuthenticationSuccessHandlerInterface new Cookie( 'BEARER', $jwt, - time() + 7200, // expiration + time() + 604800, // expiration '/', null, true, diff --git a/src/Security/OAuthAuthenticator.php b/src/Security/OAuthAuthenticator.php index 2d3f24c..59c6067 100644 --- a/src/Security/OAuthAuthenticator.php +++ b/src/Security/OAuthAuthenticator.php @@ -75,7 +75,7 @@ class OAuthAuthenticator extends OAuth2Authenticator implements AuthenticationEn new Cookie( 'BEARER', $token, - time() + 7200, // expiration + time() + 604800, // expiration '/', null, true, From 38c96416615f73adfc5da1d12d689122f810e261 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ma=C3=ABl=20Gangloff?= Date: Sat, 17 Aug 2024 21:52:40 +0200 Subject: [PATCH 5/5] feat: add diagram in domain search page --- assets/components/search/DomainDiagram.tsx | 47 ++++++++++++++++ .../tracking/diagram/WatchlistToEdges.tsx | 36 ------------- .../tracking/diagram/WatchlistToNodes.tsx | 52 ------------------ .../tracking/watchlist/WatchlistsList.tsx | 2 +- .../diagram/ViewDiagramWatchlistButton.tsx | 8 +-- .../diagram/getLayoutedElements.tsx | 0 .../watchlist/diagram/watchlistToEdges.tsx | 47 ++++++++++++++++ .../watchlist/diagram/watchlistToNodes.tsx | 54 +++++++++++++++++++ assets/pages/search/DomainSearchPage.tsx | 2 + translations/translations.pot | 42 ++++++++------- 10 files changed, 178 insertions(+), 112 deletions(-) create mode 100644 assets/components/search/DomainDiagram.tsx delete mode 100644 assets/components/tracking/diagram/WatchlistToEdges.tsx delete mode 100644 assets/components/tracking/diagram/WatchlistToNodes.tsx rename assets/components/tracking/{ => watchlist}/diagram/ViewDiagramWatchlistButton.tsx (94%) rename assets/components/tracking/{ => watchlist}/diagram/getLayoutedElements.tsx (100%) create mode 100644 assets/components/tracking/watchlist/diagram/watchlistToEdges.tsx create mode 100644 assets/components/tracking/watchlist/diagram/watchlistToNodes.tsx diff --git a/assets/components/search/DomainDiagram.tsx b/assets/components/search/DomainDiagram.tsx new file mode 100644 index 0000000..6397454 --- /dev/null +++ b/assets/components/search/DomainDiagram.tsx @@ -0,0 +1,47 @@ +import React, {useEffect} from "react"; +import {Background, Controls, MiniMap, ReactFlow, useEdgesState, useNodesState} from "@xyflow/react"; +import {Flex} from "antd"; +import {Domain} from "../../utils/api"; +import {getLayoutedElements} from "../tracking/watchlist/diagram/getLayoutedElements"; +import {domainEntitiesToNode, domainToNode, nsToNode, tldToNode} from "../tracking/watchlist/diagram/watchlistToNodes"; +import {domainEntitiesToEdges, domainNSToEdges, tldToEdge} from "../tracking/watchlist/diagram/watchlistToEdges"; + +export function DomainDiagram({domain}: { domain: Domain }) { + const [nodes, setNodes, onNodesChange] = useNodesState([]) + const [edges, setEdges, onEdgesChange] = useEdgesState([]) + + + useEffect(() => { + const e = getLayoutedElements([ + domainToNode(domain), + ...domainEntitiesToNode(domain), + tldToNode(domain.tld), + ...domain.nameservers.map(nsToNode) + ].flat(), [ + domainEntitiesToEdges(domain), + tldToEdge(domain), + ...domainNSToEdges(domain) + ].flat()) + + setNodes(e.nodes) + setEdges(e.edges) + }, []) + + return + + + + + + +} \ No newline at end of file diff --git a/assets/components/tracking/diagram/WatchlistToEdges.tsx b/assets/components/tracking/diagram/WatchlistToEdges.tsx deleted file mode 100644 index 714ed70..0000000 --- a/assets/components/tracking/diagram/WatchlistToEdges.tsx +++ /dev/null @@ -1,36 +0,0 @@ -import {Watchlist} from "../../../utils/api"; -import {translateRoles} from "../../search/EntitiesList"; - -const rolesToColor = (roles: string[]) => roles.includes('registrant') ? 'green' : - roles.includes('administrative') ? 'blue' : - roles.includes('technical') ? 'orange' : 'violet' - - -export function watchlistToEdges(watchlist: Watchlist) { - const domainRole = translateRoles() - - const entitiesEdges = watchlist.domains - .map(d => d.entities - .filter(e => !e.roles.includes('registrar')) // - .map(e => ({ - id: `e-${d.ldhName}-${e.entity.handle}`, - source: e.roles.includes('registrant') ? e.entity.handle : d.ldhName, - target: e.roles.includes('registrant') ? d.ldhName : e.entity.handle, - style: {stroke: rolesToColor(e.roles), strokeWidth: 3}, - label: e.roles.map(r => Object.keys(domainRole).includes(r) ? domainRole[r as keyof typeof domainRole] : r).join(', '), - animated: e.roles.includes('registrant'), - })) - ).flat() - - const nameserversEdges = watchlist.domains - .map(d => d.nameservers - .map(ns => ({ - id: `ns-${d.ldhName}-${ns.ldhName}`, - source: d.ldhName, - target: ns.ldhName, - style: {stroke: 'grey', strokeWidth: 3}, - label: 'DNS' - }))).flat() - - return [...entitiesEdges, ...nameserversEdges] -} diff --git a/assets/components/tracking/diagram/WatchlistToNodes.tsx b/assets/components/tracking/diagram/WatchlistToNodes.tsx deleted file mode 100644 index 4a2a4d8..0000000 --- a/assets/components/tracking/diagram/WatchlistToNodes.tsx +++ /dev/null @@ -1,52 +0,0 @@ -import {Watchlist} from "../../../utils/api"; -import vCard from "vcf"; -import React from "react"; -import {t} from 'ttag' - -export function watchlistToNodes(watchlist: Watchlist) { - const domains = watchlist.domains.map(d => ({ - id: d.ldhName, - data: {label: {d.ldhName}}, - style: { - width: 200 - }, - parentId: d.tld.tld, - extent: 'parent' - })) - const entities = [...new Set(watchlist.domains - .map(d => d.entities - .filter(e => !e.roles.includes('registrar')) // - .map(e => { - const jCard = vCard.fromJSON(e.entity.jCard) - let label = e.entity.handle - if (jCard.data.fn !== undefined && !Array.isArray(jCard.data.fn)) label = jCard.data.fn.valueOf() - - return { - id: e.entity.handle, - data: {label}, - style: { - width: 200 - }, - parentId: d.tld.tld, - extent: 'parent' - } - })).flat())] - - const tlds = [...new Set(watchlist.domains.map(d => d.tld))].map(tld => ({ - id: tld.tld, - data: {label: t`.${tld.tld} Registry`}, - style: { - width: 200 - } - })) - - const nameservers = [...new Set(watchlist.domains.map(d => d.nameservers))].flat().map(ns => ({ - id: ns.ldhName, - data: {label: ns.ldhName}, - style: { - width: 200 - } - })) - - return [...domains, ...entities, ...nameservers] -} \ No newline at end of file diff --git a/assets/components/tracking/watchlist/WatchlistsList.tsx b/assets/components/tracking/watchlist/WatchlistsList.tsx index d3a17b7..b4ee498 100644 --- a/assets/components/tracking/watchlist/WatchlistsList.tsx +++ b/assets/components/tracking/watchlist/WatchlistsList.tsx @@ -9,7 +9,7 @@ import punycode from "punycode/punycode"; import {Connector} from "../../../utils/api/connectors"; import {UpdateWatchlistButton} from "./UpdateWatchlistButton"; import {DeleteWatchlistButton} from "./DeleteWatchlistButton"; -import {ViewDiagramWatchlistButton} from "../diagram/ViewDiagramWatchlistButton"; +import {ViewDiagramWatchlistButton} from "./diagram/ViewDiagramWatchlistButton"; export function WatchlistsList({watchlists, onDelete, onUpdateWatchlist, connectors}: { watchlists: Watchlist[], diff --git a/assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx b/assets/components/tracking/watchlist/diagram/ViewDiagramWatchlistButton.tsx similarity index 94% rename from assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx rename to assets/components/tracking/watchlist/diagram/ViewDiagramWatchlistButton.tsx index e724f0d..953b01b 100644 --- a/assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx +++ b/assets/components/tracking/watchlist/diagram/ViewDiagramWatchlistButton.tsx @@ -5,10 +5,10 @@ import {ApartmentOutlined} from "@ant-design/icons" import '@xyflow/react/dist/style.css' import {Background, Controls, MiniMap, ReactFlow, useEdgesState, useNodesState} from "@xyflow/react"; -import {getWatchlist} from "../../../utils/api"; +import {getWatchlist} from "../../../../utils/api"; import {getLayoutedElements} from "./getLayoutedElements"; -import {watchlistToNodes} from "./WatchlistToNodes"; -import {watchlistToEdges} from "./WatchlistToEdges"; +import {watchlistToNodes} from "./watchlistToNodes"; +import {watchlistToEdges} from "./watchlistToEdges"; export type DiagramConfig = { tld?: boolean @@ -17,8 +17,8 @@ export type DiagramConfig = { } export function ViewDiagramWatchlistButton({token}: { token: string }) { - const [open, setOpen] = useState(false) + const [open, setOpen] = useState(false) const [loading, setLoading] = useState(false) const [nodes, setNodes, onNodesChange] = useNodesState([]) const [edges, setEdges, onEdgesChange] = useEdgesState([]) diff --git a/assets/components/tracking/diagram/getLayoutedElements.tsx b/assets/components/tracking/watchlist/diagram/getLayoutedElements.tsx similarity index 100% rename from assets/components/tracking/diagram/getLayoutedElements.tsx rename to assets/components/tracking/watchlist/diagram/getLayoutedElements.tsx diff --git a/assets/components/tracking/watchlist/diagram/watchlistToEdges.tsx b/assets/components/tracking/watchlist/diagram/watchlistToEdges.tsx new file mode 100644 index 0000000..24df8fb --- /dev/null +++ b/assets/components/tracking/watchlist/diagram/watchlistToEdges.tsx @@ -0,0 +1,47 @@ +import {Domain, Watchlist} from "../../../../utils/api"; +import {translateRoles} from "../../../search/EntitiesList"; +import {t} from "ttag"; + +const rolesToColor = (roles: string[]) => roles.includes('registrant') ? 'green' : + roles.includes('administrative') ? 'blue' : + roles.includes('technical') ? 'orange' : 'violet' + +export function domainEntitiesToEdges(d: Domain) { + const domainRole = translateRoles() + return d.entities + .filter(e => !e.roles.includes('registrar')) // + .map(e => ({ + id: `e-${d.ldhName}-${e.entity.handle}`, + source: e.roles.includes('registrant') ? e.entity.handle : d.ldhName, + target: e.roles.includes('registrant') ? d.ldhName : e.entity.handle, + style: {stroke: rolesToColor(e.roles), strokeWidth: 3}, + label: e.roles + .map(r => Object.keys(domainRole).includes(r) ? domainRole[r as keyof typeof domainRole] : r) + .join(', '), + animated: e.roles.includes('registrant'), + })) +} + +export const domainNSToEdges = (d: Domain) => d.nameservers + .map(ns => ({ + id: `ns-${d.ldhName}-${ns.ldhName}`, + source: d.ldhName, + target: ns.ldhName, + style: {stroke: 'grey', strokeWidth: 3}, + label: 'DNS' + })) + +export const tldToEdge = (d: Domain) => ({ + id: `tld-${d.ldhName}-${d.tld.tld}`, + source: d.tld.tld, + target: d.ldhName, + style: {stroke: 'yellow', strokeWidth: 3}, + label: t`Registry` +}) + +export function watchlistToEdges(watchlist: Watchlist) { + const entitiesEdges = watchlist.domains.map(domainEntitiesToEdges).flat() + const nameserversEdges = watchlist.domains.map(domainNSToEdges).flat() + + return [...entitiesEdges, ...nameserversEdges] +} diff --git a/assets/components/tracking/watchlist/diagram/watchlistToNodes.tsx b/assets/components/tracking/watchlist/diagram/watchlistToNodes.tsx new file mode 100644 index 0000000..2a1d015 --- /dev/null +++ b/assets/components/tracking/watchlist/diagram/watchlistToNodes.tsx @@ -0,0 +1,54 @@ +import {Domain, Nameserver, Tld, Watchlist} from "../../../../utils/api"; +import vCard from "vcf"; +import React from "react"; +import {t} from 'ttag' + +export const domainToNode = (d: Domain) => ({ + id: d.ldhName, + data: {label: {d.ldhName}}, + style: { + width: 200 + } +}) + +export const domainEntitiesToNode = (d: Domain) => d.entities + .filter(e => !e.roles.includes('registrar')) // + .map(e => { + const jCard = vCard.fromJSON(e.entity.jCard) + let label = e.entity.handle + if (jCard.data.fn !== undefined && !Array.isArray(jCard.data.fn)) label = jCard.data.fn.valueOf() + + return { + id: e.entity.handle, + data: {label}, + style: { + width: 200 + } + } + }) + +export const tldToNode = (tld: Tld) => ({ + id: tld.tld, + data: {label: t`.${tld.tld} Registry`}, + style: { + width: 200 + } +}) + +export const nsToNode = (ns: Nameserver) => ({ + id: ns.ldhName, + data: {label: ns.ldhName}, + style: { + width: 200 + } +}) + +export function watchlistToNodes(watchlist: Watchlist) { + + const domains = watchlist.domains.map(domainToNode) + const entities = [...new Set(watchlist.domains.map(domainEntitiesToNode).flat())] + const tlds = [...new Set(watchlist.domains.map(d => d.tld))].map(tldToNode) + const nameservers = [...new Set(watchlist.domains.map(d => d.nameservers))].flat().map(nsToNode) + + return [...domains, ...entities, ...nameservers] +} \ No newline at end of file diff --git a/assets/pages/search/DomainSearchPage.tsx b/assets/pages/search/DomainSearchPage.tsx index 4c93fc5..e5380e8 100644 --- a/assets/pages/search/DomainSearchPage.tsx +++ b/assets/pages/search/DomainSearchPage.tsx @@ -7,6 +7,7 @@ import {DomainSearchBar, FieldType} from "../../components/search/DomainSearchBa import {EventTimeline} from "../../components/search/EventTimeline"; import {EntitiesList} from "../../components/search/EntitiesList"; import {showErrorAPI} from "../../utils"; +import {DomainDiagram} from "../../components/search/DomainDiagram"; const {Text} = Typography; @@ -68,6 +69,7 @@ export default function DomainSearchPage() { } + : ) diff --git a/translations/translations.pot b/translations/translations.pot index fb1c62b..010560a 100644 --- a/translations/translations.pot +++ b/translations/translations.pot @@ -235,19 +235,6 @@ msgstr "" msgid "No" msgstr "" -#: assets/components/tracking/diagram/WatchlistToNodes.tsx:37 -#, javascript-format -msgid ".${ tld.tld } Registry" -msgstr "" - -#: assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx:40 -msgid "View the Watchlist Entity Diagram" -msgstr "" - -#: assets/components/tracking/diagram/ViewDiagramWatchlistButton.tsx:45 -msgid "Watchlist Entity Diagram" -msgstr "" - #: assets/components/tracking/watchlist/WatchlistForm.tsx:66 msgid "Name" msgstr "" @@ -313,6 +300,23 @@ msgstr "" msgid "Cancel" msgstr "" +#: assets/components/tracking/watchlist/diagram/ViewDiagramWatchlistButton.tsx:40 +msgid "View the Watchlist Entity Diagram" +msgstr "" + +#: assets/components/tracking/watchlist/diagram/ViewDiagramWatchlistButton.tsx:45 +msgid "Watchlist Entity Diagram" +msgstr "" + +#: assets/components/tracking/watchlist/diagram/watchlistToEdges.tsx:39 +msgid "Registry" +msgstr "" + +#: assets/components/tracking/watchlist/diagram/watchlistToNodes.tsx:32 +#, javascript-format +msgid ".${ tld.tld } Registry" +msgstr "" + #: assets/components/tracking/watchlist/DeleteWatchlistButton.tsx:12 #: assets/components/tracking/watchlist/DeleteWatchlistButton.tsx:19 msgid "Delete the Watchlist" @@ -411,27 +415,27 @@ msgstr "" msgid "Register" msgstr "" -#: assets/pages/search/DomainSearchPage.tsx:21 +#: assets/pages/search/DomainSearchPage.tsx:22 msgid "Found !" msgstr "" -#: assets/pages/search/DomainSearchPage.tsx:29 +#: assets/pages/search/DomainSearchPage.tsx:30 msgid "Domain finder" msgstr "" -#: assets/pages/search/DomainSearchPage.tsx:50 +#: assets/pages/search/DomainSearchPage.tsx:51 msgid "EPP Status Codes" msgstr "" -#: assets/pages/search/DomainSearchPage.tsx:60 +#: assets/pages/search/DomainSearchPage.tsx:61 msgid "Timeline" msgstr "" -#: assets/pages/search/DomainSearchPage.tsx:65 +#: assets/pages/search/DomainSearchPage.tsx:66 msgid "Entities" msgstr "" -#: assets/pages/search/DomainSearchPage.tsx:73 +#: assets/pages/search/DomainSearchPage.tsx:75 msgid "" "Although the domain exists in my database, it has been deleted from the " "WHOIS by its registrar."