External/domain-watchdog
1
0
Fork 0
mirror of https://github.com/maelgangloff/domain-watchdog.git synced 2025-12-29 16:15:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: better-looking watchlist cards

Browse Source
This commit is contained in:
vinceh121
2024-07-31 02:55:20 +02:00
parent f623d21ff4
commit 1f5c62a090
2 changed files with 22 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
assets/pages/tracking/WatchlistPage.tsx
View File

@@ -1,5 +1,5 @@
import React, {useEffect, useState} from "react";
import {Card, Flex, Form, message, Skeleton} from "antd";
import {Card, Divider, Flex, Form, message, Skeleton} from "antd";
import {EventAction, getWatchlists, postWatchlist} from "../../utils/api";
import {AxiosError} from "axios";
import {t} from 'ttag'
@@ -33,7 +33,7 @@ export default function WatchlistPage() {
messageApi.success(t`Watchlist created !`)
}).catch((e: AxiosError) => {
const data = e?.response?.data as { detail: string }
messageApi.error(data.detail ?? t`An error occurred`)
messageApi.error(data?.detail ?? t`An error occurred`)
})
}
@@ -41,13 +41,18 @@ export default function WatchlistPage() {
setWatchlists(w['hydra:member'])
}).catch((e: AxiosError) => {
const data = e?.response?.data as { detail: string }
messageApi.error(data.detail ?? t`An error occurred`)
messageApi.error(data?.detail ?? t`An error occurred`)
setWatchlists(undefined)
})
useEffect(() => {
refreshWatchlists()
getConnectors().then(c => setConnectors(c['hydra:member']))
getConnectors()
.then(c => setConnectors(c['hydra:member']))
.catch((e: AxiosError) => {
const data = e?.response?.data as { detail: string }
messageApi.error(data?.detail ?? t`An error occurred`)
})
}, [])
return <Flex gap="middle" align="center" justify="center" vertical>
@@ -59,12 +64,10 @@ export default function WatchlistPage() {
}
</Card>
<Divider />
<Skeleton loading={watchlists === undefined} active>
{watchlists && watchlists.length > 0 && <Card title={t`My Watchlists`} style={{width: '100%'}}>
<WatchlistsList watchlists={watchlists} onDelete={refreshWatchlists}/>
</Card>
}
</Skeleton>
<Card size="small" loading={!watchlists} title={t`My Watchlists`} style={{width: '100%'}}>
{watchlists && watchlists.length > 0 && <WatchlistsList watchlists={watchlists} onDelete={refreshWatchlists}/>}
</Card>
</Flex>
}