fix: sidebar selected menu issue

This commit is contained in:
Maël Gangloff
2024-12-28 21:17:13 +01:00
parent ae0fa99870
commit 4bd4d4bd4c
3 changed files with 35 additions and 36 deletions

View File

@@ -59,9 +59,6 @@ export default function App() {
useEffect(() => { useEffect(() => {
setDarkMode(windowQuery.matches) setDarkMode(windowQuery.matches)
}, [])
useEffect(() => {
getUser().then(() => { getUser().then(() => {
setIsAuthenticated(true) setIsAuthenticated(true)
if (location.pathname === '/login') navigate('/home') if (location.pathname === '/login') navigate('/home')

View File

@@ -16,14 +16,15 @@ import {
} from "@ant-design/icons"; } from "@ant-design/icons";
import {Menu} from "antd"; import {Menu} from "antd";
import React from "react"; import React from "react";
import {useNavigate} from "react-router-dom"; import {useLocation, useNavigate} from "react-router-dom";
export function Sider({isAuthenticated}: { isAuthenticated: boolean }) { export function Sider({isAuthenticated}: { isAuthenticated: boolean }) {
const navigate = useNavigate() const navigate = useNavigate()
const location = useLocation()
const menuItems: ItemType[] = [ const menuItems: ItemType[] = [
{ {
key: 'home', key: '/home',
label: t`Home`, label: t`Home`,
icon: <HomeOutlined/>, icon: <HomeOutlined/>,
onClick: () => navigate('/home') onClick: () => navigate('/home')
@@ -34,7 +35,7 @@ export function Sider({isAuthenticated}: { isAuthenticated: boolean }) {
icon: <SearchOutlined/>, icon: <SearchOutlined/>,
children: [ children: [
{ {
key: 'domain-finder', key: '/search/domain',
icon: <CompassOutlined/>, icon: <CompassOutlined/>,
label: t`Domain`, label: t`Domain`,
title: t`Domain Finder`, title: t`Domain Finder`,
@@ -42,7 +43,7 @@ export function Sider({isAuthenticated}: { isAuthenticated: boolean }) {
onClick: () => navigate('/search/domain') onClick: () => navigate('/search/domain')
}, },
{ {
key: 'tld-list', key: '/search/tld',
icon: <BankOutlined/>, icon: <BankOutlined/>,
label: t`TLD`, label: t`TLD`,
title: t`TLD list`, title: t`TLD list`,
@@ -66,7 +67,7 @@ export function Sider({isAuthenticated}: { isAuthenticated: boolean }) {
disabled: true, disabled: true,
onClick: () => navigate('/search/nameserver') onClick: () => navigate('/search/nameserver')
} }
*/ */
] ]
}, },
{ {
@@ -75,21 +76,21 @@ export function Sider({isAuthenticated}: { isAuthenticated: boolean }) {
icon: <AimOutlined/>, icon: <AimOutlined/>,
children: [ children: [
{ {
key: 'watchlist', key: '/tracking/watchlist',
icon: <FileSearchOutlined/>, icon: <FileSearchOutlined/>,
label: t`My Watchlists`, label: t`My Watchlists`,
disabled: !isAuthenticated, disabled: !isAuthenticated,
onClick: () => navigate('/tracking/watchlist') onClick: () => navigate('/tracking/watchlist')
}, },
{ {
key: 'tracked-domain', key: '/tracking/domains',
icon: <TableOutlined/>, icon: <TableOutlined/>,
label: t`Tracked domain names`, label: t`Tracked domain names`,
disabled: !isAuthenticated, disabled: !isAuthenticated,
onClick: () => navigate('/tracking/domains') onClick: () => navigate('/tracking/domains')
}, },
{ {
key: 'connectors', key: '/tracking/connectors',
icon: <ApiOutlined/>, icon: <ApiOutlined/>,
label: t`My Connectors`, label: t`My Connectors`,
disabled: !isAuthenticated, disabled: !isAuthenticated,
@@ -98,7 +99,7 @@ export function Sider({isAuthenticated}: { isAuthenticated: boolean }) {
] ]
}, },
{ {
key: 'stats', key: '/stats',
icon: <LineChartOutlined/>, icon: <LineChartOutlined/>,
label: t`Statistics`, label: t`Statistics`,
disabled: !isAuthenticated, disabled: !isAuthenticated,
@@ -108,12 +109,12 @@ export function Sider({isAuthenticated}: { isAuthenticated: boolean }) {
if (isAuthenticated) { if (isAuthenticated) {
menuItems.push(...[{ menuItems.push(...[{
key: 'account', key: '/user',
icon: <UserOutlined/>, icon: <UserOutlined/>,
label: t`My Account`, label: t`My Account`,
onClick: () => navigate('/user') onClick: () => navigate('/user')
}, { }, {
key: 'logout', key: '/logout',
icon: <LogoutOutlined/>, icon: <LogoutOutlined/>,
label: t`Log out`, label: t`Log out`,
danger: true, danger: true,
@@ -121,7 +122,7 @@ export function Sider({isAuthenticated}: { isAuthenticated: boolean }) {
}]) }])
} else { } else {
menuItems.push({ menuItems.push({
key: 'login', key: '/login',
icon: <LoginOutlined/>, icon: <LoginOutlined/>,
label: t`Log in`, label: t`Log in`,
onClick: () => navigate('/login') onClick: () => navigate('/login')
@@ -130,6 +131,7 @@ export function Sider({isAuthenticated}: { isAuthenticated: boolean }) {
return <Menu return <Menu
defaultOpenKeys={['search', 'info', 'tracking', 'doc']} defaultOpenKeys={['search', 'info', 'tracking', 'doc']}
selectedKeys={[location.pathname.includes('/search/domain') ? '/search/domain' : location.pathname]}
mode="inline" mode="inline"
theme="dark" theme="dark"
items={menuItems} items={menuItems}

View File

@@ -3,34 +3,34 @@ msgstr ""
"Content-Type: text/plain; charset=utf-8\n" "Content-Type: text/plain; charset=utf-8\n"
"Plural-Forms: nplurals=2; plural=(n!=1);\n" "Plural-Forms: nplurals=2; plural=(n!=1);\n"
#: assets/App.tsx:123 #: assets/App.tsx:120
msgid "TOS" msgid "TOS"
msgstr "" msgstr ""
#: assets/App.tsx:124 #: assets/App.tsx:121
msgid "Privacy Policy" msgid "Privacy Policy"
msgstr "" msgstr ""
#: assets/App.tsx:125 #: assets/App.tsx:122
msgid "FAQ" msgid "FAQ"
msgstr "" msgstr ""
#: assets/App.tsx:128 #: assets/App.tsx:125
msgid "Documentation" msgid "Documentation"
msgstr "" msgstr ""
#: assets/App.tsx:131 #: assets/App.tsx:128
#, javascript-format #, javascript-format
msgid "" msgid ""
"${ ProjectLink } is an open source project distributed under the ${ " "${ ProjectLink } is an open source project distributed under the ${ "
"LicenseLink } license." "LicenseLink } license."
msgstr "" msgstr ""
#: assets/App.tsx:144 #: assets/App.tsx:141
msgid "Official git repository" msgid "Official git repository"
msgstr "" msgstr ""
#: assets/App.tsx:147 #: assets/App.tsx:144
msgid "Submit an issue" msgid "Submit an issue"
msgstr "" msgstr ""
@@ -114,63 +114,63 @@ msgstr ""
msgid "This domain name does not appear to be valid" msgid "This domain name does not appear to be valid"
msgstr "" msgstr ""
#: assets/components/Sider.tsx:27 #: assets/components/Sider.tsx:28
msgid "Home" msgid "Home"
msgstr "" msgstr ""
#: assets/components/Sider.tsx:33 #: assets/components/Sider.tsx:34
msgid "Search" msgid "Search"
msgstr "" msgstr ""
#: assets/components/Sider.tsx:39 #: assets/components/Sider.tsx:40
#: assets/components/tracking/watchlist/TrackedDomainTable.tsx:69 #: assets/components/tracking/watchlist/TrackedDomainTable.tsx:69
msgid "Domain" msgid "Domain"
msgstr "" msgstr ""
#: assets/components/Sider.tsx:40 #: assets/components/Sider.tsx:41
msgid "Domain Finder" msgid "Domain Finder"
msgstr "" msgstr ""
#: assets/components/Sider.tsx:47 #: assets/components/Sider.tsx:48
#: assets/pages/search/TldPage.tsx:65 #: assets/pages/search/TldPage.tsx:65
msgid "TLD" msgid "TLD"
msgstr "" msgstr ""
#: assets/components/Sider.tsx:48 #: assets/components/Sider.tsx:49
msgid "TLD list" msgid "TLD list"
msgstr "" msgstr ""
#: assets/components/Sider.tsx:74 #: assets/components/Sider.tsx:75
msgid "Tracking" msgid "Tracking"
msgstr "" msgstr ""
#: assets/components/Sider.tsx:80 #: assets/components/Sider.tsx:81
msgid "My Watchlists" msgid "My Watchlists"
msgstr "" msgstr ""
#: assets/components/Sider.tsx:87 #: assets/components/Sider.tsx:88
#: assets/pages/StatisticsPage.tsx:68 #: assets/pages/StatisticsPage.tsx:68
msgid "Tracked domain names" msgid "Tracked domain names"
msgstr "" msgstr ""
#: assets/components/Sider.tsx:94 #: assets/components/Sider.tsx:95
msgid "My Connectors" msgid "My Connectors"
msgstr "" msgstr ""
#: assets/components/Sider.tsx:103 #: assets/components/Sider.tsx:104
msgid "Statistics" msgid "Statistics"
msgstr "" msgstr ""
#: assets/components/Sider.tsx:113 #: assets/components/Sider.tsx:114
#: assets/pages/UserPage.tsx:16 #: assets/pages/UserPage.tsx:16
msgid "My Account" msgid "My Account"
msgstr "" msgstr ""
#: assets/components/Sider.tsx:118 #: assets/components/Sider.tsx:119
msgid "Log out" msgid "Log out"
msgstr "" msgstr ""
#: assets/components/Sider.tsx:126 #: assets/components/Sider.tsx:127
#: assets/pages/LoginPage.tsx:25 #: assets/pages/LoginPage.tsx:25
#: assets/pages/LoginPage.tsx:33 #: assets/pages/LoginPage.tsx:33
msgid "Log in" msgid "Log in"