mirror of
https://github.com/maelgangloff/domain-watchdog.git
synced 2025-12-29 16:15:04 +00:00
feat: update front layout
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
import React, {useState} from "react";
|
||||
import {Badge, Card, Divider, Flex, Form, FormProps, Input, message, Space, Timeline, Typography} from "antd";
|
||||
import {Badge, Card, Divider, Flex, Form, FormProps, Input, message, Space, Tag, Timeline, Typography} from "antd";
|
||||
import {
|
||||
ClockCircleOutlined,
|
||||
DeleteOutlined,
|
||||
@@ -31,7 +31,6 @@ export default function DomainSearchPage() {
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
return <Flex gap="middle" align="center" justify="center" vertical>
|
||||
<Card title="Domain finder">
|
||||
{contextHolder}
|
||||
@@ -60,8 +59,7 @@ export default function DomainSearchPage() {
|
||||
</Form>
|
||||
|
||||
{
|
||||
domain && <>
|
||||
<Divider/>
|
||||
domain &&
|
||||
<Space direction="vertical" size="middle" style={{width: '100%'}}>
|
||||
<Badge.Ribbon text={`.${domain.tld.tld.toUpperCase()} (${domain.tld.type})`}
|
||||
color={
|
||||
@@ -72,7 +70,19 @@ export default function DomainSearchPage() {
|
||||
}>
|
||||
<Card title={`${domain.ldhName}${domain.handle ? ' (' + domain.handle + ')' : ''}`}
|
||||
size="small">
|
||||
|
||||
{domain.status.length > 0 &&
|
||||
<>
|
||||
<Divider orientation="left">EPP Status Codes</Divider>
|
||||
<Flex gap="4px 0" wrap>
|
||||
{
|
||||
domain.status.map(s =>
|
||||
<Tag color={s === 'active' ? 'green' : 'blue'}>{s}</Tag>
|
||||
)
|
||||
}
|
||||
</Flex>
|
||||
</>
|
||||
}
|
||||
<Divider orientation="left">Timeline</Divider>
|
||||
<Timeline
|
||||
mode="right"
|
||||
items={domain.events
|
||||
@@ -110,7 +120,6 @@ export default function DomainSearchPage() {
|
||||
</Card>
|
||||
</Badge.Ribbon>
|
||||
</Space>
|
||||
</>
|
||||
}
|
||||
</Card>
|
||||
</Flex>
|
||||
|
||||
Reference in New Issue
Block a user