Merge pull request #1245 from proddy/dev

Enhance version check to differentiate between ESP32 and ESP32-S3 bin versions #1240
emsesp · Aug 8, 2023 · 2698116 · 2698116
2 parents 6e653ee + e17f709
commit 2698116
Show file tree

Hide file tree

Showing 16 changed files with 716 additions and 1,473 deletions.
diff --git a/README.md b/README.md
@@ -21,7 +21,7 @@
 - Native support for Home Assistant, Domoticz and openHAB via [MQTT Discovery](https://www.home-assistant.io/docs/mqtt/discovery/)
 - Can run standalone as an independent WiFi Access Point or join an existing WiFi network
 - Easy first-time configuration via a web Captive Portal
-- Support for more than [110 EMS devices](https://emsesp.github.io/docs/#/Supported-EMS-Devices) (boilers, thermostats, solar modules, mixer modules, heat pumps, gateways, switches, heat sources)
+- Support for more than [110+ EMS devices](https://emsesp.github.io/docs/All-Devices/) (boilers, thermostats, solar modules, mixer modules, heat pumps, gateways, switches, heat sources)
 
 ## **Documentation**
 

diff --git a/interface/.typesafe-i18n.json b/interface/.typesafe-i18n.json
@@ -1,5 +1,5 @@
 {
-  "adapter": "react",
-  "baseLocale": "pl",
-  "$schema": "https://unpkg.com/typesafe-i18n@5.25.1/schema/typesafe-i18n.json"
-}
+   "adapter": "react",
+   "baseLocale": "pl",
+   "$schema": "https://unpkg.com/typesafe-i18n@5.26.0/schema/typesafe-i18n.json"
+}
diff --git a/interface/package.json b/interface/package.json
@@ -22,13 +22,14 @@
     "@alova/adapter-xhr": "^1.0.1",
     "@emotion/react": "^11.11.1",
     "@emotion/styled": "^11.11.0",
-    "@mui/icons-material": "^5.14.1",
-    "@mui/material": "^5.14.2",
+    "@mui/icons-material": "^5.14.3",
+    "@mui/material": "^5.14.3",
     "@preact/compat": "^17.1.2",
+    "@prefresh/vite": "^2.4.1",
     "@table-library/react-table-library": "4.1.4",
     "@types/lodash-es": "^4.17.8",
-    "@types/node": "^20.4.5",
-    "@types/react": "^18.2.17",
+    "@types/node": "^20.4.8",
+    "@types/react": "^18.2.18",
     "@types/react-dom": "^18.2.7",
     "@types/react-router-dom": "^5.3.3",
     "alova": "^2.9.3",
@@ -45,18 +46,19 @@
     "react-router-dom": "^6.14.2",
     "react-toastify": "^9.1.3",
     "sockette": "^2.0.6",
-    "typesafe-i18n": "^5.25.1",
+    "typesafe-i18n": "^5.26.0",
     "typescript": "^5.1.6"
   },
   "devDependencies": {
+    "@babel/core": "^7.22.10",
     "@preact/preset-vite": "^2.5.0",
-    "@typescript-eslint/eslint-plugin": "^6.2.0",
-    "@typescript-eslint/parser": "^6.2.0",
-    "cspell": "^6.31.2",
+    "@types/babel__core": "^7",
+    "@typescript-eslint/eslint-plugin": "^6.3.0",
+    "@typescript-eslint/parser": "^6.3.0",
     "eslint": "^8.46.0",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-airbnb-typescript": "^17.1.0",
-    "eslint-config-prettier": "^8.9.0",
+    "eslint-config-prettier": "^9.0.0",
     "eslint-import-resolver-typescript": "^3.5.5",
     "eslint-plugin-autofix": "^1.1.0",
     "eslint-plugin-import": "^2.28.0",
@@ -66,10 +68,10 @@
     "eslint-plugin-react-hooks": "^4.6.0",
     "nodemon": "^3.0.1",
     "npm-run-all": "^4.1.5",
-    "prettier": "^3.0.0",
+    "prettier": "^3.0.1",
     "rollup-plugin-visualizer": "^5.9.2",
     "terser": "^5.19.2",
-    "vite": "^4.4.7",
+    "vite": "^4.4.9",
     "vite-plugin-svgr": "^3.2.0",
     "vite-tsconfig-paths": "^4.2.0"
   },

diff --git a/interface/src/SignIn.tsx b/interface/src/SignIn.tsx
@@ -1,18 +1,18 @@
 import ForwardIcon from '@mui/icons-material/Forward';
-import { Box, Fab, Paper, Typography, Button } from '@mui/material';
+import { Box, Paper, Typography, MenuItem, TextField, Button } from '@mui/material';
 import { useRequest } from 'alova';
 import { useContext, useState } from 'react';
 import { toast } from 'react-toastify';
 import { FeaturesContext } from './contexts/features';
 import type { ValidateFieldsError } from 'async-validator';
 
 import type { Locales } from 'i18n/i18n-types';
-import type { FC } from 'react';
+import type { ChangeEventHandler, FC } from 'react';
 import type { SignInRequest } from 'types';
 import * as AuthenticationApi from 'api/authentication';
 import { PROJECT_NAME } from 'api/env';
 
-import { ValidatedTextField } from 'components';
+import { ValidatedPasswordField, ValidatedTextField } from 'components';
 import { AuthenticationContext } from 'contexts/authentication';
 
 import { ReactComponent as DEflag } from 'i18n/DE.svg';
@@ -82,7 +82,8 @@ const SignIn: FC = () => {
 
   const submitOnEnter = onEnterCallback(signIn);
 
-  const selectLocale = async (loc: Locales) => {
+  const onLocaleSelected: ChangeEventHandler<HTMLInputElement> = async ({ target }) => {
+    const loc = target.value as Locales;
     localStorage.setItem('lang', loc);
     await loadLocaleAsync(loc);
     setLocale(loc);
@@ -111,82 +112,79 @@ const SignIn: FC = () => {
       >
         <Typography variant="h4">{PROJECT_NAME}</Typography>
         <Typography variant="subtitle2">{features.version}</Typography>
-        <Box
-          mt={2}
-          mb={2}
-          sx={{
-            '& button, & a, & .MuiCard-root': {
-              mt: 1,
-              mx: 1
-            }
-          }}
-        >
-          <Button size="small" variant={locale === 'de' ? 'contained' : 'outlined'} onClick={() => selectLocale('de')}>
-            <DEflag style={{ width: 24 }} />
+
+        <TextField name="locale" variant="outlined" value={locale} onChange={onLocaleSelected} size="small" select>
+          <MenuItem key="de" value="de">
+            <DEflag style={{ width: 16, verticalAlign: 'middle' }} />
             &nbsp;DE
-          </Button>
-          <Button size="small" variant={locale === 'en' ? 'contained' : 'outlined'} onClick={() => selectLocale('en')}>
-            <GBflag style={{ width: 24 }} />
+          </MenuItem>
+          <MenuItem key="en" value="en">
+            <GBflag style={{ width: 16, verticalAlign: 'middle' }} />
             &nbsp;EN
-          </Button>
-          <Button size="small" variant={locale === 'fr' ? 'contained' : 'outlined'} onClick={() => selectLocale('fr')}>
-            <FRflag style={{ width: 24 }} />
+          </MenuItem>
+          <MenuItem key="fr" value="fr">
+            <FRflag style={{ width: 16, verticalAlign: 'middle' }} />
             &nbsp;FR
-          </Button>
-          <Button size="small" variant={locale === 'it' ? 'contained' : 'outlined'} onClick={() => selectLocale('it')}>
-            <ITflag style={{ width: 24 }} />
+          </MenuItem>
+          <MenuItem key="it" value="it">
+            <ITflag style={{ width: 16, verticalAlign: 'middle' }} />
             &nbsp;IT
-          </Button>
-          <Button size="small" variant={locale === 'nl' ? 'contained' : 'outlined'} onClick={() => selectLocale('nl')}>
-            <NLflag style={{ width: 24 }} />
+          </MenuItem>
+          <MenuItem key="nl" value="nl">
+            <NLflag style={{ width: 16, verticalAlign: 'middle' }} />
             &nbsp;NL
-          </Button>
-          <Button size="small" variant={locale === 'no' ? 'contained' : 'outlined'} onClick={() => selectLocale('no')}>
-            <NOflag style={{ width: 24 }} />
+          </MenuItem>
+          <MenuItem key="no" value="no">
+            <NOflag style={{ width: 16, verticalAlign: 'middle' }} />
             &nbsp;NO
-          </Button>
-          <Button size="small" variant={locale === 'pl' ? 'contained' : 'outlined'} onClick={() => selectLocale('pl')}>
-            <PLflag style={{ width: 24 }} />
+          </MenuItem>
+          <MenuItem key="pl" value="pl">
+            <PLflag style={{ width: 16, verticalAlign: 'middle' }} />
             &nbsp;PL
-          </Button>
-          <Button size="small" variant={locale === 'sv' ? 'contained' : 'outlined'} onClick={() => selectLocale('sv')}>
-            <SVflag style={{ width: 24 }} />
+          </MenuItem>
+          <MenuItem key="sv" value="sv">
+            <SVflag style={{ width: 16, verticalAlign: 'middle' }} />
             &nbsp;SV
-          </Button>
-          <Button size="small" variant={locale === 'tr' ? 'contained' : 'outlined'} onClick={() => selectLocale('tr')}>
-            <TRflag style={{ width: 24 }} />
+          </MenuItem>
+          <MenuItem key="tr" value="tr">
+            <TRflag style={{ width: 16, verticalAlign: 'middle' }} />
             &nbsp;TR
-          </Button>
+          </MenuItem>
+        </TextField>
+
+        <Box display="flex" flexDirection="column" alignItems="center">
+          <ValidatedTextField
+            fieldErrors={fieldErrors}
+            disabled={processing}
+            sx={{
+              width: 240
+            }}
+            name="username"
+            label={LL.USERNAME(0)}
+            value={signInRequest.username}
+            onChange={updateLoginRequestValue}
+            margin="normal"
+            variant="outlined"
+          />
+          <ValidatedPasswordField
+            fieldErrors={fieldErrors}
+            disabled={processing}
+            sx={{
+              width: 240
+            }}
+            name="password"
+            label={LL.PASSWORD()}
+            value={signInRequest.password}
+            onChange={updateLoginRequestValue}
+            onKeyDown={submitOnEnter}
+            variant="outlined"
+          />
         </Box>
 
-        <ValidatedTextField
-          fieldErrors={fieldErrors}
-          disabled={processing}
-          name="username"
-          label={LL.USERNAME(0)}
-          value={signInRequest.username}
-          onChange={updateLoginRequestValue}
-          margin="normal"
-          variant="outlined"
-          fullWidth
-        />
-        <ValidatedTextField
-          fieldErrors={fieldErrors}
-          disabled={processing}
-          type="password"
-          name="password"
-          label={LL.PASSWORD()}
-          value={signInRequest.password}
-          onChange={updateLoginRequestValue}
-          onKeyDown={submitOnEnter}
-          margin="normal"
-          variant="outlined"
-          fullWidth
-        />
-        <Fab variant="extended" color="primary" sx={{ mt: 2 }} onClick={validateAndSignIn} disabled={processing}>
+        <Button variant="contained" color="primary" sx={{ mt: 2 }} onClick={validateAndSignIn} disabled={processing}>
           <ForwardIcon sx={{ mr: 1 }} />
           {LL.SIGN_IN()}
-        </Fab>
+        </Button>
       </Paper>
     </Box>
   );

diff --git a/interface/src/api/endpoints.ts b/interface/src/api/endpoints.ts
@@ -54,7 +54,7 @@ export const alovaInstance = createAlova({
 });
 
 export const alovaInstanceGH = createAlova({
-  baseURL: 'https://api.github.com/repos/emsesp/EMS-ESP32',
+  baseURL: 'https://api.github.com/repos/emsesp/EMS-ESP32/releases',
   statesHook: ReactHook,
   requestAdapter: xhrRequestAdapter()
 });
diff --git a/interface/src/api/system.ts b/interface/src/api/system.ts
@@ -1,5 +1,5 @@
 import { alovaInstance, alovaInstanceGH } from './endpoints';
-import type { OTASettings, SystemStatus, LogSettings, Version } from 'types';
+import type { OTASettings, SystemStatus, LogSettings } from 'types';
 
 // SystemStatus - also used to ping in Restart monitor for pinging
 export const readSystemStatus = () => alovaInstance.Get<SystemStatus>('/rest/systemStatus');
@@ -20,24 +20,15 @@ export const fetchLog = () => alovaInstance.Post('/rest/fetchLog');
 
 // Get versions from github
 export const getStableVersion = () =>
-  alovaInstanceGH.Get<Version>('releases/latest', {
+  alovaInstanceGH.Get('latest', {
     transformData(response: any) {
-      return {
-        version: response.data.name,
-        url: response.data.assets[1].browser_download_url,
-        changelog: response.data.assets[0].browser_download_url
-      };
+      return response.data.name.substring(1);
     }
   });
-
 export const getDevVersion = () =>
-  alovaInstanceGH.Get<Version>('releases/tags/latest', {
+  alovaInstanceGH.Get('tags/latest', {
     transformData(response: any) {
-      return {
-        version: response.data.name.split(/\s+/).splice(-1),
-        url: response.data.assets[1].browser_download_url,
-        changelog: response.data.assets[0].browser_download_url
-      };
+      return response.data.name.split(/\s+/).splice(-1)[0].substring(1);
     }
   });