fix underlines in Tab headers (webUI) and NL translations

.yarnrc.yml

@@ -0,0 +1,3 @@
+nodeLinker: node-modules
+
+yarnPath: .yarn/releases/yarn-4.6.0.cjs

interface/.yarnrc.yml

@@ -1,3 +1,3 @@
 nodeLinker: node-modules
 
-yarnPath: .yarn/releases/yarn-4.5.3.cjs
+yarnPath: .yarn/releases/yarn-4.6.0.cjs

interface/package.json

@@ -24,18 +24,18 @@
     "@alova/adapter-xhr": "2.1.0",
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
-    "@mui/icons-material": "^6.2.1",
-    "@mui/material": "^6.2.1",
+    "@mui/icons-material": "^6.3.0",
+    "@mui/material": "^6.3.0",
     "@table-library/react-table-library": "4.1.7",
     "alova": "3.2.7",
     "async-validator": "^4.2.5",
     "jwt-decode": "^4.0.0",
     "mime-types": "^2.1.35",
-    "preact": "^10.25.3",
+    "preact": "^10.25.4",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "react-icons": "^5.4.0",
-    "react-router": "^7.1.0",
+    "react-router": "^7.1.1",
     "react-toastify": "^11.0.2",
     "typesafe-i18n": "^5.26.2",
     "typescript": "^5.7.2"
@@ -50,17 +50,17 @@
     "@types/node": "^22.10.2",
     "@types/react": "^19.0.2",
     "@types/react-dom": "^19.0.2",
-    "concurrently": "^9.1.0",
+    "concurrently": "^9.1.2",
     "eslint": "^9.17.0",
     "eslint-config-prettier": "^9.1.0",
     "formidable": "^3.5.2",
     "prettier": "^3.4.2",
-    "rollup-plugin-visualizer": "^5.12.0",
+    "rollup-plugin-visualizer": "^5.13.1",
     "terser": "^5.37.0",
-    "typescript-eslint": "8.18.1",
-    "vite": "^6.0.5",
+    "typescript-eslint": "8.19.0",
+    "vite": "^6.0.6",
     "vite-plugin-imagemin": "^0.6.1",
     "vite-tsconfig-paths": "^5.1.4"
   },
-  "packageManager": "yarn@4.5.3"
+  "packageManager": "yarn@4.6.0"
 }

interface/src/app/settings/network/Network.tsx

@@ -1,9 +1,16 @@
 import { useCallback, useState } from 'react';
-import { Navigate, Route, Routes, useNavigate } from 'react-router';
+import {
+  Navigate,
+  Route,
+  Routes,
+  matchRoutes,
+  useLocation,
+  useNavigate
+} from 'react-router';
 
 import { Tab } from '@mui/material';
 
-import { RouterTabs, useLayoutTitle, useRouterTab } from 'components';
+import { RouterTabs, useLayoutTitle } from 'components';
 import { useI18nContext } from 'i18n/i18n-react';
 import type { WiFiNetwork } from 'types';
 
@@ -15,7 +22,13 @@ const Network = () => {
   const { LL } = useI18nContext();
   useLayoutTitle(LL.NETWORK(0));
 
-  const { routerTab } = useRouterTab();
+  // this also works!
+  // const routerTab = useMatch(`settings/network/:path/*`)?.pathname || false;
+  const matchedRoutes = matchRoutes( [
+    { path: '/settings/network/settings', element: <NetworkSettings />, dog: 'woof' },
+    { path: '/settings/network/scan', element: <WiFiNetworkScanner /> }
+  ], useLocation());
+  const routerTab = matchedRoutes?.[0].route.path || false;
 
   const navigate = useNavigate();
 
@@ -24,7 +37,7 @@ const Network = () => {
   const selectNetwork = useCallback(
     (network: WiFiNetwork) => {
       setSelectedNetwork(network);
-      void navigate('/settings');
+      void navigate('/settings/network/settings');
     },
     [navigate]
   );
@@ -42,16 +55,16 @@ const Network = () => {
       }}
     >
       <RouterTabs value={routerTab}>
-        <Tab
-          value="/settings/network/settings"
-          label={LL.SETTINGS_OF(LL.NETWORK(1))}
-        />
+        <Tab value="/settings/network/settings" label={LL.SETTINGS_OF(LL.NETWORK(1))} />
         <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" />} />
+        <Route
+          path="*"
+          element={<Navigate replace to="/settings/network/settings" />}
+        />
       </Routes>
     </WiFiConnectionContext.Provider>
   );

interface/src/app/settings/security/Security.tsx

@@ -1,8 +1,14 @@
-import { Navigate, Route, Routes } from 'react-router';
+import {
+  Navigate,
+  Route,
+  Routes,
+  matchRoutes,
+  useLocation
+} from 'react-router';
 
 import { Tab } from '@mui/material';
 
-import { RouterTabs, useLayoutTitle, useRouterTab } from 'components';
+import { RouterTabs, useLayoutTitle } from 'components';
 import { useI18nContext } from 'i18n/i18n-react';
 
 import ManageUsers from './ManageUsers';
@@ -12,7 +18,14 @@ const Security = () => {
   const { LL } = useI18nContext();
   useLayoutTitle(LL.SECURITY(0));
 
-  const { routerTab } = useRouterTab();
+  const matchedRoutes = matchRoutes(
+    [
+      { path: '/settings/security/settings', element: <ManageUsers />, dog: 'woof' },
+      { path: '/settings/security/users', element: <SecuritySettings /> }
+    ],
+    useLocation()
+  );
+  const routerTab = matchedRoutes?.[0].route.path || false;
 
   return (
     <>
@@ -26,7 +39,7 @@ const Security = () => {
       <Routes>
         <Route path="users" element={<ManageUsers />} />
         <Route path="settings" element={<SecuritySettings />} />
-        <Route path="*" element={<Navigate replace to="settings" />} />
+        <Route path="*" element={<Navigate replace to="/settings/security/settings" />} />
       </Routes>
     </>
   );

interface/src/components/routing/index.ts

@@ -2,5 +2,3 @@ export { default as RouterTabs } from './RouterTabs';
 export { default as RequireAdmin } from './RequireAdmin';
 export { default as RequireAuthenticated } from './RequireAuthenticated';
 export { default as RequireUnauthenticated } from './RequireUnauthenticated';
-
-export * from './useRouterTab';

interface/src/i18n/nl/index.ts

@@ -72,7 +72,7 @@ const nl: Translation = {
   TX_ISSUES: 'Tx bus probleem. Probeer een andere Tx verzendmodus',
   DISCONNECTED: 'Niet verbonden',
   EMS_SCAN: 'Weet je zeker dat je een volledige EMS bus scan uit wilt voeren?',
-  DATA_TRAFFIC: 'Data Traffic', // TODO translate
+  DATA_TRAFFIC: 'Dataverkeer',
   EMS_DEVICE: 'EMS Apparaat',
   SUCCESS: 'SUCCESS',
   FAIL: 'MISLUKT',
@@ -115,7 +115,7 @@ const nl: Translation = {
   READONLY: 'Activeer read-only modus (blokkeert alle outgaande EMS Tx schrijf commandos)',
   UNDERCLOCK_CPU: 'Underclock CPU snelheid',
   REMOTE_TIMEOUT: 'Remote timeout',
-  REMOTE_TIMEOUT_EN: 'Disable remote on missing room temperature', // TODO translate
+  REMOTE_TIMEOUT_EN: 'Schakel de afstandsbediening uit bij ontbrekende kamertemperatuur',
   HEATINGOFF: 'Start ketel met geforceerde verwarming uit',
   MIN_DURATION: 'Wait time',
   ENABLE_SHOWER_TIMER: 'Activeer Douche Timer (tijdmeting)',
@@ -174,7 +174,7 @@ const nl: Translation = {
   FACTORY_RESET: 'Fabrieksinstellingen',
   SYSTEM_FACTORY_TEXT: 'Gateway is gereset en start nu weer op met fabrieksinstellingen',
   SYSTEM_FACTORY_TEXT_DIALOG: 'Weet je zeker dat je een reset naar fabrieksinstellingen uit wilt voeren?',
-  AVAILABLE_VERSION: 'Latest Available Versions', // TODO translate
+  AVAILABLE_VERSION: 'Nieuwste beschikbare versies',
   STABLE: 'Stable',
   DEVELOPMENT: 'Development',
   UPTIME: 'Systeem Uptime',
@@ -185,8 +185,8 @@ const nl: Translation = {
   FILESYSTEM: 'File System (Used / Free)',
   BUFFER_SIZE: 'Max Buffer Size',
   COMPACT: 'Compact',
-  DOWNLOAD_SETTINGS_TEXT: 'Create a backup of your configuration and settings', // TODO translate
-  UPLOAD_TEXT: 'Upload a new firmware file (.bin) or a backup file (.json)', // TODO translate
+  DOWNLOAD_SETTINGS_TEXT: 'Maak een back-up van uw configuratie en instellingen',
+  UPLOAD_TEXT: 'Upload een nieuw firmwarebestand (.bin) of een back-upbestand (.json)',
   UPLOAD_DROP_TEXT: 'Sleep bestand hierheen of klik hier',
   ERROR: 'Onverwachte fout, probeer opnieuw',
   TIME_SET: 'Tijd ingesteld',
@@ -319,32 +319,32 @@ const nl: Translation = {
   SECURITY_1: 'Gebruikers toevoegen of verwijderen',
   DOWNLOAD_UPLOAD_1: 'Download en upload instellingen en firmware',
   MODULES: 'Module',
-  MODULES_1: 'Externe modules activeren of deactiveren', // TODO translate
+  MODULES_1: 'Externe modules activeren of deactiveren',
   MODULES_UPDATED: 'Modules geüpdatet', 
   MODULES_DESCRIPTION: 'Klik op de module om EMS-ESP library modules te activeren of te deactiveren',
   MODULES_NONE: 'Geen externe modules gedetecteerd',
   RENAME: 'Hernoemen',
   ENABLE_MODBUS: 'Activeer Modbus',
-  VIEW_LOG: 'View log to diagnose issues', // TODO translate
-  UPLOAD_DRAG: 'drag and drop a file here or click to select one', // TODO translate
-  SERVICES: 'Services', // TODO translate
-  ALLVALUES: 'All Values', // TODO translate
-  SPECIAL_FUNCTIONS: 'Special Functions', // TODO translate
-  WAIT_FIRMWARE: 'Firmware is uploading and installing', // TODO translate
-  INSTALL_VERSION: 'This will install version {0}. Are you sure?', // TODO translate
-  SWITCH_DEV: 'switch to the development version', // TODO translate
-  UPGRADE_AVAILABLE: 'There is a firmware upgrade available!', // TODO translate
-  LATEST_VERSION: 'You are using the latest firmware version.', // TODO translate
-  PLEASE_WAIT: 'Please wait', // TODO translate
-  RESTARTING_PRE: 'Initializing', // TODO translate
-  RESTARTING_POST: 'Preparing', // TODO translate
-  AUTO_SCROLL: 'Auto Scroll', // TODO translate
-  DASHBOARD: 'Dashboard', // TODO translate
-  NO_DATA: 'No data available', // TODO translate
-  DASHBOARD_1: 'Customize your dashboard by marking EMS entities as Favorite using the Customizations module', // TODO translate
-  DEVELOPER_MODE: 'Developer Mode', // TODO translate
-  DUPLICATE: 'Duplicate', // TODO translate
-  UPGRADE: 'Upgrade' // TODO translate
+  VIEW_LOG: 'Log weergeven om problemen te diagnosticeren',
+  UPLOAD_DRAG: 'sleep hier een bestand en zet het neer of klik om er een te selecteren',
+  SERVICES: 'Services',
+  ALLVALUES: 'All waarden',
+  SPECIAL_FUNCTIONS: 'Speciale functies',
+  WAIT_FIRMWARE: 'Firmware wordt geüpload en geïnstalleerd',
+  INSTALL_VERSION: 'Hiermee wordt versie {0} geïnstalleerd. Weet je het zeker?',
+  SWITCH_DEV: 'Overschakelen naar de ontwikkelingsversie',
+  UPGRADE_AVAILABLE: 'Er is een firmware-upgrade beschikbaar!',
+  LATEST_VERSION: 'U gebruikt de nieuwste firmwareversie.',
+  PLEASE_WAIT: 'Een ogenblik geduld',
+  RESTARTING_PRE: 'Initialiseren',
+  RESTARTING_POST: 'Voorbereiding',
+  AUTO_SCROLL: 'Automatisch Scrollen',
+  DASHBOARD: 'Dashboard',
+  NO_DATA: 'Geen data beschikbaar',
+  DASHBOARD_1: 'Pas uw dashboard aan door EMS-entiteiten als favoriet te markeren met behulp van de module Aanpassingen',
+  DEVELOPER_MODE: 'Ontwikkelaarsmodus',
+  DUPLICATE: 'Duplicaat',
+  UPGRADE: 'Upgraden'
 };
 
 export default nl;