Merge pull request emsesp#1493 from proddy/dev

update standalone server to bun and itty-router, add back router paths, add support download button
proddy · Dec 12, 2023 · ac288b7 · ac288b7
2 parents c3ac215 + a1f296b
commit ac288b7
Show file tree

Hide file tree

Showing 35 changed files with 3,759 additions and 1,005 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -4,8 +4,7 @@
     "**/.pnp.*": true
   },
   "editor.codeActionsOnSave": {
-    "source.fixAll": true
-    // "source.organizeImports": true
+    "source.fixAll": "explicit"
   },
   "eslint.nodePath": "interface/.yarn/sdks",
   "eslint.workingDirectories": ["interface"],

diff --git a/CHANGELOG_LATEST.md b/CHANGELOG_LATEST.md
@@ -15,6 +15,7 @@
 
 - exhaust temperature for some boilers
 - add back boil2hyst [#1477](https://github.com/emsesp/EMS-ESP32/issues/1477)
+- subscribed MQTT topics not detecting changes by EMS-ESP [#1494](https://github.com/emsesp/EMS-ESP32/issues/1494)
 
 ## Changed
 

diff --git a/interface/package.json b/interface/package.json
@@ -12,7 +12,7 @@
     "preview": "vite preview",
     "build-hosted": "typesafe-i18n --no-watch && vite build --mode hosted",
     "preview-standalone": "typesafe-i18n --no-watch && vite build && concurrently -c \"auto\" \"npm:mock-api\" \"vite preview\"",
-    "mock-api": "node --watch ../mock-api ../mock-api/server.js",
+    "mock-api": "bun --watch ../mock-api/server.ts",
     "standalone": "concurrently -c \"auto\" \"typesafe-i18n\" \"npm:mock-api\" \"vite\"",
     "typesafe-i18n": "typesafe-i18n --no-watch",
     "webUI": "node progmem-generator.js",
@@ -21,19 +21,19 @@
   },
   "dependencies": {
     "@alova/adapter-xhr": "^1.0.1",
-    "@babel/core": "^7.23.5",
+    "@babel/core": "^7.23.6",
     "@emotion/react": "^11.11.1",
     "@emotion/styled": "^11.11.0",
-    "@mui/icons-material": "^5.14.19",
-    "@mui/material": "^5.14.19",
+    "@mui/icons-material": "^5.15.0",
+    "@mui/material": "^5.15.0",
     "@table-library/react-table-library": "4.1.7",
     "@types/imagemin": "^8.0.5",
     "@types/lodash-es": "^4.17.12",
-    "@types/node": "^20.10.3",
-    "@types/react": "^18.2.41",
+    "@types/node": "^20.10.4",
+    "@types/react": "^18.2.43",
     "@types/react-dom": "^18.2.17",
     "@types/react-router-dom": "^5.3.3",
-    "alova": "^2.15.0",
+    "alova": "^2.16.0",
     "async-validator": "^4.2.5",
     "history": "^5.3.0",
     "jwt-decode": "^4.0.0",
@@ -47,13 +47,13 @@
     "react-toastify": "^9.1.3",
     "sockette": "^2.0.6",
     "typesafe-i18n": "^5.26.2",
-    "typescript": "^5.3.2"
+    "typescript": "^5.3.3"
   },
   "devDependencies": {
     "@preact/compat": "^17.1.2",
     "@preact/preset-vite": "^2.7.0",
-    "@typescript-eslint/eslint-plugin": "^6.13.1",
-    "@typescript-eslint/parser": "^6.13.1",
+    "@typescript-eslint/eslint-plugin": "^6.14.0",
+    "@typescript-eslint/parser": "^6.14.0",
     "concurrently": "^8.2.2",
     "eslint": "^8.55.0",
     "eslint-config-airbnb": "^19.0.4",
@@ -66,13 +66,13 @@
     "eslint-plugin-prettier": "alpha",
     "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "preact": "^10.19.2",
-    "prettier": "^3.1.0",
-    "rollup-plugin-visualizer": "^5.10.0",
-    "terser": "^5.25.0",
-    "vite": "^5.0.5",
+    "preact": "^10.19.3",
+    "prettier": "^3.1.1",
+    "rollup-plugin-visualizer": "^5.11.0",
+    "terser": "^5.26.0",
+    "vite": "^5.0.8",
     "vite-plugin-imagemin": "^0.6.1",
-    "vite-tsconfig-paths": "^4.2.1"
+    "vite-tsconfig-paths": "^4.2.2"
   },
   "packageManager": "[email protected]"
 }
diff --git a/interface/src/components/routing/useRouterTab.ts b/interface/src/components/routing/useRouterTab.ts
@@ -1,12 +1,12 @@
-import { useMatch, useResolvedPath } from 'react-router-dom';
+import { useLocation } from 'react-router-dom';
 
 export const useRouterTab = () => {
-  // const loc = useLocation().pathname;
-  // const routerTab = loc.substring(0, loc.lastIndexOf('/')) ? loc : false;
+  const loc = useLocation().pathname;
+  const routerTab = loc.substring(0, loc.lastIndexOf('/')) ? loc : false;
 
-  const routerTabPath = useResolvedPath(':tab');
-  const routerTabPathMatch = useMatch(routerTabPath.pathname);
-  const routerTab = routerTabPathMatch?.params?.tab || false;
+  // const routerTabPath = useResolvedPath(':tab');
+  // const routerTabPathMatch = useMatch(routerTabPath.pathname);
+  // const routerTab = routerTabPathMatch?.params?.tab || false;
 
   return { routerTab } as const;
 };
diff --git a/interface/src/framework/ap/AccessPoint.tsx b/interface/src/framework/ap/AccessPoint.tsx
@@ -22,8 +22,12 @@ const AccessPoint: FC = () => {
   return (
     <>
       <RouterTabs value={routerTab}>
-        <Tab value="status" label={LL.STATUS_OF(LL.ACCESS_POINT(1))} />
-        <Tab value="settings" label={LL.SETTINGS_OF(LL.ACCESS_POINT(1))} disabled={!authenticatedContext.me.admin} />
+        <Tab value="/ap/status" label={LL.STATUS_OF(LL.ACCESS_POINT(1))} />
+        <Tab
+          value="/ap/settings"
+          label={LL.SETTINGS_OF(LL.ACCESS_POINT(1))}
+          disabled={!authenticatedContext.me.admin}
+        />
       </RouterTabs>
       <Routes>
         <Route path="status" element={<APStatusForm />} />
@@ -36,7 +40,7 @@ const AccessPoint: FC = () => {
             </RequireAdmin>
           }
         />
-        <Route path="/*" element={<Navigate replace to="status" />} />
+        <Route path="*" element={<Navigate replace to="/ap/status" />} />
       </Routes>
     </>
   );

diff --git a/interface/src/framework/mqtt/Mqtt.tsx b/interface/src/framework/mqtt/Mqtt.tsx
@@ -21,8 +21,8 @@ const Mqtt: FC = () => {
   return (
     <>
       <RouterTabs value={routerTab}>
-        <Tab value="status" label={LL.STATUS_OF('MQTT')} />
-        <Tab value="settings" label={LL.SETTINGS_OF('MQTT')} disabled={!authenticatedContext.me.admin} />
+        <Tab value="/mqtt/status" label={LL.STATUS_OF('MQTT')} />
+        <Tab value="/mqtt/settings" label={LL.SETTINGS_OF('MQTT')} disabled={!authenticatedContext.me.admin} />
       </RouterTabs>
       <Routes>
         <Route path="status" element={<MqttStatusForm />} />
@@ -34,7 +34,7 @@ const Mqtt: FC = () => {
             </RequireAdmin>
           }
         />
-        <Route path="/*" element={<Navigate replace to="status" />} />
+        <Route path="*" element={<Navigate replace to="/mqtt/status" />} />
       </Routes>
     </>
   );

diff --git a/interface/src/framework/network/NetworkConnection.tsx b/interface/src/framework/network/NetworkConnection.tsx
@@ -44,9 +44,13 @@ const NetworkConnection: FC = () => {
       }}
     >
       <RouterTabs value={routerTab}>
-        <Tab value="status" label={LL.STATUS_OF(LL.NETWORK(1))} />
-        <Tab value="scan" label={LL.NETWORK_SCAN()} disabled={!authenticatedContext.me.admin} />
-        <Tab value="settings" label={LL.SETTINGS_OF(LL.NETWORK(1))} disabled={!authenticatedContext.me.admin} />
+        <Tab value="/network/status" label={LL.STATUS_OF(LL.NETWORK(1))} />
+        <Tab value="/network/scan" label={LL.NETWORK_SCAN()} disabled={!authenticatedContext.me.admin} />
+        <Tab
+          value="/network/settings"
+          label={LL.SETTINGS_OF(LL.NETWORK(1))}
+          disabled={!authenticatedContext.me.admin}
+        />
       </RouterTabs>
       <Routes>
         <Route path="status" element={<NetworkStatusForm />} />
@@ -66,7 +70,7 @@ const NetworkConnection: FC = () => {
             </RequireAdmin>
           }
         />
-        <Route path="/*" element={<Navigate replace to="status" />} />
+        <Route path="*" element={<Navigate replace to="/network/status" />} />
       </Routes>
     </WiFiConnectionContext.Provider>
   );

diff --git a/interface/src/framework/ntp/NetworkTime.tsx b/interface/src/framework/ntp/NetworkTime.tsx
@@ -20,8 +20,8 @@ const NetworkTime: FC = () => {
   return (
     <>
       <RouterTabs value={routerTab}>
-        <Tab value="status" label={LL.STATUS_OF('NTP')} />
-        <Tab value="settings" label={LL.SETTINGS_OF('NTP')} disabled={!authenticatedContext.me.admin} />
+        <Tab value="/ntp/status" label={LL.STATUS_OF('NTP')} />
+        <Tab value="/ntp/settings" label={LL.SETTINGS_OF('NTP')} disabled={!authenticatedContext.me.admin} />
       </RouterTabs>
       <Routes>
         <Route path="status" element={<NTPStatusForm />} />
@@ -33,7 +33,7 @@ const NetworkTime: FC = () => {
             </RequireAdmin>
           }
         />
-        <Route path="/*" element={<Navigate replace to="status" />} />
+        <Route path="*" element={<Navigate replace to="/ntp/status" />} />
       </Routes>
     </>
   );

diff --git a/interface/src/framework/security/Security.tsx b/interface/src/framework/security/Security.tsx
@@ -17,13 +17,13 @@ const Security: FC = () => {
   return (
     <>
       <RouterTabs value={routerTab}>
-        <Tab value="users" label={LL.MANAGE_USERS()} />
-        <Tab value="settings" label={LL.SETTINGS_OF(LL.SECURITY(1))} />
+        <Tab value="/security/users" label={LL.MANAGE_USERS()} />
+        <Tab value="/security/settings" label={LL.SETTINGS_OF(LL.SECURITY(1))} />
       </RouterTabs>
       <Routes>
         <Route path="users" element={<ManageUsersForm />} />
         <Route path="settings" element={<SecuritySettingsForm />} />
-        <Route path="/*" element={<Navigate replace to="users" />} />
+        <Route path="*" element={<Navigate replace to="/security/users" />} />
       </Routes>
     </>
   );

diff --git a/interface/src/framework/system/System.tsx b/interface/src/framework/system/System.tsx
@@ -23,10 +23,10 @@ const System: FC = () => {
   return (
     <>
       <RouterTabs value={routerTab}>
-        <Tab value="status" label={LL.STATUS_OF(LL.SYSTEM(1))} />
-        <Tab value="log" label={LL.LOG_OF(LL.SYSTEM(2))} />
-        <Tab value="ota" label={LL.SETTINGS_OF('OTA')} disabled={!me.admin} />
-        <Tab value="upload" label={LL.UPLOAD_DOWNLOAD()} disabled={!me.admin} />
+        <Tab value="/system/status" label={LL.STATUS_OF(LL.SYSTEM(1))} />
+        <Tab value="/system/log" label={LL.LOG_OF(LL.SYSTEM(2))} />
+        <Tab value="/system/ota" label={LL.SETTINGS_OF('OTA')} disabled={!me.admin} />
+        <Tab value="/system/upload" label={LL.UPLOAD_DOWNLOAD()} disabled={!me.admin} />
       </RouterTabs>
       <Routes>
         <Route path="status" element={<SystemStatusForm />} />
@@ -47,7 +47,7 @@ const System: FC = () => {
             </RequireAdmin>
           }
         />
-        <Route path="/*" element={<Navigate replace to="status" />} />
+        <Route path="*" element={<Navigate replace to="/system/status" />} />
       </Routes>
     </>
   );

diff --git a/interface/src/framework/system/UploadFileForm.tsx b/interface/src/framework/system/UploadFileForm.tsx
@@ -28,7 +28,7 @@ const UploadFileForm: FC = () => {
   const { send: getSchedule, onSuccess: onSuccessGetSchedule } = useRequest(EMSESP.getSchedule(), {
     immediate: false
   });
-  const { send: getInfo, onSuccess: onSuccessGetInfo } = useRequest((data) => EMSESP.API(data), {
+  const { send: getAPI, onSuccess: onGetAPI } = useRequest((data) => EMSESP.API(data), {
     immediate: false
   });
 
@@ -71,26 +71,26 @@ const UploadFileForm: FC = () => {
         type: 'text/plain'
       })
     );
-    anchor.download = 'emsesp_' + endpoint + '.json';
+    anchor.download = 'emsesp_' + endpoint;
     anchor.click();
     URL.revokeObjectURL(anchor.href);
     toast.info(LL.DOWNLOAD_SUCCESSFUL());
   };
 
   onSuccessGetSettings((event) => {
-    saveFile(event.data, 'settings');
+    saveFile(event.data, 'settings.json');
   });
   onSuccessgetCustomizations((event) => {
-    saveFile(event.data, 'customizations');
+    saveFile(event.data, 'customizations.json');
   });
   onSuccessGetEntities((event) => {
-    saveFile(event.data, 'entities');
+    saveFile(event.data, 'entities.json');
   });
   onSuccessGetSchedule((event) => {
-    saveFile(event.data, 'schedule');
+    saveFile(event.data, 'schedule.json');
   });
-  onSuccessGetInfo((event) => {
-    saveFile(event.data, 'info');
+  onGetAPI((event) => {
+    saveFile(event.data, event.sendArgs[0].device + '_' + event.sendArgs[0].entity + '.txt');
   });
 
   const downloadSettings = async () => {
@@ -112,13 +112,17 @@ const UploadFileForm: FC = () => {
   };
 
   const downloadSchedule = async () => {
-    await getSchedule().catch((error) => {
-      toast.error(error.message);
-    });
+    await getSchedule()
+      .catch((error) => {
+        toast.error(error.message);
+      })
+      .finally(() => {
+        toast.info(LL.DOWNLOAD_SUCCESSFUL());
+      });
   };
 
-  const downloadInfo = async () => {
-    await getInfo({ device: 'system', entity: 'info', id: 0 }).catch((error) => {
+  const callAPI = async (device: string, entity: string) => {
+    await getAPI({ device, entity, id: 0 }).catch((error) => {
       toast.error(error.message);
     });
   };
@@ -143,8 +147,34 @@ const UploadFileForm: FC = () => {
       <SingleUpload onDrop={startUpload} onCancel={cancelUpload} isUploading={isUploading} progress={progress} />
       {!isUploading && (
         <>
-          <Typography sx={{ pt: 2, pb: 2 }} variant="h6" color="primary">
-            {LL.DOWNLOAD(0)}
+          <Typography sx={{ pt: 4, pb: 2 }} variant="h6" color="primary">
+            {LL.DOWNLOAD(0)}&nbsp;{LL.SUPPORT_INFORMATION()}
+          </Typography>
+          <Box color="warning.main">
+            <Typography mb={1} variant="body2">
+              {LL.HELP_INFORMATION_4()}
+            </Typography>
+          </Box>
+          <Button
+            startIcon={<DownloadIcon />}
+            variant="outlined"
+            color="primary"
+            onClick={() => callAPI('system', 'info')}
+          >
+            {LL.SUPPORT_INFORMATION()}
+          </Button>
+          <Button
+            sx={{ ml: 2 }}
+            startIcon={<DownloadIcon />}
+            variant="outlined"
+            color="primary"
+            onClick={() => callAPI('system', 'allvalues')}
+          >
+            All Values
+          </Button>
+
+          <Typography sx={{ pt: 4, pb: 2 }} variant="h6" color="primary">
+            {LL.DOWNLOAD(0)}&nbsp;{LL.SETTINGS()}
           </Typography>
           <Box color="warning.main">
             <Typography mb={1} variant="body2">
@@ -179,14 +209,6 @@ const UploadFileForm: FC = () => {
           <Button startIcon={<DownloadIcon />} variant="outlined" color="primary" onClick={downloadSchedule}>
             {LL.SCHEDULE(0)}
           </Button>
-          <Box color="warning.main">
-            <Typography mt={2} mb={1} variant="body2">
-              {LL.DOWNLOAD(0)}&nbsp;{LL.SUPPORT_INFORMATION()}
-            </Typography>
-          </Box>
-          <Button startIcon={<DownloadIcon />} variant="outlined" color="primary" onClick={downloadInfo}>
-            {LL.SUPPORT_INFORMATION()}
-          </Button>
         </>
       )}
     </>

diff --git a/interface/src/i18n/en/index.ts b/interface/src/i18n/en/index.ts
@@ -169,7 +169,7 @@ const en: Translation = {
   HELP_INFORMATION_1: 'Visit the online wiki to get instructions on how to configure EMS-ESP',
   HELP_INFORMATION_2: 'For live community chat join our Discord server',
   HELP_INFORMATION_3: 'To request a feature or report a bug',
-  HELP_INFORMATION_4: 'remember to download and attach your system information for a faster response when reporting an issue',
+  HELP_INFORMATION_4: 'Remember to download and attach your support information for a faster response when reporting an issue',
   HELP_INFORMATION_5: 'EMS-ESP is a free and open-source project. Please support its future development by giving it a star on Github!',
   UPLOAD: 'Upload',
   DOWNLOAD: '{{D|d|d}}ownload',

diff --git a/interface/src/i18n/fr/index.ts b/interface/src/i18n/fr/index.ts
@@ -169,7 +169,7 @@ const fr: Translation = {
   HELP_INFORMATION_1: 'Visitez le wiki en ligne pour obtenir des instructions sur la façon de configurer EMS-ESP.',
   HELP_INFORMATION_2: 'Pour une discussion en direct avec la communauté, rejoignez notre serveur Discord',
   HELP_INFORMATION_3: 'Pour demander une fonctionnalité ou signaler un problème',
-  HELP_INFORMATION_4: 'n\'oubliez pas de télécharger et de joindre les informations relatives à votre système pour obtenir une réponse plus rapide lorsque vous signalez un problème',
+  HELP_INFORMATION_4: 'N\'oubliez pas de télécharger et de joindre les informations relatives à votre système pour obtenir une réponse plus rapide lorsque vous signalez un problème',
   HELP_INFORMATION_5: 'EMS-ESP est un projet libre et open-source. Merci de soutenir son développement futur en lui donnant une étoile sur Github !',
   UPLOAD: 'Upload',
   DOWNLOAD: '{{D|d|d}}ownload',

diff --git a/interface/src/i18n/it/index.ts b/interface/src/i18n/it/index.ts
@@ -171,7 +171,7 @@ const it: Translation = {
   HELP_INFORMATION_1: 'Visita il wiki online per ottenere istruzioni su come configurare EMS-ESP',
   HELP_INFORMATION_2: 'Per la chat della community dal vivo unisciti al nostro server Discord',
   HELP_INFORMATION_3: 'Per richiedere una funzionalità o segnalare un errore',
-  HELP_INFORMATION_4: 'ricordati di scaricare e allegare le informazioni del tuo sistema per una risposta più rapida quando segnali un problema',
+  HELP_INFORMATION_4: 'Ricordati di scaricare e allegare le informazioni del tuo sistema per una risposta più rapida quando segnali un problema',
   HELP_INFORMATION_5: 'EMS-ESP è un progetto gratuito e open-source. Supporta il suo sviluppo futuro assegnandogli una stella su Github!',
   UPLOAD: 'Carica',
   DOWNLOAD: 'Scarica',

diff --git a/interface/src/i18n/nl/index.ts b/interface/src/i18n/nl/index.ts
@@ -169,7 +169,7 @@ const nl: Translation = {
   HELP_INFORMATION_1: 'Bezoek de online wiki om instructies te vinden om EMS-ESP te configureren',
   HELP_INFORMATION_2: 'Voor de live community ga naar de Discord server',
   HELP_INFORMATION_3: 'Om een nieuwe feature te vragen of een bug te rapporteren',
-  HELP_INFORMATION_4: 'zorg dat je ook je systeem details zijn toevoeged voor een sneller antwoord',
+  HELP_INFORMATION_4: 'Zorg dat je ook je systeem details zijn toevoeged voor een sneller antwoord',
   HELP_INFORMATION_5: 'EMS-ESP is een gratis en open source project. Steun ons met een Star op Github!',
   UPLOAD: 'Upload',
   DOWNLOAD: '{{D|d|d}}ownload',