update the upload

2025-12-06 07:49:52 +03:00 · 2024-08-14 18:53:52 +02:00
parent d5fec4aec8
commit 5a058746bb
11 changed files with 466 additions and 720 deletions
--- a/interface/package.json
+++ b/interface/package.json
@@ -8,6 +8,7 @@
  "private": true,
  "type": "module",
  "scripts": {
+    "dev": "vite dev",
    "build": "vite build",
    "preview": "vite preview",
    "build-hosted": "typesafe-i18n --no-watch && vite build --mode hosted",
@@ -28,15 +29,14 @@
    "@mui/icons-material": "^5.16.7",
    "@mui/material": "^5.16.7",
    "@table-library/react-table-library": "4.1.7",
-    "alova": "3.0.6",
+    "alova": "3.0.8",
    "async-validator": "^4.2.5",
    "jwt-decode": "^4.0.0",
    "mime-types": "^2.1.35",
-    "preact": "^10.23.1",
+    "preact": "^10.23.2",
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
-    "react-dropzone": "^14.2.3",
-    "react-icons": "^5.2.1",
+    "react-icons": "^5.3.0",
    "react-router-dom": "^6.26.0",
    "react-toastify": "^10.0.5",
    "typesafe-i18n": "^5.26.2",
@@ -49,17 +49,19 @@
    "@preact/preset-vite": "^2.9.0",
    "@trivago/prettier-plugin-sort-imports": "^4.3.0",
    "@types/babel__core": "^7",
-    "@types/node": "^22.2.0",
+    "@types/formidable": "^3",
+    "@types/node": "^22.3.0",
    "@types/react": "^18.3.3",
    "@types/react-dom": "^18.3.0",
    "@types/react-router-dom": "^5.3.3",
    "concurrently": "^8.2.2",
    "eslint": "^9.9.0",
    "eslint-config-prettier": "^9.1.0",
+    "formidable": "^3.5.1",
    "prettier": "^3.3.3",
    "rollup-plugin-visualizer": "^5.12.0",
-    "terser": "^5.31.5",
-    "typescript-eslint": "8.0.1",
+    "terser": "^5.31.6",
+    "typescript-eslint": "8.1.0",
    "vite": "^5.4.0",
    "vite-plugin-imagemin": "^0.6.1",
    "vite-tsconfig-paths": "^5.0.1"
--- a/interface/src/api/endpoints.ts
+++ b/interface/src/api/endpoints.ts
@@ -22,6 +22,11 @@ export const alovaInstance = createAlova({
      method.config.headers.Authorization =
        'Bearer ' + localStorage.getItem(ACCESS_TOKEN);
    }
+    // for simualting vrey slow networks
+    // return new Promise((resolve) => {
+    //   const random = 3000 + Math.random() * 2000;
+    //   setTimeout(resolve, Math.floor(random));
+    // });
  },

  responded: {
--- a/interface/src/app/settings/UploadDownload.tsx
+++ b/interface/src/app/settings/UploadDownload.tsx
@@ -1,4 +1,3 @@
-import { useState } from 'react';
 import { toast } from 'react-toastify';

 import DownloadIcon from '@mui/icons-material/GetApp';
@@ -24,28 +23,8 @@ import {
 } from 'components';
 import { useI18nContext } from 'i18n/i18n-react';

-import RestartMonitor from '../status/RestartMonitor';
-
 const UploadDownload = () => {
  const { LL } = useI18nContext();
-  const [restarting, setRestarting] = useState<boolean>();
-  const [md5, setMd5] = useState<string>();
-
-  const {
-    loading: isUploading,
-    uploading: progress,
-    send: sendUpload,
-    abort: cancelUpload
-  } = useRequest(SystemApi.uploadFile, {
-    immediate: false
-  }).onSuccess(({ data }) => {
-    if (data) {
-      setMd5(data.md5 as string);
-      toast.success(LL.UPLOAD() + ' MD5 ' + LL.SUCCESSFUL());
-    } else {
-      setRestarting(true);
-    }
-  });

  const { send: sendSettings } = useRequest(getSettings(), {
    immediate: false
@@ -116,18 +95,6 @@ const UploadDownload = () => {
    return data.esp_platform;
  };

-  const startUpload = async (files: File[]) => {
-    await sendUpload(files[0]).catch((error: Error) => {
-      if (error.message === 'The user aborted a request') {
-        toast.warning(LL.UPLOAD() + ' ' + LL.ABORTED());
-      } else if (error.message === 'Network Error') {
-        toast.warning('Invalid file extension or incompatible bin file');
-      } else {
-        toast.error(error.message);
-      }
-    });
-  };
-
  const saveFile = (json: unknown, endpoint: string) => {
    const anchor = document.createElement('a');
    anchor.href = URL.createObjectURL(
@@ -241,107 +208,93 @@ const UploadDownload = () => {
            {LL.RESTART_TEXT(1)}.
          </Typography>
        </Box>
-        {md5 && (
-          <Box mb={2}>
-            <Typography variant="body2">{'MD5: ' + md5}</Typography>
-          </Box>
-        )}
-        <SingleUpload
-          onDrop={startUpload}
-          onCancel={cancelUpload}
-          isUploading={isUploading}
-          progress={progress}
-        />
-        {!isUploading && (
-          <>
-            <Typography sx={{ pt: 4, pb: 2 }} variant="h6" color="primary">
-              {LL.DOWNLOAD(0)}
+
+        <SingleUpload />
+
+        <Typography sx={{ pt: 4, pb: 2 }} variant="h6" color="primary">
+          {LL.DOWNLOAD(0)}
+        </Typography>
+        <Box color="warning.main">
+          <Typography mb={1} variant="body2">
+            {LL.HELP_INFORMATION_4()}
+          </Typography>
+          <Button
+            sx={{ ml: 2 }}
+            startIcon={<DownloadIcon />}
+            variant="outlined"
+            color="primary"
+            onClick={() => callAPI('system', 'info')}
+          >
+            {LL.SUPPORT_INFORMATION(0)}
+          </Button>
+          <Button
+            sx={{ ml: 2 }}
+            startIcon={<DownloadIcon />}
+            variant="outlined"
+            color="primary"
+            onClick={() => callAPI('system', 'allvalues')}
+          >
+            All Values
+          </Button>
+        </Box>
+
+        <Box color="warning.main">
+          <Typography mt={2} mb={1} variant="body2">
+            {LL.DOWNLOAD_SETTINGS_TEXT()}
+          </Typography>
+          <Button
+            sx={{ ml: 2 }}
+            startIcon={<DownloadIcon />}
+            variant="outlined"
+            color="primary"
+            onClick={downloadSettings}
+          >
+            {LL.SETTINGS_OF('')}
+          </Button>
+        </Box>
+
+        <Box color="warning.main">
+          <Typography mt={2} mb={1} variant="body2">
+            {LL.DOWNLOAD_CUSTOMIZATION_TEXT()}
+          </Typography>
+          <Button
+            sx={{ ml: 2 }}
+            startIcon={<DownloadIcon />}
+            variant="outlined"
+            color="primary"
+            onClick={downloadCustomizations}
+          >
+            {LL.CUSTOMIZATIONS()}
+          </Button>
+          <Button
+            sx={{ ml: 2 }}
+            startIcon={<DownloadIcon />}
+            variant="outlined"
+            color="primary"
+            onClick={downloadEntities}
+          >
+            {LL.CUSTOM_ENTITIES(0)}
+          </Button>
+          <Box color="warning.main">
+            <Typography mt={2} mb={1} variant="body2">
+              {LL.DOWNLOAD_SCHEDULE_TEXT()}
            </Typography>
-            <Box color="warning.main">
-              <Typography mb={1} variant="body2">
-                {LL.HELP_INFORMATION_4()}
-              </Typography>
-              <Button
-                sx={{ ml: 2 }}
-                startIcon={<DownloadIcon />}
-                variant="outlined"
-                color="primary"
-                onClick={() => callAPI('system', 'info')}
-              >
-                {LL.SUPPORT_INFORMATION(0)}
-              </Button>
-              <Button
-                sx={{ ml: 2 }}
-                startIcon={<DownloadIcon />}
-                variant="outlined"
-                color="primary"
-                onClick={() => callAPI('system', 'allvalues')}
-              >
-                All Values
-              </Button>
-            </Box>
-
-            <Box color="warning.main">
-              <Typography mt={2} mb={1} variant="body2">
-                {LL.DOWNLOAD_SETTINGS_TEXT()}
-              </Typography>
-              <Button
-                sx={{ ml: 2 }}
-                startIcon={<DownloadIcon />}
-                variant="outlined"
-                color="primary"
-                onClick={downloadSettings}
-              >
-                {LL.SETTINGS_OF('')}
-              </Button>
-            </Box>
-
-            <Box color="warning.main">
-              <Typography mt={2} mb={1} variant="body2">
-                {LL.DOWNLOAD_CUSTOMIZATION_TEXT()}
-              </Typography>
-              <Button
-                sx={{ ml: 2 }}
-                startIcon={<DownloadIcon />}
-                variant="outlined"
-                color="primary"
-                onClick={downloadCustomizations}
-              >
-                {LL.CUSTOMIZATIONS()}
-              </Button>
-              <Button
-                sx={{ ml: 2 }}
-                startIcon={<DownloadIcon />}
-                variant="outlined"
-                color="primary"
-                onClick={downloadEntities}
-              >
-                {LL.CUSTOM_ENTITIES(0)}
-              </Button>
-              <Box color="warning.main">
-                <Typography mt={2} mb={1} variant="body2">
-                  {LL.DOWNLOAD_SCHEDULE_TEXT()}
-                </Typography>
-              </Box>
-              <Button
-                sx={{ ml: 2 }}
-                startIcon={<DownloadIcon />}
-                variant="outlined"
-                color="primary"
-                onClick={downloadSchedule}
-              >
-                {LL.SCHEDULE(0)}
-              </Button>
-            </Box>
-          </>
-        )}
+          </Box>
+          <Button
+            sx={{ ml: 2 }}
+            startIcon={<DownloadIcon />}
+            variant="outlined"
+            color="primary"
+            onClick={downloadSchedule}
+          >
+            {LL.SCHEDULE(0)}
+          </Button>
+        </Box>
      </>
    );
  };

-  return (
-    <SectionContent>{restarting ? <RestartMonitor /> : content()}</SectionContent>
-  );
+  return <SectionContent>{content()}</SectionContent>;
 };

 export default UploadDownload;
--- a/interface/src/components/upload/SingleUpload.tsx
+++ b/interface/src/components/upload/SingleUpload.tsx
@@ -1,117 +1,119 @@
-import { Fragment } from 'react';
-import { useDropzone } from 'react-dropzone';
-import type { DropzoneState } from 'react-dropzone';
+import { ChangeEvent, useRef, useState } from 'react';
+import { toast } from 'react-toastify';

 import CancelIcon from '@mui/icons-material/Cancel';
-import CloudUploadIcon from '@mui/icons-material/CloudUpload';
-import { Box, Button, LinearProgress, Typography, useTheme } from '@mui/material';
-import type { Theme } from '@mui/material';
+import UploadIcon from '@mui/icons-material/Upload';
+import { Box, Button, LinearProgress, Typography } from '@mui/material';

-import type { Progress } from 'alova';
+import * as SystemApi from 'api/system';
+
+import { useRequest } from 'alova/client';
+import RestartMonitor from 'app/status/RestartMonitor';
 import { useI18nContext } from 'i18n/i18n-react';

-const getBorderColor = (theme: Theme, props: DropzoneState) => {
-  if (props.isDragAccept) {
-    return theme.palette.success.main;
-  }
-  if (props.isDragReject) {
-    return theme.palette.error.main;
-  }
-  if (props.isDragActive) {
-    return theme.palette.info.main;
-  }
-  return theme.palette.grey[700];
-};
+const SingleUpload = () => {
+  const [md5, setMd5] = useState<string>();
+  const [restarting, setRestarting] = useState<boolean>();

-export interface SingleUploadProps {
-  onDrop: (acceptedFiles: File[]) => void;
-  onCancel: () => void;
-  isUploading: boolean;
-  progress: Progress;
-}
-
-const SingleUpload = ({
-  onDrop,
-  onCancel,
-  isUploading,
-  progress
-}: SingleUploadProps) => {
-  const uploading = isUploading && progress.total > 0;
-
-  const dropzoneState = useDropzone({
-    onDrop,
-    accept: {
-      'application/octet-stream': ['.bin'],
-      'application/json': ['.json'],
-      'text/plain': ['.md5']
-    },
-    disabled: isUploading,
-    multiple: false
+  const {
+    loading: isUploading,
+    uploading: progress,
+    send: sendUpload,
+    abort: cancelUpload
+  } = useRequest(SystemApi.uploadFile, {
+    immediate: false
+  }).onSuccess(({ data }) => {
+    if (data) {
+      setMd5(data.md5 as string);
+      toast.success(LL.UPLOAD() + ' MD5 ' + LL.SUCCESSFUL());
+      setFile(undefined);
+    } else {
+      setRestarting(true);
+    }
  });

-  const { getRootProps, getInputProps } = dropzoneState;
-  const theme = useTheme();
+  const [file, setFile] = useState<File>();
+  const inputRef = useRef<HTMLInputElement | null>(null);
+
  const { LL } = useI18nContext();

-  const progressText = () => {
-    if (uploading) {
-      return (
-        LL.UPLOADING() +
-        ': ' +
-        Math.round((progress.loaded * 100) / progress.total) +
-        '%'
-      );
+  console.log(progress); // TODO remove
+
+  const handleUploadClick = () => {
+    inputRef.current?.click();
+  };
+
+  const handleFileChange = async (e: ChangeEvent<HTMLInputElement>) => {
+    if (!e.target.files) {
+      return;
    }
-    return LL.UPLOAD_DROP_TEXT();
+
+    setFile(e.target.files[0]);
+
+    await sendUpload(e.target.files[0]).catch((error: Error) => {
+      if (error.message === 'The user aborted a request') {
+        toast.warning(LL.UPLOAD() + ' ' + LL.ABORTED());
+      } else if (error.message === 'Network Error') {
+        toast.warning('Invalid file extension or incompatible bin file');
+      } else {
+        toast.error(error.message);
+      }
+    });
  };

  return (
-    <Box
-      {...getRootProps({
-        sx: {
-          py: 4,
-          px: 2,
-          borderWidth: 2,
-          borderRadius: 2,
-          borderStyle: 'dashed',
-          color: theme.palette.grey[400],
-          transition: 'border .24s ease-in-out',
-          width: '100%',
-          cursor: uploading ? 'default' : 'pointer',
-          borderColor: getBorderColor(theme, dropzoneState)
-        }
-      })}
-    >
-      <input {...getInputProps()} />
-      <Box flexDirection="column" display="flex" alignItems="center">
-        <CloudUploadIcon fontSize="large" />
-        <Typography variant="h6">{progressText()}</Typography>
-        {uploading && (
-          <Fragment>
-            <Box width="100%" p={2}>
-              <LinearProgress
-                variant="determinate"
-                value={
-                  progress.total === 0 || progress.loaded === 0
-                    ? 0
-                    : progress.loaded <= progress.total
-                      ? Math.round((progress.loaded * 100) / progress.total)
-                      : Math.round((progress.total * 100) / progress.loaded)
-                }
-              />
-            </Box>
-            <Button
-              startIcon={<CancelIcon />}
-              variant="outlined"
-              color="secondary"
-              onClick={onCancel}
-            >
-              {LL.CANCEL()}
-            </Button>
-          </Fragment>
-        )}
-      </Box>
-    </Box>
+    <>
+      <input
+        type="file"
+        ref={inputRef}
+        style={{ display: 'none' }}
+        onChange={handleFileChange}
+      />
+
+      <Button
+        sx={{ ml: 2 }}
+        startIcon={<UploadIcon />}
+        variant="outlined"
+        color="secondary"
+        onClick={handleUploadClick}
+      >
+        {file ? LL.UPLOADING() + ` ${file.name}` : LL.UPLOAD()}
+      </Button>
+
+      {isUploading && (
+        <>
+          <Box width="100%" p={2}>
+            <LinearProgress
+              variant="determinate"
+              value={
+                progress.total === 0 || progress.loaded === 0
+                  ? 0
+                  : progress.loaded <= progress.total
+                    ? Math.round((progress.loaded * 100) / progress.total)
+                    : Math.round((progress.total * 100) / progress.loaded)
+              }
+            />
+          </Box>
+
+          <Button
+            startIcon={<CancelIcon />}
+            variant="outlined"
+            color="secondary"
+            onClick={cancelUpload}
+          >
+            {LL.CANCEL()}
+          </Button>
+        </>
+      )}
+
+      {md5 && (
+        <Box mt={2}>
+          <Typography variant="body2">{'MD5: ' + md5}</Typography>
+        </Box>
+      )}
+
+      {restarting && <RestartMonitor />}
+    </>
  );
 };

--- a/interface/vite.config.ts
+++ b/interface/vite.config.ts
@@ -4,11 +4,13 @@ import { defineConfig } from 'vite';
 import viteImagemin from 'vite-plugin-imagemin';
 import viteTsconfigPaths from 'vite-tsconfig-paths';

+import mockServer from '../mock-api/mockServer.js';
+
 export default defineConfig(({ command, mode }) => {
  if (command === 'serve') {
    console.log('Preparing for standalone build with server, mode=' + mode);
    return {
-      plugins: [preact(), viteTsconfigPaths()],
+      plugins: [preact(), viteTsconfigPaths(), mockServer()],
      server: {
        open: true,
        port: mode == 'production' ? 4173 : 3000,
@@ -23,7 +25,6 @@ export default defineConfig(({ command, mode }) => {
            changeOrigin: true,
            secure: false
          },
-          '/rest/uploadFile': 'http://localhost:3082', // this must come first to work!
          '/rest': 'http://localhost:3080'
        }
      }
--- a/interface/yarn.lock
+++ b/interface/yarn.lock
@@ -1330,6 +1330,15 @@ __metadata:
  languageName: node
  linkType: hard

+"@types/formidable@npm:^3":
+  version: 3.4.5
+  resolution: "@types/formidable@npm:3.4.5"
+  dependencies:
+    "@types/node": "npm:*"
+  checksum: 10c0/733dc59d4d12152ba5fb70751184812345ff08691864dd9b1b7626b9d40045a306021b9721495cafb56cd375da54fecaaebdada98fc390b7406ebb81efe0bfbe
+  languageName: node
+  linkType: hard
+
 "@types/glob@npm:^7.1.1":
  version: 7.2.0
  resolution: "@types/glob@npm:7.2.0"
@@ -1436,7 +1445,7 @@ __metadata:
  languageName: node
  linkType: hard

-"@types/node@npm:*, @types/node@npm:^22.2.0":
+"@types/node@npm:*":
  version: 22.2.0
  resolution: "@types/node@npm:22.2.0"
  dependencies:
@@ -1445,6 +1454,15 @@ __metadata:
  languageName: node
  linkType: hard

+"@types/node@npm:^22.3.0":
+  version: 22.3.0
+  resolution: "@types/node@npm:22.3.0"
+  dependencies:
+    undici-types: "npm:~6.18.2"
+  checksum: 10c0/855be3b97f4262a84818f889ff898e147dcef4f72b866e3551a8367380cdb63a45cf3929f09d9a0647f62706f8d4772e91a1ecd1bd7c6a80d6744c2b0cbca608
+  languageName: node
+  linkType: hard
+
 "@types/parse-json@npm:^4.0.0":
  version: 4.0.2
  resolution: "@types/parse-json@npm:4.0.2"
@@ -1526,15 +1544,15 @@ __metadata:
  languageName: node
  linkType: hard

-"@typescript-eslint/eslint-plugin@npm:8.0.1":
-  version: 8.0.1
-  resolution: "@typescript-eslint/eslint-plugin@npm:8.0.1"
+"@typescript-eslint/eslint-plugin@npm:8.1.0":
+  version: 8.1.0
+  resolution: "@typescript-eslint/eslint-plugin@npm:8.1.0"
  dependencies:
    "@eslint-community/regexpp": "npm:^4.10.0"
-    "@typescript-eslint/scope-manager": "npm:8.0.1"
-    "@typescript-eslint/type-utils": "npm:8.0.1"
-    "@typescript-eslint/utils": "npm:8.0.1"
-    "@typescript-eslint/visitor-keys": "npm:8.0.1"
+    "@typescript-eslint/scope-manager": "npm:8.1.0"
+    "@typescript-eslint/type-utils": "npm:8.1.0"
+    "@typescript-eslint/utils": "npm:8.1.0"
+    "@typescript-eslint/visitor-keys": "npm:8.1.0"
    graphemer: "npm:^1.4.0"
    ignore: "npm:^5.3.1"
    natural-compare: "npm:^1.4.0"
@@ -1545,66 +1563,66 @@ __metadata:
  peerDependenciesMeta:
    typescript:
      optional: true
-  checksum: 10c0/fd4e11599c4a85d0fbbd0be350f11acaa32d424bc5c2c0b672133266b4b56fc20a78edd0c7b803b4223a1a66736624561a60fee827738118550733d14afb775a
+  checksum: 10c0/7bbeae588f859b59c34d6a76cac06ef0fa605921b40c5d3b65b94829984280ea84c4dd3f5cb9ce2eb326f5563e9abb4c90ebff05c47f83f4def296c2ea1fa86c
  languageName: node
  linkType: hard

-"@typescript-eslint/parser@npm:8.0.1":
-  version: 8.0.1
-  resolution: "@typescript-eslint/parser@npm:8.0.1"
+"@typescript-eslint/parser@npm:8.1.0":
+  version: 8.1.0
+  resolution: "@typescript-eslint/parser@npm:8.1.0"
  dependencies:
-    "@typescript-eslint/scope-manager": "npm:8.0.1"
-    "@typescript-eslint/types": "npm:8.0.1"
-    "@typescript-eslint/typescript-estree": "npm:8.0.1"
-    "@typescript-eslint/visitor-keys": "npm:8.0.1"
+    "@typescript-eslint/scope-manager": "npm:8.1.0"
+    "@typescript-eslint/types": "npm:8.1.0"
+    "@typescript-eslint/typescript-estree": "npm:8.1.0"
+    "@typescript-eslint/visitor-keys": "npm:8.1.0"
    debug: "npm:^4.3.4"
  peerDependencies:
    eslint: ^8.57.0 || ^9.0.0
  peerDependenciesMeta:
    typescript:
      optional: true
-  checksum: 10c0/bf93640f06c9d2e09a79d015d2c3303f58a8569a3f6928544feeeaad8825388133b5e44ca017b4480d38c037644cf6390c785129539fe256f55422ae608943b5
+  checksum: 10c0/b94b2d3ab5ca505484d100701fad6a04a5dc8d595029bac1b9f5b8a4a91d80fd605b0f65d230b36a97ab7e5d55eeb0c28af2ab63929a3e4ab8fdefd2a548c36b
  languageName: node
  linkType: hard

-"@typescript-eslint/scope-manager@npm:8.0.1":
-  version: 8.0.1
-  resolution: "@typescript-eslint/scope-manager@npm:8.0.1"
+"@typescript-eslint/scope-manager@npm:8.1.0":
+  version: 8.1.0
+  resolution: "@typescript-eslint/scope-manager@npm:8.1.0"
  dependencies:
-    "@typescript-eslint/types": "npm:8.0.1"
-    "@typescript-eslint/visitor-keys": "npm:8.0.1"
-  checksum: 10c0/79c00bc726c0c14b800bbbc1c1b88978c2cbeb29d2b06b94a5773f959aafac5cfb37bdb8c3bb80b9fb07fd10440413fce9098f338dce100696a4d3dc1ea6b187
+    "@typescript-eslint/types": "npm:8.1.0"
+    "@typescript-eslint/visitor-keys": "npm:8.1.0"
+  checksum: 10c0/2bcf8cd176a1819bddcae16c572e7da8fba821b995a91cd53d64d8d6b85a17f5a895522f281ba57e34929574bddd4d6684ee3e545ec4e8096be4c3198e253a9a
  languageName: node
  linkType: hard

-"@typescript-eslint/type-utils@npm:8.0.1":
-  version: 8.0.1
-  resolution: "@typescript-eslint/type-utils@npm:8.0.1"
+"@typescript-eslint/type-utils@npm:8.1.0":
+  version: 8.1.0
+  resolution: "@typescript-eslint/type-utils@npm:8.1.0"
  dependencies:
-    "@typescript-eslint/typescript-estree": "npm:8.0.1"
-    "@typescript-eslint/utils": "npm:8.0.1"
+    "@typescript-eslint/typescript-estree": "npm:8.1.0"
+    "@typescript-eslint/utils": "npm:8.1.0"
    debug: "npm:^4.3.4"
    ts-api-utils: "npm:^1.3.0"
  peerDependenciesMeta:
    typescript:
      optional: true
-  checksum: 10c0/5cbf604044d5cd9cc6e95a2eee5a62803a09f46ccf4aa7293e373a4be8b7b57b470cbc97c1121ef354f842e7fc1d17b30c81bf3540023382ad5e339c9ca3ce15
+  checksum: 10c0/62753941c4136e8d2daa72fe0410dea48e5317a6f12ece6382ca85e29912bd1b3f739b61d1060fc0a1f8c488dfc905beab4c8b8497951a21c3138a659c7271ec
  languageName: node
  linkType: hard

-"@typescript-eslint/types@npm:8.0.1":
-  version: 8.0.1
-  resolution: "@typescript-eslint/types@npm:8.0.1"
-  checksum: 10c0/e7c02d4e153a935c04bfddc0c8fc1618b1c8e9767583cff05a0e063bbacb7f3c8fac2257879c41162fe19094a0de3a567b57969177b2a0c32f39accd4c5601d5
+"@typescript-eslint/types@npm:8.1.0":
+  version: 8.1.0
+  resolution: "@typescript-eslint/types@npm:8.1.0"
+  checksum: 10c0/ceade44455f45974e68956016c4d1c6626580732f7f9675e14ffa63db80b551752b0df596b20473dae9f0dc6ed966e17417dc2cf36e1a82b6ab0edc97c5eaa50
  languageName: node
  linkType: hard

-"@typescript-eslint/typescript-estree@npm:8.0.1":
-  version: 8.0.1
-  resolution: "@typescript-eslint/typescript-estree@npm:8.0.1"
+"@typescript-eslint/typescript-estree@npm:8.1.0":
+  version: 8.1.0
+  resolution: "@typescript-eslint/typescript-estree@npm:8.1.0"
  dependencies:
-    "@typescript-eslint/types": "npm:8.0.1"
-    "@typescript-eslint/visitor-keys": "npm:8.0.1"
+    "@typescript-eslint/types": "npm:8.1.0"
+    "@typescript-eslint/visitor-keys": "npm:8.1.0"
    debug: "npm:^4.3.4"
    globby: "npm:^11.1.0"
    is-glob: "npm:^4.0.3"
@@ -1614,31 +1632,31 @@ __metadata:
  peerDependenciesMeta:
    typescript:
      optional: true
-  checksum: 10c0/12507995dc634a1746b581635e0df9f986ad01e7f0b4482f1f240986e7277ebd301dfe3b59c07da6d1f3d465f9110dc2a61ce50b67a8f31188cad13f7cc3632e
+  checksum: 10c0/a7bc8275df1c79c4cb14ef086c56674316dd4907efec53eddca35d0b5220428b69c82178ce2d95138da2e398269c8bd0764cae8020a36417e411e35c3c47bc4b
  languageName: node
  linkType: hard

-"@typescript-eslint/utils@npm:8.0.1":
-  version: 8.0.1
-  resolution: "@typescript-eslint/utils@npm:8.0.1"
+"@typescript-eslint/utils@npm:8.1.0":
+  version: 8.1.0
+  resolution: "@typescript-eslint/utils@npm:8.1.0"
  dependencies:
    "@eslint-community/eslint-utils": "npm:^4.4.0"
-    "@typescript-eslint/scope-manager": "npm:8.0.1"
-    "@typescript-eslint/types": "npm:8.0.1"
-    "@typescript-eslint/typescript-estree": "npm:8.0.1"
+    "@typescript-eslint/scope-manager": "npm:8.1.0"
+    "@typescript-eslint/types": "npm:8.1.0"
+    "@typescript-eslint/typescript-estree": "npm:8.1.0"
  peerDependencies:
    eslint: ^8.57.0 || ^9.0.0
-  checksum: 10c0/9ab4baee82ac74caee18fb687697698043385aea5d0ec4bb34d874a6969eaa3e48f9319ab023cbcb6114f86de17f7360a43460fb4159c61760a2d2984004dd21
+  checksum: 10c0/c95503a6bdcd98b1ff04d1adbf46377b2036b1c510d90a4a056401f996f775f06c3108c95fb81cd6babc9c97b73b91b8e848f0337bc508de8a49c993582f0e75
  languageName: node
  linkType: hard

-"@typescript-eslint/visitor-keys@npm:8.0.1":
-  version: 8.0.1
-  resolution: "@typescript-eslint/visitor-keys@npm:8.0.1"
+"@typescript-eslint/visitor-keys@npm:8.1.0":
+  version: 8.1.0
+  resolution: "@typescript-eslint/visitor-keys@npm:8.1.0"
  dependencies:
-    "@typescript-eslint/types": "npm:8.0.1"
+    "@typescript-eslint/types": "npm:8.1.0"
    eslint-visitor-keys: "npm:^3.4.3"
-  checksum: 10c0/64c12095a97808bb1e1f5709192b274cac58d6b8fbbf9ec8fafead30f7effef7f0232244ec759298d046e1cd43521b9f3ba37b80618d5184c8b22fae665a7068
+  checksum: 10c0/b7544dbb0eec1ddbfcd95c04b51b9a739c2e768c16d1c88508f976a2b0d1bc02fefb7491930e06e48073a5c07c6f488cd8403bba3a8b918888b93a88d5ac3869
  languageName: node
  linkType: hard

@@ -1658,30 +1676,31 @@ __metadata:
    "@table-library/react-table-library": "npm:4.1.7"
    "@trivago/prettier-plugin-sort-imports": "npm:^4.3.0"
    "@types/babel__core": "npm:^7"
-    "@types/node": "npm:^22.2.0"
+    "@types/formidable": "npm:^3"
+    "@types/node": "npm:^22.3.0"
    "@types/react": "npm:^18.3.3"
    "@types/react-dom": "npm:^18.3.0"
    "@types/react-router-dom": "npm:^5.3.3"
-    alova: "npm:3.0.6"
+    alova: "npm:3.0.8"
    async-validator: "npm:^4.2.5"
    concurrently: "npm:^8.2.2"
    eslint: "npm:^9.9.0"
    eslint-config-prettier: "npm:^9.1.0"
+    formidable: "npm:^3.5.1"
    jwt-decode: "npm:^4.0.0"
    mime-types: "npm:^2.1.35"
-    preact: "npm:^10.23.1"
+    preact: "npm:^10.23.2"
    prettier: "npm:^3.3.3"
    react: "npm:^18.3.1"
    react-dom: "npm:^18.3.1"
-    react-dropzone: "npm:^14.2.3"
-    react-icons: "npm:^5.2.1"
+    react-icons: "npm:^5.3.0"
    react-router-dom: "npm:^6.26.0"
    react-toastify: "npm:^10.0.5"
    rollup-plugin-visualizer: "npm:^5.12.0"
-    terser: "npm:^5.31.5"
+    terser: "npm:^5.31.6"
    typesafe-i18n: "npm:^5.26.2"
    typescript: "npm:^5.5.4"
-    typescript-eslint: "npm:8.0.1"
+    typescript-eslint: "npm:8.1.0"
    vite: "npm:^5.4.0"
    vite-plugin-imagemin: "npm:^0.6.1"
    vite-tsconfig-paths: "npm:^5.0.1"
@@ -1744,13 +1763,13 @@ __metadata:
  languageName: node
  linkType: hard

-"alova@npm:3.0.6":
-  version: 3.0.6
-  resolution: "alova@npm:3.0.6"
+"alova@npm:3.0.8":
+  version: 3.0.8
+  resolution: "alova@npm:3.0.8"
  dependencies:
    "@alova/shared": "npm:^1.0.4"
    rate-limiter-flexible: "npm:^5.0.3"
-  checksum: 10c0/dec1ceabaedc4c3c42237e03e4fdcd41ada8ad8aeb856ab2a1d428a1daf4559125767a9bd2d20f193ae013063baa59641a6c34dddf7794f7bba1a31e7258968f
+  checksum: 10c0/7244b0e611153a01ae36a3076a54df2165c9f7a7e44b83378e1d60cd079879b5786f5abfd213cb4ebb9c7a1cc7d763de193d49e21465c2cec9c9cb9912dec9f9
  languageName: node
  linkType: hard

@@ -1844,6 +1863,13 @@ __metadata:
  languageName: node
  linkType: hard

+"asap@npm:^2.0.0":
+  version: 2.0.6
+  resolution: "asap@npm:2.0.6"
+  checksum: 10c0/c6d5e39fe1f15e4b87677460bd66b66050cd14c772269cee6688824c1410a08ab20254bb6784f9afb75af9144a9f9a7692d49547f4d19d715aeb7c0318f3136d
+  languageName: node
+  linkType: hard
+
 "async-validator@npm:^4.2.5":
  version: 4.2.5
  resolution: "async-validator@npm:4.2.5"
@@ -1851,13 +1877,6 @@ __metadata:
  languageName: node
  linkType: hard

-"attr-accept@npm:^2.2.2":
-  version: 2.2.2
-  resolution: "attr-accept@npm:2.2.2"
-  checksum: 10c0/f77c073ac9616a783f2df814a56f65f1c870193e8da6097139e30b3be84ecc19fb835b93e81315d1da4f19e80721f14e8c8075014205e00abd37b856fe030b80
-  languageName: node
-  linkType: hard
-
 "babel-plugin-macros@npm:^3.1.0":
  version: 3.1.0
  resolution: "babel-plugin-macros@npm:3.1.0"
@@ -2586,6 +2605,16 @@ __metadata:
  languageName: node
  linkType: hard

+"dezalgo@npm:^1.0.4":
+  version: 1.0.4
+  resolution: "dezalgo@npm:1.0.4"
+  dependencies:
+    asap: "npm:^2.0.0"
+    wrappy: "npm:1"
+  checksum: 10c0/8a870ed42eade9a397e6141fe5c025148a59ed52f1f28b1db5de216b4d57f0af7a257070c3af7ce3d5508c1ce9dd5009028a76f4b2cc9370dc56551d2355fad8
+  languageName: node
+  linkType: hard
+
 "dir-glob@npm:^3.0.1":
  version: 3.0.1
  resolution: "dir-glob@npm:3.0.1"
@@ -3446,15 +3475,6 @@ __metadata:
  languageName: node
  linkType: hard

-"file-selector@npm:^0.6.0":
-  version: 0.6.0
-  resolution: "file-selector@npm:0.6.0"
-  dependencies:
-    tslib: "npm:^2.4.0"
-  checksum: 10c0/477ca1b56274db9fee1a8a623c4bfef580389726a5fef843af8c1f2f17f70ec2d1e41b29115777c92e120a15f1cca734c6ef36bb48bfa2ee027c68da16cd0d28
-  languageName: node
-  linkType: hard
-
 "file-type@npm:5.2.0, file-type@npm:^5.2.0":
  version: 5.2.0
  resolution: "file-type@npm:5.2.0"
@@ -3594,6 +3614,17 @@ __metadata:
  languageName: node
  linkType: hard

+"formidable@npm:^3.5.1":
+  version: 3.5.1
+  resolution: "formidable@npm:3.5.1"
+  dependencies:
+    dezalgo: "npm:^1.0.4"
+    hexoid: "npm:^1.0.0"
+    once: "npm:^1.4.0"
+  checksum: 10c0/c02fa1a027876dd9fc5abde16e9c537bec41bc652b362d0b3fd26daaae0615b9a472129c29b328a130d11f543f676acd1b13e6f28f3adc1b088cdaea9fb9e054
+  languageName: node
+  linkType: hard
+
 "from2@npm:^2.1.1":
  version: 2.3.0
  resolution: "from2@npm:2.3.0"
@@ -3989,6 +4020,13 @@ __metadata:
  languageName: node
  linkType: hard

+"hexoid@npm:^1.0.0":
+  version: 1.0.0
+  resolution: "hexoid@npm:1.0.0"
+  checksum: 10c0/9c45e8ba676b9eb88455631ebceec4c829a8374a583410dc735472ab9808bf11339fcd074633c3fa30e420901b894d8a92ffd5e2e21eddd41149546e05a91f69
+  languageName: node
+  linkType: hard
+
 "hoist-non-react-statics@npm:^3.3.1":
  version: 3.3.2
  resolution: "hoist-non-react-statics@npm:3.3.2"
@@ -5593,10 +5631,10 @@ __metadata:
  languageName: node
  linkType: hard

-"preact@npm:^10.23.1":
-  version: 10.23.1
-  resolution: "preact@npm:10.23.1"
-  checksum: 10c0/f0eb37999bfa9cbc725e57e189387c77919fa05d17cdc3c4ff41660298805159867689f1d974eb8e6496288c0212760490d0e6f1c12022e0f5a74d06cc618e85
+"preact@npm:^10.23.2":
+  version: 10.23.2
+  resolution: "preact@npm:10.23.2"
+  checksum: 10c0/6e0dc1b38ead7554c99ddec9a32162b456e8f622229413b136042a777445a12d115633cd49d6df83c30b64d721a0ad4d3c71bb468edc759c15799896e96fd9f2
  languageName: node
  linkType: hard

@@ -5733,25 +5771,12 @@ __metadata:
  languageName: node
  linkType: hard

-"react-dropzone@npm:^14.2.3":
-  version: 14.2.3
-  resolution: "react-dropzone@npm:14.2.3"
-  dependencies:
-    attr-accept: "npm:^2.2.2"
-    file-selector: "npm:^0.6.0"
-    prop-types: "npm:^15.8.1"
-  peerDependencies:
-    react: ">= 16.8 || 18.0.0"
-  checksum: 10c0/6433517c53309aca1bb4f4a535aeee297345ca1e11b123676f46c7682ffab34a3428cbda106448fc92b5c9a5e0fa5d225bc188adebcd4d302366bf6b1f9c3fc1
-  languageName: node
-  linkType: hard
-
-"react-icons@npm:^5.2.1":
-  version: 5.2.1
-  resolution: "react-icons@npm:5.2.1"
+"react-icons@npm:^5.3.0":
+  version: 5.3.0
+  resolution: "react-icons@npm:5.3.0"
  peerDependencies:
    react: "*"
-  checksum: 10c0/9d52b975afaf27dab07dcaefd50497ba43cc57076fc26ccac5142965e01c7fd0c503a62ea31c3bb710e0b2959a4620c2fed12c3c86960ad8ceb63de7f0085f3a
+  checksum: 10c0/a53af0de558f0e2bacfbafc973aa8ca1e6a429006a2f83d70becad5be431726a691e096336c95949bb0d967587b145264c5046d2bc1518969dbae731855d0712
  languageName: node
  linkType: hard

@@ -6657,9 +6682,9 @@ __metadata:
  languageName: node
  linkType: hard

-"terser@npm:^5.31.5":
-  version: 5.31.5
-  resolution: "terser@npm:5.31.5"
+"terser@npm:^5.31.6":
+  version: 5.31.6
+  resolution: "terser@npm:5.31.6"
  dependencies:
    "@jridgewell/source-map": "npm:^0.3.3"
    acorn: "npm:^8.8.2"
@@ -6667,7 +6692,7 @@ __metadata:
    source-map-support: "npm:~0.5.20"
  bin:
    terser: bin/terser
-  checksum: 10c0/6e7c66c1f4062ee098bff3dc3c396819ebf5f1740f0615be9de39b675a78c732d199f4dcfdcd15bd65f354e37c45bb944360f532a36fe7f7d22f800ca53c2d02
+  checksum: 10c0/b17d02b65a52a5041430572b3c514475820f5e7590fa93773c0f5b4be601ccf3f6d745bf5a79f3ee58187cf85edf61c24ddf4345783839fccb44c9c8fa9b427e
  languageName: node
  linkType: hard

@@ -6763,7 +6788,7 @@ __metadata:
  languageName: node
  linkType: hard

-"tslib@npm:^2.1.0, tslib@npm:^2.4.0":
+"tslib@npm:^2.1.0":
  version: 2.6.3
  resolution: "tslib@npm:2.6.3"
  checksum: 10c0/2598aef53d9dbe711af75522464b2104724d6467b26a60f2bdac8297d2b5f1f6b86a71f61717384aa8fd897240467aaa7bcc36a0700a0faf751293d1331db39a
@@ -6806,17 +6831,17 @@ __metadata:
  languageName: node
  linkType: hard

-"typescript-eslint@npm:8.0.1":
-  version: 8.0.1
-  resolution: "typescript-eslint@npm:8.0.1"
+"typescript-eslint@npm:8.1.0":
+  version: 8.1.0
+  resolution: "typescript-eslint@npm:8.1.0"
  dependencies:
-    "@typescript-eslint/eslint-plugin": "npm:8.0.1"
-    "@typescript-eslint/parser": "npm:8.0.1"
-    "@typescript-eslint/utils": "npm:8.0.1"
+    "@typescript-eslint/eslint-plugin": "npm:8.1.0"
+    "@typescript-eslint/parser": "npm:8.1.0"
+    "@typescript-eslint/utils": "npm:8.1.0"
  peerDependenciesMeta:
    typescript:
      optional: true
-  checksum: 10c0/dc9df2dd82863b98720b7555c1fa6c2724055a252ce5940655187667253b717be8697bb798742f23701ee6efcd743d5556f00ab9a3af24a0e735df1e8b24e24a
+  checksum: 10c0/9b5769b95aeca54ae9fa15cd2f0e5656747f643a7be220513555de143ff19d70c5945eb82259a3fb29ab4d37f4d158f7f088e7b2cf98e2e8253a7429ac19d072
  languageName: node
  linkType: hard

@@ -6857,6 +6882,13 @@ __metadata:
  languageName: node
  linkType: hard

+"undici-types@npm:~6.18.2":
+  version: 6.18.2
+  resolution: "undici-types@npm:6.18.2"
+  checksum: 10c0/dea28163891a5af7624c120107dc07a74c369ee94c6dd1d0de29af061ee129fac4846f97130589f4436b85f6102c73d30328ca908be02626dd8ab9fec5642aba
+  languageName: node
+  linkType: hard
+
 "unique-filename@npm:^3.0.0":
  version: 3.0.0
  resolution: "unique-filename@npm:3.0.0"
--- a/mock-api/mockServer.js
+++ b/mock-api/mockServer.js
@@ -0,0 +1,68 @@
+import formidable from "formidable";
+
+export default () => {
+    return {
+        name: "vite:mockserver",
+        configureServer: async (server) => {
+
+            // catch any file uploads
+            server.middlewares.use(async (req, res, next) => {
+
+                if (req.url.startsWith("/rest/uploadFile")) {
+
+                    let progress = 0;
+                    const file_size = req.headers['content-length'];
+
+                    req.on('data', async (chunk) => {
+                        progress += chunk.length;
+                        const percentage = (progress / file_size) * 100;
+                        console.log(`Progress: ${Math.round(percentage)}%`);
+                        // await new Promise((resolve) => setTimeout(() => resolve(), 3000)); // slow it down
+                    });
+
+                    const form = formidable({});
+                    let fields;
+                    let files;
+                    try {
+                        [fields, files] = await form.parse(req);
+                    } catch (err) {
+                        console.error(err);
+                        res.writeHead(err.httpCode || 400, {
+                            "Content-Type": "text/plain",
+                        });
+                        res.end(String(err));
+                        return;
+                    }
+
+                    const upploaded_file = files.file[0];
+                    const file_name = upploaded_file.originalFilename;
+                    const file_extension = file_name.substring(file_name.lastIndexOf('.') + 1);
+
+                    console.log("Filename: " + file_name);
+                    console.log("Extension: " + file_extension);
+                    console.log("File size: " + file_size);
+
+                    if (file_extension === 'bin' || file_extension === 'json') {
+                        console.log("File uploaded successfully!");
+                    } else if (file_extension === 'md5') {
+                        // return res.json({ md5: 'ef4304fc4d9025a58dcf25d71c882d2c' });
+                        console.log("MD5 hash generated successfully!");
+                        res.end(
+                            JSON.stringify({
+                                md5: 'ef4304fc4d9025a58dcf25d71c882d2c',
+                            }),
+                        );
+                    } else {
+                        res.statusCode = 400;
+                        console.log("Invalid file extension!");
+                    }
+
+                    res.end();
+
+                } else {
+                    next(); // call next middleware
+                }
+            });
+        },
+    };
+};
--- a/mock-api/package.json
+++ b/mock-api/package.json
@@ -11,10 +11,9 @@
  },
  "dependencies": {
    "@msgpack/msgpack": "^2.8.0",
-    "@types/multer": "^1.4.11",
    "express": "^4.19.2",
-    "itty-router": "^5.0.17",
-    "multer": "^1.4.5-lts.1"
+    "formidable": "^3.5.1",
+    "itty-router": "^5.0.17"
  },
-  "packageManager": "yarn@4.2.1"
+  "packageManager": "yarn@4.4.0"
 }
--- a/mock-api/upload_server.ts
+++ b/mock-api/upload_server.ts
@@ -1,55 +0,0 @@
-import express from 'express';
-import multer from 'multer';
-
-const rest_server = express();
-const port = 3082;
-const upload = multer({ dest: './uploads' });
-
-const UPLOAD_FILE_ENDPOINT = '/rest/uploadFile';
-
-// delay functions, 2 different types
-const delay = (ms) => new Promise((res) => setTimeout(res, ms));
-function delay_blocking(milliseconds) {
-  var start = new Date().getTime();
-  while (true) {
-    if (new Date().getTime() - start > milliseconds) {
-      break;
-    }
-  }
-}
-
-function progress_middleware(req, _res, next) {
-  let progress = 0;
-  const file_size = req.headers['content-length'];
-  console.log('Uploading file. Size ' + file_size + ' bytes');
-
-  // set event listener
-  req.on('data', async (chunk) => {
-    progress += chunk.length;
-    const percentage = (progress / file_size) * 100;
-    console.log(`Progress: ${Math.round(percentage)}%`);
-    // await delay(1000); // slow it down
-    delay_blocking(1000); // slow it down
-  });
-  next(); // invoke next middleware which is multer
-}
-
-rest_server.post(UPLOAD_FILE_ENDPOINT, progress_middleware, upload.single('file'), (req, res) => {
-  if (req.file) {
-    const filename = req.file.originalname;
-    const ext = filename.substring(filename.lastIndexOf('.') + 1);
-    console.log(req.file);
-
-    if (ext === 'bin' || ext === 'json') {
-      console.log('Received firmware or json file, extension: ' + ext);
-      return res.sendStatus(200);
-    } else if (ext === 'md5') {
-      return res.json({ md5: 'ef4304fc4d9025a58dcf25d71c882d2c' });
-    }
-  }
-  console.log('Invalid file extension');
-  return res.sendStatus(400);
-});
-
-// start server
-rest_server.listen(port, () => console.log(`EMS-ESP File Upload mock server running on http://localhost:${port}/`));
--- a/mock-api/yarn.lock
+++ b/mock-api/yarn.lock
@@ -12,117 +12,7 @@ __metadata:
  languageName: node
  linkType: hard

-"@types/body-parser@npm:*":
-  version: 1.19.5
-  resolution: "@types/body-parser@npm:1.19.5"
-  dependencies:
-    "@types/connect": "npm:*"
-    "@types/node": "npm:*"
-  checksum: 10c0/aebeb200f25e8818d8cf39cd0209026750d77c9b85381cdd8deeb50913e4d18a1ebe4b74ca9b0b4d21952511eeaba5e9fbbf739b52731a2061e206ec60d568df
-  languageName: node
-  linkType: hard
-
-"@types/connect@npm:*":
-  version: 3.4.38
-  resolution: "@types/connect@npm:3.4.38"
-  dependencies:
-    "@types/node": "npm:*"
-  checksum: 10c0/2e1cdba2c410f25649e77856505cd60223250fa12dff7a503e492208dbfdd25f62859918f28aba95315251fd1f5e1ffbfca1e25e73037189ab85dd3f8d0a148c
-  languageName: node
-  linkType: hard
-
-"@types/express-serve-static-core@npm:^4.17.33":
-  version: 4.19.0
-  resolution: "@types/express-serve-static-core@npm:4.19.0"
-  dependencies:
-    "@types/node": "npm:*"
-    "@types/qs": "npm:*"
-    "@types/range-parser": "npm:*"
-    "@types/send": "npm:*"
-  checksum: 10c0/38a13dfbb38d18526276e68dae1097eb0ebef296e76bff2a9bf6831c052c2f87797e910c87bd3f0dd1a1b4136241c9d7c841779a00b22576d12aa9b483a63349
-  languageName: node
-  linkType: hard
-
-"@types/express@npm:*":
-  version: 4.17.21
-  resolution: "@types/express@npm:4.17.21"
-  dependencies:
-    "@types/body-parser": "npm:*"
-    "@types/express-serve-static-core": "npm:^4.17.33"
-    "@types/qs": "npm:*"
-    "@types/serve-static": "npm:*"
-  checksum: 10c0/12e562c4571da50c7d239e117e688dc434db1bac8be55613294762f84fd77fbd0658ccd553c7d3ab02408f385bc93980992369dd30e2ecd2c68c358e6af8fabf
-  languageName: node
-  linkType: hard
-
-"@types/http-errors@npm:*":
-  version: 2.0.4
-  resolution: "@types/http-errors@npm:2.0.4"
-  checksum: 10c0/494670a57ad4062fee6c575047ad5782506dd35a6b9ed3894cea65830a94367bd84ba302eb3dde331871f6d70ca287bfedb1b2cf658e6132cd2cbd427ab56836
-  languageName: node
-  linkType: hard
-
-"@types/mime@npm:^1":
-  version: 1.3.5
-  resolution: "@types/mime@npm:1.3.5"
-  checksum: 10c0/c2ee31cd9b993804df33a694d5aa3fa536511a49f2e06eeab0b484fef59b4483777dbb9e42a4198a0809ffbf698081fdbca1e5c2218b82b91603dfab10a10fbc
-  languageName: node
-  linkType: hard
-
-"@types/multer@npm:^1.4.11":
-  version: 1.4.11
-  resolution: "@types/multer@npm:1.4.11"
-  dependencies:
-    "@types/express": "npm:*"
-  checksum: 10c0/ace8e9f5ac7d2d7f6e0c35b790504f582a2f82a84cc06a7b90315527599b95256595bc0bb5bba60220c20a558554f0c21b96b94848b885987ab69512a3a9865e
-  languageName: node
-  linkType: hard
-
-"@types/node@npm:*":
-  version: 20.12.10
-  resolution: "@types/node@npm:20.12.10"
-  dependencies:
-    undici-types: "npm:~5.26.4"
-  checksum: 10c0/2cc3b6ea09894ed1a3cf39f6491ec539281580f4ff83216e7d26ce85c83237fe0543c0ca49e25b2515ccdb6c8814b488d17a64a05f536dcaea94f9d32a60c7d7
-  languageName: node
-  linkType: hard
-
-"@types/qs@npm:*":
-  version: 6.9.15
-  resolution: "@types/qs@npm:6.9.15"
-  checksum: 10c0/49c5ff75ca3adb18a1939310042d273c9fc55920861bd8e5100c8a923b3cda90d759e1a95e18334092da1c8f7b820084687770c83a1ccef04fb2c6908117c823
-  languageName: node
-  linkType: hard
-
-"@types/range-parser@npm:*":
-  version: 1.2.7
-  resolution: "@types/range-parser@npm:1.2.7"
-  checksum: 10c0/361bb3e964ec5133fa40644a0b942279ed5df1949f21321d77de79f48b728d39253e5ce0408c9c17e4e0fd95ca7899da36841686393b9f7a1e209916e9381a3c
-  languageName: node
-  linkType: hard
-
-"@types/send@npm:*":
-  version: 0.17.4
-  resolution: "@types/send@npm:0.17.4"
-  dependencies:
-    "@types/mime": "npm:^1"
-    "@types/node": "npm:*"
-  checksum: 10c0/7f17fa696cb83be0a104b04b424fdedc7eaba1c9a34b06027239aba513b398a0e2b7279778af521f516a397ced417c96960e5f50fcfce40c4bc4509fb1a5883c
-  languageName: node
-  linkType: hard
-
-"@types/serve-static@npm:*":
-  version: 1.15.7
-  resolution: "@types/serve-static@npm:1.15.7"
-  dependencies:
-    "@types/http-errors": "npm:*"
-    "@types/node": "npm:*"
-    "@types/send": "npm:*"
-  checksum: 10c0/26ec864d3a626ea627f8b09c122b623499d2221bbf2f470127f4c9ebfe92bd8a6bb5157001372d4c4bd0dd37a1691620217d9dc4df5aa8f779f3fd996b1c60ae
-  languageName: node
-  linkType: hard
-
-"accepts@npm:~1.3.5, accepts@npm:~1.3.8":
+"accepts@npm:~1.3.8":
  version: 1.3.8
  resolution: "accepts@npm:1.3.8"
  dependencies:
@@ -132,13 +22,6 @@ __metadata:
  languageName: node
  linkType: hard

-"append-field@npm:^1.0.0":
-  version: 1.0.0
-  resolution: "append-field@npm:1.0.0"
-  checksum: 10c0/1b5abcc227e5179936a9e4f7e2af4769fa1f00eda85bbaed907f7964b0fd1f7d61f0f332b35337f391389ff13dd5310c2546ba670f8e5a743b23ec85185c73ef
-  languageName: node
-  linkType: hard
-
 "array-flatten@npm:1.1.1":
  version: 1.1.1
  resolution: "array-flatten@npm:1.1.1"
@@ -146,6 +29,13 @@ __metadata:
  languageName: node
  linkType: hard

+"asap@npm:^2.0.0":
+  version: 2.0.6
+  resolution: "asap@npm:2.0.6"
+  checksum: 10c0/c6d5e39fe1f15e4b87677460bd66b66050cd14c772269cee6688824c1410a08ab20254bb6784f9afb75af9144a9f9a7692d49547f4d19d715aeb7c0318f3136d
+  languageName: node
+  linkType: hard
+
 "body-parser@npm:1.20.2":
  version: 1.20.2
  resolution: "body-parser@npm:1.20.2"
@@ -166,29 +56,6 @@ __metadata:
  languageName: node
  linkType: hard

-"buffer-from@npm:^1.0.0":
-  version: 1.1.2
-  resolution: "buffer-from@npm:1.1.2"
-  checksum: 10c0/124fff9d66d691a86d3b062eff4663fe437a9d9ee4b47b1b9e97f5a5d14f6d5399345db80f796827be7c95e70a8e765dd404b7c3ff3b3324f98e9b0c8826cc34
-  languageName: node
-  linkType: hard
-
-"busboy@npm:^1.0.0":
-  version: 1.6.0
-  resolution: "busboy@npm:1.6.0"
-  dependencies:
-    streamsearch: "npm:^1.1.0"
-  checksum: 10c0/fa7e836a2b82699b6e074393428b91ae579d4f9e21f5ac468e1b459a244341d722d2d22d10920cdd849743dbece6dca11d72de939fb75a7448825cf2babfba1f
-  languageName: node
-  linkType: hard
-
-"bytes@npm:3.0.0":
-  version: 3.0.0
-  resolution: "bytes@npm:3.0.0"
-  checksum: 10c0/91d42c38601c76460519ffef88371caacaea483a354c8e4b8808e7b027574436a5713337c003ea3de63ee4991c2a9a637884fdfe7f761760d746929d9e8fec60
-  languageName: node
-  linkType: hard
-
 "bytes@npm:3.1.2":
  version: 3.1.2
  resolution: "bytes@npm:3.1.2"
@@ -209,42 +76,6 @@ __metadata:
  languageName: node
  linkType: hard

-"compressible@npm:~2.0.16":
-  version: 2.0.18
-  resolution: "compressible@npm:2.0.18"
-  dependencies:
-    mime-db: "npm:>= 1.43.0 < 2"
-  checksum: 10c0/8a03712bc9f5b9fe530cc5a79e164e665550d5171a64575d7dcf3e0395d7b4afa2d79ab176c61b5b596e28228b350dd07c1a2a6ead12fd81d1b6cd632af2fef7
-  languageName: node
-  linkType: hard
-
-"compression@npm:^1.7.4":
-  version: 1.7.4
-  resolution: "compression@npm:1.7.4"
-  dependencies:
-    accepts: "npm:~1.3.5"
-    bytes: "npm:3.0.0"
-    compressible: "npm:~2.0.16"
-    debug: "npm:2.6.9"
-    on-headers: "npm:~1.0.2"
-    safe-buffer: "npm:5.1.2"
-    vary: "npm:~1.1.2"
-  checksum: 10c0/138db836202a406d8a14156a5564fb1700632a76b6e7d1546939472895a5304f2b23c80d7a22bf44c767e87a26e070dbc342ea63bb45ee9c863354fa5556bbbc
-  languageName: node
-  linkType: hard
-
-"concat-stream@npm:^1.5.2":
-  version: 1.6.2
-  resolution: "concat-stream@npm:1.6.2"
-  dependencies:
-    buffer-from: "npm:^1.0.0"
-    inherits: "npm:^2.0.3"
-    readable-stream: "npm:^2.2.2"
-    typedarray: "npm:^0.0.6"
-  checksum: 10c0/2e9864e18282946dabbccb212c5c7cec0702745e3671679eb8291812ca7fd12023f7d8cb36493942a62f770ac96a7f90009dc5c82ad69893438371720fa92617
-  languageName: node
-  linkType: hard
-
 "content-disposition@npm:0.5.4":
  version: 0.5.4
  resolution: "content-disposition@npm:0.5.4"
@@ -275,13 +106,6 @@ __metadata:
  languageName: node
  linkType: hard

-"core-util-is@npm:~1.0.0":
-  version: 1.0.3
-  resolution: "core-util-is@npm:1.0.3"
-  checksum: 10c0/90a0e40abbddfd7618f8ccd63a74d88deea94e77d0e8dbbea059fa7ebebb8fbb4e2909667fe26f3a467073de1a542ebe6ae4c73a73745ac5833786759cd906c9
-  languageName: node
-  linkType: hard
-
 "debug@npm:2.6.9":
  version: 2.6.9
  resolution: "debug@npm:2.6.9"
@@ -316,6 +140,16 @@ __metadata:
  languageName: node
  linkType: hard

+"dezalgo@npm:^1.0.4":
+  version: 1.0.4
+  resolution: "dezalgo@npm:1.0.4"
+  dependencies:
+    asap: "npm:^2.0.0"
+    wrappy: "npm:1"
+  checksum: 10c0/8a870ed42eade9a397e6141fe5c025148a59ed52f1f28b1db5de216b4d57f0af7a257070c3af7ce3d5508c1ce9dd5009028a76f4b2cc9370dc56551d2355fad8
+  languageName: node
+  linkType: hard
+
 "ee-first@npm:1.1.1":
  version: 1.1.1
  resolution: "ee-first@npm:1.1.1"
@@ -414,6 +248,17 @@ __metadata:
  languageName: node
  linkType: hard

+"formidable@npm:^3.5.1":
+  version: 3.5.1
+  resolution: "formidable@npm:3.5.1"
+  dependencies:
+    dezalgo: "npm:^1.0.4"
+    hexoid: "npm:^1.0.0"
+    once: "npm:^1.4.0"
+  checksum: 10c0/c02fa1a027876dd9fc5abde16e9c537bec41bc652b362d0b3fd26daaae0615b9a472129c29b328a130d11f543f676acd1b13e6f28f3adc1b088cdaea9fb9e054
+  languageName: node
+  linkType: hard
+
 "forwarded@npm:0.2.0":
  version: 0.2.0
  resolution: "forwarded@npm:0.2.0"
@@ -489,6 +334,13 @@ __metadata:
  languageName: node
  linkType: hard

+"hexoid@npm:^1.0.0":
+  version: 1.0.0
+  resolution: "hexoid@npm:1.0.0"
+  checksum: 10c0/9c45e8ba676b9eb88455631ebceec4c829a8374a583410dc735472ab9808bf11339fcd074633c3fa30e420901b894d8a92ffd5e2e21eddd41149546e05a91f69
+  languageName: node
+  linkType: hard
+
 "http-errors@npm:2.0.0":
  version: 2.0.0
  resolution: "http-errors@npm:2.0.0"
@@ -511,7 +363,7 @@ __metadata:
  languageName: node
  linkType: hard

-"inherits@npm:2.0.4, inherits@npm:^2.0.3, inherits@npm:~2.0.3":
+"inherits@npm:2.0.4":
  version: 2.0.4
  resolution: "inherits@npm:2.0.4"
  checksum: 10c0/4e531f648b29039fb7426fb94075e6545faa1eb9fe83c29f0b6d9e7263aceb4289d2d4557db0d428188eeb449cc7c5e77b0a0b2c4e248ff2a65933a0dee49ef2
@@ -525,13 +377,6 @@ __metadata:
  languageName: node
  linkType: hard

-"isarray@npm:~1.0.0":
-  version: 1.0.0
-  resolution: "isarray@npm:1.0.0"
-  checksum: 10c0/18b5be6669be53425f0b84098732670ed4e727e3af33bc7f948aac01782110eb9a18b3b329c5323bcdd3acdaae547ee077d3951317e7f133bff7105264b3003d
-  languageName: node
-  linkType: hard
-
 "itty-router@npm:^5.0.17":
  version: 5.0.17
  resolution: "itty-router@npm:5.0.17"
@@ -560,7 +405,7 @@ __metadata:
  languageName: node
  linkType: hard

-"mime-db@npm:1.52.0, mime-db@npm:>= 1.43.0 < 2":
+"mime-db@npm:1.52.0":
  version: 1.52.0
  resolution: "mime-db@npm:1.52.0"
  checksum: 10c0/0557a01deebf45ac5f5777fe7740b2a5c309c6d62d40ceab4e23da9f821899ce7a900b7ac8157d4548ddbb7beffe9abc621250e6d182b0397ec7f10c7b91a5aa
@@ -585,34 +430,14 @@ __metadata:
  languageName: node
  linkType: hard

-"minimist@npm:^1.2.6":
-  version: 1.2.8
-  resolution: "minimist@npm:1.2.8"
-  checksum: 10c0/19d3fcdca050087b84c2029841a093691a91259a47def2f18222f41e7645a0b7c44ef4b40e88a1e58a40c84d2ef0ee6047c55594d298146d0eb3f6b737c20ce6
-  languageName: node
-  linkType: hard
-
-"mkdirp@npm:^0.5.4":
-  version: 0.5.6
-  resolution: "mkdirp@npm:0.5.6"
-  dependencies:
-    minimist: "npm:^1.2.6"
-  bin:
-    mkdirp: bin/cmd.js
-  checksum: 10c0/e2e2be789218807b58abced04e7b49851d9e46e88a2f9539242cc8a92c9b5c3a0b9bab360bd3014e02a140fc4fbc58e31176c408b493f8a2a6f4986bd7527b01
-  languageName: node
-  linkType: hard
-
 "mock-api@workspace:.":
  version: 0.0.0-use.local
  resolution: "mock-api@workspace:."
  dependencies:
    "@msgpack/msgpack": "npm:^2.8.0"
-    "@types/multer": "npm:^1.4.11"
-    compression: "npm:^1.7.4"
    express: "npm:^4.19.2"
+    formidable: "npm:^3.5.1"
    itty-router: "npm:^5.0.17"
-    multer: "npm:^1.4.5-lts.1"
  languageName: unknown
  linkType: soft

@@ -630,21 +455,6 @@ __metadata:
  languageName: node
  linkType: hard

-"multer@npm:^1.4.5-lts.1":
-  version: 1.4.5-lts.1
-  resolution: "multer@npm:1.4.5-lts.1"
-  dependencies:
-    append-field: "npm:^1.0.0"
-    busboy: "npm:^1.0.0"
-    concat-stream: "npm:^1.5.2"
-    mkdirp: "npm:^0.5.4"
-    object-assign: "npm:^4.1.1"
-    type-is: "npm:^1.6.4"
-    xtend: "npm:^4.0.0"
-  checksum: 10c0/4c6c91e93e510c99e791b6520e3e2f4a227a57f4f509427ff7f3a6f4cc0b4b09ad77c475f629c12f7ae01dba11645b2bd6568877cab775de8bf853b0a67259b4
-  languageName: node
-  linkType: hard
-
 "negotiator@npm:0.6.3":
  version: 0.6.3
  resolution: "negotiator@npm:0.6.3"
@@ -652,13 +462,6 @@ __metadata:
  languageName: node
  linkType: hard

-"object-assign@npm:^4.1.1":
-  version: 4.1.1
-  resolution: "object-assign@npm:4.1.1"
-  checksum: 10c0/1f4df9945120325d041ccf7b86f31e8bcc14e73d29171e37a7903050e96b81323784ec59f93f102ec635bcf6fa8034ba3ea0a8c7e69fa202b87ae3b6cec5a414
-  languageName: node
-  linkType: hard
-
 "object-inspect@npm:^1.13.1":
  version: 1.13.1
  resolution: "object-inspect@npm:1.13.1"
@@ -675,10 +478,12 @@ __metadata:
  languageName: node
  linkType: hard

-"on-headers@npm:~1.0.2":
-  version: 1.0.2
-  resolution: "on-headers@npm:1.0.2"
-  checksum: 10c0/f649e65c197bf31505a4c0444875db0258e198292f34b884d73c2f751e91792ef96bb5cf89aa0f4fecc2e4dc662461dda606b1274b0e564f539cae5d2f5fc32f
+"once@npm:^1.4.0":
+  version: 1.4.0
+  resolution: "once@npm:1.4.0"
+  dependencies:
+    wrappy: "npm:1"
+  checksum: 10c0/5d48aca287dfefabd756621c5dfce5c91a549a93e9fdb7b8246bc4c4790aa2ec17b34a260530474635147aeb631a2dcc8b32c613df0675f96041cbb8244517d0
  languageName: node
  linkType: hard

@@ -696,13 +501,6 @@ __metadata:
  languageName: node
  linkType: hard

-"process-nextick-args@npm:~2.0.0":
-  version: 2.0.1
-  resolution: "process-nextick-args@npm:2.0.1"
-  checksum: 10c0/bec089239487833d46b59d80327a1605e1c5287eaad770a291add7f45fda1bb5e28b38e0e061add0a1d0ee0984788ce74fa394d345eed1c420cacf392c554367
-  languageName: node
-  linkType: hard
-
 "proxy-addr@npm:~2.0.7":
  version: 2.0.7
  resolution: "proxy-addr@npm:2.0.7"
@@ -741,28 +539,6 @@ __metadata:
  languageName: node
  linkType: hard

-"readable-stream@npm:^2.2.2":
-  version: 2.3.8
-  resolution: "readable-stream@npm:2.3.8"
-  dependencies:
-    core-util-is: "npm:~1.0.0"
-    inherits: "npm:~2.0.3"
-    isarray: "npm:~1.0.0"
-    process-nextick-args: "npm:~2.0.0"
-    safe-buffer: "npm:~5.1.1"
-    string_decoder: "npm:~1.1.1"
-    util-deprecate: "npm:~1.0.1"
-  checksum: 10c0/7efdb01f3853bc35ac62ea25493567bf588773213f5f4a79f9c365e1ad13bab845ac0dae7bc946270dc40c3929483228415e92a3fc600cc7e4548992f41ee3fa
-  languageName: node
-  linkType: hard
-
-"safe-buffer@npm:5.1.2, safe-buffer@npm:~5.1.0, safe-buffer@npm:~5.1.1":
-  version: 5.1.2
-  resolution: "safe-buffer@npm:5.1.2"
-  checksum: 10c0/780ba6b5d99cc9a40f7b951d47152297d0e260f0df01472a1b99d4889679a4b94a13d644f7dbc4f022572f09ae9005fa2fbb93bbbd83643316f365a3e9a45b21
-  languageName: node
-  linkType: hard
-
 "safe-buffer@npm:5.2.1":
  version: 5.2.1
  resolution: "safe-buffer@npm:5.2.1"
@@ -850,22 +626,6 @@ __metadata:
  languageName: node
  linkType: hard

-"streamsearch@npm:^1.1.0":
-  version: 1.1.0
-  resolution: "streamsearch@npm:1.1.0"
-  checksum: 10c0/fbd9aecc2621364384d157f7e59426f4bfd385e8b424b5aaa79c83a6f5a1c8fd2e4e3289e95de1eb3511cb96bb333d6281a9919fafce760e4edb35b2cd2facab
-  languageName: node
-  linkType: hard
-
-"string_decoder@npm:~1.1.1":
-  version: 1.1.1
-  resolution: "string_decoder@npm:1.1.1"
-  dependencies:
-    safe-buffer: "npm:~5.1.0"
-  checksum: 10c0/b4f89f3a92fd101b5653ca3c99550e07bdf9e13b35037e9e2a1c7b47cec4e55e06ff3fc468e314a0b5e80bfbaf65c1ca5a84978764884ae9413bec1fc6ca924e
-  languageName: node
-  linkType: hard
-
 "toidentifier@npm:1.0.1":
  version: 1.0.1
  resolution: "toidentifier@npm:1.0.1"
@@ -873,7 +633,7 @@ __metadata:
  languageName: node
  linkType: hard

-"type-is@npm:^1.6.4, type-is@npm:~1.6.18":
+"type-is@npm:~1.6.18":
  version: 1.6.18
  resolution: "type-is@npm:1.6.18"
  dependencies:
@@ -883,20 +643,6 @@ __metadata:
  languageName: node
  linkType: hard

-"typedarray@npm:^0.0.6":
-  version: 0.0.6
-  resolution: "typedarray@npm:0.0.6"
-  checksum: 10c0/6005cb31df50eef8b1f3c780eb71a17925f3038a100d82f9406ac2ad1de5eb59f8e6decbdc145b3a1f8e5836e17b0c0002fb698b9fe2516b8f9f9ff602d36412
-  languageName: node
-  linkType: hard
-
-"undici-types@npm:~5.26.4":
-  version: 5.26.5
-  resolution: "undici-types@npm:5.26.5"
-  checksum: 10c0/bb673d7876c2d411b6eb6c560e0c571eef4a01c1c19925175d16e3a30c4c428181fb8d7ae802a261f283e4166a0ac435e2f505743aa9e45d893f9a3df017b501
-  languageName: node
-  linkType: hard
-
 "unpipe@npm:1.0.0, unpipe@npm:~1.0.0":
  version: 1.0.0
  resolution: "unpipe@npm:1.0.0"
@@ -904,13 +650,6 @@ __metadata:
  languageName: node
  linkType: hard

-"util-deprecate@npm:~1.0.1":
-  version: 1.0.2
-  resolution: "util-deprecate@npm:1.0.2"
-  checksum: 10c0/41a5bdd214df2f6c3ecf8622745e4a366c4adced864bc3c833739791aeeeb1838119af7daed4ba36428114b5c67dcda034a79c882e97e43c03e66a4dd7389942
-  languageName: node
-  linkType: hard
-
 "utils-merge@npm:1.0.1":
  version: 1.0.1
  resolution: "utils-merge@npm:1.0.1"
@@ -925,9 +664,9 @@ __metadata:
  languageName: node
  linkType: hard

-"xtend@npm:^4.0.0":
-  version: 4.0.2
-  resolution: "xtend@npm:4.0.2"
-  checksum: 10c0/366ae4783eec6100f8a02dff02ac907bf29f9a00b82ac0264b4d8b832ead18306797e283cf19de776538babfdcb2101375ec5646b59f08c52128ac4ab812ed0e
+"wrappy@npm:1":
+  version: 1.0.2
+  resolution: "wrappy@npm:1.0.2"
+  checksum: 10c0/56fece1a4018c6a6c8e28fbc88c87e0fbf4ea8fd64fc6c63b18f4acc4bd13e0ad2515189786dd2c30d3eec9663d70f4ecf699330002f8ccb547e4a18231fc9f0
  languageName: node
  linkType: hard
--- a/src/command.cpp
+++ b/src/command.cpp
@@ -418,7 +418,7 @@ uint8_t Command::call(const uint8_t device_type, const char * command, const cha
        LOG_WARNING(error);
    } else {
        if (single_command) {
-            // log as DEBUG (TRACE) regarless if compiled with EMSESP_DEBUG
+            // log as DEBUG (TRACE) regardless if compiled with EMSESP_DEBUG
            logger_.debug(("%sCalled command %s"), ro.c_str(), info_s);
        } else {
            if (id > 0) {