mirror of
https://github.com/maelgangloff/domain-watchdog.git
synced 2025-12-17 09:45:29 +00:00
feat: add authentication banner
This commit is contained in:
Maël Gangloff
parent
7b04d1889e
commit
5c2c74cfb4
199
assets/App.tsx
199
assets/App.tsx
@ -1,4 +1,4 @@
|
||||
import {Button, ConfigProvider, Drawer, Flex, Layout, message, theme, Typography} from 'antd'
|
||||
import {Alert, Button, ConfigProvider, Drawer, Flex, Layout, message, theme, Typography} from 'antd'
|
||||
import {Link, Navigate, Route, Routes, useLocation, useNavigate} from 'react-router-dom'
|
||||
import TextPage from './pages/TextPage'
|
||||
import DomainSearchPage from './pages/search/DomainSearchPage'
|
||||
@ -8,7 +8,7 @@ import StatisticsPage from './pages/StatisticsPage'
|
||||
import WatchlistPage from './pages/tracking/WatchlistPage'
|
||||
import UserPage from './pages/UserPage'
|
||||
import type {PropsWithChildren} from 'react'
|
||||
import React, { useCallback, useEffect, useMemo, useState} from 'react'
|
||||
import React, {useCallback, useEffect, useMemo, useState} from 'react'
|
||||
import {getConfiguration, getUser, type InstanceConfig} from './utils/api'
|
||||
import LoginPage from './pages/LoginPage'
|
||||
import ConnectorPage from './pages/tracking/ConnectorPage'
|
||||
@ -25,10 +25,15 @@ import {AuthenticatedContext, ConfigurationContext} from "./contexts"
|
||||
const PROJECT_LINK = 'https://github.com/maelgangloff/domain-watchdog'
|
||||
const LICENSE_LINK = 'https://www.gnu.org/licenses/agpl-3.0.txt'
|
||||
|
||||
const ProjectLink = <Typography.Link key="projectLink" target='_blank' href={PROJECT_LINK}>Domain Watchdog</Typography.Link>
|
||||
const LicenseLink = <Typography.Link key="licenceLink" target='_blank' rel='license' href={LICENSE_LINK}>AGPL-3.0-or-later</Typography.Link>
|
||||
const ProjectLink = <Typography.Link key="projectLink" target='_blank' href={PROJECT_LINK}>Domain
|
||||
Watchdog</Typography.Link>
|
||||
const LicenseLink = <Typography.Link key="licenceLink" target='_blank' rel='license'
|
||||
href={LICENSE_LINK}>AGPL-3.0-or-later</Typography.Link>
|
||||
|
||||
function SiderWrapper(props: PropsWithChildren<{sidebarCollapsed: boolean, setSidebarCollapsed: (collapsed: boolean) => void}>): React.ReactElement {
|
||||
function SiderWrapper(props: PropsWithChildren<{
|
||||
sidebarCollapsed: boolean,
|
||||
setSidebarCollapsed: (collapsed: boolean) => void
|
||||
}>): React.ReactElement {
|
||||
const {sidebarCollapsed, setSidebarCollapsed, children} = props
|
||||
const sm = useBreakpoint('sm')
|
||||
const location = useLocation()
|
||||
@ -41,22 +46,22 @@ function SiderWrapper(props: PropsWithChildren<{sidebarCollapsed: boolean, setSi
|
||||
|
||||
if (sm) {
|
||||
return <Drawer
|
||||
placement="left"
|
||||
open={sidebarCollapsed}
|
||||
onClose={() => setSidebarCollapsed(false)}
|
||||
closeIcon={null}
|
||||
styles={{body: {padding: 0, height: '100%', background: '#001529'}}}
|
||||
width='200px'>
|
||||
placement="left"
|
||||
open={sidebarCollapsed}
|
||||
onClose={() => setSidebarCollapsed(false)}
|
||||
closeIcon={null}
|
||||
styles={{body: {padding: 0, height: '100%', background: '#001529'}}}
|
||||
width='200px'>
|
||||
{children}
|
||||
</Drawer>
|
||||
} else {
|
||||
return <Layout.Sider
|
||||
collapsible
|
||||
breakpoint='sm'
|
||||
width={220}
|
||||
trigger={null}
|
||||
collapsed={sidebarCollapsed && sm}
|
||||
{...(sm ? {collapsedWidth: 0} : {})}>
|
||||
collapsible
|
||||
breakpoint='sm'
|
||||
width={220}
|
||||
trigger={null}
|
||||
collapsed={sidebarCollapsed && sm}
|
||||
{...(sm ? {collapsedWidth: 0} : {})}>
|
||||
{children}
|
||||
</Layout.Sider>
|
||||
}
|
||||
@ -68,8 +73,7 @@ export default function App(): React.ReactElement {
|
||||
const sm = useBreakpoint('sm')
|
||||
|
||||
const [sidebarCollapsed, setSidebarCollapsed] = useState(false)
|
||||
const [isAuthenticated, setIsAuthenticated] = useState(false)
|
||||
|
||||
const [isAuthenticated, setIsAuthenticated] = useState<boolean | undefined>(undefined)
|
||||
const [configuration, setConfiguration] = useState<InstanceConfig | undefined>(undefined)
|
||||
|
||||
const [darkMode, setDarkMode] = useState(false)
|
||||
@ -108,7 +112,7 @@ export default function App(): React.ReactElement {
|
||||
}).catch(() => {
|
||||
setIsAuthenticated(false)
|
||||
const pathname = location.pathname
|
||||
if(configuration.publicRdapLookupEnabled) return navigate('/search/domain')
|
||||
if (configuration.publicRdapLookupEnabled) return navigate('/search/domain')
|
||||
if (!['/login', '/tos', '/faq', '/privacy'].includes(pathname)) return navigate('/home')
|
||||
})
|
||||
}).catch(() => messageApi.error(t`Unable to contact the server, please reload the page.`))
|
||||
@ -121,91 +125,92 @@ export default function App(): React.ReactElement {
|
||||
}}
|
||||
>
|
||||
<ConfigurationContext.Provider value={configContextValue}>
|
||||
<AuthenticatedContext.Provider value={authContextValue}>
|
||||
<Layout hasSider style={{minHeight: '100vh'}}>
|
||||
<SiderWrapper sidebarCollapsed={sidebarCollapsed} setSidebarCollapsed={setSidebarCollapsed}>
|
||||
<Sider />
|
||||
</SiderWrapper>
|
||||
<Layout>
|
||||
<Layout.Header style={{padding: 0}}>
|
||||
{sm &&
|
||||
<Button type="text" style={{marginLeft: 8}} onClick={() => setSidebarCollapsed(!sidebarCollapsed)}>
|
||||
<MenuOutlined />
|
||||
</Button>
|
||||
}
|
||||
</Layout.Header>
|
||||
<Layout.Content style={sm ? {margin: '24px 0'} : {margin: '24px 16px 0'}}>
|
||||
<div style={{
|
||||
padding: sm ? 8 : 24,
|
||||
minHeight: 360
|
||||
}}
|
||||
>
|
||||
{contextHolder}
|
||||
<Routes>
|
||||
<Route path='/' element={<Navigate to={configuration?.publicRdapLookupEnabled ? '/search/domain' : '/home'}/>}/>
|
||||
<Route path='/home' element={<TextPage resource='home.md'/>}/>
|
||||
|
||||
<Route path='/search/domain' element={<DomainSearchPage/>}/>
|
||||
<Route path='/search/domain/:query' element={<DomainSearchPage/>}/>
|
||||
<Route path='/search/entity' element={<EntitySearchPage/>}/>
|
||||
|
||||
<Route path='/infrastructure/tld' element={<TldPage/>}/>
|
||||
<Route path='/infrastructure/icann' element={<IcannRegistrarPage/>}/>
|
||||
|
||||
<Route path='/tracking/watchlist' element={<WatchlistPage/>}/>
|
||||
<Route path='/tracking/domains' element={<TrackedDomainPage/>}/>
|
||||
<Route path='/tracking/connectors' element={<ConnectorPage/>}/>
|
||||
|
||||
<Route path='/stats' element={<StatisticsPage/>}/>
|
||||
<Route path='/user' element={<UserPage/>}/>
|
||||
|
||||
<Route path='/faq' element={<TextPage resource='faq.md'/>}/>
|
||||
<Route path='/tos' element={<TextPage resource='tos.md'/>}/>
|
||||
<Route path='/privacy' element={<TextPage resource='privacy.md'/>}/>
|
||||
|
||||
<Route path='/login' element={<LoginPage/>}/>
|
||||
|
||||
<Route path='*' element={<NotFoundPage/>}/>
|
||||
</Routes>
|
||||
</div>
|
||||
</Layout.Content>
|
||||
<Layout.Footer style={{textAlign: 'center'}}>
|
||||
<Flex gap='middle' wrap justify='center'>
|
||||
<Link to='/tos' rel='terms-of-service'><Button type='text'>{t`TOS`}</Button></Link>
|
||||
<Link to='/privacy' rel='privacy-policy'><Button type='text'>{t`Privacy Policy`}</Button></Link>
|
||||
<Link to='/faq'><Button type='text'>{t`FAQ`}</Button></Link>
|
||||
<Typography.Link
|
||||
target='_blank'
|
||||
href='https://domainwatchdog.eu'
|
||||
<AuthenticatedContext.Provider value={authContextValue}>
|
||||
{(configuration?.registerEnabled || configuration?.ssoLogin) && isAuthenticated === false && location.pathname !== '/login' &&
|
||||
<Alert
|
||||
type="warning"
|
||||
message={t`Please authenticate to take advantage of all features, monitor domains and manage your Connectors.`}
|
||||
action={<Link to='/login'><Button>{t`Log in`}`</Button></Link>}
|
||||
banner closable/>
|
||||
}
|
||||
<Layout hasSider style={{minHeight: '100vh'}}>
|
||||
<SiderWrapper sidebarCollapsed={sidebarCollapsed} setSidebarCollapsed={setSidebarCollapsed}>
|
||||
<Sider/>
|
||||
</SiderWrapper>
|
||||
<Layout>
|
||||
<Layout.Header style={{padding: 0}}>
|
||||
{sm &&
|
||||
<Button type="text" style={{marginLeft: 8}}
|
||||
onClick={() => setSidebarCollapsed(!sidebarCollapsed)}>
|
||||
<MenuOutlined/>
|
||||
</Button>
|
||||
}
|
||||
</Layout.Header>
|
||||
<Layout.Content style={sm ? {margin: '24px 0'} : {margin: '24px 16px 0'}}>
|
||||
<div style={{
|
||||
padding: sm ? 8 : 24,
|
||||
minHeight: 360
|
||||
}}
|
||||
>
|
||||
<Button type='text'>
|
||||
{contextHolder}
|
||||
<Routes>
|
||||
<Route path='/' element={<Navigate
|
||||
to={configuration?.publicRdapLookupEnabled ? '/search/domain' : '/home'}/>}/>
|
||||
<Route path='/home' element={<TextPage resource='home.md'/>}/>
|
||||
|
||||
<Route path='/search/domain' element={<DomainSearchPage/>}/>
|
||||
<Route path='/search/domain/:query' element={<DomainSearchPage/>}/>
|
||||
<Route path='/search/entity' element={<EntitySearchPage/>}/>
|
||||
|
||||
<Route path='/infrastructure/tld' element={<TldPage/>}/>
|
||||
<Route path='/infrastructure/icann' element={<IcannRegistrarPage/>}/>
|
||||
|
||||
<Route path='/tracking/watchlist' element={<WatchlistPage/>}/>
|
||||
<Route path='/tracking/domains' element={<TrackedDomainPage/>}/>
|
||||
<Route path='/tracking/connectors' element={<ConnectorPage/>}/>
|
||||
|
||||
<Route path='/stats' element={<StatisticsPage/>}/>
|
||||
<Route path='/user' element={<UserPage/>}/>
|
||||
|
||||
<Route path='/faq' element={<TextPage resource='faq.md'/>}/>
|
||||
<Route path='/tos' element={<TextPage resource='tos.md'/>}/>
|
||||
<Route path='/privacy' element={<TextPage resource='privacy.md'/>}/>
|
||||
|
||||
<Route path='/login' element={<LoginPage/>}/>
|
||||
|
||||
<Route path='*' element={<NotFoundPage/>}/>
|
||||
</Routes>
|
||||
</div>
|
||||
</Layout.Content>
|
||||
<Layout.Footer style={{textAlign: 'center'}}>
|
||||
<Flex gap='middle' wrap justify='center'>
|
||||
<Link to='/tos' rel='terms-of-service'><Button type='text'>{t`TOS`}</Button></Link>
|
||||
<Link to='/privacy' rel='privacy-policy'><Button
|
||||
type='text'>{t`Privacy Policy`}</Button></Link>
|
||||
<Link to='/faq'><Button type='text'>{t`FAQ`}</Button></Link>
|
||||
<Button target='_blank'
|
||||
href='https://domainwatchdog.eu'
|
||||
type='text'>
|
||||
{t`Documentation`}
|
||||
</Button>
|
||||
</Typography.Link>
|
||||
<Typography.Link
|
||||
target='_blank'
|
||||
href={PROJECT_LINK}
|
||||
>
|
||||
<Button type='text'>
|
||||
<Button target='_blank'
|
||||
href={PROJECT_LINK}
|
||||
type='text'>
|
||||
{t`Source code`}
|
||||
</Button>
|
||||
</Typography.Link>
|
||||
<Typography.Link
|
||||
target='_blank'
|
||||
href={PROJECT_LINK + '/issues'}
|
||||
>
|
||||
<Button type='text'>
|
||||
<Button target='_blank'
|
||||
href={PROJECT_LINK + '/issues'}
|
||||
type='text'>
|
||||
{t`Submit an issue`}
|
||||
</Button>
|
||||
</Typography.Link>
|
||||
</Flex>
|
||||
<Typography.Paragraph style={{marginTop: '1em'}}>
|
||||
{jt`${ProjectLink} is an open source project distributed under the ${LicenseLink} license.`}
|
||||
</Typography.Paragraph>
|
||||
</Layout.Footer>
|
||||
</Flex>
|
||||
<Typography.Paragraph style={{marginTop: '1em'}}>
|
||||
{jt`${ProjectLink} is an open source project distributed under the ${LicenseLink} license.`}
|
||||
</Typography.Paragraph>
|
||||
</Layout.Footer>
|
||||
</Layout>
|
||||
</Layout>
|
||||
</Layout>
|
||||
</AuthenticatedContext.Provider>
|
||||
</AuthenticatedContext.Provider>
|
||||
</ConfigurationContext.Provider>
|
||||
</ConfigProvider>
|
||||
)
|
||||
|
||||
@ -12,7 +12,7 @@ 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 eventDetail = t`Estimated WHOIS removal date. This is the earliest date this record would be deleted, according to ICANN's standard lifecycle. Note that some registries have their own lifecycles.`
|
||||
|
||||
const dateStr =
|
||||
<Typography.Text>
|
||||
|
||||
@ -13,12 +13,12 @@ export const ConfigurationContext = createContext<ConfigurationContextType>({
|
||||
|
||||
|
||||
export type AuthContextType = {
|
||||
isAuthenticated: boolean
|
||||
setIsAuthenticated: React.Dispatch<React.SetStateAction<boolean>>
|
||||
isAuthenticated?: boolean
|
||||
setIsAuthenticated: React.Dispatch<React.SetStateAction<boolean | undefined>>
|
||||
}
|
||||
|
||||
export const AuthenticatedContext = createContext<AuthContextType>({
|
||||
isAuthenticated: false,
|
||||
isAuthenticated: undefined,
|
||||
setIsAuthenticated: () => {
|
||||
},
|
||||
})
|
||||
@ -1,6 +1,6 @@
|
||||
import React, {useContext, useEffect, useState} from 'react'
|
||||
import type {FormProps} from 'antd'
|
||||
import {Empty, Flex, FloatButton, message, Skeleton} from 'antd'
|
||||
import { Empty, Flex, FloatButton, message, Skeleton} from 'antd'
|
||||
import type {Domain, Watchlist} from '../../utils/api'
|
||||
import {addDomainToWatchlist, getDomain} from '../../utils/api'
|
||||
import type {AxiosError} from 'axios'
|
||||
|
||||
@ -3,35 +3,48 @@ msgstr ""
|
||||
"Content-Type: text/plain; charset=utf-8\n"
|
||||
"Plural-Forms: nplurals=2; plural=(n!=1);\n"
|
||||
|
||||
#: assets/App.tsx:114
|
||||
#: assets/App.tsx:118
|
||||
msgid "Unable to contact the server, please reload the page."
|
||||
msgstr ""
|
||||
|
||||
#: assets/App.tsx:174
|
||||
#: assets/App.tsx:132
|
||||
msgid ""
|
||||
"Please authenticate to take advantage of all features, monitor domains and "
|
||||
"manage your Connectors."
|
||||
msgstr ""
|
||||
|
||||
#: assets/App.tsx:133
|
||||
#: assets/components/Sider.tsx:158
|
||||
#: assets/pages/LoginPage.tsx:36
|
||||
#: assets/pages/LoginPage.tsx:50
|
||||
msgid "Log in"
|
||||
msgstr ""
|
||||
|
||||
#: assets/App.tsx:187
|
||||
msgid "TOS"
|
||||
msgstr ""
|
||||
|
||||
#: assets/App.tsx:175
|
||||
#: assets/App.tsx:189
|
||||
msgid "Privacy Policy"
|
||||
msgstr ""
|
||||
|
||||
#: assets/App.tsx:176
|
||||
#: assets/App.tsx:190
|
||||
msgid "FAQ"
|
||||
msgstr ""
|
||||
|
||||
#: assets/App.tsx:182
|
||||
#: assets/App.tsx:194
|
||||
msgid "Documentation"
|
||||
msgstr ""
|
||||
|
||||
#: assets/App.tsx:190
|
||||
#: assets/App.tsx:199
|
||||
msgid "Source code"
|
||||
msgstr ""
|
||||
|
||||
#: assets/App.tsx:198
|
||||
#: assets/App.tsx:204
|
||||
msgid "Submit an issue"
|
||||
msgstr ""
|
||||
|
||||
#: assets/App.tsx:203
|
||||
#: assets/App.tsx:208
|
||||
#, javascript-format
|
||||
msgid ""
|
||||
"${ ProjectLink } is an open source project distributed under the ${ "
|
||||
@ -177,7 +190,10 @@ msgid "Estimated removal"
|
||||
msgstr ""
|
||||
|
||||
#: assets/components/search/EventTimeline.tsx:15
|
||||
msgid "Estimated date when the WHOIS record is removed"
|
||||
msgid ""
|
||||
"Estimated WHOIS removal date. This is the earliest date this record would "
|
||||
"be deleted, according to ICANN's standard lifecycle. Note that some "
|
||||
"registries have their own lifecycles."
|
||||
msgstr ""
|
||||
|
||||
#: assets/components/Sider.tsx:35
|
||||
@ -261,12 +277,6 @@ msgstr ""
|
||||
msgid "Log out"
|
||||
msgstr ""
|
||||
|
||||
#: assets/components/Sider.tsx:158
|
||||
#: assets/pages/LoginPage.tsx:36
|
||||
#: assets/pages/LoginPage.tsx:50
|
||||
msgid "Log in"
|
||||
msgstr ""
|
||||
|
||||
#: assets/components/tracking/connector/ConnectorForm.tsx:36
|
||||
#: assets/pages/infrastructure/IcannRegistrarPage.tsx:51
|
||||
#: assets/utils/functions/rdapTranslation.ts:12
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user