andry/EMS-ESP32
1
0
Fork 0
mirror of https://github.com/emsesp/EMS-ESP32.git synced 2026-07-29 10:02:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

react-router optimizations

Browse Source
This commit is contained in:
proddy
2026-06-20 10:26:00 +02:00
parent 92d63d6f5d
commit 39b02591d9
12 changed files with 217 additions and 262 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
interface/src/app/settings/network/Network.tsx
View File

@@ -1,12 +1,5 @@
import { memo, useState } from 'react';
import {
Navigate,
Route,
Routes,
matchRoutes,
useLocation,
useNavigate
} from 'react-router';
import { Outlet, useMatch, useNavigate } from 'react-router';
import { Tab } from '@mui/material';
@@ -14,27 +7,13 @@ import { RouterTabs, useLayoutTitle } from 'components';
import { useI18nContext } from 'i18n/i18n-react';
import type { WiFiNetwork } from 'types';
import NetworkSettings from './NetworkSettings';
import { WiFiConnectionContext } from './WiFiConnectionContext';
import WiFiNetworkScanner from './WiFiNetworkScanner';
const Network = () => {
const { LL } = useI18nContext();
useLayoutTitle(LL.NETWORK(0));
// this also works!
// const routerTab = useMatch(`settings/network/:path/*`)?.pathname || false;
const matchedRoutes = matchRoutes(
[
{
path: '/settings/network/settings',
element: <NetworkSettings />
},
{ path: '/settings/network/scan', element: <WiFiNetworkScanner /> }
],
useLocation()
);
const routerTab = matchedRoutes?.[0]?.route.path || false;
const routerTab = useMatch('/settings/network/:tab')?.pathname || false;
const navigate = useNavigate();
@@ -64,14 +43,7 @@ const Network = () => {
/>
<Tab value="/settings/network/scan" label={LL.NETWORK_SCAN()} />
</RouterTabs>
<Routes>
<Route path="scan" element={<WiFiNetworkScanner />} />
<Route path="settings" element={<NetworkSettings />} />
<Route
path="*"
element={<Navigate replace to="/settings/network/settings" />}
/>
</Routes>
<Outlet />
</WiFiConnectionContext.Provider>
);
};

28
interface/src/app/settings/security/Security.tsx
View File

@@ -1,31 +1,16 @@
import { memo } from 'react';
import { Navigate, Route, Routes, matchRoutes, useLocation } from 'react-router';
import { Outlet, useMatch } from 'react-router';
import { Tab } from '@mui/material';
import { RouterTabs, useLayoutTitle } from 'components';
import { useI18nContext } from 'i18n/i18n-react';
import ManageUsers from './ManageUsers';
import SecuritySettings from './SecuritySettings';
const Security = () => {
const { LL } = useI18nContext();
useLayoutTitle(LL.SECURITY(0));
const location = useLocation();
const matchedRoutes = matchRoutes(
[
{
path: '/settings/security/settings',
element: <ManageUsers />
},
{ path: '/settings/security/users', element: <SecuritySettings /> }
],
location
);
const routerTab = matchedRoutes?.[0]?.route.path || false;
const routerTab = useMatch('/settings/security/:tab')?.pathname || false;
return (
<>
@@ -36,14 +21,7 @@ const Security = () => {
/>
<Tab value="/settings/security/users" label={LL.MANAGE_USERS()} />
</RouterTabs>
<Routes>
<Route path="users" element={<ManageUsers />} />
<Route path="settings" element={<SecuritySettings />} />
<Route
path="*"
element={<Navigate replace to="/settings/security/settings" />}
/>
</Routes>
<Outlet />
</>
);
};