feat: add registrar in diagram

This commit is contained in:
Maël Gangloff 2024-08-18 03:28:53 +02:00
parent aa1d9818e6
commit c8953078ad
No known key found for this signature in database
GPG Key ID: 11FDC81C24A7F629
5 changed files with 16 additions and 15 deletions

View File

@ -14,11 +14,11 @@ export function DomainDiagram({domain}: { domain: Domain }) {
useEffect(() => { useEffect(() => {
const e = getLayoutedElements([ const e = getLayoutedElements([
domainToNode(domain), domainToNode(domain),
...domainEntitiesToNode(domain), ...domainEntitiesToNode(domain, true),
tldToNode(domain.tld), tldToNode(domain.tld),
...domain.nameservers.map(nsToNode) ...domain.nameservers.map(nsToNode)
].flat(), [ ].flat(), [
domainEntitiesToEdges(domain), domainEntitiesToEdges(domain, true),
tldToEdge(domain), tldToEdge(domain),
...domainNSToEdges(domain) ...domainNSToEdges(domain)
].flat()) ].flat())
@ -30,7 +30,7 @@ export function DomainDiagram({domain}: { domain: Domain }) {
return <Flex style={{width: '80vw', height: '80vh'}}> return <Flex style={{width: '80vw', height: '80vh'}}>
<ReactFlow <ReactFlow
fitView fitView
colorMode='system' colorMode='dark'
nodesConnectable={false} nodesConnectable={false}
edgesReconnectable={false} edgesReconnectable={false}
nodes={nodes} nodes={nodes}

View File

@ -4,16 +4,17 @@ import {t} from "ttag";
const rolesToColor = (roles: string[]) => roles.includes('registrant') ? 'green' : const rolesToColor = (roles: string[]) => roles.includes('registrant') ? 'green' :
roles.includes('administrative') ? 'blue' : roles.includes('administrative') ? 'blue' :
roles.includes('technical') ? 'orange' : 'violet' roles.includes('technical') ? 'orange' :
roles.includes('registrar') ? 'violet' : 'white'
export function domainEntitiesToEdges(d: Domain) { export function domainEntitiesToEdges(d: Domain, withRegistrar = false) {
const domainRole = translateRoles() const domainRole = translateRoles()
return d.entities return d.entities
.filter(e => !e.roles.includes('registrar')) // .filter(e => !withRegistrar ? !e.roles.includes('registrar') : true)
.map(e => ({ .map(e => ({
id: `e-${d.ldhName}-${e.entity.handle}`, id: `e-${d.ldhName}-${e.entity.handle}`,
source: e.roles.includes('registrant') ? e.entity.handle : d.ldhName, source: e.roles.includes('registrant') || e.roles.includes('registrar') ? e.entity.handle : d.ldhName,
target: e.roles.includes('registrant') ? d.ldhName : e.entity.handle, target: e.roles.includes('registrant') || e.roles.includes('registrar') ? d.ldhName : e.entity.handle,
style: {stroke: rolesToColor(e.roles), strokeWidth: 3}, style: {stroke: rolesToColor(e.roles), strokeWidth: 3},
label: e.roles label: e.roles
.map(r => Object.keys(domainRole).includes(r) ? domainRole[r as keyof typeof domainRole] : r) .map(r => Object.keys(domainRole).includes(r) ? domainRole[r as keyof typeof domainRole] : r)
@ -40,7 +41,7 @@ export const tldToEdge = (d: Domain) => ({
}) })
export function watchlistToEdges(watchlist: Watchlist) { export function watchlistToEdges(watchlist: Watchlist) {
const entitiesEdges = watchlist.domains.map(domainEntitiesToEdges).flat() const entitiesEdges = watchlist.domains.map(d => domainEntitiesToEdges(d)).flat()
const nameserversEdges = watchlist.domains.map(domainNSToEdges).flat() const nameserversEdges = watchlist.domains.map(domainNSToEdges).flat()
return [...entitiesEdges, ...nameserversEdges] return [...entitiesEdges, ...nameserversEdges]

View File

@ -11,8 +11,8 @@ export const domainToNode = (d: Domain) => ({
} }
}) })
export const domainEntitiesToNode = (d: Domain) => d.entities export const domainEntitiesToNode = (d: Domain, withRegistrar = false) => d.entities
.filter(e => !e.roles.includes('registrar')) // .filter(e => !withRegistrar ? !e.roles.includes('registrar') : true)
.map(e => { .map(e => {
const jCard = vCard.fromJSON(e.entity.jCard) const jCard = vCard.fromJSON(e.entity.jCard)
let label = e.entity.handle let label = e.entity.handle
@ -46,7 +46,7 @@ export const nsToNode = (ns: Nameserver) => ({
export function watchlistToNodes(watchlist: Watchlist) { export function watchlistToNodes(watchlist: Watchlist) {
const domains = watchlist.domains.map(domainToNode) const domains = watchlist.domains.map(domainToNode)
const entities = [...new Set(watchlist.domains.map(domainEntitiesToNode).flat())] const entities = [...new Set(watchlist.domains.map(d => domainEntitiesToNode(d)).flat())]
const tlds = [...new Set(watchlist.domains.map(d => d.tld))].map(tldToNode) 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) const nameservers = [...new Set(watchlist.domains.map(d => d.nameservers))].flat().map(nsToNode)

View File

@ -16,7 +16,7 @@ export function showErrorAPI(e: AxiosError, messageApi: MessageInstance): Messag
if (response.status === 429) { if (response.status === 429) {
const duration = response.headers['retry-after'] const duration = response.headers['retry-after']
return messageApi.error(t`Please retry after ${duration} seconds`) return messageApi.error(t`Please retry after ${duration} minutes`)
} }
if (response.status.toString()[0] === '4') { if (response.status.toString()[0] === '4') {

View File

@ -325,7 +325,7 @@ msgstr ""
msgid "Watchlist Entity Diagram" msgid "Watchlist Entity Diagram"
msgstr "" msgstr ""
#: assets/components/tracking/watchlist/diagram/watchlistToEdges.tsx:39 #: assets/components/tracking/watchlist/diagram/watchlistToEdges.tsx:40
msgid "Registry" msgid "Registry"
msgstr "" msgstr ""
@ -607,7 +607,7 @@ msgstr ""
#: assets/utils/index.ts:19 #: assets/utils/index.ts:19
#, javascript-format #, javascript-format
msgid "Please retry after ${ duration } seconds" msgid "Please retry after ${ duration } minutes"
msgstr "" msgstr ""
#: assets/utils/index.ts:23 #: assets/utils/index.ts:23