diff --git a/assets/components/search/DomainResult.tsx b/assets/components/search/DomainResult.tsx index 5ebed16..2f98c58 100644 --- a/assets/components/search/DomainResult.tsx +++ b/assets/components/search/DomainResult.tsx @@ -96,7 +96,7 @@ export function DomainResult({domain}: { domain: Domain }) { { domain.events.length > 0 && <> {t`Timeline`} - + } { diff --git a/assets/components/search/EventTimeline.tsx b/assets/components/search/EventTimeline.tsx index 091d57b..5454fb7 100644 --- a/assets/components/search/EventTimeline.tsx +++ b/assets/components/search/EventTimeline.tsx @@ -5,54 +5,94 @@ import useBreakpoint from '../../hooks/useBreakpoint' import {rdapEventDetailTranslation, rdapEventNameTranslation} from '../../utils/functions/rdapTranslation' import {actionToColor} from '../../utils/functions/actionToColor' import {actionToIcon} from '../../utils/functions/actionToIcon' +import {ThunderboltOutlined} from "@ant-design/icons" +import {t} from "ttag" -export function EventTimeline({events}: { events: Event[] }) { +function getWhoisRemoveTimelineEvent(expiresInDays: number) { + const locale = navigator.language.split('-')[0] + const sm = useBreakpoint('sm') + const eventName = t`Estimated removal` + const eventDetail = t`Estimated date when the WHOIS record is removed` + + const dateStr = + + {new Date(new Date().getTime() + expiresInDays * 24 * 60 * 60 * 1e3).toLocaleDateString(locale)} + + + const text = sm + ? { + children: + {eventName} {dateStr} + + } + : { + label: dateStr, + children: {eventName} + } + + return { + color: 'yellow', + dot: , + pending: true, + ...text + } +} + + +export function EventTimeline({events, expiresInDays}: { events: Event[], expiresInDays?: number }) { const sm = useBreakpoint('sm') const locale = navigator.language.split('-')[0] const rdapEventNameTranslated = rdapEventNameTranslation() const rdapEventDetailTranslated = rdapEventDetailTranslation() - return ( - <> - { - const eventName = ( - - {rdapEventNameTranslated[e.action as keyof typeof rdapEventNameTranslated] || e.action} - - ) + const items = [] + if (expiresInDays !== undefined) { + items.push(getWhoisRemoveTimelineEvent(expiresInDays)) + } - const dateStr = ( - {new Date(e.date).toLocaleString(locale)} - - ) + items.push( + ...events + .sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime()) + .map(e => { + const eventName = ( + + {rdapEventNameTranslated[e.action as keyof typeof rdapEventNameTranslated] || e.action} + + ) - const eventDetail = rdapEventDetailTranslated[e.action as keyof typeof rdapEventDetailTranslated] || undefined + const dateStr = ( + {new Date(e.date).toLocaleString(locale)} + + ) - const text = sm - ? { - children: - {eventName} {dateStr} - - } - : { - label: dateStr, - children: {eventName} - } + const eventDetail = rdapEventDetailTranslated[e.action as keyof typeof rdapEventDetailTranslated] || undefined - return { - color: e.deleted ? 'grey' : actionToColor(e.action), - dot: actionToIcon(e.action), - pending: new Date(e.date).getTime() > new Date().getTime(), - ...text + const text = sm + ? { + children: + {eventName} {dateStr} + } + : { + label: dateStr, + children: {eventName} + } + + return { + color: e.deleted ? 'grey' : actionToColor(e.action), + dot: actionToIcon(e.action), + pending: new Date(e.date).getTime() > new Date().getTime(), + ...text } - )} - /> - + } + ) ) + + return } diff --git a/translations/translations.pot b/translations/translations.pot index 08beb1c..e967663 100644 --- a/translations/translations.pot +++ b/translations/translations.pot @@ -172,6 +172,14 @@ msgstr "" msgid "This domain name does not appear to be valid" msgstr "" +#: assets/components/search/EventTimeline.tsx:14 +msgid "Estimated removal" +msgstr "" + +#: assets/components/search/EventTimeline.tsx:15 +msgid "Estimated date when the WHOIS record is removed" +msgstr "" + #: assets/components/Sider.tsx:35 msgid "Home" msgstr ""