Merge pull request #2660 from MichaelDvP/dev

add dhw modetype #2659, complete SRC plus entities

.github/CODE_OF_CONDUCT.md

@@ -0,0 +1,132 @@
+
+# Contributor Covenant Code of Conduct
+
+## Our Pledge
+
+We as members, contributors, and leaders pledge to make participation in our
+community a harassment-free experience for everyone, regardless of age, body
+size, visible or invisible disability, ethnicity, sex characteristics, gender
+identity and expression, level of experience, education, socio-economic status,
+nationality, personal appearance, race, religion, or sexual identity
+and orientation.
+
+We pledge to act and interact in ways that contribute to an open, welcoming,
+diverse, inclusive, and healthy community.
+
+## Our Standards
+
+Examples of behavior that contributes to a positive environment for our
+community include:
+
+* Demonstrating empathy and kindness toward other people
+* Being respectful of differing opinions, viewpoints, and experiences
+* Giving and gracefully accepting constructive feedback
+* Accepting responsibility and apologizing to those affected by our mistakes,
+  and learning from the experience
+* Focusing on what is best not just for us as individuals, but for the
+  overall community
+
+Examples of unacceptable behavior include:
+
+* The use of sexualized language or imagery, and sexual attention or
+  advances of any kind
+* Trolling, insulting or derogatory comments, and personal or political attacks
+* Public or private harassment
+* Publishing others' private information, such as a physical or email
+  address, without their explicit permission
+* Other conduct which could reasonably be considered inappropriate in a
+  professional setting
+
+## Enforcement Responsibilities
+
+Community leaders are responsible for clarifying and enforcing our standards of
+acceptable behavior and will take appropriate and fair corrective action in
+response to any behavior that they deem inappropriate, threatening, offensive,
+or harmful.
+
+Community leaders have the right and responsibility to remove, edit, or reject
+comments, commits, code, wiki edits, issues, and other contributions that are
+not aligned to this Code of Conduct, and will communicate reasons for moderation
+decisions when appropriate.
+
+## Scope
+
+This Code of Conduct applies within all community spaces, and also applies when
+an individual is officially representing the community in public spaces.
+Examples of representing our community include using an official e-mail address,
+posting via an official social media account, or acting as an appointed
+representative at an online or offline event.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported to the community leaders responsible for enforcement.
+All complaints will be reviewed and investigated promptly and fairly.
+
+All community leaders are obligated to respect the privacy and security of the
+reporter of any incident.
+
+## Enforcement Guidelines
+
+Community leaders will follow these Community Impact Guidelines in determining
+the consequences for any action they deem in violation of this Code of Conduct:
+
+### 1. Correction
+
+**Community Impact**: Use of inappropriate language or other behavior deemed
+unprofessional or unwelcome in the community.
+
+**Consequence**: A private, written warning from community leaders, providing
+clarity around the nature of the violation and an explanation of why the
+behavior was inappropriate. A public apology may be requested.
+
+### 2. Warning
+
+**Community Impact**: A violation through a single incident or series
+of actions.
+
+**Consequence**: A warning with consequences for continued behavior. No
+interaction with the people involved, including unsolicited interaction with
+those enforcing the Code of Conduct, for a specified period of time. This
+includes avoiding interactions in community spaces as well as external channels
+like social media. Violating these terms may lead to a temporary or
+permanent ban.
+
+### 3. Temporary Ban
+
+**Community Impact**: A serious violation of community standards, including
+sustained inappropriate behavior.
+
+**Consequence**: A temporary ban from any sort of interaction or public
+communication with the community for a specified period of time. No public or
+private interaction with the people involved, including unsolicited interaction
+with those enforcing the Code of Conduct, is allowed during this period.
+Violating these terms may lead to a permanent ban.
+
+### 4. Permanent Ban
+
+**Community Impact**: Demonstrating a pattern of violation of community
+standards, including sustained inappropriate behavior,  harassment of an
+individual, or aggression toward or disparagement of classes of individuals.
+
+**Consequence**: A permanent ban from any sort of public interaction within
+the community.
+
+## Attribution
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage],
+version 2.0, available at
+[https://www.contributor-covenant.org/version/2/0/code_of_conduct.html][v2.0].
+
+Community Impact Guidelines were inspired by
+[Mozilla's code of conduct enforcement ladder][Mozilla CoC].
+
+For answers to common questions about this code of conduct, see the FAQ at
+[https://www.contributor-covenant.org/faq][FAQ]. Translations are available
+at [https://www.contributor-covenant.org/translations][translations].
+
+[homepage]: https://www.contributor-covenant.org
+[v2.0]: https://www.contributor-covenant.org/version/2/0/code_of_conduct.html
+[Mozilla CoC]: https://github.com/mozilla/diversity
+[FAQ]: https://www.contributor-covenant.org/faq
+[translations]: https://www.contributor-covenant.org/translations

.github/ISSUE_TEMPLATE/bug_report.md

@@ -1,32 +1,32 @@
 ---
-name: Problem Report
+name: Problem Report/Change Request
 about: Create a Report to help us improve
 ---
 
-<!-- Thanks for reporting a problem for this project. READ THIS FIRST:
+<!-- Thanks for reporting an issue for this project. READ THIS FIRST:
 
-Please DO NOT OPEN AN ISSUE if your EMS-ESP version is not the latest from the dev branch, please update your device before submitting your issue. Your problem might already be solved. The latest precompiled binaries of EMS-ESP can be downloaded from https://github.com/emsesp/EMS-ESP32/releases/tag/latest
+Please DO NOT OPEN AN ISSUE if your EMS-ESP version is not the latest from the dev branch, please update your device before submitting your issue. Your issue might already be solved. The latest precompiled binaries of EMS-ESP can be downloaded from https://github.com/emsesp/EMS-ESP32/releases/tag/latest
 
 Please take a few minutes to complete the requested information below.
 
 -->
 
-### PROBLEM DESCRIPTION
+### DESCRIPTION
 
-_A clear and concise description of what the problem is._
+_A clear and concise description of what the problem is or the change requested._
 
 ### REQUESTED INFORMATION
 
 _Make sure your have performed every step and checked the applicable boxes before submitting your issue. Thank you!_
 
-- [ ] Searched the problem in [issues](https://github.com/emsesp/EMS-ESP32/issues)
+- [ ] Searched the issue in [issues](https://github.com/emsesp/EMS-ESP32/issues)
-- [ ] Searched the problem in [discussions](https://github.com/emsesp/EMS-ESP32/discussions)
+- [ ] Searched the issue in [discussions](https://github.com/emsesp/EMS-ESP32/discussions)
-- [ ] Searched the problem in the [docs](https://emsesp.github.io/docs/Troubleshooting/)
+- [ ] Searched the issue in the [docs](https://docs.emsesp.org/Troubleshooting/)
-- [ ] Searched the problem in the [chat](https://discord.gg/3J3GgnzpyT)
+- [ ] Searched the issue in the [chat](https://discord.gg/3J3GgnzpyT)
-- [ ] Provide the output of http://ems-esp.local/api/system :
+- [ ] Provide the System information in the area below, taken from `http://<IP>/api/system`
 
-```lua
+```json
-  System information output here:
+  Paste System information here....
 
 
 ```
@@ -41,10 +41,10 @@ _A clear and concise description of what you expected to happen._
 
 ### SCREENSHOTS
 
-_If applicable, add screenshots to help explain your problem._
+_If applicable, add screenshots to help explain your issue._
 
 ### ADDITIONAL CONTEXT
 
-_Add any other context about the problem here._
+_Add any other context about the issue here._
 
-**(Please, remember to close the issue when the problem has been addressed)**
+**(Please remember to close the issue when it has been addressed)**

.github/ISSUE_TEMPLATE/config.yml

@@ -1,7 +1,7 @@
 blank_issues_enabled: false
 contact_links:
   - name: EMS-ESP Docs
-    url: https://emsesp.github.io/docs/
+    url: https://docs.emsesp.org
     about: All the information related to EMS-ESP.
   - name: EMS-ESP Discussions and Support
     url: https://github.com/emsesp/EMS-ESP32/discussions

.github/SUPPORT.md

@@ -0,0 +1 @@
+# Support

.github/workflows/dev_release.yml

@@ -0,0 +1,73 @@
+name: 'Build dev release'
+
+on:
+  workflow_dispatch:
+  push:
+    paths:
+      - 'src/emsesp_version.h'
+    branches:
+      - 'dev'
+
+permissions:
+  contents: write
+
+jobs:
+  pre-release:
+    name: 'Build Dev Release'
+    runs-on: ubuntu-latest
+    steps:
+        
+      - name: Install python 3.13
+        uses: actions/setup-python@v5
+        with:
+          python-version: '3.13'
+
+      - name: Install Node.js 22
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+
+      - name: Checkout repository
+        uses: actions/checkout@v4
+  
+      - name: Enable Corepack
+        run: corepack enable pnpm
+
+      - name: Get the EMS-ESP version
+        id: build_info
+        run: |
+          version=`grep -E '^#define EMSESP_APP_VERSION' ./src/emsesp_version.h | awk -F'"' '{print $2}'`
+          echo "VERSION=$version" >> $GITHUB_OUTPUT
+
+      - name: Install PlatformIO
+        run: |
+          python -m pip install --upgrade pip
+          pip install -U platformio
+          python -m pip install intelhex
+
+      - name: Build the WebUI
+        run: |
+          cd interface
+          pnpm install
+          pnpm typesafe-i18n --no-watch
+          sed -i "s/= 'pl'/= 'en'/" ./src/i18n/i18n-util.ts
+          pnpm build
+          pnpm webUI
+
+      - name: Build all PIO target environments
+        run: |
+          platformio run
+        env:
+          NO_BUILD_WEBUI: true
+
+      - name: Create GitHub Release
+        id: 'automatic_releases'
+        uses: emsesp/action-automatic-releases@v1.0.0
+        with:
+          repo_token: '${{ secrets.GITHUB_TOKEN }}'
+          title: Development Build v${{steps.build_info.outputs.VERSION}}
+          automatic_release_tag: 'latest'
+          prerelease: true
+          files: |
+            CHANGELOG_LATEST.md
+            ./build/firmware/*.*

.github/workflows/github-releases-to-discord.yml

@@ -0,0 +1,24 @@
+name: 'Publish releases to discord'
+
+on:
+  release:
+    types: [published]
+
+jobs:
+  github-releases-to-discord:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+        
+      - name: GitHub Releases To Discord
+        uses: SethCohen/github-releases-to-discord@v1.13.1
+        with:
+          webhook_url: ${{ secrets.WEBHOOK_URL }}
+          color: '2105893'
+          username: 'Release Changelog'
+          avatar_url: 'https://cdn.discordapp.com/icons/816637840644505620/0b14718532d855c452903851b4f0c9a2.png'
+          content: '||@everyone||'
+          footer_title: 'Changelog'
+          footer_icon_url: 'https://cdn.discordapp.com/icons/816637840644505620/0b14718532d855c452903851b4f0c9a2.png'
+          footer_timestamp: true

.github/workflows/pr_check.yml

@@ -0,0 +1,37 @@
+name: 'Pre-check on PR'
+
+on:
+  workflow_dispatch:
+  pull_request:
+    branches: dev
+    paths:
+     - '**.c'
+     - '**.cpp'
+     - '**.h'
+     - '**.hpp'
+     - '**.json'
+     - '**.py'
+     - '**.md'
+     - '.github/workflows/pr_check.yml'
+
+jobs:
+  pre-release:
+    name: 'Automatic pre-release build'
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      - name: Install python 3.11
+        uses: actions/setup-python@v5
+        with:
+          python-version: '3.11'
+
+      - name: Install PlatformIO
+        run: |
+          pip install wheel
+          pip install -U platformio
+
+      - name: Build native
+        run: |
+          platformio run -e native

.github/workflows/pre_release.yml

@@ -1,58 +0,0 @@
-name: 'pre-release'
-
-on:
-  workflow_dispatch:
-  push:
-    branches:
-      - 'dev'
-
-jobs:
-  pre-release:
-    name: 'Automatic pre-release build'
-    runs-on: ubuntu-latest
-
-    steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-python@v4
-      - uses: actions/setup-node@v3
-        with:
-          node-version: '18'
-
-      - name: Get EMS-ESP source code and version
-        id: build_info
-        run: |
-          version=`grep -E '^#define EMSESP_APP_VERSION' ./src/version.h | awk -F'"' '{print $2}'`
-          echo "VERSION=$version" >> $GITHUB_OUTPUT
-
-      - name: Install PlatformIO
-        run: |
-          python -m pip install --upgrade pip
-          pip install -U platformio
-
-      - name: Build WebUI
-        run: |
-          cd interface
-          yarn install
-          yarn run typesafe-i18n --no-watch
-          sed -i "s/= 'pl'/= 'en'/" ./src/i18n/i18n-util.ts
-          yarn run build
-
-      - name: Build firmware
-        run: |
-          platformio run -e ci
-
-      - name: Build S3 firmware
-        run: |
-          platformio run -e ci_s3
-
-      - name: Create a GH Release
-        id: 'automatic_releases'
-        uses: 'marvinpinto/action-automatic-releases@latest'
-        with:
-          repo_token: '${{ secrets.GITHUB_TOKEN }}'
-          title: Development Build v${{steps.build_info.outputs.VERSION}}
-          automatic_release_tag: 'latest'
-          prerelease: true
-          files: |
-            CHANGELOG_LATEST.md
-            ./build/firmware/*.*

.github/workflows/sonar_check.yml

@@ -1,30 +1,31 @@
+# see https://github.com/marketplace/actions/sonarcloud-scan-for-c-and-c#usage
 name: Sonar Check
+
 on:
   push:
     branches:
       - dev
-  pull_request:
+  # pull_request:
-    types: [opened, synchronize, reopened]
+  #   types: [opened, synchronize, reopened]
+
 jobs:
   build:
     name: Build and analyze
+    if: github.repository == 'emsesp/EMS-ESP32'
     runs-on: ubuntu-latest
-    # if: github.repository_owner == 'emsesp'
-    # if: github.repository == 'emsesp/EMS-ESP32'
     env:
-      BUILD_WRAPPER_OUT_DIR: build_wrapper_output_directory
+      BUILD_WRAPPER_OUT_DIR: bw-output
     steps:
-      - uses: actions/checkout@v3
+      - name: Checkout repository
+        uses: actions/checkout@v4
         with:
-          fetch-depth: 0 # Shallow clones should be disabled for a better relevancy of analysis
+          fetch-depth: 0
-      - name: Install sonar-scanner and build-wrapper
+      - name: Install Build Wrapper
-        uses: SonarSource/sonarcloud-github-c-cpp@v2
+        uses: SonarSource/sonarqube-scan-action/install-build-wrapper@master
-      - name: Run build-wrapper
+      - name: Run Build Wrapper
-        run: |
+        run: build-wrapper-linux-x86-64 --out-dir ${{ env.BUILD_WRAPPER_OUT_DIR }} make all
-          build-wrapper-linux-x86-64 --out-dir ${{ env.BUILD_WRAPPER_OUT_DIR }} make all
+      - name: SonarQube Scan
-      - name: Run sonar-scanner
+        uses: SonarSource/sonarqube-scan-action@master
         env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
-        run: |
+            
-          sonar-scanner --define sonar.cfamily.build-wrapper-output="${{ env.BUILD_WRAPPER_OUT_DIR }}"

.github/workflows/stable_release.yml

@@ -0,0 +1,62 @@
+name: 'Build stable release'
+
+permissions:
+  contents: write
+
+on:
+  workflow_dispatch:
+  push:
+    tags:
+      - 'v*'
+
+jobs:
+  tagged-release:
+    name: 'Build Stable Release'
+    runs-on: ubuntu-latest
+    steps:
+
+      - name: Install python 3.13
+        uses: actions/setup-python@v5
+        with:
+          python-version: '3.13'
+
+      - name: Install Node.js 22
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+
+      - name: Checkout repository
+        uses: actions/checkout@v4
+  
+      - name: Enable Corepack
+        run: corepack enable pnpm
+
+      - name: Install PlatformIO
+        run: |
+          python -m pip install --upgrade pip
+          pip install -U platformio
+          python -m pip install intelhex
+
+      - name: Build the WebUI
+        run: |
+          cd interface
+          pnpm install
+          pnpm typesafe-i18n --no-watch
+          sed -i "s/= 'pl'/= 'en'/" ./src/i18n/i18n-util.ts
+          pnpm build
+          pnpm webUI
+
+      - name: Build all PIO target environments
+        run: |
+          platformio run
+        env:
+          NO_BUILD_WEBUI: true
+
+      - name: Create GitHub Release
+        uses: emsesp/action-automatic-releases@v1.0.0
+        with:
+          repo_token: '${{ secrets.GITHUB_TOKEN }}'
+          prerelease: false
+          files: |
+            CHANGELOG.md
+            ./build/firmware/*.*

.github/workflows/stale_issues.yml

@@ -0,0 +1,23 @@
+name: "Mark or close stale issues and PRs"
+ 
+on:
+  schedule:
+    - cron: "30 1 * * *"
+
+jobs:
+  stale:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/stale@v9
+        with:
+          repo-token: ${{ secrets.GITHUB_TOKEN }}
+          days-before-stale: 30
+          days-before-close: 5
+          stale-issue-message: "This issue is stale because it has been open 30 days with no activity. Remove stale label or comment otherwise this will be closed in 5 days."
+          stale-pr-message: "This PR has been automatically marked as stale because there has been no activity in last 30 days. It will be closed if no further activity occurs. Thank you for your contributions."
+          close-issue-message: "This issue was closed because it has been stalled for 5 days with no activity."
+          close-pr-message: "This PR was automatically closed because of being stale."
+          stale-pr-label: "stale"
+          stale-issue-label: "stale"
+          exempt-issue-labels: "bug,enhancement,pinned,security"
+          exempt-pr-labels: "bug,enhancement,pinned,security"

.github/workflows/tagged_release.yml

@@ -1,46 +0,0 @@
-name: 'tagged-release'
-
-on:
-  push:
-    tags:
-      - 'v*'
-
-jobs:
-  tagged-release:
-    name: 'Tagged Release'
-    runs-on: ubuntu-latest
-
-    steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-python@v4
-      - uses: actions/setup-node@v3
-        with:
-          node-version: '18'
-
-      - name: Install PlatformIO
-        run: |
-          python -m pip install --upgrade pip
-          pip install -U platformio
-          platformio upgrade
-          pio pkg update
-
-      - name: Build WebUI
-        run: |
-          cd interface
-          yarn install
-          yarn run typesafe-i18n --no-watch
-          sed -i "s/= 'pl'/= 'en'/" ./src/i18n/i18n-util.ts
-          yarn run build
-
-      - name: Build firmware
-        run: |
-          platformio run -e ci
-
-      - name: Release
-        uses: 'marvinpinto/action-automatic-releases@latest'
-        with:
-          repo_token: '${{ secrets.GITHUB_TOKEN }}'
-          prerelease: false
-          files: |
-            CHANGELOG.md
-            ./build/firmware/*.*

.github/workflows/test_release.yml

@@ -1,4 +1,4 @@
-name: 'test-release'
+name: 'Build test release'
 
 on:
   workflow_dispatch:
@@ -6,48 +6,63 @@ on:
     branches:
       - 'dev2'
 
+permissions:
+  contents: read
+
 jobs:
   pre-release:
-    name: 'Automatic test-release build'
+    name: 'Build Test Release'
     runs-on: ubuntu-latest
-
+    permissions:
+      contents: write
     steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-python@v4
-      - uses: actions/setup-node@v3
-        with:
-          node-version: '18'
 
-      - name: Get EMS-ESP source code and version
+      - name: Install python 3.13
+        uses: actions/setup-python@v5
+        with:
+          python-version: '3.13'
+
+      - name: Install Node.js 22
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      - name: Enable Corepack
+        run: corepack enable pnpm
+
+      - name: Get the EMS-ESP version
         id: build_info
         run: |
-          version=`grep -E '^#define EMSESP_APP_VERSION' ./src/version.h | awk -F'"' '{print $2}'`
+          version=`grep -E '^#define EMSESP_APP_VERSION' ./src/emsesp_version.h | awk -F'"' '{print $2}'`
           echo "VERSION=$version" >> $GITHUB_OUTPUT
 
       - name: Install PlatformIO
         run: |
           python -m pip install --upgrade pip
           pip install -U platformio
+          python -m pip install intelhex
 
-      - name: Build WebUI
+      - name: Build the WebUI
         run: |
           cd interface
-          yarn install
+          pnpm install
-          yarn run typesafe-i18n --no-watch
+          pnpm typesafe-i18n --no-watch
           sed -i "s/= 'pl'/= 'en'/" ./src/i18n/i18n-util.ts
-          yarn run build
+          pnpm build
+          pnpm webUI
 
-      - name: Build firmware
+      - name: Build all target environments
         run: |
-          platformio run -e ci
+          platformio run
+        env:
+          NO_BUILD_WEBUI: true
 
-      - name: Build S3 firmware
+      - name: Create GitHub Release
-        run: |
-          platformio run -e ci_s3
-
-      - name: Create a GH Release
         id: 'automatic_releases'
-        uses: 'marvinpinto/action-automatic-releases@latest'
+        uses: emsesp/action-automatic-releases@v1.0.0
         with:
           repo_token: '${{ secrets.GITHUB_TOKEN }}'
           title: Test Build v${{steps.build_info.outputs.VERSION}}
@@ -56,3 +71,4 @@ jobs:
           files: |
             CHANGELOG_LATEST.md
             ./build/firmware/*.*
+            

.gitignore

@@ -2,7 +2,7 @@
 .vscode/c_cpp_properties.json
 .vscode/extensions.json
 .vscode/launch.json
-# .vscode/settings.json
+.vscode/settings.json
 
 # c++ compiling
 .clang_complete
@@ -16,13 +16,11 @@ pio_local.ini
 # OS specific
 .DS_Store
 *Thumbs.db
-emsesp
 
-# web specfic
+# web specific
 build/
 dist/
 /data/www
-/lib/framework/WWWData.h
 /interface/build
 node_modules
 /interface/.eslintcache
@@ -30,18 +28,10 @@ stats.html
 *.sln
 *.sw?
 .pnp.*
-.yarn/*
+analyse.html
-!.yarn/patches
+interface/vite.config.ts.timestamp*
-!.yarn/plugins
+*.local
-!.yarn/releases
+src/ESP32React/WWWData.h
-!.yarn/sdks
-!.yarn/versions
-
-# scripts
-test.sh
-scripts/run.sh
-scripts/__pycache__
-/scripts/stackdmp.txt
 
 # i18n generated files
 interface/src/i18n/i18n-react.tsx
@@ -50,11 +40,35 @@ interface/src/i18n/i18n-util.ts
 interface/src/i18n/i18n-util.sync.ts
 interface/src/i18n/i18n-util.async.ts
 
+# scripts
+test.sh
+scripts/run.sh
+scripts/__pycache__
+scripts/stackdmp.txt
+
 # sonar
 .scannerwork/
 sonar/
-build_wrapper_output_directory/
+bw-output/
 
-# entity dump results
+# standalone executable for testing
-# dump_entities.csv
+emsesp
-# dump_entities.xls*
+interface/tsconfig.tsbuildinfo
+
+# python virtual environment
+venv/
+
+# cspell
+words-found-verbose.txt
+
+# sonarlint
+compile_commands.json
+
+# pioarduino + hybrid
+managed_components
+dependencies.lock
+CMakeLists.txt
+.dummy/*
+logs/*
+sdkconfig.*
+sdkconfig_tasmota_esp32

.markdownlint.json

@@ -0,0 +1,6 @@
+{
+    "MD033": false,
+    "MD013": false,
+    "MD045": false,
+    "MD041": false
+}

.prettierignore

@@ -0,0 +1,6 @@
+*/node_modules/
+build/
+dist/*
+interface/src/i18n/*
+
+.typesafe-i18n.json

.prettierrc

@@ -1,8 +1,13 @@
 {
+  "plugins": ["@trivago/prettier-plugin-sort-imports"],
   "trailingComma": "none",
   "tabWidth": 2,
   "semi": true,
   "singleQuote": true,
-  "printWidth": 120,
+  "printWidth": 85,
-  "bracketSpacing": true
+  "bracketSpacing": true,
-}
+  "importOrder": ["^react", "^@mui/(.*)$", "^api*/(.*)$", "<THIRD_PARTY_MODULES>", "^[./]"],
+  "importOrderSeparation": true,
+  "importOrderSortSpecifiers": true,
+  "importOrderGroupNamespaceSpecifiers": true
+} 

.sonarlint/connectedMode.json

@@ -0,0 +1,4 @@
+{
+    "sonarCloudOrganization": "emsesp",
+    "projectKey": "emsesp_EMS-ESP32"
+}

.vscode/extensions.json

@@ -1,13 +0,0 @@
-{
-    // See http://go.microsoft.com/fwlink/?LinkId=827846
-    // for the documentation about the extensions.json format
-    "recommendations": [
-        "arcanis.vscode-zipfs",
-        "dbaeumer.vscode-eslint",
-        "esbenp.prettier-vscode",
-        "platformio.platformio-ide"
-    ],
-    "unwantedRecommendations": [
-        "ms-vscode.cpptools-extension-pack"
-    ]
-}

.vscode/settings.json

@@ -1,45 +1,101 @@
 {
-  "search.exclude": {
+    "search.exclude": {
-    "**/.yarn": true,
+      "**/.yarn": true,
-    "**/.pnp.*": true
+      "**/.pnp.*": true
-  },
+    },
-  "editor.codeActionsOnSave": {
+    "editor.codeActionsOnSave": {
-    "source.fixAll": true
+      "source.fixAll": "explicit"
-    // "source.organizeImports": true
+    },
-  },
+    "eslint.validate": [
-  "eslint.nodePath": "interface/.yarn/sdks",
+      "typescript"
-  "eslint.workingDirectories": ["interface"],
+    ],
-  "prettier.prettierPath": "",
+    "eslint.codeActionsOnSave.rules": null,
-  "typescript.tsdk": "interface/.yarn/sdks/typescript/lib",
+    "eslint.nodePath": "interface/.yarn/sdks",
-  "typescript.enablePromptUseWorkspaceTsdk": true,
+    "eslint.workingDirectories": ["interface"],
-  "files.associations": {
+    "prettier.prettierPath": "",
-    "*.tsx": "typescriptreact",
+    "typescript.enablePromptUseWorkspaceTsdk": true,
-    "*.tcc": "cpp",
+    "files.associations": {
-    "optional": "cpp",
+      "*.tsx": "typescriptreact",
-    "istream": "cpp",
+      "*.tcc": "cpp",
-    "ostream": "cpp",
+      "optional": "cpp",
-    "ratio": "cpp",
+      "istream": "cpp",
-    "system_error": "cpp",
+      "ostream": "cpp",
-    "array": "cpp",
+      "ratio": "cpp",
-    "functional": "cpp",
+      "system_error": "cpp",
-    "regex": "cpp",
+      "array": "cpp",
-    "tuple": "cpp",
+      "functional": "cpp",
-    "type_traits": "cpp",
+      "regex": "cpp",
-    "utility": "cpp",
+      "tuple": "cpp",
-    "string": "cpp",
+      "type_traits": "cpp",
-    "string_view": "cpp"
+      "utility": "cpp",
-  },
+      "string": "cpp",
-  "todo-tree.filtering.excludeGlobs": [
+      "string_view": "cpp",
-    "**/vendor/**",
+      "atomic": "cpp",
-    "**/node_modules/**",
+      "bitset": "cpp",
-    "**/dist/**",
+      "cctype": "cpp",
-    "**/bower_components/**",
+      "chrono": "cpp",
-    "**/build/**",
+      "clocale": "cpp",
-    "**/.vscode/**",
+      "cmath": "cpp",
-    "**/.github/**",
+      "condition_variable": "cpp",
-    "**/_output/**",
+      "cstdarg": "cpp",
-    "**/*.min.*",
+      "cstddef": "cpp",
-    "**/*.map",
+      "cstdint": "cpp",
-    "**/ArduinoJson/**"
+      "cstdio": "cpp",
-  ]
+      "cstdlib": "cpp",
-}
+      "cstring": "cpp",
+      "ctime": "cpp",
+      "cwchar": "cpp",
+      "cwctype": "cpp",
+      "deque": "cpp",
+      "list": "cpp",
+      "unordered_map": "cpp",
+      "unordered_set": "cpp",
+      "vector": "cpp",
+      "exception": "cpp",
+      "algorithm": "cpp",
+      "iterator": "cpp",
+      "map": "cpp",
+      "memory": "cpp",
+      "memory_resource": "cpp",
+      "numeric": "cpp",
+      "random": "cpp",
+      "set": "cpp",
+      "fstream": "cpp",
+      "initializer_list": "cpp",
+      "iomanip": "cpp",
+      "iosfwd": "cpp",
+      "iostream": "cpp",
+      "limits": "cpp",
+      "mutex": "cpp",
+      "new": "cpp",
+      "sstream": "cpp",
+      "stdexcept": "cpp",
+      "streambuf": "cpp",
+      "thread": "cpp",
+      "cinttypes": "cpp",
+      "typeinfo": "cpp"
+    },
+    "todo-tree.filtering.excludeGlobs": [
+      "**/vendor/**",
+      "**/node_modules/**",
+      "**/dist/**",
+      "**/bower_components/**",
+      "**/build/**",
+      "**/.vscode/**",
+      "**/.github/**",
+      "**/_output/**",
+      "**/*.min.*",
+      "**/*.map",
+      "**/ArduinoJson/**"
+    ],
+    "cSpell.enableFiletypes": [
+      "ini",
+      "makefile"
+    ],
+    "typescript.preferences.preferTypeOnlyAutoImports": true,
+    "sonarlint.pathToCompileCommands": "${workspaceFolder}/compile_commands.json",
+    "sonarlint.connectedMode.project": {
+      "connectionId": "emsesp",
+      "projectKey": "emsesp_EMS-ESP32"
+    }
+  }

.vscode/tasks.json

@@ -1,18 +0,0 @@
-{
-  // See https://go.microsoft.com/fwlink/?LinkId=733558
-  // for the documentation about the tasks.json format
-  "version": "2.0.0",
-  "tasks": [
-    {
-      "type": "shell",
-      "label": "build standalone emsesp",
-      "command": "make",
-      "args": [],
-      "problemMatcher": ["$gcc"],
-      "group": {
-        "kind": "build",
-        "isDefault": true
-      }
-    }
-  ]
-}

CHANGELOG.md

@@ -5,6 +5,365 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [3.7.2] 22 March 2025
+
+## Added
+
+- change enum_heatingtype for remote control [#2268](https://github.com/emsesp/EMS-ESP32/issues/2268)
+- system service commands [#2182](https://github.com/emsesp/EMS-ESP32/issues/2182)
+- read 0x02A5 for thermostat CT200 [#2277](https://github.com/emsesp/EMS-ESP32/issues/2277)
+- add "duplicate" option to Custom Entities [#2266](https://github.com/emsesp/EMS-ESP32/discussion/2266)
+- mask bits for bool custom entities
+- thermostat `reduce threshold` [#2288](https://github.com/emsesp/EMS-ESP32/issues/2288)
+- thermostat `absent` [#1957](https://github.com/emsesp/EMS-ESP32/issues/1957)
+- CR11 thermostat [#2295](https://github.com/emsesp/EMS-ESP32/issues/2295)
+- Show ESP32's CPU temp in Hardware Status
+- vacation mode for the CR50 [#2403](https://github.com/emsesp/EMS-ESP32/issues/2403)
+- new Console command "set admin password" to set WebUI admin password
+- support nested conditions in scheduler [#2451](https://github.com/emsesp/EMS-ESP32/issues/2451)
+- allow mixed case in scheduler expressions [#2457](https://github.com/emsesp/EMS-ESP32/issues/2457)
+- Suprapur-o [#2470](https://github.com/emsesp/EMS-ESP32/issues/2470)
+
+## Fixed
+
+- long numbers of custom entities [#2267](https://github.com/emsesp/EMS-ESP32/issues/2267)
+- modbus command path to `api/` [#2276](https://github.com/emsesp/EMS-ESP32/issues/2276)
+- info command for devices without entity-commands [#2274](https://github.com/emsesp/EMS-ESP32/issues/2274)
+- CW100 settings telegram 0x241 [#2290](https://github.com/emsesp/EMS-ESP32/issues/2290)
+- modbus signed 8bit values [#2294](https://github.com/emsesp/EMS-ESP32/issues/2294)
+- thermostat date [#2313](https://github.com/emsesp/EMS-ESP32/issues/2313)
+- Updated unknown compressor stati "enum_hpactivity" [#2311](https://github.com/emsesp/EMS-ESP32/pull/2311)
+- Underline Tab headers in WebUI
+- console unit tests fixed due to changed shell output
+- tx-queue overflow in some heatpump systems [#2455](https://github.com/emsesp/EMS-ESP32/issues/2455)
+
+## Changed
+
+- show operation in pretty telegram between src and dst [#2263](https://github.com/emsesp/EMS-ESP32/discussions/2263)
+- update eModbus to 1.7.2 [#2254](https://github.com/emsesp/EMS-ESP32/issues/2254)
+- modbus timeout default to 300 sec, change setting from ms to sec [#2254](https://github.com/emsesp/EMS-ESP32/issues/2254)
+- update AsyncTCP and ESPAsyncWebServer to latest versions
+- update Arduino pio platform to 3.10.0 and optimized flash using build flags
+- Version checker in WebUI improved
+- rename `remoteseltemp` to `cooltemp` [#2456](https://github.com/emsesp/EMS-ESP32/issues/2456)
+
+## [3.7.1] 29 November 2024
+
+## Added
+
+- include HA "unit_of_meas", "stat_cla" and "dev_cla" attributes for Number sensors [#2149](https://github.com/emsesp/EMS-ESP32/issues/2149)
+- Bosch CS6800i AW - Silent Mode + Electrical Power Reduction (HP) [#2147](https://github.com/emsesp/EMS-ESP32/issues/2147)
+- `/api/system/showeralert` and `/api/system/showertimer` [#2182](https://github.com/emsesp/EMS-ESP32/issues/2182)
+- MX400 [#2198](https://github.com/emsesp/EMS-ESP32/issues/2198)
+- SM200 values [#2212](https://github.com/emsesp/EMS-ESP32/discussions/2212)
+
+## Fixed
+
+- Modbus integration in 3.7.0 missing offset [#2148](https://github.com/emsesp/EMS-ESP32/issues/2148)
+- fix changing TZ in NTPsettings without clearing enable+server, added DST support [#2142](https://github.com/emsesp/EMS-ESP32/issues/2142)
+- Support MQTT Discovery (AD) with Domoticz [#2177](https://github.com/emsesp/EMS-ESP32/issues/2177)
+- wwExtra (dhw extra) changed from temperature reading to number
+- auxheaterstatus [#2192](https://github.com/emsesp/EMS-ESP32/issues/2192)
+- lastCode character check [#2189](https://github.com/emsesp/EMS-ESP32/issues/2189)
+- reading too many telegram parts
+- heatpump cost UOMs [#2188](https://github.com/emsesp/EMS-ESP32/issues/2188)
+- analog dac output and inputs on dac pins [#2201](https://github.com/emsesp/EMS-ESP32/discussions/2201)
+- api memory leak [#2216](https://github.com/emsesp/EMS-ESP32/issues/2216)
+- modbus multiple mixers [#2229](https://github.com/emsesp/EMS-ESP32/issues/2229)
+- Last Will (LWT) not set on MQTT Connect [#2247](https://github.com/emsesp/EMS-ESP32/issues/2247)
+
+## Changed
+
+- name of wwstarts2 [#2217](https://github.com/emsesp/EMS-ESP32/discussions/2217)
+
+## [3.7.0] 27 October 2024
+
+## **IMPORTANT! BREAKING CHANGES with 3.6.5**
+
+- "ww" and "wwc" has been renamed to "dhw". It is nested JSON object in both the MQTT and API outputs. The old prefix has also been removed from MQTT topics ([#1634](https://github.com/emsesp/EMS-ESP32/issues/1634)). This will impact historical data in home automation systems like Home Assistant and IOBroker. To preserve the current value of dhw energy (was previously nrgww) refer to this issue [#1938](https://github.com/emsesp/EMS-ESP32/issues/1938).
+- dhw entities from the MM100/SM100 have been moved under a new Device called 'water'.
+- The automatically generated temperature sensor ID has replaced dashes (`-`) with underscores (`_`) to be compatible with Home Assistant.
+- `api/system/info` has it's JSON key names changed to camelCase syntax.
+
+For more details go to [docs.emsesp.org](https://docs.emsesp.org/).
+
+## Added
+
+- some more entities for dhw with SM100 module
+- thermostat second dhw circuit [#1634](https://github.com/emsesp/EMS-ESP32/issues/1634)
+- remote thermostat emulation for RC100H, RC200 and FB10 [#1287](https://github.com/emsesp/EMS-ESP32/discussions/1287), [#1602](https://github.com/emsesp/EMS-ESP32/discussions/1602), [#1551](https://github.com/emsesp/EMS-ESP32/discussions/1551)
+- heatpump dhw stop temperatures [#1624](https://github.com/emsesp/EMS-ESP32/issues/1624)
+- reset history [#1695](https://github.com/emsesp/EMS-ESP32/issues/1695)
+- heatpump entities `fan` and `shutdown` [#1690](https://github.com/emsesp/EMS-ESP32/discussions/1690)
+- mqtt HA-mode 3 for v3.6 compatible HA entities, set on update v3.6->v3.7
+- HP input states [#1723](https://github.com/emsesp/EMS-ESP32/discussions/1723)
+- holiday settings for rego 3000  [#1735](https://github.com/emsesp/EMS-ESP32/issues/1735)
+- Added scripts for OTA (scripts/upload.py and upload_cli.py) [#1738](https://github.com/emsesp/EMS-ESP32/issues/1738)
+- timeout for remote thermostat emulation [#1680](https://github.com/emsesp/EMS-ESP32/discussions/1680), [#1774](https://github.com/emsesp/EMS-ESP32/issues/1774)
+- CR120 thermostat as own model() [#1779](https://github.com/emsesp/EMS-ESP32/discussions/1779)
+- modules - external linkable module library [#1778](https://github.com/emsesp/EMS-ESP32/issues/1778)
+- scheduler onChange and Conditions [#1806](https://github.com/emsesp/EMS-ESP32/issues/1806)
+- make remote control timeout editable [#1774](https://github.com/emsesp/EMS-ESP32/issues/1774)
+- added extra pump characteristics (mode and pressure for EMS+) by @SLTKA [#1802](https://github.com/emsesp/EMS-ESP32/pull/1802)
+- allow device name to be customized [#1174](https://github.com/emsesp/EMS-ESP32/issues/1174)
+- Modbus support by @mheyse [#1744](https://github.com/emsesp/EMS-ESP32/issues/1744)
+- System Message command [#1854](https://github.com/emsesp/EMS-ESP32/issues/1854)
+- scheduler can use web get/post for values and commands [#1806](https://github.com/emsesp/EMS-ESP32/issues/1806)
+- RT800 remote emulation [#1867](https://github.com/emsesp/EMS-ESP32/issues/1867)
+- RC310 cooling parameters [#1857](https://github.com/emsesp/EMS-ESP32/issues/1857)
+- command `api/device/entities` [#1897](https://github.com/emsesp/EMS-ESP32/issues/1897)
+- switchprogmode [#1903](https://github.com/emsesp/EMS-ESP32/discussions/1903)
+- autodetect and download firmware upgrades via the WebUI
+- command 'show log' that lists out the current weblog buffer, showing last messages.
+- default web log buffer to 25 lines for ESP32s with no PSRAM
+- try and determine correct board profile if none is set during boot
+- auto Scroll in WebLog UI - reduced delay so incoming logs are faster
+- uploading custom support info, shown to Guest users in Help page [#2054](https://github.com/emsesp/EMS-ESP32/issues/2054)
+- feature: Dashboard showing all data (favorites, sensors, custom) [#1958](https://github.com/emsesp/EMS-ESP32/issues/1958)
+- entity for low-temperature boilers pump start temp (pumpOnTemp) #2088 [#2088](https://github.com/emsesp/EMS-ESP32/issues/2088)
+- internal ESP32 temperature sensor on the S3 [#2077](https://github.com/emsesp/EMS-ESP32/issues/2077)
+- MQTT status topic (used in connect and last will) set to Retain [#2086](https://github.com/emsesp/EMS-ESP32/discussions/2086)
+- Czech language [2096](https://github.com/emsesp/EMS-ESP32/issues/2096)
+- Developer Mode and send EMS Read Commands from WebUI [#2116](https://github.com/emsesp/EMS-ESP32/issues/2116)
+- Scheduler functions [#2115](https://github.com/emsesp/EMS-ESP32/issues/2115)
+- Set device custom name from telegram 0x01 [#2073](https://github.com/emsesp/EMS-ESP32/issues/2073)
+
+## Fixed
+
+- remote thermostat emulation for RC200 on Rego2000/3000 thermostats [#1691](https://github.com/emsesp/EMS-ESP32/discussions/1691)
+- log shows data for F7/F9 requests
+- Detection of LittleFS for factory setting wasn't working
+- Check for bad GPIOs with Ethernet before the ethernet is initialized
+- Show values with factor 50 on webUI [#2064](https://github.com/emsesp/EMS-ESP32/issues/2064)
+- Rendering of values between -1 and 0
+- Value for 32bit times not-set [#2109](https://github.com/emsesp/EMS-ESP32/issues/2109)
+
+## Changed
+
+- use flag for BC400 compatible thermostats, manage different mode settings
+- use factory partition for 16M flash
+- store digital out states to nvs
+- Refresh UI - moving settings to one location [#1665](https://github.com/emsesp/EMS-ESP32/issues/1665)
+- rename DeviceValueTypes, add UINT32 for custom entities
+- dynamic register dhw circuits for thermostat
+- removed OTA feature [#1738](https://github.com/emsesp/EMS-ESP32/issues/1738)
+- added shower min duration [#1801](https://github.com/emsesp/EMS-ESP32/issues/1801)
+- Include TXT file along with the generated CSV for Device Data export/download
+- thermostat/remotetemp as command [#1835](https://github.com/emsesp/EMS-ESP32/discussions/1835)
+- temperaturesensor id notation with underscore [#1794](https://github.com/emsesp/EMS-ESP32/discussions/1794)
+- Change key-names in JSON to be compliant and consistent [#1860](https://github.com/emsesp/EMS-ESP32/issues/1860)
+- Updates to webUI [#1920](https://github.com/emsesp/EMS-ESP32/issues/1920)
+- Correct firmware naming #1933 [#1933](https://github.com/emsesp/EMS-ESP32/issues/1933)
+- Don't start Serial console if not connected to a Serial port. Will initiate manually after a CTRL-C/CTRL-S  
+- WebLog UI matches color schema of the terminal console correctly
+- Updated Web libraries, ArduinoJson
+- Help page doesn't show detailed tech info if the user is not 'admin' role [#2054](https://github.com/emsesp/EMS-ESP32/issues/2054)
+- removed system command `allvalues` and moved to an action called `export`
+- Show ems-esp internal devices in device list of system/info
+- Scheduler and mqtt run async on systems with psram
+- Show IPv6 address type (local/global/ula) in log
+
+## [3.6.5] March 23 2024
+
+## **IMPORTANT! BREAKING CHANGES**
+
+- The Wifi Tx Power setting in Network Settings will be reset to Auto
+
+## Added
+
+- thermostat boost mode and boost time [#1446](https://github.com/emsesp/EMS-ESP32/issues/1446)
+- heatpump energy meters [#1463](https://github.com/emsesp/EMS-ESP32/issues/1463)
+- heatpump max power [#1475](https://github.com/emsesp/EMS-ESP32/issues/1475)
+- checkbox for MQTT-TLS enable [#1474](https://github.com/emsesp/EMS-ESP32/issues/1474)
+- added SK (Slovak) language. Thanks @misa1515
+- CPU info [#1497](https://github.com/emsesp/EMS-ESP32/pull/1497)
+- Show network hostname in Web UI under Network Status
+- Improved HA Discovery so each section (EMS device, Scheduler, Analog, Temperature, Custom, Shower) have their own section
+- boiler Bosch C1200W, id 12, [#1536](https://github.com/emsesp/EMS-ESP32/issues/1536)
+- mixer MM100 telegram 0x2CC [#1554](https://github.com/emsesp/EMS-ESP32/issues/1554)
+- boiler hpSetDiffPressure [#1563](https://github.com/emsesp/EMS-ESP32/issues/1563)
+- custom variables [#1423](https://github.com/emsesp/EMS-ESP32/issues/1423)
+- weather compensation [#1642](https://github.com/emsesp/EMS-ESP32/issues/1642)
+- env and partitions for DevKitC-1-N32R8 [#1635](https://github.com/emsesp/EMS-ESP32/discussions/1635)
+- command `restart partitionname` and button long press to start with other partition [#1657](https://github.com/emsesp/EMS-ESP32/issues/1657)
+- command `set service  <mqtt|ota|ntp|ap> <enable|disable>` [#1663](https://github.com/emsesp/EMS-ESP32/issues/1663)
+
+## Fixed
+
+- 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 HA name and grouping to be consistent [#1528](https://github.com/emsesp/EMS-ESP32/issues/1528)
+- MQTT autodiscovery in Domoticz not working [#1360](https://github.com/emsesp/EMS-ESP32/issues/1528)
+- dhw comfort for new ems+, [#1495](https://github.com/emsesp/EMS-ESP32/issues/1495)
+- added writeable icon to Web's Custom Entity page for each entity shown in the table
+- Wifi Tx Power not adjusted [#1614](https://github.com/emsesp/EMS-ESP32/issues/1614)
+- MQTT discovery of custom entity doesn't consider type of data [#1587](https://github.com/emsesp/EMS-ESP32/issues/1587)
+- WiFi TxPower wasn't correctly used. Added an 'Auto' setting, which is the default.
+- dns w/wo IPv6 [#1644](https://github.com/emsesp/EMS-ESP32/issues/1644)
+
+## Changed
+
+- HA don't set entity_category to Diagnostic/Configuration for EMS entities [#1459](https://github.com/emsesp/EMS-ESP32/discussions/1459)
+- upgraded ArduinoJson to 7.0.0 #1538 and then 7.0.2
+- small changes to the API for analog and temperature sensors
+- Length of mqtt Broker adress [#1619](https://github.com/emsesp/EMS-ESP32/issues/1619)
+- C++ optimizations - see <https://github.com/emsesp/EMS-ESP32/pull/1615>
+- Send MQTT heartbeat immediately after connection [#1628](https://github.com/emsesp/EMS-ESP32/issues/1628)
+- 16MB partitions with second nvs, larger FS, Coredump, optional factory partition
+- stop fetching empty telegrams after 5 min
+
+## [3.6.4] November 24 2023
+
+## **IMPORTANT! BREAKING CHANGES**
+
+Writeable Text entities have moved from type `sensor` to `text` in Home Assistant to make them also editable within an HA dashboard. Examples are `datetime`, `holidays`, `switchtime`, `vacations`, `maintenancedate`... You will need to manually remove any old discovery topics from your MQTT broker using an application like MQTT Explorer.
+
+## Added
+
+- humidity for ventilation devices
+- telegrams for RC100H, hc2, etc. (seen on discord, not tested)
+- names for BC400, GB192i.2, read temperatures for low loss header and heatblock [#1317](https://github.com/emsesp/EMS-ESP32/discussions/1317)
+- option for `forceheatingoff` [#1262](https://github.com/emsesp/EMS-ESP32/issues/1262)
+- remote thermostat emulation RC100H for RC3xx [#1278](https://github.com/emsesp/EMS-ESP32/discussions/1278)
+- shower_data MQTT payload contains the timestamp [#1329](https://github.com/emsesp/EMS-ESP32/issues/1329)
+- HA discovery for writeable text entities [#1337](https://github.com/emsesp/EMS-ESP32/pull/1377)
+- autodetect board_profile, store in nvs, add telnet command option, add E32V2
+- heat pump high res energy counters [#1348, #1349. #1350](https://github.com/emsesp/EMS-ESP32/issues/1348)
+- optional bssid in network settings
+- extension module EM100 [#1315](https://github.com/emsesp/EMS-ESP32/discussions/1315)
+- digital_out with new options for polarity and startup state
+- added 'system allvalues' command that dumps all the EMS device values, plus sensors and any custom entities
+
+## Fixed
+
+- remove command `remoteseltemp`, thermostat accept it only from remote thermostat
+- shower_data MQTT payload contains the timestamp [#1329](https://github.com/emsesp/EMS-ESP32/issues/1329)
+- fixed helper text in Web Device Entity dialog box for numerical ranges
+- MQTT base with paths not working in HA [#1393](https://github.com/emsesp/EMS-ESP32/issues/1393)
+- set/read thermostat mode for RC100-RC300, [#1440](https://github.com/emsesp/EMS-ESP32/issues/1440) [#1442](https://github.com/emsesp/EMS-ESP32/issues/1442)
+- some setting commands for ems-boiler have used wrong ems+ telegram in 3.6.3
+
+## Changed
+
+- update to platform 6.4.0, arduino 2.0.14 / idf 4.4.6
+- small changes for arduino 3.0.0 / idf 5.1 compatibility (not backward compatible to platform 6.3.2 and before)
+- AP start after 10 sec, stay until station/eth connected
+- tested wifi-all-channel-scan (3.6.3-dev4 a-e), removed again because of connect issues
+- mqtt disconnect stops queue
+
+## [3.6.2] October 1 2023
+
+## **IMPORTANT! BREAKING CHANGES**
+
+## Added
+
+- Power entities
+- Optional input of BSSID for AP connection
+- Return empty json if no entries in scheduler/custom/analogsensor/temperaturesensor
+
+## Fixed
+
+- Wifi full scan to get strongest AP
+- Add missing dhw tags
+- Sending a dash/- to the Reset command doesn't return an error [#1308](https://github.com/emsesp/EMS-ESP32/discussions/1308)
+
+## Changed
+
+- MQTT queue max 300 messages, check heap and maxAlloc
+- API call commands are logged as WARN in the log
+- Reset Command renamed to 'reset' in lowercase in EN
+
+## [3.6.1] September 9 2023
+
+## **IMPORTANT! BREAKING CHANGES**
+
+- `shower_data` MQTT topic shows duration is seconds (was previously a full english sentence)
+
+## Added
+
+- Show WiFi rssi in Network Status Page, show quality as color
+
+## Fixed
+
+- Issue in espMqttClient causing a memory leak when MQTT broker is disconnected due to network unavailability [#1264](https://github.com/emsesp/EMS-ESP32/issues/1264)
+- Using MQTT enum values correctly formatted in MQTT Discovery [#1280](https://github.com/emsesp/EMS-ESP32/issues/1280)
+
+## Changed
+
+- MQTT free mem check set to 60 kb
+- Small cosmetic changes to Searching in Customization web page
+- Updated to espressif32@6.4.0
+
+# [3.6.0] August 13 2023
+
+## **IMPORTANT! BREAKING CHANGES**
+
+There are breaking changes between 3.5.x and earlier versions of 3.6.0. Please read carefully before applying the update.
+
+- The sensors have been renamed. `dallassensor` is now `temperaturesensor` in the MQTT topic and named `ts` in the Customizations file. Likewise `analogs` is now `analogsensor` in MQTT and called `as` in the Customizations file. If you have previous customizations you will need to manually update by downloading, changing the JSON file and uploading. It's also recommended cleaning up any old MQTT topics from your broker using an application like MQTTExplorer.
+
+## Added
+
+- Workaround for better Domoticz MQTT integration? [#904](https://github.com/emsesp/EMS-ESP32/issues/904)
+- Show MAC address without connecting to network enhancement [#933](https://github.com/emsesp/EMS-ESP32/issues/933)
+- Warn user in WebUI of unsaved changes [#911](https://github.com/emsesp/EMS-ESP32/issues/911)
+- Detect old Tado thermostat, device-id 0x19, no entities
+- Some more HM200 entities [#500](https://github.com/emsesp/EMS-ESP32/issues/500)
+- Added Scheduler [#701](https://github.com/emsesp/EMS-ESP32/issues/701)
+- Added Custom Entities read/write from EMS bus
+- Build S3 binary with github actions
+- Greenstar HIU [#1158](https://github.com/emsesp/EMS-ESP32/issues/1158)
+- AM200 code 10 [#1161](https://github.com/emsesp/EMS-ESP32/issues/1161)
+- Ventilation device (Logavent HRV176) [#1172](https://github.com/emsesp/EMS-ESP32/issues/1172)
+- Turn ETH off on wifi connect [#1167](https://github.com/emsesp/EMS-ESP32/issues/1167)
+- Support for multiple EMS-ESPs with HA [#1196](https://github.com/emsesp/EMS-ESP32/issues/1196)
+- Italian translation [#1199](https://github.com/emsesp/EMS-ESP32/issues/1199)
+- Turkish language support [#1076](https://github.com/emsesp/EMS-ESP32/issues/1076)
+- Buderus GB182 - HC1 mode change not work bug [#1193](https://github.com/emsesp/EMS-ESP32/issues/1193)
+- Minimal flow temperature enhancement [#1192](https://github.com/emsesp/EMS-ESP32/issues/1192)
+- Roomtemperature Switching Difference enhancement [#1191](https://github.com/emsesp/EMS-ESP32/issues/1191)
+- Dew Point Temperature Difference enhancement [#1190](https://github.com/emsesp/EMS-ESP32/issues/1190)
+- Control of heating circuit mode enhancement [#1187](https://github.com/emsesp/EMS-ESP32/issues/1187)
+- Warn user in WebUI of unsaved changes enhancement [#911](https://github.com/emsesp/EMS-ESP32/issues/911)
+- Create safebuild app to fit into factory partition to give ESP32 more flash memory enhancement [#608](https://github.com/emsesp/EMS-ESP32/issues/608)
+- Support ESP32 S2, C3 mini and S3 [#605](https://github.com/emsesp/EMS-ESP32/issues/605)
+- Support Buderus AM200 [#1161](https://github.com/emsesp/EMS-ESP32/issues/1161)
+- Custom telegram handler [#1155](https://github.com/emsesp/EMS-ESP32/issues/1155)
+- Added support for TLS in MQTT (ESP32-S3 only) [#1178](https://github.com/emsesp/EMS-ESP32/issues/1178)
+- Boardprofile BBQKees Gateway S3
+- Custom entity type RAW [#1212](https://github.com/emsesp/EMS-ESP32/discussions/1212)
+- API command response [#1212](https://github.com/emsesp/EMS-ESP32/discussions/1212)
+
+## Fixed
+
+- HA-discovery for analog sensor commands [#1035](https://github.com/emsesp/EMS-ESP32/issues/1035)
+- Enum order of RC3x nofrost mode
+- Heartbeat interval
+- Exhaust temperature always zero on GB125/MC110/RC310 bug [#1147](https://github.com/emsesp/EMS-ESP32/issues/1147)
+- thermostat modetype is not changing when mode changes (e.g. to night) bugSomething isn't working [#1098](https://github.com/emsesp/EMS-ESP32/issues/1098)
+- NTP: cant apply changed timezone [#1182](https://github.com/emsesp/EMS-ESP32/issues/1182)
+- Missing Status of VS1 for Buderus SM200 enhancement [#1034](https://github.com/emsesp/EMS-ESP32/issues/1034)
+- Allowed gpios for S3
+
+## Changed
+
+- Optional upgrade to platform-espressif32 6.3.0 (after 5.3.0) [#862](https://github.com/emsesp/EMS-ESP32/issues/862)
+- Use byte 3 for detection RC30 active heatingcircuit [#786](https://github.com/emsesp/EMS-ESP32/issues/786)
+- Write repeated selflowtemp if tx-queue is empty without verify [#954](https://github.com/emsesp/EMS-ESP32/issues/954)
+- HA discovery recreate after disconnect by device [#1067](https://github.com/emsesp/EMS-ESP32/issues/1067)
+- File upload: check flash size (overflow) instead of filesize
+- Improved HA Discovery so previous configs no longer need to be removed when starting [#1077](https://github.com/emsesp/EMS-ESP32/pull/1077) (thanks @pswid)
+- Enlarge UART-Stack to 2,5k
+- Retry timeout for Mqtt-QOS1/2 10seconds
+- Optimize WebUI rendering when using Dialog Boxes [#1116](https://github.com/emsesp/EMS-ESP32/issues/1116)
+- Optimize Web libraries to reduce bundle size (3.6.x) [#1112](https://github.com/emsesp/EMS-ESP32/issues/1112)
+- Use [espMqttClient](https://github.com/bertmelis/espMqttClient) with integrated queue [#1178](https://github.com/emsesp/EMS-ESP32/issues/1178)
+- Move Sensors from Web dashboard to it's own tab enhancement [#1170](https://github.com/emsesp/EMS-ESP32/issues/1170)
+- Optimize WebUI dashboard data [#1169](https://github.com/emsesp/EMS-ESP32/issues/1169)
+- Replace React core library with Preact to save on memory footprint
+- Response to `system/send` raw reads gives combined data for telegrams with more parts
+
 # [3.5.0] February 6 2023
 
 ## **IMPORTANT! BREAKING CHANGES**
@@ -85,7 +444,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - fix Table resizing in WebUI [#519](https://github.com/emsesp/EMS-ESP32/issues/519)
 - allow larger customization files [#570](https://github.com/emsesp/EMS-ESP32/issues/570)
-- losing entitiy wwcomfort [#581](https://github.com/emsesp/EMS-ESP32/issues/581)
+- losing entity wwcomfort [#581](https://github.com/emsesp/EMS-ESP32/issues/581)
 
 ## Changed
 
@@ -112,7 +471,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - WebUI optimizations, updated look&feel and better performance [#124](https://github.com/emsesp/EMS-ESP32/issues/124)
 - Auto refresh of WebUI after successful firmware upload [#178](https://github.com/emsesp/EMS-ESP32/issues/178)
-- New Customization Service in WebUI. First feature is the ability to enable/disabled Enitites (device values) from EMS devices [#206](https://github.com/emsesp/EMS-ESP32/issues/206)
+- New Customization Service in WebUI. First feature is the ability to enable/disabled Entities (device values) from EMS devices [#206](https://github.com/emsesp/EMS-ESP32/issues/206)
 - Option to disable Telnet Console [#209](https://github.com/emsesp/EMS-ESP32/issues/209)
 - Added Hide SSID, Max Clients and Preferred Channel to Access Point
 - Merged in MichaelDvP's changes like Fahrenheit conversion, publish single (for IOBroker) and a few other critical optimizations

CHANGELOG_LATEST.md

@@ -1,70 +1,56 @@
 # Changelog
 
-# [3.6.0]
+For more details go to [docs.emsesp.org](https://docs.emsesp.org/).
 
-## **IMPORTANT! BREAKING CHANGES**
+## [3.7.3]
-
-There are breaking changes between 3.5.x and earlier versions of 3.6.0. Please read carefully before applying the update.
-
-- The sensors have been renamed. `dallassensor` is now `temperaturesensor` in the MQTT topic and named `ts` in the Customizations file. Likewise `analogs` is now `analogsensor` in MQTT and called `as` in the Customizations file. If you have previous customizations you will need to manually update by downloading, changing the JSON file and uploading. It's also recommended cleaning up any old MQTT topics from your broker using an application like MQTTExplorer.
 
 ## Added
 
-- Workaround for better Domoticz MQTT intergration? [#904](https://github.com/emsesp/EMS-ESP32/issues/904)
+- analogsensor types: NTC and RGB-Led
-- Show MAC address without connecting to network enhancement [#933](https://github.com/emsesp/EMS-ESP32/issues/933)
+- Flag for HMC310 [#2465](https://github.com/emsesp/EMS-ESP32/issues/2465)
-- Warn user in WebUI of unsaved changes [#911](https://github.com/emsesp/EMS-ESP32/issues/911)
+- boiler auxheatersource [#2489](https://github.com/emsesp/EMS-ESP32/discussions/2489)
-- Detect old Tado thermostat, device-id 0x19, no entities
+- thermostat last error for RC100/300 [#2501](https://github.com/emsesp/EMS-ESP32/issues/2501)
-- Some more HM200 entities [#500](https://github.com/emsesp/EMS-ESP32/issues/500)
+- boiler 0xC6 telegram [#1963](https://github.com/emsesp/EMS-ESP32/issues/1963)
-- Added Scheduler [#701](https://github.com/emsesp/EMS-ESP32/issues/701)
+- CS6800i changes [#2448](https://github.com/emsesp/EMS-ESP32/issues/2448), [#2449](https://github.com/emsesp/EMS-ESP32/issues/2449)
-- Added Custom Entities read/write from EMS bus
+- charging pump [#2544](https://github.com/emsesp/EMS-ESP32/issues/2544)
-- Build S3 binary with github actions
+- hybrid CSH5800iG [#2569](https://github.com/emsesp/EMS-ESP32/issues/2569)
-- Greenstar HIU [#1158](https://github.com/emsesp/EMS-ESP32/issues/1158)
+- add EMS Device details to Home Assistant MQTT Discovery
-- AM200 code 10 [#1161](https://github.com/emsesp/EMS-ESP32/issues/1161)
+- disinfection command [#2601](https://github.com/emsesp/EMS-ESP32/issues/2601)
-- Ventilation device (Logavent HRV176) [#1172](https://github.com/emsesp/EMS-ESP32/issues/1172)
+- added new board profile for upcoming BBQKees E32V2.2
-- Turn ETH off on wifi connect [#1167](https://github.com/emsesp/EMS-ESP32/issues/1167)
+- set differential pressure entity in Mixer device
-- Support for multiple EMS-ESPs with HA [#1196](https://github.com/emsesp/EMS-ESP32/issues/1196)
+- set set climate action cooling/heating in HA [#2583](https://github.com/emsesp/EMS-ESP32/issues/2583)
-- Italian translation [#1199](https://github.com/emsesp/EMS-ESP32/issues/1199)
+- Internal sensors of E32V2_2
-- Turkish language support [#1076](https://github.com/emsesp/EMS-ESP32/issues/1076)
+- FW200 display options [#2610](https://github.com/emsesp/EMS-ESP32/discussions/2610)
-- Buderus GB182 - HC1 mode change not work bug [#1193](https://github.com/emsesp/EMS-ESP32/issues/1193)
+- CR11 mode settings OFF/MANUAL depends on selTemp [#2437](https://github.com/emsesp/EMS-ESP32/issues/2437)
-- Minimal flow temperature enhancement [#1192](https://github.com/emsesp/EMS-ESP32/issues/1192)
+- Fuse settings for BBQKees boards
-- Roomtemperature Switching Difference enhancement [#1191](https://github.com/emsesp/EMS-ESP32/issues/1191)
+- Analogsensors for pulse output [#2624](https://github.com/emsesp/EMS-ESP32/discussions/2624)
-- Dew Point Temperature Difference enhancement [#1190](https://github.com/emsesp/EMS-ESP32/issues/1190)
+- Analogsensors frequency input [#2631](https://github.com/emsesp/EMS-ESP32/discussions/2631)
-- Control of heating circuit mode enhancement [#1187](https://github.com/emsesp/EMS-ESP32/issues/1187)
+- SRC plus thermostats [#2636](https://github.com/emsesp/EMS-ESP32/issues/2636)
-- Warn user in WebUI of unsaved changes enhancement [#911](https://github.com/emsesp/EMS-ESP32/issues/911)
+- Greenstar 2000 [#2645](https://github.com/emsesp/EMS-ESP32/issues/2645)
-- Create safebuild app to fit into factory partition to give ESP32 more flash memory enhancement [#608](https://github.com/emsesp/EMS-ESP32/issues/608)
+- RC3xx `dhw modetype` [#2659](https://github.com/emsesp/EMS-ESP32/discussions/2659)
-- Support ESP32 S2, C3 mini and S3 [#605](https://github.com/emsesp/EMS-ESP32/issues/605)
-- Support Buderus AM200 [#1161](https://github.com/emsesp/EMS-ESP32/issues/1161)
-- Custom telegram handler [#1155](https://github.com/emsesp/EMS-ESP32/issues/1155)
-- Added support for TLS in MQTT (ESP32-S3 only) [#1178](https://github.com/emsesp/EMS-ESP32/issues/1178)
-- Boardprofile BBQKees Gateway S3
-- Custom entity type RAW [#1212](https://github.com/emsesp/EMS-ESP32/discussions/1212)
-- API command response [#1212](https://github.com/emsesp/EMS-ESP32/discussions/1212)
 
 ## Fixed
 
-- HA-discovery for analog sensor commands [#1035](https://github.com/emsesp/EMS-ESP32/issues/1035)
+- dhw/switchtime [#2490](https://github.com/emsesp/EMS-ESP32/issues/2490)
-- Enum order of RC3x nofrost mode
+- switch to secure mqtt [#2492](https://github.com/emsesp/EMS-ESP32/issues/2492)
-- Heartbeat interval
+- update link buttons [#2497](https://github.com/emsesp/EMS-ESP32/issues/2497)
-- Exhaust temperature always zero on GB125/MC110/RC310 bug [#1147](https://github.com/emsesp/EMS-ESP32/issues/1147)
+- refresh scheduler states [#2502](https://github.com/emsesp/EMS-ESP32/discussions/2502)
-- thermostat modetype is not changing when mode changes (e.g. to night) bugSomething isn't working [#1098](https://github.com/emsesp/EMS-ESP32/issues/1098)
+- also rebuild HA config on mqtt connect for scheduler, custom and shower
-- NTP: cant apply changed timezone [#1182](https://github.com/emsesp/EMS-ESP32/issues/1182)
+- FB100 controls the hc, not the master [#2510](https://github.com/emsesp/EMS-ESP32/issues/2510)
-- Missing Status of VS1 for Buderus SM200 enhancement [#1034](https://github.com/emsesp/EMS-ESP32/issues/1034)
+- IPM DHW module, [#2524](https://github.com/emsesp/EMS-ESP32/issues/2524)
-- Allowed gpios for S3
+- charge optimization [#2543](https://github.com/emsesp/EMS-ESP32/issues/2543)
+- shower active state retained, shows correctly in HA
+- MQTT Command Topic with slashes [#2571](https://github.com/emsesp/EMS-ESP32/issues/2571)
+- Add pulsed water meter input to V1.3 gateway with Lilygo S3 [#2550](https://github.com/emsesp/EMS-ESP32/issues/2550)
+- fix missing long 10-second press of Button to perform a factory reset
+- fix wwMaxPower on Junkers ZBS14 [#2609](https://github.com/emsesp/EMS-ESP32/issues/2609)
+- ventilation bypass state from telegram 0x55C [#1197](https://github.com/emsesp/EMS-ESP32/issues/1197)
+- set selflowtemp for ems+ boilers [#2641](https://github.com/emsesp/EMS-ESP32/discussions/2641)
 
 ## Changed
 
-- Optional upgrade to platform-espressif32 6.3.0 (after 5.3.0) [#862](https://github.com/emsesp/EMS-ESP32/issues/862)
+- show console log with ISO date/time [#2533](https://github.com/emsesp/EMS-ESP32/discussions/2533)
-- Use byte 3 for detection RC30 active heatingcircuit [#786](https://github.com/emsesp/EMS-ESP32/issues/786)
+- remove ESP32 CPU temperature
-- Write repeated selflowtemp if tx-queue is empty without verify [#954](https://github.com/emsesp/EMS-ESP32/issues/954)
+- updated core libraries like AsyncTCP, AsyncWebServer and Modbus
-- HA discovery recreate after disconnect by device [#1067](https://github.com/emsesp/EMS-ESP32/issues/1067)
+- remove command `scan deep`
-- File upload: check flash size (overflow) instead of filesize
+- ignore repeated `forceheatingoff` commands [#2641](https://github.com/emsesp/EMS-ESP32/discussions/2641)
-- Improved HA Discovery so previous configs no longer need to be removed when starting [#1077](https://github.com/emsesp/EMS-ESP32/pull/1077) (thanks @pswid)
-- Enlarge UART-Stack to 2,5k
-- Retry timeout for Mqtt-QOS1/2 10seconds
-- Optimize WebUI rendering when using Dialog Boxes [#1116](https://github.com/emsesp/EMS-ESP32/issues/1116)
-- Optimize Web libraries to reduce bundle size (3.6.x) [#1112](https://github.com/emsesp/EMS-ESP32/issues/1112)
-- Use [espMqttClient](https://github.com/bertmelis/espMqttClient) with integrated queue [#1178](https://github.com/emsesp/EMS-ESP32/issues/1178)
-- Move Sensors from Web dashboard to it's own tab enhancement [#1170](https://github.com/emsesp/EMS-ESP32/issues/1170)
-- Optimize WebUI dashboard data [#1169](https://github.com/emsesp/EMS-ESP32/issues/1169)
-- Replace React core library with Preact to save on memory footprint
-- Response to `system/send` raw reads gives combined data for telegrams with more parts

CONTRIBUTING.md

@@ -6,7 +6,7 @@ Everybody is welcome and invited to contribute to the EMS-ESP Project by:
 
 - providing Pull Requests (Features, Fixes, suggestions)
 - testing new released features and report issues on your EMS equipment
-- contributing to missing [documentation](https://emsesp.github.io/docs)
+- contributing to missing [documentation](https://docs.emsesp.org)
 
 This document describes rules that are in effect for this repository, meant for handling issues by contributors in the issue tracker and PRs.
 

Makefile

@@ -2,8 +2,37 @@
 # GNUMakefile for EMS-ESP
 #
 
-NUMJOBS=${NUMJOBS:-" -j4 "}
+_mkfile_path := $(abspath $(lastword $(MAKEFILE_LIST)))
-MAKEFLAGS+="j "
+I := $(patsubst %/,%,$(dir $(_mkfile_path)))
+
+ifneq ($(words $(MAKECMDGOALS)),1)
+.DEFAULT_GOAL = all
+%:
+	@$(MAKE) $@ --no-print-directory -rRf $(firstword $(MAKEFILE_LIST))
+else
+ifndef ECHO
+T := $(shell $(MAKE) $(MAKECMDGOALS) --no-print-directory \
+      -nrRf $(firstword $(MAKEFILE_LIST)) \
+      ECHO="COUNTTHIS" | grep -c "COUNTTHIS")
+N := x
+C = $(words $N)$(eval N := x $N)
+ECHO = python3 $(I)/scripts/echo_progress.py --stepno=$C --nsteps=$T
+endif
+
+# determine number of parallel compiles based on OS
+UNAME_S := $(shell uname -s)
+ifeq ($(UNAME_S),Linux)
+    EXTRA_CPPFLAGS = -D LINUX
+	JOBS ?= $(shell nproc)
+endif
+ifeq ($(UNAME_S),Darwin)
+    EXTRA_CPPFLAGS = -D OSX -Wno-tautological-constant-out-of-range-compare
+	JOBS ?= $(shell sysctl -n hw.ncpu)
+endif
+MAKEFLAGS += -j $(JOBS) -l $(JOBS)
+
+# $(info Number of jobs: $(JOBS))
+
 #----------------------------------------------------------------------
 # Project Structure
 #----------------------------------------------------------------------
@@ -13,36 +42,29 @@ MAKEFLAGS+="j "
 # INCLUDES  is a list of directories containing header files
 # LIBRARIES is a list of directories containing libraries, this must be the top level containing include and lib
 #----------------------------------------------------------------------
-
-#TARGET    := $(notdir $(CURDIR))
 TARGET    := emsesp
 BUILD     := build
-SOURCES   := src src/* lib_standalone lib/uuid-common/src lib/uuid-console/src lib/uuid-log/src src/devices lib/ArduinoJson/src lib/PButton lib/semver lib/espMqttClient/src lib/espMqttClient/src/*
+SOURCES   := src/core src/devices src/web src/test       lib_standalone lib/semver lib/espMqttClient/src lib/espMqttClient/src/*         lib/ArduinoJson/src lib/uuid-common/src lib/uuid-console/src lib/uuid-log/src   lib/PButton 
-INCLUDES  := src lib_standalone lib/espMqttClient/src lib/espMqttClient/src/Transport lib/ArduinoJson/src lib/uuid-common/src lib/uuid-console/src lib/uuid-log/src lib/uuid-telnet/src lib/uuid-syslog/src lib/semver lib/* src/devices
+INCLUDES  := src/core src/devices src/web src/test lib/* lib_standalone lib/semver lib/espMqttClient/src lib/espMqttClient/src/Transport lib/ArduinoJson/src lib/uuid-common/src lib/uuid-console/src lib/uuid-log/src   lib/uuid-telnet/src lib/uuid-syslog/src
 LIBRARIES :=
 
 CPPCHECK = cppcheck
-# CHECKFLAGS = -q --force --std=c++17
+CHECKFLAGS = -q --force --std=gnu++17
-CHECKFLAGS = -q --force --std=c++11
 
 #----------------------------------------------------------------------
 # Languages Standard
 #----------------------------------------------------------------------
 C_STANDARD   := -std=c17
-# CXX_STANDARD := -std=c++17
+CXX_STANDARD := -std=gnu++17
-CXX_STANDARD := -std=gnu++11
-
-# C_STANDARD   := -std=c11
-# CXX_STANDARD := -std=c++11
 
 #----------------------------------------------------------------------
 # Defined Symbols
 #----------------------------------------------------------------------
-DEFINES += -DARDUINOJSON_ENABLE_STD_STRING=1 -DARDUINOJSON_ENABLE_PROGMEM=1 -DARDUINOJSON_ENABLE_ARDUINO_STRING -DARDUINOJSON_USE_DOUBLE=0
+DEFINES += -DARDUINOJSON_ENABLE -DARDUINOJSON_ENABLE_ARDUINO_STRING -DARDUINOJSON_USE_DOUBLE=0
-DEFINES += -DEMSESP_DEBUG -DEMSESP_STANDALONE -DEMSESP_TEST -D__linux__ -DEMC_RX_BUFFER_SIZE=1500
+DEFINES += -DEMSESP_STANDALONE -DEMSESP_TEST -DEMSESP_DEBUG -DEMC_RX_BUFFER_SIZE=1500
 DEFINES += $(ARGS)
 
-DEFAULTS = -DEMSESP_DEFAULT_LOCALE=\"en\" -DEMSESP_DEFAULT_TX_MODE=8 -DEMSESP_DEFAULT_VERSION=\"3.6.0-dev\" -DEMSESP_DEFAULT_BOARD_PROFILE=\"S32\"
+DEFAULTS = -DEMSESP_DEFAULT_LOCALE=\"en\" -DEMSESP_DEFAULT_TX_MODE=8 -DEMSESP_DEFAULT_VERSION=\"3.7.3-dev\" -DEMSESP_DEFAULT_BOARD_PROFILE=\"S32S3\"
 
 #----------------------------------------------------------------------
 # Sources & Files
@@ -76,14 +98,16 @@ CXX := /usr/bin/g++
 # LDFLAGS   Linker Flags
 #----------------------------------------------------------------------
 CPPFLAGS  += $(DEFINES) $(DEFAULTS) $(INCLUDE)
-CPPFLAGS  += -ggdb
+CPPFLAGS  += -ggdb -g3 -MMD
-CPPFLAGS  += -g3
+CPPFLAGS  += -flto=auto -fno-lto
-CPPFLAGS  += -Os
+CPPFLAGS  += -Wall -Wextra -Werror -Wswitch-enum
+CPPFLAGS  += -Wno-unused-parameter -Wno-missing-braces -Wno-vla-cxx-extension
+
+CPPFLAGS  += $(EXTRA_CPPFLAGS)
 
 CFLAGS    += $(CPPFLAGS)
-CFLAGS    += -Wall -Wextra -Werror -Wswitch-enum -Wno-unused-parameter -Wno-inconsistent-missing-override -Wno-missing-braces -Wno-unused-lambda-capture
+CXXFLAGS  += $(CPPFLAGS)
-
+LDFLAGS =
-CXXFLAGS  += $(CFLAGS) -MMD
 
 #----------------------------------------------------------------------
 # Compiler & Linker Commands
@@ -124,23 +148,27 @@ COMPILE.cpp = $(CXX) $(CXX_STANDARD) $(CXXFLAGS) $(DEPFLAGS) -c $< -o $@
 .SILENT: $(OUTPUT)
 
 all: $(OUTPUT)
+	@$(ECHO) Build complete.
 
 $(OUTPUT): $(OBJS)
 	@mkdir -p $(@D)
+	@$(ECHO) Linking $@
 	$(LINK.o)
 	$(SYMBOLS.out)
-
+	
 $(BUILD)/%.o: %.c
 	@mkdir -p $(@D)
-	$(COMPILE.c)
+	@$(ECHO) Compiling $@
+	@$(COMPILE.c)
 
 $(BUILD)/%.o: %.cpp
 	@mkdir -p $(@D)
-	$(COMPILE.cpp)
+	@$(ECHO) Compiling $@
+	@$(COMPILE.cpp)
 
 $(BUILD)/%.o: %.s
 	@mkdir -p $(@D)
-	$(COMPILE.s)
+	@$(COMPILE.s)
 
 cppcheck: $(SOURCES)
 	$(CPPCHECK) $(CHECKFLAGS) $^
@@ -149,6 +177,7 @@ run: $(OUTPUT)
 	@$<
 
 .PHONY: clean
+
 clean:
 	@$(RM) -rf $(BUILD) $(OUTPUT)
 
@@ -156,4 +185,6 @@ help:
 	@echo available targets: all run clean
 	@echo $(OUTPUT)
 
--include $(DEPS)
+-include $(DEPS)
+
+endif

README.md

@@ -1,10 +1,36 @@
-# ![logo](media/EMS-ESP_logo_dark.png)
+<div align="center">
+  <p align="center">
+    <a href="#">
+      <img src="https://raw.githubusercontent.com/emsesp/EMS-ESP32/dev/media/favicon/android-chrome-512x512.png" height="100px" />
+    </a>
+  </p>
+</div>
+
+<h1 align="center">EMS-ESP</h1>
+
+<p align="center">
+  <a href="https://emsesp.org">
+    <img src="https://img.shields.io/badge/Website-0077b5?style=for-the-badge&logo=googlehome&logoColor=white" alt="Website" />
+  </a>
+  <a href="https://github.com/emsesp/EMS-ESP32/blob/dev/CONTRIBUTING.md">
+    <img src="https://img.shields.io/badge/Contribute-ff4785?style=for-the-badge&logo=git&logoColor=white" alt="Contribute" />
+  </a>
+  <a href="https://docs.emsesp.org">
+    <img src="https://img.shields.io/badge/Documentation-0077b5?style=for-the-badge&logo=googledocs&logoColor=white" alt="Guides" />
+  </a>
+  <a href="https://discord.gg/3J3GgnzpyT">
+    <img src="https://img.shields.io/badge/Discord-7289da?style=for-the-badge&logo=discord&logoColor=white" alt="Discord" />
+  </a>
+  <a href="https://github.com/emsesp/EMS-ESP32/blob/main/CHANGELOG.md">
+    <img src="https://img.shields.io/badge/Changelog-6c5ce7?style=for-the-badge&logo=git&logoColor=white" alt="Changelog" />
+  </a>
+</p>
 
 [![version](https://img.shields.io/github/release/emsesp/EMS-ESP32.svg?label=Latest%20Release)](https://github.com/emsesp/EMS-ESP32/blob/main/CHANGELOG.md)
 [![release-date](https://img.shields.io/github/release-date/emsesp/EMS-ESP32.svg?label=Released)](https://github.com/emsesp/EMS-ESP32/commits/main)
 [![license](https://img.shields.io/github/license/emsesp/EMS-ESP32.svg)](LICENSE)
 [![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=emsesp_EMS-ESP32&metric=alert_status)](https://sonarcloud.io/summary/new_code?id=emsesp_EMS-ESP32)
-[![Codacy Badge](https://app.codacy.com/project/badge/Grade/9441142f49424ef891e8f5251866ee6b)](https://www.codacy.com/gh/emsesp/EMS-ESP32/dashboard?utm_source=github.com&utm_medium=referral&utm_content=emsesp/EMS-ESP32&utm_campaign=Badge_Grade)
+[![Codacy Badge](https://app.codacy.com/project/badge/Grade/9441142f49424ef891e8f5251866ee6b)](https://app.codacy.com/gh/emsesp/EMS-ESP32/dashboard?utm_source=gh&utm_medium=referral&utm_content=&utm_campaign=Badge_grade)
 [![downloads](https://img.shields.io/github/downloads/emsesp/EMS-ESP32/total.svg)](https://github.com/emsesp/EMS-ESP32/releases)
 [![chat](https://img.shields.io/discord/816637840644505620.svg?style=flat-square&color=blueviolet)](https://discord.gg/3J3GgnzpyT)
 
@@ -12,44 +38,59 @@
 [![GitHub forks](https://img.shields.io/github/forks/emsesp/EMS-ESP32.svg?style=social&label=Fork)](https://github.com/emsesp/EMS-ES32P/network)
 [![donate](https://img.shields.io/badge/donate-PayPal-blue.svg)](https://www.paypal.com/paypalme/prderbyshire/2)
 
-**EMS-ESP** is an open-source firmware for the Espressif ESP32 microcontroller that communicates with **EMS** (Energy Management System) based equipment from manufacturers like Bosch, Buderus, Nefit, Junkers, Worcester and Sieger. It requires a small gateway circuit to interface with the EMS bus which can be purchased from <https://bbqkees-electronics.nl> or custom built.
+**EMS-ESP** is an open-source firmware for the Espressif ESP32 microcontroller to communicate with **EMS** (Energy Management System) compatible equipment from manufacturers such as Bosch, Buderus, Nefit, Junkers, Worcester, Sieger, elm.leblanc and iVT.
 
-## **Features**
+It requires a small circuit to interface with the EMS bus which can be purchased from <https://bbqkees-electronics.nl> or custom built.
 
-- A multi-user, multi-language secure web interface to change settings and monitor incoming data
+## 📦&nbsp; **Key Features**
-- A console, accessible via Serial and Telnet for more advanced monitoring
-- 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/All-Devices/) (boilers, thermostats, solar modules, mixer modules, heat pumps, gateways, switches, heat sources)
 
-## **Documentation**
+- Compatible with EMS, EMS+, EMS2, EMS Plus, Logamatic EMS, Junkers 2-wire, Heatronic 3 and 4
+- Supporting over 120 different EMS compatible devices such as thermostats, boilers, heat pumps, mixing units, solar modules, connect modules, ventilation units, switches and more
+- Easy to add external Temperature and Analog sensors that are attached to GPIO pins on the ESP32 board
+- A multi-user, multi-language web interface to change settings and monitor incoming data
+- A simple to use console, accessible via Serial/USB or Telnet for advanced operations and detailed monitoring
+- Native integration with Home Assistant, Domoticz, openHAB and Modbus
+- Easy setup and install with automatic updates
+- Simulation of remote thermostats
+- Localized in 11 languages, and customizable to rename any device or sensor
+- Extendable by adding own custom EMS entities
+- Expandable via adding user-built external modules
+- A powerful Scheduler to automate tasks and trigger events based data changes
+- A Notification service to alert you of important events
 
-For the complete documentation on how to install, configure and get support visit the [EMS-ESP Wiki](https://emsesp.github.io/docs).
+## 🚀&nbsp; **Installing**
 
-## **Support**
+Head over to [download.emsesp.org](https://download.emsesp.org) for instructions on how to install EMS-ESP. There is also further details on which boards are supported in [this section](https://docs.emsesp.org/Installing/) of the documentation.
+
+## 📋&nbsp; **Documentation**
+
+Visit [emsesp.org](https://docs.emsesp.org) for more details on how to install and configure EMS-ESP. There is also a collection of Frequently Asked Questions and Troubleshooting tips with example customizations from the community.
+
+## 💬&nbsp; **Getting Support**
 
 To chat with the community reach out on our [Discord Server](https://discord.gg/3J3GgnzpyT).
 
-If you like **EMS-ESP**, please give it a star, or fork it and contribute or offer a small donation!
+If you find an issue or have a request, see [here](https://docs.emsesp.org/Support/) on how to submit a bug report or feature request.
 
-## **Demo**
+## 🎥&nbsp; **Live Demo**
 
-For a live demo of the Web UI click [here](https://ems-esp.derbyshire.nl) and log in with any username/password.
+For a live demo go to [demo.emsesp.org](https://demo.emsesp.org). Pick a language from the sign on page and log in with any username or password. Note not all features are operational as it's based on static data.
 
-## **Contributors ✨**
+## 💖&nbsp; **Contributors**
 
-EMS-ESP is a project owned and maintained by [proddy](https://github.com/proddy) and [MichaelDvP](https://github.com/MichaelDvP).
+EMS-ESP is a project created by [proddy](https://github.com/proddy) and owned and maintained by both [proddy](https://github.com/proddy) and [MichaelDvP](https://github.com/MichaelDvP) with support from [BBQKees Electronics](https://bbqkees-electronics.nl).
 
-## **Libraries used**
+If you like **EMS-ESP**, please give it a ✨ on GitHub, or even better fork it and contribute. You can also offer a small donation. This is an open-source project maintained by volunteers, and your support is greatly appreciated.
 
-- [esp8266-react](https://github.com/rjwats/esp8266-react) by @rjwats for the framework that provides the core of the Web UI
+## 📢&nbsp; **Libraries used**
-- [uuid-\*](https://github.com/nomis/mcu-uuid-console) from @nomis. The console, syslog, telnet and logging are based off these open source libraries
-- [ArduinoJson](https://github.com/bblanchon/ArduinoJson) for all the JSON
-- [espMqttClient](https://github.com/bertmelis/espMqttClient) for the MQTT client, with custom modifications from @MichaelDvP and @proddy
-- ESPAsyncWebServer and AsyncTCP for the Web server and TCP backends, with custom modifications for performance
 
-## **License**
+- [esp8266-react](https://github.com/rjwats/esp8266-react) by @rjwats for the core framework that provides the Web UI, which has been heavily modified
+- [uuid-\*](https://github.com/nomis/mcu-uuid-console) from @nomis. The console, syslog, telnet and logging are based off these awesome open source libraries
+- [ArduinoJson](https://github.com/bblanchon/ArduinoJson) for all the JSON processing
+- [espMqttClient](https://github.com/bertmelis/espMqttClient) for the MQTT client
+- [ESPAsyncWebServer](https://github.com/ESP32Async/ESPAsyncWebServer) and [AsyncTCP](https://github.com/ESP32Async/AsyncTCP) for the Web server and TCP backends
+
+## 📜&nbsp; **License**
 
 This program is licensed under GPL-3.0
 
@@ -59,14 +100,14 @@ This program is licensed under GPL-3.0
 
 |                                    |                                  |
 | ---------------------------------- | -------------------------------- |
-| <img src="media/web_settings.png"> | <img src="media/web_status.png"> |
+| ![Web Settings](media/web_settings.png) | ![Web Status](media/web_status.png) |
-| <img src="media/web_devices.png">  | <img src="media/web_mqtt.png">   |
+| ![Web Devices](media/web_devices.png)  | ![Web MQTT](media/web_mqtt.png)   |
-| <img src="media/web_edit.png">     | <img src="media/web_log.png">    |
+| ![Web Edit](media/web_edit.png)     | ![Web Log](media/web_log.png)    |
 
 ### Telnet Console
 
-<img src="media/console0.png" width=80% height=80%>
+![Console](media/console0.png)
 
-### In Home Assistant
+### Home Assistant
 
-<img src="media/ha_lovelace.png" width=80% height=80%>
+![Home Assistant](media/ha_lovelace.png)

boards/c3_mini_4M.json

@@ -0,0 +1,45 @@
+{
+    "build": {
+      "arduino": {
+        "ldscript": "esp32c3_out.ld"
+      },
+      "core": "esp32",
+      "extra_flags": [
+        "-DTASMOTA_SDK",
+        "-DARDUINO_LOLIN_C3_MINI",
+        "-DARDUINO_USB_MODE=1",
+        "-DARDUINO_USB_CDC_ON_BOOT=1"
+      ],
+      "f_cpu": "160000000L",
+      "f_flash": "80000000L",
+      "flash_mode": "qio",
+      "hwids": [
+        [
+          "0X303A",
+          "0x1001"
+        ]
+      ],
+      "mcu": "esp32c3",
+      "variant": "lolin_c3_mini"
+    },
+    "connectivity": [
+      "wifi"
+    ],
+    "debug": {
+      "openocd_target": "esp32c3.cfg"
+    },
+    "frameworks": [
+      "arduino",
+      "espidf"
+    ],
+    "name": "WEMOS LOLIN C3 Mini",
+    "upload": {
+      "flash_size": "4MB",
+      "maximum_ram_size": 327680,
+      "maximum_size": 4194304,
+      "require_upload_port": true,
+      "speed": 460800
+    },
+    "url": "https://www.wemos.cc/en/latest/c3/c3_mini.html",
+    "vendor": "WEMOS"
+  }

boards/esp32dev.json

@@ -0,0 +1,34 @@
+{
+    "build": {
+      "core": "esp32",
+      "f_cpu": "240000000L",
+      "f_flash": "40000000L",
+      "flash_mode": "dio",
+      "mcu": "esp32",
+      "variant": "esp32"
+    },
+    "connectivity": [
+      "wifi",
+      "ethernet"
+    ],
+    "debug": {
+      "openocd_board": "esp32.cfg"
+    },
+    "frameworks": [
+      "arduino",
+      "espidf"
+    ],
+    "name": "Espressif ESP32 Dev Module",
+    "upload": {
+      "flash_size": "16MB",
+      "maximum_ram_size": 327680,
+      "maximum_size": 16777216,
+      "require_upload_port": true,
+      "speed": 460800
+    },
+    "download": {
+        "speed": 230400
+    },
+    "url": "https://en.wikipedia.org/wiki/ESP32",
+    "vendor": "Espressif"
+  }

boards/s2_4M_P.json

@@ -0,0 +1,47 @@
+{
+    "build": {
+      "arduino": {
+        "ldscript": "esp32s2_out.ld"
+      },
+      "core": "esp32",
+      "extra_flags": [
+        "-DBOARD_HAS_PSRAM",
+        "-DTASMOTA_SDK",
+        "-DARDUINO_USB_CDC_ON_BOOT=1",
+        "-DARDUINO_USB_MODE=0"
+      ],
+      "f_cpu": "240000000L",
+      "f_flash": "80000000L",
+      "flash_mode": "dio",
+      "hwids": [
+        [
+          "0X303A",
+          "0x80C2"
+        ]
+      ],
+      "mcu": "esp32s2",
+      "variant": "lolin_s2_mini"
+    },
+    "connectivity": [
+      "wifi"
+    ],
+    "debug": {
+      "openocd_target": "esp32s2.cfg"
+    },
+    "frameworks": [
+      "arduino",
+      "espidf"
+    ],
+    "name": "WEMOS LOLIN S2 Mini",
+    "upload": {
+      "flash_size": "4MB",
+      "maximum_ram_size": 327680,
+      "maximum_size": 4194304,
+      "use_1200bps_touch": true,
+      "wait_for_upload_port": true,
+      "require_upload_port": true,
+      "speed": 921600
+    },
+    "url": "https://www.wemos.cc/en/latest/s2/s2_mini.html",
+    "vendor": "WEMOS"
+  }

boards/s3_16M_P.json

@@ -0,0 +1,44 @@
+{
+    "build": {
+      "arduino": {
+        "ldscript": "esp32s3_out.ld",
+        "memory_type": "qio_opi"
+      },
+      "core": "esp32",
+      "extra_flags": [
+        "-DBOARD_HAS_PSRAM",
+        "-DARDUINO_USB_MODE=1",
+        "-DARDUINO_USB_CDC_ON_BOOT=1",
+        "-DARDUINO_RUNNING_CORE=1",
+        "-DARDUINO_EVENT_RUNNING_CORE=1"
+      ],
+      "f_cpu": "240000000L",
+      "f_flash": "80000000L",
+      "flash_mode": "qio",
+      "mcu": "esp32s3",
+      "variant": "esp32s3"
+    },
+    "connectivity": [
+      "wifi"
+    ],
+    "debug": {
+      "openocd_target": "esp32s3.cfg"
+    },
+    "frameworks": [
+      "arduino",
+      "espidf"
+    ],
+    "name": "Espressif ESP32-S3 16M Flash OPI PSRAM, 4608KB Code/OTA, 2MB FS",
+    "upload": {
+      "flash_size": "16MB",
+      "maximum_ram_size": 327680,
+      "maximum_size": 16777216,
+      "require_upload_port": true,
+      "speed": 460800
+    },
+    "download": {
+      "speed": 230400
+    },
+    "url": "https://docs.espressif.com/projects/esp-idf/en/latest/esp32s3/hw-reference/esp32s3/",
+    "vendor": "Espressif"
+  }

boards/s3_32M_P.json

@@ -0,0 +1,37 @@
+{
+    "build": {
+      "arduino":{
+        "memory_type": "opi_opi"
+      },
+      "core": "esp32",
+      "extra_flags": "-DBOARD_HAS_PSRAM",
+      "f_cpu": "240000000L",
+      "f_flash": "80000000L",
+      "flash_mode": "opi",
+      "mcu": "esp32s3",
+      "variant": "esp32s3"
+    },
+    "connectivity": [
+      "wifi"
+    ],
+    "debug": {
+      "openocd_target": "esp32s3.cfg"
+    },
+    "frameworks": [
+      "arduino",
+      "espidf"
+    ],
+    "name": "Espressif ESP32-S3 32M Flash OPI PSRAM, 4608KB Code/OTA, 2MB FS",
+    "upload": {
+      "flash_size": "32MB",
+      "maximum_ram_size": 327680,
+      "maximum_size": 16777216,
+      "require_upload_port": true,
+      "speed": 460800
+    },
+    "download": {
+      "speed": 230400
+    },
+    "url": "https://docs.espressif.com/projects/esp-idf/en/latest/esp32s3/hw-reference/esp32s3/",
+    "vendor": "Espressif"
+  }

boards/s_16M.json

@@ -0,0 +1,35 @@
+{
+    "build": {
+      "core": "esp32",
+      "extra_flags": "-DTASMOTA_SDK",
+      "f_cpu": "240000000L",
+      "f_flash": "40000000L",
+      "flash_mode": "dio",
+      "mcu": "esp32",
+      "variant": "esp32"
+    },
+    "connectivity": [
+      "wifi",
+      "ethernet"
+    ],
+    "debug": {
+      "openocd_target": "esp32.cfg"
+    },
+    "frameworks": [
+      "arduino",
+      "espidf"
+    ],
+    "name": "Espressif ESP32 16M Flash, 4608KB Code/OTA, 2MB FS",
+    "upload": {
+      "flash_size": "16MB",
+      "maximum_ram_size": 327680,
+      "maximum_size": 16777216,
+      "require_upload_port": true,
+      "speed": 460800
+    },
+    "download": {
+      "speed": 230400
+    },
+    "url": "https://en.wikipedia.org/wiki/ESP32",
+    "vendor": "Espressif"
+  }

boards/s_16M_P.json

@@ -0,0 +1,35 @@
+{
+    "build": {
+      "core": "esp32",
+      "extra_flags": "-DBOARD_HAS_PSRAM",
+      "f_cpu": "240000000L",
+      "f_flash": "80000000L",
+      "flash_mode": "dio",
+      "mcu": "esp32",
+      "variant": "esp32"
+    },
+    "connectivity": [
+      "wifi",
+      "ethernet"
+    ],
+    "debug": {
+      "openocd_target": "esp32.cfg"
+    },
+    "frameworks": [
+      "arduino",
+      "espidf"
+    ],
+    "name": "Espressif ESP32 16M Flash DIO PSRAM, 4608KB Code/OTA, 2MB FS",
+    "upload": {
+      "flash_size": "16MB",
+      "maximum_ram_size": 327680,
+      "maximum_size": 16777216,
+      "require_upload_port": true,
+      "speed": 460800
+    },
+    "download": {
+      "speed": 230400
+    },
+    "url": "https://en.wikipedia.org/wiki/ESP32",
+    "vendor": "Espressif"
+  }

boards/s_4M.json

@@ -0,0 +1,34 @@
+{
+    "build": {
+      "core": "esp32",
+      "extra_flags": "-DTASMOTA_SDK",
+      "f_cpu": "240000000L",
+      "f_flash": "40000000L",
+      "flash_mode": "dio",
+      "mcu": "esp32",
+      "variant": "esp32"
+    },
+    "connectivity": [
+      "wifi"
+    ],
+    "debug": {
+      "openocd_target": "esp32.cfg"
+    },
+    "frameworks": [
+      "arduino",
+      "espidf"
+    ],
+    "name": "Tasmota ESP32 4M Flash, 4608KB Code/OTA, 2MB FS",
+    "upload": {
+      "flash_size": "4MB",
+      "maximum_ram_size": 327680,
+      "maximum_size": 4194304,
+      "require_upload_port": true,
+      "speed": 460800
+    },
+    "download": {
+      "speed": 230400
+    },
+    "url": "https://en.wikipedia.org/wiki/ESP32",
+    "vendor": "Espressif"
+  }

boards/seeed_xiao_esp32c6.json

@@ -0,0 +1,48 @@
+{
+  "build": {
+    "core": "esp32",
+    "extra_flags": [
+      "-DARDUINO_XIAO_ESP32C6",
+      "-DARDUINO_USB_MODE=1",
+      "-DARDUINO_USB_CDC_ON_BOOT=1"
+    ],
+    "f_cpu": "160000000L",
+    "f_flash": "80000000L",
+    "flash_mode": "qio",
+    "hwids": [
+      [
+        "0x2886",
+        "0x0046"
+      ],
+      [
+        "0x303a",
+        "0x1001"
+      ]
+    ],
+    "mcu": "esp32c6",
+    "variant": "XIAO_ESP32C6"
+  },
+  "connectivity": [
+    "wifi",
+    "bluetooth",
+    "zigbee",
+    "thread"
+  ],
+  "debug": {
+    "openocd_target": "esp32c6.cfg"
+  },
+  "frameworks": [
+    "arduino",
+    "espidf"
+  ],
+  "name": "Seeed Studio XIAO ESP32C6",
+  "upload": {
+    "flash_size": "4MB",
+    "maximum_ram_size": 327680,
+    "maximum_size": 4194304,
+    "require_upload_port": true,
+    "speed": 460800
+  },
+  "url": "https://wiki.seeedstudio.com/XIAO_ESP32C6_Getting_Started/",
+  "vendor": "Seeed Studio"
+}

cspell.json

@@ -0,0 +1,38 @@
+{
+    "$schema": "https://raw.githubusercontent.com/streetsidesoftware/cspell/main/cspell.schema.json",
+    "version": "0.2",
+    "dictionaryDefinitions": [
+      {
+        "name": "project-words",
+        "path": "./project-words.txt",
+        "addWords": true
+      }
+    ],
+    "dictionaries": ["project-words"],
+    "ignorePaths": [
+    "node_modules", 
+    "compile_commands.json", 
+    "WWWData.h", "**/venv/**", 
+    "lib/eModbus", 
+    "lib/ESPAsyncWebServer", 
+    "lib/espMqttClient", 
+    "analyse.html", 
+    "dist", 
+    "**/*.csv", 
+    "**/*.md", 
+    "**/*.py", 
+    "locale_translations.h", 
+    "TZ.tsx", 
+    "**/*.txt",
+    "build/**", 
+    "**/i18n/**", 
+    "/project-words.txt",
+    "Makefile",
+    "**/*.ini",
+    "**/*.json",
+    "src/core/modbus_entity_parameters.hpp",
+    "sdkconfig.*",
+    "managed_components/**",
+    "pnpm-*.yaml"
+  ]
+  }

data/pre_load.json

@@ -0,0 +1,85 @@
+{
+    "type": "settings",
+    "Network": {
+      "ssid": "my_wifi_ssid",
+      "bssid": "",
+      "password": "my_wifi_password",
+      "hostname": "ems-esp"
+    },
+    "AP": {
+      "provision_mode": 2,
+      "ssid": "ems-esp",
+      "password": "ems-esp-neo",
+      "channel": 1,
+      "ssid_hidden": false,
+      "max_clients": 4,
+      "local_ip": "192.168.4.1",
+      "gateway_ip": "192.168.4.1",
+      "subnet_mask": "255.255.255.0"
+    },
+    "MQTT": {
+      "enableTLS": false,
+      "rootCA": "",
+      "enabled": false,
+      "host": "127.0.0.1",
+      "port": 1883,
+      "base": "ems-esp",
+      "username": "username",
+      "password": "password",
+      "client_id": "ems-esp",
+      "entity_format": 1,
+      "publish_time_boiler": 10,
+      "publish_time_thermostat": 10,
+      "publish_time_solar": 10,
+      "publish_time_mixer": 10,
+      "publish_time_water": 10,
+      "publish_time_other": 60,
+      "publish_time_sensor": 10,
+      "publish_time_heartbeat": 60,
+      "mqtt_qos": 0,
+      "mqtt_retain": false,
+      "ha_enabled": false,
+      "nested_format": 1,
+      "discovery_prefix": "homeassistant",
+      "discovery_type": 0,
+      "publish_single": false,
+      "publish_single2cmd": false,
+      "send_response": false
+    },
+    "NTP": {
+      "enabled": true,
+      "server": "time.google.com",
+      "tz_label": "Europe/Amsterdam",
+      "tz_format": "CET-1CEST,M3.5.0,M10.5.0/3"
+    },
+    "Security": {
+      "jwt_secret": "ems-esp-neo",
+      "users": [
+        {
+          "username": "admin",
+          "password": "admin",
+          "admin": true
+        },
+        {
+          "username": "guest",
+          "password": "guest",
+          "admin": false
+        }
+      ]
+    },
+    "Settings": {
+      "board_profile": "S3",
+      "locale": "en",
+      "tx_mode": 1,
+      "ems_bus_id": 11,
+      "boiler_heatingoff": false,
+      "hide_led": true,
+      "telnet_enabled": true,
+      "notoken_api": false,
+      "analog_enabled": true,
+      "fahrenheit": false,
+      "bool_format": 1,
+      "bool_dashboard": 1,
+      "enum_format": 1
+    }
+  }

docs/dump_telegrams.csv

@@ -0,0 +1,231 @@
+telegram_type_id,name,is_fetched
+0x04,UBAFactory,fetched
+0x06,RCTime, 
+0x0A,EasyMonitor,fetched
+0x10,UBAErrorMessage1, 
+0x11,UBAErrorMessage2, 
+0x12,RCErrorMessage, 
+0x13,RCErrorMessage2, 
+0x14,UBATotalUptime,fetched
+0x15,UBAMaintenanceData, 
+0x16,UBAParameters,fetched
+0x18,UBAMonitorFast, 
+0x19,UBAMonitorSlow, 
+0x1A,UBASetPoints, 
+0x1C,UBAMaintenanceStatus, 
+0x1E,HydrTemp, 
+0x23,JunkersSetMixer,fetched
+0x27,UBASettingsWW,fetched
+0x28,WeatherComp,fetched
+0x2A,MC110Status, 
+0x2E,Meters, 
+0x33,UBAParameterWW,fetched
+0x34,UBAMonitorWW, 
+0x35,UBAFlags, 
+0x37,WWSettings,fetched
+0x38,WWTimer,fetched
+0x39,WWCircTimer,fetched
+0x3A,RC30WWSettings,fetched
+0x3B,Energy, 
+0x3D,RC35Set, 
+0x3E,RC35Monitor, 
+0x3F,RC35Timer, 
+0x40,RC30Temp, 
+0x41,RC30Monitor, 
+0x42,RC35Timer2, 
+0x47,RC35Set, 
+0x48,RC35Monitor, 
+0x49,RC35Timer, 
+0x4C,RC35Timer2, 
+0x51,RC35Set, 
+0x52,RC35Monitor, 
+0x53,RC35Timer, 
+0x56,RC35Timer2, 
+0x5B,RC35Set, 
+0x5C,RC35Monitor, 
+0x5D,RC35Timer, 
+0x60,RC35Timer2, 
+0x96,SM10Config,fetched
+0x97,SM10Monitor, 
+0x9C,WM10MonitorMessage, 
+0x9D,WM10SetMessage, 
+0xA2,RCError, 
+0xA3,RCOutdoorTemp, 
+0xA5,IBASettings,fetched
+0xA7,RC30Set, 
+0xA9,RC30Vacation,fetched
+0xAA,MMConfigMessage,fetched
+0xAB,MMStatusMessage, 
+0xAC,MMSetMessage, 
+0xAF,RC20Remote, 
+0xB0,RC10Set, 
+0xB1,RC10Monitor, 
+0xBB,HybridSettings,fetched
+0xBF,ErrorMessage, 
+0xC0,RCErrorMessage, 
+0xC2,UBAErrorMessage3, 
+0xC6,UBAErrorMessage3, 
+0xD1,UBAOutdoorTemp, 
+0xE3,UBAMonitorSlowPlus2, 
+0xE4,UBAMonitorFastPlus, 
+0xE5,UBAMonitorSlowPlus, 
+0xE6,UBAParametersPlus,fetched
+0xE9,UBAMonitorWWPlus, 
+0xEA,UBAParameterWWPlus,fetched
+0x0101,ISM1Set,fetched
+0x0103,ISM1StatusMessage,fetched
+0x0104,ISM2StatusMessage, 
+0x010C,IPMStatusMessage, 
+0x011E,JunkersDisp,fetched
+0x012E,HPEnergy1, 
+0x013B,HPEnergy2, 
+0x0165,JunkersSet, 
+0x0166,JunkersSet, 
+0x0167,JunkersSet, 
+0x0168,JunkersSet, 
+0x016E,Absent,fetched
+0x016F,JunkersMonitor, 
+0x0170,JunkersMonitor, 
+0x0171,JunkersMonitor, 
+0x0172,JunkersMonitor, 
+0x0179,JunkersSet, 
+0x017A,JunkersSet, 
+0x017B,JunkersSet, 
+0x017C,JunkersSet, 
+0x01D3,JunkersDhw,fetched
+0x023A,RC300OutdoorTemp,fetched
+0x023E,PVSettings,fetched
+0x0240,RC300Settings,fetched
+0x0241,RC300Settings,fetched
+0x0267,RC300Floordry, 
+0x0269,RC300Holiday,fetched
+0x0291,HPMode,fetched
+0x0292,HPMode,fetched
+0x0293,HPMode,fetched
+0x0294,HPMode,fetched
+0x029B,RC300Curves, 
+0x029C,RC300Curves, 
+0x029D,RC300Curves, 
+0x029E,RC300Curves, 
+0x029F,RC300Curves, 
+0x02A0,RC300Curves, 
+0x02A1,RC300Curves, 
+0x02A2,RC300Curves, 
+0x02A5,RC300Monitor, 
+0x02A6,RC300Monitor, 
+0x02A7,RC300Monitor, 
+0x02A8,RC300Monitor, 
+0x02A9,RC300Monitor, 
+0x02AA,RC300Monitor, 
+0x02AB,RC300Monitor, 
+0x02AC,RC300Monitor, 
+0x02AF,RC300Summer, 
+0x02B0,RC300Summer, 
+0x02B1,RC300Summer, 
+0x02B2,RC300Summer, 
+0x02B3,RC300Summer, 
+0x02B4,RC300Summer, 
+0x02B5,RC300Summer, 
+0x02B6,RC300Summer, 
+0x02B9,RC300Set, 
+0x02BA,RC300Set, 
+0x02BB,RC300Set, 
+0x02BC,RC300Set, 
+0x02BD,RC300Set, 
+0x02BE,RC300Set, 
+0x02BF,RC300Set, 
+0x02C0,RC300Set, 
+0x02CC,HPPressure,fetched
+0x02CD,MMPLUSConfigMessage,fetched
+0x02CE,RC300Set2, 
+0x02D0,RC300Set2, 
+0x02D2,RC300Set2, 
+0x02D6,HPPump2,fetched
+0x02D7,MMPLUSStatusMessage, 
+0x02E0,UBASetPoints, 
+0x02F5,RC300WWmode,fetched
+0x02F6,RC300WW2mode,fetched
+0x0313,MMPLUSConfigMessage_WWC,fetched
+0x031B,RC300WWtemp,fetched
+0x031D,RC300WWmode2, 
+0x031E,RC300WWmode2, 
+0x0331,MMPLUSStatusMessage_WWC, 
+0x0358,SM100SystemConfig,fetched
+0x035A,SM100CircuitConfig,fetched
+0x035C,SM100HeatAssist,fetched
+0x035D,SM100Circuit2Config,fetched
+0x035F,SM100Config1,fetched
+0x0361,SM100Differential,fetched
+0x0362,SM100Monitor, 
+0x0363,SM100Monitor2, 
+0x0364,SM100Status, 
+0x0366,SM100Config, 
+0x036A,SM100Status2, 
+0x0380,SM100CollectorConfig,fetched
+0x038E,SM100Energy,fetched
+0x0391,SM100Time,fetched
+0x043F,CRHolidays,fetched
+0x0467,HPSet, 
+0x0468,HPSet, 
+0x0469,HPSet, 
+0x046A,HPSet, 
+0x0471,RC300Summer2, 
+0x0472,RC300Summer2, 
+0x0473,RC300Summer2, 
+0x0474,RC300Summer2, 
+0x0475,RC300Summer2, 
+0x0476,RC300Summer2, 
+0x0477,RC300Summer2, 
+0x0478,RC300Summer2, 
+0x047B,HP2, 
+0x0484,HPSilentMode,fetched
+0x0485,HpCooling,fetched
+0x0486,HpInConfig,fetched
+0x0488,HPValve,fetched
+0x048A,HpPool,fetched
+0x048B,HPPumps,fetched
+0x048D,HpPower,fetched
+0x048F,HpTemperatures, 
+0x0491,HPAdditionalHeater,fetched
+0x0492,HpHeaterConfig,fetched
+0x0494,UBAEnergySupplied, 
+0x0495,UBAInformation, 
+0x0499,HPDhwSettings,fetched
+0x049C,HPSettings2,fetched
+0x049D,HPSettings3,fetched
+0x04A2,HpInput,fetched
+0x04A5,HPFan,fetched
+0x04A7,HPPowerLimit,fetched
+0x04AA,HPPower2,fetched
+0x04AE,HPEnergy,fetched
+0x04AF,HPMeters,fetched
+0x055C,VentilationSet,fetched
+0x056B,VentilationMode,fetched
+0x0583,VentilationMonitor, 
+0x0585,Blowerspeed, 
+0x0587,Bypass, 
+0x05BA,HpPoolStatus,fetched
+0x05D9,Airquality, 
+0x0772,HIUSettings, 
+0x0779,HIUMonitor, 
+0x07A5,SM100wwCirc,fetched
+0x07A6,SM100wwParam,fetched
+0x07AA,SM100wwStatus, 
+0x07AB,SM100wwCommand, 
+0x07AC,SM100wwParam1, 
+0x07AD,SM100ValveStatus, 
+0x07AE,SM100wwKeepWarm,fetched
+0x07D6,SM100wwTemperature, 
+0x07E0,SM100wwStatus2,fetched
+0x0935,EM100SetMessage,fetched
+0x0936,EM100OutMessage, 
+0x0937,EM100TempMessage, 
+0x0938,EM100InputMessage, 
+0x0939,EM100MonitorMessage, 
+0x093A,EM100ConfigMessage, 
+0x0998,HPSettings,fetched
+0x0999,HPFunctionTest,fetched
+0x099A,HPStarts, 
+0x099B,HPFlowTemp, 
+0x099C,HPComp, 
+0x09A0,HPTemperature, 

esp32_partition_16M.csv

@@ -1,6 +0,0 @@
-# Name,   Type, SubType, Offset,   Size,    Flags
-nvs,      data, nvs,     0x9000,   0x5000,
-otadata,  data, ota,     ,         0x2000,
-app0,     app,  ota_0,   ,         0x7F0000,
-app1,     app,  ota_1,   ,         0x7F0000,
-spiffs,   data, spiffs,  ,         64K,

factory_settings.ini

@@ -25,18 +25,12 @@ build_flags =
     -D FACTORY_NTP_TIME_ZONE_FORMAT=\"CET-1CEST,M3.5.0,M10.5.0/3\"
     -D FACTORY_NTP_SERVER=\"time.google.com\"
 
-    ; OTA settings
-    -D FACTORY_OTA_PORT=8266
-    -D FACTORY_OTA_PASSWORD=\"ems-esp-neo\"
-    -D FACTORY_OTA_ENABLED=false
-
     ; MQTT settings
     -D FACTORY_MQTT_ENABLED=false
     -D FACTORY_MQTT_HOST=\"\"
     -D FACTORY_MQTT_PORT=1883
     -D FACTORY_MQTT_USERNAME=\"\"
     -D FACTORY_MQTT_PASSWORD=\"\"
-    -D FACTORY_MQTT_CLIENT_ID=\"ems-esp\"
     -D FACTORY_MQTT_KEEP_ALIVE=60
     -D FACTORY_MQTT_CLEAN_SESSION=false
     -D FACTORY_MQTT_MAX_TOPIC_LENGTH=128

interface/.eslintignore

@@ -1,12 +0,0 @@
-node_modules/
-build/
-dist/
-.yarn/
-
-.prettierrc
-.eslintrc*
-env.d.ts
-progmem-generator.js
-unpack.ts
-vite.config.ts
-package.json

interface/.eslintrc.json

@@ -1,108 +0,0 @@
-{
-  "env": {
-    "browser": true,
-    "es6": true
-  },
-  "extends": [
-    "eslint:recommended",
-    "airbnb/hooks",
-    "airbnb-typescript",
-    "plugin:react/recommended",
-    "plugin:react/jsx-runtime",
-    "plugin:@typescript-eslint/recommended",
-    "plugin:@typescript-eslint/recommended-requiring-type-checking",
-    "plugin:prettier/recommended",
-    "plugin:import/recommended"
-  ],
-  "parser": "@typescript-eslint/parser",
-  "parserOptions": {
-    "ecmaFeatures": {
-      "jsx": true
-    },
-    "ecmaVersion": "latest",
-    "sourceType": "module",
-    "tsconfigRootDir": ".",
-    "project": ["tsconfig.json"]
-  },
-  "plugins": ["react", "@typescript-eslint", "autofix", "react-hooks"],
-  "settings": {
-    "import/resolver": {
-      "typescript": {
-        "project": "./tsconfig.json"
-      }
-    },
-    "react": {
-      "version": "18.x"
-    }
-  },
-  "rules": {
-    "object-shorthand": "error",
-    "no-console": "warn",
-    "@typescript-eslint/consistent-type-definitions": ["off", "type"],
-    "@typescript-eslint/explicit-function-return-type": "off",
-    "@typescript-eslint/no-unsafe-call": "off",
-    "@typescript-eslint/no-unsafe-enum-comparison": "off",
-    "@typescript-eslint/no-unsafe-assignment": "off",
-    "@typescript-eslint/no-unsafe-return": "off",
-    "@typescript-eslint/no-unsafe-member-access": "off",
-    "@typescript-eslint/naming-convention": "off",
-    "@typescript-eslint/no-explicit-any": "off",
-    "@typescript-eslint/no-unsafe-argument": "off",
-    "@typescript-eslint/restrict-plus-operands": "off",
-    "@typescript-eslint/no-unused-expressions": "off",
-    "@typescript-eslint/no-implied-eval": "off",
-    "@typescript-eslint/no-misused-promises": "off",
-    "arrow-body-style": ["error", "as-needed"],
-    "react-hooks/exhaustive-deps": "warn",
-    "@typescript-eslint/consistent-type-imports": [
-      "error",
-      {
-        "prefer": "type-imports"
-      }
-    ],
-    "import/order": [
-      "warn",
-      {
-        "groups": ["builtin", "external", "parent", "sibling", "index", "object", "type"],
-        "pathGroups": [
-          {
-            "pattern": "@/**/**",
-            "group": "parent",
-            "position": "before"
-          }
-        ],
-        "alphabetize": { "order": "asc" }
-      }
-    ],
-    // "autofix/no-unused-vars": [
-    //   "error",
-    //   {
-    //     "argsIgnorePattern": "^_",
-    //     "ignoreRestSiblings": true,
-    //     "destructuredArrayIgnorePattern": "^_"
-    //   }
-    // ],
-    "react/self-closing-comp": [
-      "error",
-      {
-        "component": true,
-        "html": true
-      }
-    ],
-    "@typescript-eslint/ban-types": [
-      "error",
-      {
-        "extendDefaults": true,
-        "types": {
-          "{}": false
-        }
-      }
-    ],
-    "prettier/prettier": [
-      "error",
-      {
-        "endOfLine": "auto"
-      }
-    ]
-  }
-}

interface/.gitignore

@@ -1,7 +0,0 @@
-.pnp.*
-.yarn/*
-!.yarn/patches
-!.yarn/plugins
-!.yarn/releases
-!.yarn/sdks
-!.yarn/versions

interface/.prettierignore

@@ -1,6 +1,7 @@
 node_modules/
 build/
 dist/
+src/i18n/*
+
 .prettierrc
-.yarn/
+.typesafe-i18n.json
-.typesafe-i18n.json

interface/.typesafe-i18n.json

@@ -1,5 +1,5 @@
 {
    "adapter": "react",
    "baseLocale": "pl",
-   "$schema": "https://unpkg.com/typesafe-i18n@5.26.0/schema/typesafe-i18n.json"
+   "$schema": "https://unpkg.com/typesafe-i18n@5.26.2/schema/typesafe-i18n.json"
 }

interface/.yarn/sdks/eslint/bin/eslint.js

@@ -1,20 +0,0 @@
-#!/usr/bin/env node
-
-const {existsSync} = require(`fs`);
-const {createRequire} = require(`module`);
-const {resolve} = require(`path`);
-
-const relPnpApiPath = "../../../../.pnp.cjs";
-
-const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = createRequire(absPnpApiPath);
-
-if (existsSync(absPnpApiPath)) {
-  if (!process.versions.pnp) {
-    // Setup the environment to be able to require eslint/bin/eslint.js
-    require(absPnpApiPath).setup();
-  }
-}
-
-// Defer to the real eslint/bin/eslint.js your application uses
-module.exports = absRequire(`eslint/bin/eslint.js`);

interface/.yarn/sdks/eslint/lib/api.js

@@ -1,20 +0,0 @@
-#!/usr/bin/env node
-
-const {existsSync} = require(`fs`);
-const {createRequire} = require(`module`);
-const {resolve} = require(`path`);
-
-const relPnpApiPath = "../../../../.pnp.cjs";
-
-const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = createRequire(absPnpApiPath);
-
-if (existsSync(absPnpApiPath)) {
-  if (!process.versions.pnp) {
-    // Setup the environment to be able to require eslint
-    require(absPnpApiPath).setup();
-  }
-}
-
-// Defer to the real eslint your application uses
-module.exports = absRequire(`eslint`);

interface/.yarn/sdks/eslint/package.json

@@ -1,6 +0,0 @@
-{
-  "name": "eslint",
-  "version": "8.36.0-sdk",
-  "main": "./lib/api.js",
-  "type": "commonjs"
-}

interface/.yarn/sdks/integrations.yml

@@ -1,5 +0,0 @@
-# This file is automatically generated by @yarnpkg/sdks.
-# Manual changes might be lost!
-
-integrations:
-  - vscode

interface/.yarn/sdks/prettier/index.js

@@ -1,20 +0,0 @@
-#!/usr/bin/env node
-
-const {existsSync} = require(`fs`);
-const {createRequire} = require(`module`);
-const {resolve} = require(`path`);
-
-const relPnpApiPath = "../../../.pnp.cjs";
-
-const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = createRequire(absPnpApiPath);
-
-if (existsSync(absPnpApiPath)) {
-  if (!process.versions.pnp) {
-    // Setup the environment to be able to require prettier/index.js
-    require(absPnpApiPath).setup();
-  }
-}
-
-// Defer to the real prettier/index.js your application uses
-module.exports = absRequire(`prettier/index.js`);

interface/.yarn/sdks/prettier/package.json

@@ -1,6 +0,0 @@
-{
-  "name": "prettier",
-  "version": "2.8.7-sdk",
-  "main": "./index.js",
-  "type": "commonjs"
-}

interface/.yarn/sdks/typescript/bin/tsc

@@ -1,20 +0,0 @@
-#!/usr/bin/env node
-
-const {existsSync} = require(`fs`);
-const {createRequire} = require(`module`);
-const {resolve} = require(`path`);
-
-const relPnpApiPath = "../../../../.pnp.cjs";
-
-const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = createRequire(absPnpApiPath);
-
-if (existsSync(absPnpApiPath)) {
-  if (!process.versions.pnp) {
-    // Setup the environment to be able to require typescript/bin/tsc
-    require(absPnpApiPath).setup();
-  }
-}
-
-// Defer to the real typescript/bin/tsc your application uses
-module.exports = absRequire(`typescript/bin/tsc`);

interface/.yarn/sdks/typescript/bin/tsserver

@@ -1,20 +0,0 @@
-#!/usr/bin/env node
-
-const {existsSync} = require(`fs`);
-const {createRequire} = require(`module`);
-const {resolve} = require(`path`);
-
-const relPnpApiPath = "../../../../.pnp.cjs";
-
-const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = createRequire(absPnpApiPath);
-
-if (existsSync(absPnpApiPath)) {
-  if (!process.versions.pnp) {
-    // Setup the environment to be able to require typescript/bin/tsserver
-    require(absPnpApiPath).setup();
-  }
-}
-
-// Defer to the real typescript/bin/tsserver your application uses
-module.exports = absRequire(`typescript/bin/tsserver`);

interface/.yarn/sdks/typescript/lib/tsc.js

@@ -1,20 +0,0 @@
-#!/usr/bin/env node
-
-const {existsSync} = require(`fs`);
-const {createRequire} = require(`module`);
-const {resolve} = require(`path`);
-
-const relPnpApiPath = "../../../../.pnp.cjs";
-
-const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = createRequire(absPnpApiPath);
-
-if (existsSync(absPnpApiPath)) {
-  if (!process.versions.pnp) {
-    // Setup the environment to be able to require typescript/lib/tsc.js
-    require(absPnpApiPath).setup();
-  }
-}
-
-// Defer to the real typescript/lib/tsc.js your application uses
-module.exports = absRequire(`typescript/lib/tsc.js`);

interface/.yarn/sdks/typescript/lib/tsserver.js

@@ -1,223 +0,0 @@
-#!/usr/bin/env node
-
-const {existsSync} = require(`fs`);
-const {createRequire} = require(`module`);
-const {resolve} = require(`path`);
-
-const relPnpApiPath = "../../../../.pnp.cjs";
-
-const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = createRequire(absPnpApiPath);
-
-const moduleWrapper = tsserver => {
-  if (!process.versions.pnp) {
-    return tsserver;
-  }
-
-  const {isAbsolute} = require(`path`);
-  const pnpApi = require(`pnpapi`);
-
-  const isVirtual = str => str.match(/\/(\$\$virtual|__virtual__)\//);
-  const isPortal = str => str.startsWith("portal:/");
-  const normalize = str => str.replace(/\\/g, `/`).replace(/^\/?/, `/`);
-
-  const dependencyTreeRoots = new Set(pnpApi.getDependencyTreeRoots().map(locator => {
-    return `${locator.name}@${locator.reference}`;
-  }));
-
-  // VSCode sends the zip paths to TS using the "zip://" prefix, that TS
-  // doesn't understand. This layer makes sure to remove the protocol
-  // before forwarding it to TS, and to add it back on all returned paths.
-
-  function toEditorPath(str) {
-    // We add the `zip:` prefix to both `.zip/` paths and virtual paths
-    if (isAbsolute(str) && !str.match(/^\^?(zip:|\/zip\/)/) && (str.match(/\.zip\//) || isVirtual(str))) {
-      // We also take the opportunity to turn virtual paths into physical ones;
-      // this makes it much easier to work with workspaces that list peer
-      // dependencies, since otherwise Ctrl+Click would bring us to the virtual
-      // file instances instead of the real ones.
-      //
-      // We only do this to modules owned by the the dependency tree roots.
-      // This avoids breaking the resolution when jumping inside a vendor
-      // with peer dep (otherwise jumping into react-dom would show resolution
-      // errors on react).
-      //
-      const resolved = isVirtual(str) ? pnpApi.resolveVirtual(str) : str;
-      if (resolved) {
-        const locator = pnpApi.findPackageLocator(resolved);
-        if (locator && (dependencyTreeRoots.has(`${locator.name}@${locator.reference}`) || isPortal(locator.reference))) {
-          str = resolved;
-        }
-      }
-
-      str = normalize(str);
-
-      if (str.match(/\.zip\//)) {
-        switch (hostInfo) {
-          // Absolute VSCode `Uri.fsPath`s need to start with a slash.
-          // VSCode only adds it automatically for supported schemes,
-          // so we have to do it manually for the `zip` scheme.
-          // The path needs to start with a caret otherwise VSCode doesn't handle the protocol
-          //
-          // Ref: https://github.com/microsoft/vscode/issues/105014#issuecomment-686760910
-          //
-          // 2021-10-08: VSCode changed the format in 1.61.
-          // Before | ^zip:/c:/foo/bar.zip/package.json
-          // After  | ^/zip//c:/foo/bar.zip/package.json
-          //
-          // 2022-04-06: VSCode changed the format in 1.66.
-          // Before | ^/zip//c:/foo/bar.zip/package.json
-          // After  | ^/zip/c:/foo/bar.zip/package.json
-          //
-          // 2022-05-06: VSCode changed the format in 1.68
-          // Before | ^/zip/c:/foo/bar.zip/package.json
-          // After  | ^/zip//c:/foo/bar.zip/package.json
-          //
-          case `vscode <1.61`: {
-            str = `^zip:${str}`;
-          } break;
-
-          case `vscode <1.66`: {
-            str = `^/zip/${str}`;
-          } break;
-
-          case `vscode <1.68`: {
-            str = `^/zip${str}`;
-          } break;
-
-          case `vscode`: {
-            str = `^/zip/${str}`;
-          } break;
-
-          // To make "go to definition" work,
-          // We have to resolve the actual file system path from virtual path
-          // and convert scheme to supported by [vim-rzip](https://github.com/lbrayner/vim-rzip)
-          case `coc-nvim`: {
-            str = normalize(resolved).replace(/\.zip\//, `.zip::`);
-            str = resolve(`zipfile:${str}`);
-          } break;
-
-          // Support neovim native LSP and [typescript-language-server](https://github.com/theia-ide/typescript-language-server)
-          // We have to resolve the actual file system path from virtual path,
-          // everything else is up to neovim
-          case `neovim`: {
-            str = normalize(resolved).replace(/\.zip\//, `.zip::`);
-            str = `zipfile://${str}`;
-          } break;
-
-          default: {
-            str = `zip:${str}`;
-          } break;
-        }
-      }
-    }
-
-    return str;
-  }
-
-  function fromEditorPath(str) {
-    switch (hostInfo) {
-      case `coc-nvim`: {
-        str = str.replace(/\.zip::/, `.zip/`);
-        // The path for coc-nvim is in format of /<pwd>/zipfile:/<pwd>/.yarn/...
-        // So in order to convert it back, we use .* to match all the thing
-        // before `zipfile:`
-        return process.platform === `win32`
-          ? str.replace(/^.*zipfile:\//, ``)
-          : str.replace(/^.*zipfile:/, ``);
-      } break;
-
-      case `neovim`: {
-        str = str.replace(/\.zip::/, `.zip/`);
-        // The path for neovim is in format of zipfile:///<pwd>/.yarn/...
-        return str.replace(/^zipfile:\/\//, ``);
-      } break;
-
-      case `vscode`:
-      default: {
-        return str.replace(/^\^?(zip:|\/zip(\/ts-nul-authority)?)\/+/, process.platform === `win32` ? `` : `/`)
-      } break;
-    }
-  }
-
-  // Force enable 'allowLocalPluginLoads'
-  // TypeScript tries to resolve plugins using a path relative to itself
-  // which doesn't work when using the global cache
-  // https://github.com/microsoft/TypeScript/blob/1b57a0395e0bff191581c9606aab92832001de62/src/server/project.ts#L2238
-  // VSCode doesn't want to enable 'allowLocalPluginLoads' due to security concerns but
-  // TypeScript already does local loads and if this code is running the user trusts the workspace
-  // https://github.com/microsoft/vscode/issues/45856
-  const ConfiguredProject = tsserver.server.ConfiguredProject;
-  const {enablePluginsWithOptions: originalEnablePluginsWithOptions} = ConfiguredProject.prototype;
-  ConfiguredProject.prototype.enablePluginsWithOptions = function() {
-    this.projectService.allowLocalPluginLoads = true;
-    return originalEnablePluginsWithOptions.apply(this, arguments);
-  };
-
-  // And here is the point where we hijack the VSCode <-> TS communications
-  // by adding ourselves in the middle. We locate everything that looks
-  // like an absolute path of ours and normalize it.
-
-  const Session = tsserver.server.Session;
-  const {onMessage: originalOnMessage, send: originalSend} = Session.prototype;
-  let hostInfo = `unknown`;
-
-  Object.assign(Session.prototype, {
-    onMessage(/** @type {string | object} */ message) {
-      const isStringMessage = typeof message === 'string';
-      const parsedMessage = isStringMessage ? JSON.parse(message) : message;
-
-      if (
-        parsedMessage != null &&
-        typeof parsedMessage === `object` &&
-        parsedMessage.arguments &&
-        typeof parsedMessage.arguments.hostInfo === `string`
-      ) {
-        hostInfo = parsedMessage.arguments.hostInfo;
-        if (hostInfo === `vscode` && process.env.VSCODE_IPC_HOOK) {
-          const [, major, minor] = (process.env.VSCODE_IPC_HOOK.match(
-            // The RegExp from https://semver.org/ but without the caret at the start
-            /(0|[1-9]\d*)\.(0|[1-9]\d*)\.(0|[1-9]\d*)(?:-((?:0|[1-9]\d*|\d*[a-zA-Z-][0-9a-zA-Z-]*)(?:\.(?:0|[1-9]\d*|\d*[a-zA-Z-][0-9a-zA-Z-]*))*))?(?:\+([0-9a-zA-Z-]+(?:\.[0-9a-zA-Z-]+)*))?$/
-          ) ?? []).map(Number)
-
-          if (major === 1) {
-            if (minor < 61) {
-              hostInfo += ` <1.61`;
-            } else if (minor < 66) {
-              hostInfo += ` <1.66`;
-            } else if (minor < 68) {
-              hostInfo += ` <1.68`;
-            }
-          }
-        }
-      }
-
-      const processedMessageJSON = JSON.stringify(parsedMessage, (key, value) => {
-        return typeof value === 'string' ? fromEditorPath(value) : value;
-      });
-
-      return originalOnMessage.call(
-        this,
-        isStringMessage ? processedMessageJSON : JSON.parse(processedMessageJSON)
-      );
-    },
-
-    send(/** @type {any} */ msg) {
-      return originalSend.call(this, JSON.parse(JSON.stringify(msg, (key, value) => {
-        return typeof value === `string` ? toEditorPath(value) : value;
-      })));
-    }
-  });
-
-  return tsserver;
-};
-
-if (existsSync(absPnpApiPath)) {
-  if (!process.versions.pnp) {
-    // Setup the environment to be able to require typescript/lib/tsserver.js
-    require(absPnpApiPath).setup();
-  }
-}
-
-// Defer to the real typescript/lib/tsserver.js your application uses
-module.exports = moduleWrapper(absRequire(`typescript/lib/tsserver.js`));

interface/.yarn/sdks/typescript/lib/tsserverlibrary.js

@@ -1,223 +0,0 @@
-#!/usr/bin/env node
-
-const {existsSync} = require(`fs`);
-const {createRequire} = require(`module`);
-const {resolve} = require(`path`);
-
-const relPnpApiPath = "../../../../.pnp.cjs";
-
-const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = createRequire(absPnpApiPath);
-
-const moduleWrapper = tsserver => {
-  if (!process.versions.pnp) {
-    return tsserver;
-  }
-
-  const {isAbsolute} = require(`path`);
-  const pnpApi = require(`pnpapi`);
-
-  const isVirtual = str => str.match(/\/(\$\$virtual|__virtual__)\//);
-  const isPortal = str => str.startsWith("portal:/");
-  const normalize = str => str.replace(/\\/g, `/`).replace(/^\/?/, `/`);
-
-  const dependencyTreeRoots = new Set(pnpApi.getDependencyTreeRoots().map(locator => {
-    return `${locator.name}@${locator.reference}`;
-  }));
-
-  // VSCode sends the zip paths to TS using the "zip://" prefix, that TS
-  // doesn't understand. This layer makes sure to remove the protocol
-  // before forwarding it to TS, and to add it back on all returned paths.
-
-  function toEditorPath(str) {
-    // We add the `zip:` prefix to both `.zip/` paths and virtual paths
-    if (isAbsolute(str) && !str.match(/^\^?(zip:|\/zip\/)/) && (str.match(/\.zip\//) || isVirtual(str))) {
-      // We also take the opportunity to turn virtual paths into physical ones;
-      // this makes it much easier to work with workspaces that list peer
-      // dependencies, since otherwise Ctrl+Click would bring us to the virtual
-      // file instances instead of the real ones.
-      //
-      // We only do this to modules owned by the the dependency tree roots.
-      // This avoids breaking the resolution when jumping inside a vendor
-      // with peer dep (otherwise jumping into react-dom would show resolution
-      // errors on react).
-      //
-      const resolved = isVirtual(str) ? pnpApi.resolveVirtual(str) : str;
-      if (resolved) {
-        const locator = pnpApi.findPackageLocator(resolved);
-        if (locator && (dependencyTreeRoots.has(`${locator.name}@${locator.reference}`) || isPortal(locator.reference))) {
-          str = resolved;
-        }
-      }
-
-      str = normalize(str);
-
-      if (str.match(/\.zip\//)) {
-        switch (hostInfo) {
-          // Absolute VSCode `Uri.fsPath`s need to start with a slash.
-          // VSCode only adds it automatically for supported schemes,
-          // so we have to do it manually for the `zip` scheme.
-          // The path needs to start with a caret otherwise VSCode doesn't handle the protocol
-          //
-          // Ref: https://github.com/microsoft/vscode/issues/105014#issuecomment-686760910
-          //
-          // 2021-10-08: VSCode changed the format in 1.61.
-          // Before | ^zip:/c:/foo/bar.zip/package.json
-          // After  | ^/zip//c:/foo/bar.zip/package.json
-          //
-          // 2022-04-06: VSCode changed the format in 1.66.
-          // Before | ^/zip//c:/foo/bar.zip/package.json
-          // After  | ^/zip/c:/foo/bar.zip/package.json
-          //
-          // 2022-05-06: VSCode changed the format in 1.68
-          // Before | ^/zip/c:/foo/bar.zip/package.json
-          // After  | ^/zip//c:/foo/bar.zip/package.json
-          //
-          case `vscode <1.61`: {
-            str = `^zip:${str}`;
-          } break;
-
-          case `vscode <1.66`: {
-            str = `^/zip/${str}`;
-          } break;
-
-          case `vscode <1.68`: {
-            str = `^/zip${str}`;
-          } break;
-
-          case `vscode`: {
-            str = `^/zip/${str}`;
-          } break;
-
-          // To make "go to definition" work,
-          // We have to resolve the actual file system path from virtual path
-          // and convert scheme to supported by [vim-rzip](https://github.com/lbrayner/vim-rzip)
-          case `coc-nvim`: {
-            str = normalize(resolved).replace(/\.zip\//, `.zip::`);
-            str = resolve(`zipfile:${str}`);
-          } break;
-
-          // Support neovim native LSP and [typescript-language-server](https://github.com/theia-ide/typescript-language-server)
-          // We have to resolve the actual file system path from virtual path,
-          // everything else is up to neovim
-          case `neovim`: {
-            str = normalize(resolved).replace(/\.zip\//, `.zip::`);
-            str = `zipfile://${str}`;
-          } break;
-
-          default: {
-            str = `zip:${str}`;
-          } break;
-        }
-      }
-    }
-
-    return str;
-  }
-
-  function fromEditorPath(str) {
-    switch (hostInfo) {
-      case `coc-nvim`: {
-        str = str.replace(/\.zip::/, `.zip/`);
-        // The path for coc-nvim is in format of /<pwd>/zipfile:/<pwd>/.yarn/...
-        // So in order to convert it back, we use .* to match all the thing
-        // before `zipfile:`
-        return process.platform === `win32`
-          ? str.replace(/^.*zipfile:\//, ``)
-          : str.replace(/^.*zipfile:/, ``);
-      } break;
-
-      case `neovim`: {
-        str = str.replace(/\.zip::/, `.zip/`);
-        // The path for neovim is in format of zipfile:///<pwd>/.yarn/...
-        return str.replace(/^zipfile:\/\//, ``);
-      } break;
-
-      case `vscode`:
-      default: {
-        return str.replace(/^\^?(zip:|\/zip(\/ts-nul-authority)?)\/+/, process.platform === `win32` ? `` : `/`)
-      } break;
-    }
-  }
-
-  // Force enable 'allowLocalPluginLoads'
-  // TypeScript tries to resolve plugins using a path relative to itself
-  // which doesn't work when using the global cache
-  // https://github.com/microsoft/TypeScript/blob/1b57a0395e0bff191581c9606aab92832001de62/src/server/project.ts#L2238
-  // VSCode doesn't want to enable 'allowLocalPluginLoads' due to security concerns but
-  // TypeScript already does local loads and if this code is running the user trusts the workspace
-  // https://github.com/microsoft/vscode/issues/45856
-  const ConfiguredProject = tsserver.server.ConfiguredProject;
-  const {enablePluginsWithOptions: originalEnablePluginsWithOptions} = ConfiguredProject.prototype;
-  ConfiguredProject.prototype.enablePluginsWithOptions = function() {
-    this.projectService.allowLocalPluginLoads = true;
-    return originalEnablePluginsWithOptions.apply(this, arguments);
-  };
-
-  // And here is the point where we hijack the VSCode <-> TS communications
-  // by adding ourselves in the middle. We locate everything that looks
-  // like an absolute path of ours and normalize it.
-
-  const Session = tsserver.server.Session;
-  const {onMessage: originalOnMessage, send: originalSend} = Session.prototype;
-  let hostInfo = `unknown`;
-
-  Object.assign(Session.prototype, {
-    onMessage(/** @type {string | object} */ message) {
-      const isStringMessage = typeof message === 'string';
-      const parsedMessage = isStringMessage ? JSON.parse(message) : message;
-
-      if (
-        parsedMessage != null &&
-        typeof parsedMessage === `object` &&
-        parsedMessage.arguments &&
-        typeof parsedMessage.arguments.hostInfo === `string`
-      ) {
-        hostInfo = parsedMessage.arguments.hostInfo;
-        if (hostInfo === `vscode` && process.env.VSCODE_IPC_HOOK) {
-          const [, major, minor] = (process.env.VSCODE_IPC_HOOK.match(
-            // The RegExp from https://semver.org/ but without the caret at the start
-            /(0|[1-9]\d*)\.(0|[1-9]\d*)\.(0|[1-9]\d*)(?:-((?:0|[1-9]\d*|\d*[a-zA-Z-][0-9a-zA-Z-]*)(?:\.(?:0|[1-9]\d*|\d*[a-zA-Z-][0-9a-zA-Z-]*))*))?(?:\+([0-9a-zA-Z-]+(?:\.[0-9a-zA-Z-]+)*))?$/
-          ) ?? []).map(Number)
-
-          if (major === 1) {
-            if (minor < 61) {
-              hostInfo += ` <1.61`;
-            } else if (minor < 66) {
-              hostInfo += ` <1.66`;
-            } else if (minor < 68) {
-              hostInfo += ` <1.68`;
-            }
-          }
-        }
-      }
-
-      const processedMessageJSON = JSON.stringify(parsedMessage, (key, value) => {
-        return typeof value === 'string' ? fromEditorPath(value) : value;
-      });
-
-      return originalOnMessage.call(
-        this,
-        isStringMessage ? processedMessageJSON : JSON.parse(processedMessageJSON)
-      );
-    },
-
-    send(/** @type {any} */ msg) {
-      return originalSend.call(this, JSON.parse(JSON.stringify(msg, (key, value) => {
-        return typeof value === `string` ? toEditorPath(value) : value;
-      })));
-    }
-  });
-
-  return tsserver;
-};
-
-if (existsSync(absPnpApiPath)) {
-  if (!process.versions.pnp) {
-    // Setup the environment to be able to require typescript/lib/tsserverlibrary.js
-    require(absPnpApiPath).setup();
-  }
-}
-
-// Defer to the real typescript/lib/tsserverlibrary.js your application uses
-module.exports = moduleWrapper(absRequire(`typescript/lib/tsserverlibrary.js`));

interface/.yarn/sdks/typescript/lib/typescript.js

@@ -1,20 +0,0 @@
-#!/usr/bin/env node
-
-const {existsSync} = require(`fs`);
-const {createRequire} = require(`module`);
-const {resolve} = require(`path`);
-
-const relPnpApiPath = "../../../../.pnp.cjs";
-
-const absPnpApiPath = resolve(__dirname, relPnpApiPath);
-const absRequire = createRequire(absPnpApiPath);
-
-if (existsSync(absPnpApiPath)) {
-  if (!process.versions.pnp) {
-    // Setup the environment to be able to require typescript/lib/typescript.js
-    require(absPnpApiPath).setup();
-  }
-}
-
-// Defer to the real typescript/lib/typescript.js your application uses
-module.exports = absRequire(`typescript/lib/typescript.js`);

interface/.yarn/sdks/typescript/package.json

@@ -1,6 +0,0 @@
-{
-  "name": "typescript",
-  "version": "5.0.2-sdk",
-  "main": "./lib/typescript.js",
-  "type": "commonjs"
-}

interface/.yarnrc.yml

@@ -1,14 +0,0 @@
-plugins:
-  - path: .yarn/plugins/@yarnpkg/plugin-typescript.cjs
-    spec: '@yarnpkg/plugin-typescript'
-
-yarnPath: .yarn/releases/yarn-3.4.1.cjs
-
-# uing pnp
-# nodeLinker: pnp
-
-# use these if not using PnP and have node_modules
-nodeLinker: node-modules
-compressionLevel: 0
-nmMode: hardlinks-local
-enableGlobalCache: true

interface/eslint.config.js

@@ -0,0 +1,44 @@
+// @ts-check
+import eslint from '@eslint/js';
+import prettierConfig from 'eslint-config-prettier';
+import tseslint from 'typescript-eslint';
+
+export default tseslint.config(
+  eslint.configs.recommended,
+  ...tseslint.configs.recommendedTypeChecked,
+  prettierConfig,
+  {
+    languageOptions: {
+      parserOptions: {
+        project: true,
+        tsconfigRootDir: import.meta.dirname
+      }
+    }
+  },
+  {
+    ignores: [
+      'dist/*',
+      '*.mjs',
+      'build/*',
+      '*.js',
+      '**/*.cjs',
+      '**/unpack.ts',
+      'i18n*.*'
+    ]
+  },
+  {
+    rules: {
+      '@typescript-eslint/no-unsafe-enum-comparison': 'off',
+      '@typescript-eslint/no-unused-expressions': 'off',
+      '@typescript-eslint/no-unsafe-assignment': 'off',
+      '@typescript-eslint/no-unsafe-member-access': 'off',
+      '@typescript-eslint/no-unsafe-call': 'off',
+      '@typescript-eslint/no-misused-promises': [
+        'error',
+        {
+          checksVoidReturn: false
+        }
+      ]
+    }
+  }
+);

interface/package.json

@@ -1,79 +1,67 @@
 {
   "name": "EMS-ESP",
-  "version": "3.6.0",
+  "version": "3.7.2",
-  "description": "build EMS-ESP WebUI",
+  "description": "EMS-ESP WebUI",
-  "homepage": "https://emsesp.github.io/docs",
+  "homepage": "https://emsesp.org",
-  "author": "proddy",
+  "author": "proddy, emsesp.org",
   "license": "MIT",
   "private": true,
+  "type": "module",
   "scripts": {
-    "dev": "vite",
+    "preinstall": "npx only-allow pnpm",
+    "dev": "vite dev",
     "build": "vite build",
-    "build-hosted": "vite build --mode hosted",
     "preview": "vite preview",
-    "preview-standalone": "npm-run-all -p preview typesafe-i18n mock-api",
+    "build-hosted": "typesafe-i18n && vite build --mode hosted",
-    "mock-api": "nodemon --watch ../mock-api ../mock-api/server.js",
+    "preview-standalone": "typesafe-i18n --no-watch && vite build && concurrently -c \"auto\" \"pnpm:mock-rest\" \"vite preview\"",
-    "standalone": "npm-run-all -p dev typesafe-i18n mock-api",
+    "mock-rest": "bun --watch ../mock-api/restServer.ts",
-    "typesafe-i18n": "typesafe-i18n",
+    "standalone": "concurrently -c \"auto\" \"typesafe-i18n\" \"pnpm:mock-rest\" \"vite\"",
-    "format": "prettier --write '**/*.{ts,tsx,js,css,json,md}'",
+    "typesafe-i18n": "typesafe-i18n --no-watch",
-    "lint": "eslint . --cache --fix"
+    "webUI": "node progmem-generator.js",
+    "format": "prettier -l -w '**/*.{ts,tsx,js,css,json,md}'",
+    "lint": "eslint . --fix"
   },
   "dependencies": {
-    "@alova/adapter-xhr": "^1.0.1",
+    "@alova/adapter-xhr": "2.2.1",
-    "@emotion/react": "^11.11.1",
+    "@emotion/react": "^11.14.0",
-    "@emotion/styled": "^11.11.0",
+    "@emotion/styled": "^11.14.1",
-    "@mui/icons-material": "^5.14.3",
+    "@mui/icons-material": "^7.3.4",
-    "@mui/material": "^5.14.4",
+    "@mui/material": "^7.3.4",
-    "@preact/compat": "^17.1.2",
+    "@table-library/react-table-library": "4.1.15",
-    "@prefresh/vite": "^2.4.1",
+    "alova": "3.3.4",
-    "@table-library/react-table-library": "4.1.7",
-    "@types/lodash-es": "^4.17.8",
-    "@types/node": "^20.4.9",
-    "@types/react": "^18.2.20",
-    "@types/react-dom": "^18.2.7",
-    "@types/react-router-dom": "^5.3.3",
-    "alova": "^2.10.0",
     "async-validator": "^4.2.5",
-    "history": "^5.3.0",
+    "formidable": "^3.5.4",
-    "jwt-decode": "^3.1.2",
+    "jwt-decode": "^4.0.0",
-    "lodash-es": "^4.17.21",
+    "magic-string": "^0.30.19",
-    "mime-types": "^2.1.35",
+    "mime-types": "^3.0.1",
-    "preact": "^10.16.0",
+    "preact": "^10.27.2",
-    "react": "latest",
+    "react": "^19.2.0",
-    "react-dom": "latest",
+    "react-dom": "^19.2.0",
-    "react-dropzone": "^14.2.3",
+    "react-icons": "^5.5.0",
-    "react-icons": "^4.10.1",
+    "react-router": "^7.9.4",
-    "react-router-dom": "^6.15.0",
+    "react-toastify": "^11.0.5",
-    "react-toastify": "^9.1.3",
+    "typesafe-i18n": "^5.26.2",
-    "sockette": "^2.0.6",
+    "typescript": "^5.9.3"
-    "typesafe-i18n": "^5.26.0",
-    "typescript": "^5.1.6"
   },
   "devDependencies": {
-    "@babel/core": "^7.22.10",
+    "@babel/core": "^7.28.4",
-    "@preact/preset-vite": "^2.5.0",
+    "@eslint/js": "^9.37.0",
-    "@types/babel__core": "^7",
+    "@preact/compat": "^18.3.1",
-    "@typescript-eslint/eslint-plugin": "^6.3.0",
+    "@preact/preset-vite": "^2.10.2",
-    "@typescript-eslint/parser": "^6.3.0",
+    "@trivago/prettier-plugin-sort-imports": "^5.2.2",
-    "eslint": "^8.47.0",
+    "@types/node": "^24.7.2",
-    "eslint-config-airbnb": "^19.0.4",
+    "@types/react": "^19.2.2",
-    "eslint-config-airbnb-typescript": "^17.1.0",
+    "@types/react-dom": "^19.2.2",
-    "eslint-config-prettier": "^9.0.0",
+    "concurrently": "^9.2.1",
-    "eslint-import-resolver-typescript": "^3.6.0",
+    "eslint": "^9.37.0",
-    "eslint-plugin-autofix": "^1.1.0",
+    "eslint-config-prettier": "^10.1.8",
-    "eslint-plugin-import": "^2.28.0",
+    "prettier": "^3.6.2",
-    "eslint-plugin-jsx-a11y": "^6.7.1",
+    "rollup-plugin-visualizer": "^6.0.4",
-    "eslint-plugin-prettier": "alpha",
+    "terser": "^5.44.0",
-    "eslint-plugin-react": "^7.33.1",
+    "typescript-eslint": "^8.46.1",
-    "eslint-plugin-react-hooks": "^4.6.0",
+    "vite": "^7.1.10",
-    "nodemon": "^3.0.1",
+    "vite-plugin-imagemin": "^0.6.1",
-    "npm-run-all": "^4.1.5",
+    "vite-tsconfig-paths": "^5.1.4"
-    "prettier": "^3.0.1",
-    "rollup-plugin-visualizer": "^5.9.2",
-    "terser": "^5.19.2",
-    "vite": "^4.4.9",
-    "vite-plugin-svgr": "^3.2.0",
-    "vite-tsconfig-paths": "^4.2.0"
   },
-  "packageManager": "yarn@3.4.1"
+  "packageManager": "pnpm@10.18.3"
 }

interface/pnpm-workspace.yaml

@@ -0,0 +1,8 @@
+onlyBuiltDependencies:
+  - cwebp-bin
+  - esbuild
+  - gifsicle
+  - jpegtran-bin
+  - mozjpeg
+  - optipng-bin
+  - pngquant-bin

interface/progmem-generator.js

@@ -1,10 +1,33 @@
-const { readdirSync, existsSync, unlinkSync, readFileSync, createWriteStream } = require('fs');
+import crypto from 'crypto';
-const { resolve, relative, sep } = require('path');
+import {
-var zlib = require('zlib');
+  createWriteStream,
-var mime = require('mime-types');
+  existsSync,
+  readFileSync,
+  readdirSync,
+  unlinkSync
+} from 'fs';
+import mime from 'mime-types';
+import { relative, resolve, sep } from 'path';
+import zlib from 'zlib';
 
 const ARDUINO_INCLUDES = '#include <Arduino.h>\n\n';
 const INDENT = '  ';
+const outputPath = '../src/ESP32React/WWWData.h';
+const sourcePath = './dist';
+const bytesPerLine = 20;
+var totalSize = 0;
+
+const generateWWWClass = () =>
+  `typedef std::function<void(const char * uri, const String & contentType, const uint8_t * content, size_t len, const String & hash)> RouteRegistrationHandler;
+// Total size is ${totalSize} bytes
+
+class WWWData {
+${indent}public:
+${indent.repeat(2)}static void registerRoutes(RouteRegistrationHandler handler) {
+${fileInfo.map((file) => `${indent.repeat(3)}handler("${file.uri}", "${file.mimeType}", ${file.variable}, ${file.size}, "${file.hash}");`).join('\n')}
+${indent.repeat(2)}}
+};
+`;
 
 function getFilesSync(dir, files = []) {
   readdirSync(dir, { withFileTypes: true }).forEach((entry) => {
@@ -18,10 +41,6 @@ function getFilesSync(dir, files = []) {
   return files;
 }
 
-// function coherseToBuffer(input) {
-//   return Buffer.isBuffer(input) ? input : Buffer.from(input);
-// }
-
 function cleanAndOpen(path) {
   if (existsSync(path)) {
     unlinkSync(path);
@@ -29,90 +48,68 @@ function cleanAndOpen(path) {
   return createWriteStream(path, { flags: 'w+' });
 }
 
-export default function ProgmemGenerator({ outputPath = './WWWData.h', bytesPerLine = 20 }) {
+const writeFile = (relativeFilePath, buffer) => {
-  return {
+  const variable = 'ESP_REACT_DATA_' + fileInfo.length;
-    name: 'ProgmemGenerator',
+  const mimeType = mime.lookup(relativeFilePath);
-    writeBundle: () => {
+  var size = 0;
-      console.log('Generating ' + outputPath);
+  writeStream.write('const uint8_t ' + variable + '[] = {');
-      const includes = ARDUINO_INCLUDES;
+  // const zipBuffer = zlib.brotliCompressSync(buffer, { quality: 1 });
-      const indent = INDENT;
+  const zipBuffer = zlib.gzipSync(buffer, { level: 9 });
-      const fileInfo = [];
-      const writeStream = cleanAndOpen(resolve(outputPath));
 
-      try {
+  // create sha
-        const writeIncludes = () => {
+  const hashSum = crypto.createHash('sha256');
-          writeStream.write(includes);
+  hashSum.update(zipBuffer);
-        };
+  const hash = hashSum.digest('hex');
 
-        const writeFile = (relativeFilePath, buffer) => {
+  zipBuffer.forEach((b) => {
-          const variable = 'ESP_REACT_DATA_' + fileInfo.length;
+    if (!(size % bytesPerLine)) {
-          const mimeType = mime.lookup(relativeFilePath);
+      writeStream.write('\n');
-          var size = 0;
+      writeStream.write(indent);
-          writeStream.write('const uint8_t ' + variable + '[] = {');
-          // const zipBuffer = zlib.brotliCompressSync(buffer, { quality: 1 });
-          const zipBuffer = zlib.gzipSync(buffer);
-          zipBuffer.forEach((b) => {
-            if (!(size % bytesPerLine)) {
-              writeStream.write('\n');
-              writeStream.write(indent);
-            }
-            writeStream.write('0x' + ('00' + b.toString(16).toUpperCase()).substr(-2) + ',');
-            size++;
-          });
-          if (size % bytesPerLine) {
-            writeStream.write('\n');
-          }
-          writeStream.write('};\n\n');
-          fileInfo.push({
-            uri: '/' + relativeFilePath.replace(sep, '/'),
-            mimeType,
-            variable,
-            size
-          });
-        };
-
-        const writeFiles = () => {
-          // process static files
-          const buildPath = resolve('build');
-          for (const filePath of getFilesSync(buildPath)) {
-            const readStream = readFileSync(filePath);
-            const relativeFilePath = relative(buildPath, filePath);
-            writeFile(relativeFilePath, readStream);
-          }
-
-          // process assets
-          // const { assets } = compilation;
-          // Object.keys(assets).forEach((relativeFilePath) => {
-          //   writeFile(relativeFilePath, coherseToBuffer(assets[relativeFilePath].source()));
-          // });
-        };
-
-        const generateWWWClass = () =>
-          `typedef std::function<void(const String& uri, const String& contentType, const uint8_t * content, size_t len)> RouteRegistrationHandler;
-
-class WWWData {
-${indent}public:
-${indent.repeat(2)}static void registerRoutes(RouteRegistrationHandler handler) {
-${fileInfo
-  .map((file) => `${indent.repeat(3)}handler("${file.uri}", "${file.mimeType}", ${file.variable}, ${file.size});`)
-  .join('\n')}
-${indent.repeat(2)}}
-};
-`;
-        const writeWWWClass = () => {
-          writeStream.write(generateWWWClass());
-        };
-
-        writeIncludes();
-        writeFiles();
-        writeWWWClass();
-
-        writeStream.on('finish', () => {
-          // callback();
-        });
-      } finally {
-        writeStream.end();
-      }
     }
-  };
+    writeStream.write('0x' + ('00' + b.toString(16).toUpperCase()).slice(-2) + ',');
+    size++;
+  });
+
+  if (size % bytesPerLine) {
+    writeStream.write('\n');
+  }
+
+  writeStream.write('};\n\n');
+
+  fileInfo.push({
+    uri: '/' + relativeFilePath.replace(sep, '/'),
+    mimeType,
+    variable,
+    size,
+    hash
+  });
+
+  // console.log(relativeFilePath + ' (size ' + size + ' bytes)');
+  totalSize += size;
+};
+
+// start
+console.log('Generating ' + outputPath + ' from ' + sourcePath);
+const includes = ARDUINO_INCLUDES;
+const indent = INDENT;
+const fileInfo = [];
+const writeStream = cleanAndOpen(resolve(outputPath));
+
+// includes
+writeStream.write(includes);
+
+// process static files
+const buildPath = resolve(sourcePath);
+for (const filePath of getFilesSync(buildPath)) {
+  const readStream = readFileSync(filePath);
+  const relativeFilePath = relative(buildPath, filePath);
+  writeFile(relativeFilePath, readStream);
 }
+
+// add class
+writeStream.write(generateWWWClass());
+
+// end
+writeStream.end();
+
+console.log('Total size: ' + totalSize / 1000 + ' KB');

interface/public/css/roboto.css

@@ -1,5 +1,6 @@
 /*
-* Uses font-size 400 (normal) only and Latin (plus extra unicode chars) to keep flash memory to a minimum
+* Uses font-weight 400 (normal) only, no bold, and Latin with a few extra unicode chars.
+* This is to keep flash memory to a minimum
 * View fonts on https://fonts.google.com/
 * Download woff2 using e.g. https://fonts.googleapis.com/css2?family=Lato or https://fonts.googleapis.com/css2?family=Roboto
 */
@@ -12,7 +13,9 @@
     local('Roboto'),
     local('Roboto-Regular'),
     url(../fonts/re.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0104-0107, U+0118-0119, U+011E-011F, U+0130-0131, U+0141-0144, U+0152-0153, U+015A-015B,
+  unicode-range:
-    U+015E-015F, U+0179-017C, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193,
+    U+0000-00FF, U+0104-0107, U+0118-0119, U+011E-011F, U+0130-0131, U+0141-0144,
-    U+2212, U+2215, U+FEFF, U+FFFD;
+    U+0152-0153, U+015A-015B, U+015E-015F, U+0179-017C, U+02BB-02BC, U+02C6, U+02DA,
+    U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
+    U+FEFF, U+FFFD;
 }

interface/src/App.tsx

@@ -1,48 +1,62 @@
 import { useEffect, useState } from 'react';
-import { ToastContainer, Slide } from 'react-toastify';
+import { ToastContainer, Zoom } from 'react-toastify';
 
-import 'react-toastify/dist/ReactToastify.min.css';
-
-import { localStorageDetector } from 'typesafe-i18n/detectors';
-import { FeaturesLoader } from './contexts/features';
-import type { FC } from 'react';
 import AppRouting from 'AppRouting';
 import CustomTheme from 'CustomTheme';
-
 import TypesafeI18n from 'i18n/i18n-react';
-import { detectLocale } from 'i18n/i18n-util';
+import type { Locales } from 'i18n/i18n-types';
 import { loadLocaleAsync } from 'i18n/i18n-util.async';
+import { detectLocale, navigatorDetector } from 'typesafe-i18n/detectors';
 
-const detectedLocale = detectLocale(localStorageDetector);
+const availableLocales = [
+  'de',
+  'en',
+  'it',
+  'fr',
+  'nl',
+  'no',
+  'pl',
+  'sk',
+  'sv',
+  'tr',
+  'cz'
+];
 
-const App: FC = () => {
+const App = () => {
   const [wasLoaded, setWasLoaded] = useState(false);
+  const [locale, setLocale] = useState<Locales>('en');
 
   useEffect(() => {
-    void loadLocaleAsync(detectedLocale).then(() => setWasLoaded(true));
+    // determine locale, take from session if set other default to browser language
+    const browserLocale = detectLocale('en', availableLocales, navigatorDetector);
+    const newLocale = (localStorage.getItem('lang') || browserLocale) as Locales;
+    localStorage.setItem('lang', newLocale);
+    setLocale(newLocale);
+    void loadLocaleAsync(newLocale).then(() => setWasLoaded(true));
   }, []);
 
   if (!wasLoaded) return null;
 
   return (
-    <TypesafeI18n locale={detectedLocale}>
+    <TypesafeI18n locale={locale}>
       <CustomTheme>
-        <FeaturesLoader>
+        <AppRouting />
-          <AppRouting />
-        </FeaturesLoader>
         <ToastContainer
           position="bottom-left"
           autoClose={3000}
           hideProgressBar={false}
           newestOnTop={false}
-          closeOnClick={true}
+          closeOnClick
           rtl={false}
-          pauseOnFocusLoss={false}
+          pauseOnFocusLoss
           draggable={false}
           pauseOnHover={false}
-          transition={Slide}
+          transition={Zoom}
           closeButton={false}
-          theme="light"
+          theme="dark"
+          toastStyle={{
+            border: '1px solid #177ac9'
+          }}
         />
       </CustomTheme>
     </TypesafeI18n>

interface/src/AppRouting.tsx

@@ -1,14 +1,10 @@
 import { useContext, useEffect } from 'react';
-
+import { Navigate, Route, Routes } from 'react-router';
-import { Route, Routes, Navigate, useLocation } from 'react-router-dom';
-
 import { toast } from 'react-toastify';
-import type { FC } from 'react';
 
 import AuthenticatedRouting from 'AuthenticatedRouting';
 import SignIn from 'SignIn';
 import { RequireAuthenticated, RequireUnauthenticated } from 'components';
-
 import { Authentication, AuthenticationContext } from 'contexts/authentication';
 import { useI18nContext } from 'i18n/i18n-react';
 
@@ -17,7 +13,7 @@ interface SecurityRedirectProps {
   signOut?: boolean;
 }
 
-const RootRedirect: FC<SecurityRedirectProps> = ({ message, signOut }) => {
+const RootRedirect = ({ message, signOut }: SecurityRedirectProps) => {
   const authenticationContext = useContext(AuthenticationContext);
   useEffect(() => {
     signOut && authenticationContext.signOut(false);
@@ -26,29 +22,20 @@ const RootRedirect: FC<SecurityRedirectProps> = ({ message, signOut }) => {
   return <Navigate to="/" />;
 };
 
-export const RemoveTrailingSlashes = () => {
+const AppRouting = () => {
-  const location = useLocation();
-  return (
-    location.pathname.match('/.*/$') && (
-      <Navigate
-        to={{
-          pathname: location.pathname.replace(/\/+$/, ''),
-          search: location.search
-        }}
-      />
-    )
-  );
-};
-
-const AppRouting: FC = () => {
   const { LL } = useI18nContext();
 
   return (
     <Authentication>
-      <RemoveTrailingSlashes />
       <Routes>
-        <Route path="/unauthorized" element={<RootRedirect message={LL.PLEASE_SIGNIN()} signOut />} />
+        <Route
-        <Route path="/fileUpdated" element={<RootRedirect message={LL.UPLOAD_SUCCESSFUL()} />} />
+          path="/unauthorized"
+          element={<RootRedirect message={LL.PLEASE_SIGNIN()} signOut />}
+        />
+        <Route
+          path="/fileUpdated"
+          element={<RootRedirect message={LL.UPLOAD_SUCCESSFUL()} />}
+        />
         <Route
           path="/"
           element={

interface/src/AuthenticatedRouting.tsx

@@ -1,64 +1,76 @@
-import { Navigate, Routes, Route } from 'react-router-dom';
+import { useContext } from 'react';
-import Dashboard from './project/Dashboard';
+import { Navigate, Route, Routes } from 'react-router';
-import Help from './project/Help';
-import Settings from './project/Settings';
-import type { FC } from 'react';
 
-import { Layout, RequireAdmin } from 'components';
+import CustomEntities from 'app/main/CustomEntities';
-import AccessPoint from 'framework/ap/AccessPoint';
+import Customizations from 'app/main/Customizations';
-import Mqtt from 'framework/mqtt/Mqtt';
+import Dashboard from 'app/main/Dashboard';
-import NetworkConnection from 'framework/network/NetworkConnection';
+import Devices from 'app/main/Devices';
-import NetworkTime from 'framework/ntp/NetworkTime';
+import Help from 'app/main/Help';
-import Security from 'framework/security/Security';
+import Modules from 'app/main/Modules';
-import System from 'framework/system/System';
+import Scheduler from 'app/main/Scheduler';
+import Sensors from 'app/main/Sensors';
+import APSettings from 'app/settings/APSettings';
+import ApplicationSettings from 'app/settings/ApplicationSettings';
+import DownloadUpload from 'app/settings/DownloadUpload';
+import MqttSettings from 'app/settings/MqttSettings';
+import NTPSettings from 'app/settings/NTPSettings';
+import Settings from 'app/settings/Settings';
+import Network from 'app/settings/network/Network';
+import Security from 'app/settings/security/Security';
+import APStatus from 'app/status/APStatus';
+import Activity from 'app/status/Activity';
+import HardwareStatus from 'app/status/HardwareStatus';
+import MqttStatus from 'app/status/MqttStatus';
+import NTPStatus from 'app/status/NTPStatus';
+import NetworkStatus from 'app/status/NetworkStatus';
+import Status from 'app/status/Status';
+import SystemLog from 'app/status/SystemLog';
+import Version from 'app/status/Version';
+import { Layout } from 'components';
+import { AuthenticatedContext } from 'contexts/authentication';
 
-const AuthenticatedRouting: FC = () => (
+const AuthenticatedRouting = () => {
-  // const location = useLocation();
+  const { me } = useContext(AuthenticatedContext);
-  // const navigate = useNavigate();
+  return (
-  // const handleApiResponseError = useCallback(
+    <Layout>
-  //   (error: AxiosError) => {
+      <Routes>
-  //     if (error.response && error.response.status === 401) {
+        <Route path="/dashboard/*" element={<Dashboard />} />
-  //       AuthenticationApi.storeLoginRedirect(location);
+        <Route path="/devices/*" element={<Devices />} />
-  //       navigate('/unauthorized');
+        <Route path="/sensors/*" element={<Sensors />} />
-  //     }
+        <Route path="/status/*" element={<Status />} />
-  //     return Promise.reject(error);
+        <Route path="/help/*" element={<Help />} />
-  //   },
+        <Route path="/*" element={<Navigate to="/" />} />
-  //   [location, navigate]
-  // );
-  // useEffect(() => {
-  //   const axiosHandlerId = AXIOS.interceptors.response.use((response) => response, handleApiResponseError);
-  //   return () => AXIOS.interceptors.response.eject(axiosHandlerId);
-  // }, [handleApiResponseError]);
 
-  <Layout>
+        <Route path="/status/hardwarestatus/*" element={<HardwareStatus />} />
-    <Routes>
+        <Route path="/status/activity" element={<Activity />} />
-      <Route path="/dashboard/*" element={<Dashboard />} />
+        <Route path="/status/log" element={<SystemLog />} />
-      <Route
+        <Route path="/status/mqtt" element={<MqttStatus />} />
-        path="/settings/*"
+        <Route path="/status/ntp" element={<NTPStatus />} />
-        element={
+        <Route path="/status/ap" element={<APStatus />} />
-          <RequireAdmin>
+        <Route path="/status/network" element={<NetworkStatus />} />
-            <Settings />
+        <Route path="/status/version" element={<Version />} />
-          </RequireAdmin>
-        }
-      />
-      <Route path="/help/*" element={<Help />} />
 
-      <Route path="/network/*" element={<NetworkConnection />} />
+        {me.admin && (
-      <Route path="/ap/*" element={<AccessPoint />} />
+          <>
-      <Route path="/ntp/*" element={<NetworkTime />} />
+            <Route path="/settings" element={<Settings />} />
-      <Route path="/mqtt/*" element={<Mqtt />} />
+            <Route path="/settings/application" element={<ApplicationSettings />} />
-      <Route
+            <Route path="/settings/mqtt" element={<MqttSettings />} />
-        path="/security/*"
+            <Route path="/settings/ntp" element={<NTPSettings />} />
-        element={
+            <Route path="/settings/ap" element={<APSettings />} />
-          <RequireAdmin>
+            <Route path="/settings/modules" element={<Modules />} />
-            <Security />
+            <Route path="/settings/downloadUpload" element={<DownloadUpload />} />
-          </RequireAdmin>
+
-        }
+            <Route path="/settings/network/*" element={<Network />} />
-      />
+            <Route path="/settings/security/*" element={<Security />} />
-      <Route path="/system/*" element={<System />} />
+
-      <Route path="/*" element={<Navigate to="/" />} />
+            <Route path="/customizations" element={<Customizations />} />
-    </Routes>
+            <Route path="/scheduler" element={<Scheduler />} />
-  </Layout>
+            <Route path="/customentities" element={<CustomEntities />} />
-);
+          </>
+        )}
+      </Routes>
+    </Layout>
+  );
+};
 
 export default AuthenticatedRouting;

interface/src/CustomTheme.tsx

@@ -1,7 +1,8 @@
-import { CssBaseline } from '@mui/material';
-import { createTheme, responsiveFontSizes, ThemeProvider } from '@mui/material/styles';
 import type { FC } from 'react';
 
+import { CssBaseline, ThemeProvider, responsiveFontSizes } from '@mui/material';
+import { createTheme } from '@mui/material/styles';
+
 import type { RequiredChildrenProps } from 'utils';
 
 export const dialogStyle = {
@@ -10,8 +11,7 @@ export const dialogStyle = {
     borderColor: '#565656',
     borderStyle: 'solid',
     borderWidth: '1px'
-  },
+  }
-  backdropFilter: 'blur(1px)'
 };
 
 const theme = responsiveFontSizes(
@@ -26,6 +26,9 @@ const theme = responsiveFontSizes(
       },
       info: {
         main: '#607d8b' // blueGrey[500]
+      },
+      text: {
+        disabled: '#eee' // white
       }
     }
   })

interface/src/SignIn.tsx

@@ -1,40 +1,28 @@
-import ForwardIcon from '@mui/icons-material/Forward';
-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 ForwardIcon from '@mui/icons-material/Forward';
+import { Box, Button, Paper, Typography } from '@mui/material';
+
+import * as AuthenticationApi from 'components/routing/authentication';
+import { useRequest } from 'alova/client';
 import type { ValidateFieldsError } from 'async-validator';
-
+import {
-import type { Locales } from 'i18n/i18n-types';
+  LanguageSelector,
-import type { ChangeEventHandler, FC } from 'react';
+  ValidatedPasswordField,
-import type { SignInRequest } from 'types';
+  ValidatedTextField
-import * as AuthenticationApi from 'api/authentication';
+} from 'components';
-import { PROJECT_NAME } from 'api/env';
-
-import { ValidatedPasswordField, ValidatedTextField } from 'components';
 import { AuthenticationContext } from 'contexts/authentication';
-
+import { PROJECT_NAME } from 'env';
-import { ReactComponent as DEflag } from 'i18n/DE.svg';
+import { useI18nContext } from 'i18n/i18n-react';
-import { ReactComponent as FRflag } from 'i18n/FR.svg';
+import type { SignInRequest } from 'types';
-import { ReactComponent as GBflag } from 'i18n/GB.svg';
-import { ReactComponent as ITflag } from 'i18n/IT.svg';
-import { ReactComponent as NLflag } from 'i18n/NL.svg';
-import { ReactComponent as NOflag } from 'i18n/NO.svg';
-import { ReactComponent as PLflag } from 'i18n/PL.svg';
-import { ReactComponent as SVflag } from 'i18n/SV.svg';
-import { ReactComponent as TRflag } from 'i18n/TR.svg';
-import { I18nContext } from 'i18n/i18n-react';
-import { loadLocaleAsync } from 'i18n/i18n-util.async';
 import { onEnterCallback, updateValue } from 'utils';
 import { SIGN_IN_REQUEST_VALIDATOR, validate } from 'validators';
 
-const SignIn: FC = () => {
+const SignIn = () => {
   const authenticationContext = useContext(AuthenticationContext);
 
-  const { LL, setLocale, locale } = useContext(I18nContext);
+  const { LL } = useI18nContext();
-
-  const { features } = useContext(FeaturesContext);
 
   const [signInRequest, setSignInRequest] = useState<SignInRequest>({
     username: '',
@@ -43,11 +31,12 @@ const SignIn: FC = () => {
   const [processing, setProcessing] = useState<boolean>(false);
   const [fieldErrors, setFieldErrors] = useState<ValidateFieldsError>();
 
-  const { send: callSignIn, onSuccess } = useRequest((request: SignInRequest) => AuthenticationApi.signIn(request), {
+  const { send: callSignIn } = useRequest(
-    immediate: false
+    (request: SignInRequest) => AuthenticationApi.signIn(request),
-  });
+    {
-
+      immediate: false
-  onSuccess((response) => {
+    }
+  ).onSuccess((response) => {
     if (response.data) {
       authenticationContext.signIn(response.data.access_token);
     }
@@ -56,7 +45,7 @@ const SignIn: FC = () => {
   const updateLoginRequestValue = updateValue(setSignInRequest);
 
   const signIn = async () => {
-    await callSignIn(signInRequest).catch((event) => {
+    await callSignIn(signInRequest).catch((event: Error) => {
       if (event.message === 'Unauthorized') {
         toast.warning(LL.INVALID_LOGIN());
       } else {
@@ -74,21 +63,14 @@ const SignIn: FC = () => {
     try {
       await validate(SIGN_IN_REQUEST_VALIDATOR, signInRequest);
       await signIn();
-    } catch (errors: any) {
+    } catch (error) {
-      setFieldErrors(errors);
+      setFieldErrors(error as ValidateFieldsError);
       setProcessing(false);
     }
   };
 
   const submitOnEnter = onEnterCallback(signIn);
 
-  const onLocaleSelected: ChangeEventHandler<HTMLInputElement> = async ({ target }) => {
-    const loc = target.value as Locales;
-    localStorage.setItem('lang', loc);
-    await loadLocaleAsync(loc);
-    setLocale(loc);
-  };
-
   return (
     <Box
       display="flex"
@@ -111,46 +93,8 @@ const SignIn: FC = () => {
         })}
       >
         <Typography variant="h4">{PROJECT_NAME}</Typography>
-        <Typography variant="subtitle2">{features.version}</Typography>
 
-        <TextField name="locale" variant="outlined" value={locale} onChange={onLocaleSelected} size="small" select>
+        <LanguageSelector />
-          <MenuItem key="de" value="de">
-            <DEflag style={{ width: 16, verticalAlign: 'middle' }} />
-            &nbsp;DE
-          </MenuItem>
-          <MenuItem key="en" value="en">
-            <GBflag style={{ width: 16, verticalAlign: 'middle' }} />
-            &nbsp;EN
-          </MenuItem>
-          <MenuItem key="fr" value="fr">
-            <FRflag style={{ width: 16, verticalAlign: 'middle' }} />
-            &nbsp;FR
-          </MenuItem>
-          <MenuItem key="it" value="it">
-            <ITflag style={{ width: 16, verticalAlign: 'middle' }} />
-            &nbsp;IT
-          </MenuItem>
-          <MenuItem key="nl" value="nl">
-            <NLflag style={{ width: 16, verticalAlign: 'middle' }} />
-            &nbsp;NL
-          </MenuItem>
-          <MenuItem key="no" value="no">
-            <NOflag style={{ width: 16, verticalAlign: 'middle' }} />
-            &nbsp;NO
-          </MenuItem>
-          <MenuItem key="pl" value="pl">
-            <PLflag style={{ width: 16, verticalAlign: 'middle' }} />
-            &nbsp;PL
-          </MenuItem>
-          <MenuItem key="sv" value="sv">
-            <SVflag style={{ width: 16, verticalAlign: 'middle' }} />
-            &nbsp;SV
-          </MenuItem>
-          <MenuItem key="tr" value="tr">
-            <TRflag style={{ width: 16, verticalAlign: 'middle' }} />
-            &nbsp;TR
-          </MenuItem>
-        </TextField>
 
         <Box display="flex" flexDirection="column" alignItems="center">
           <ValidatedTextField
@@ -165,6 +109,12 @@ const SignIn: FC = () => {
             onChange={updateLoginRequestValue}
             margin="normal"
             variant="outlined"
+            slotProps={{
+              input: {
+                autoCapitalize: 'none',
+                autoCorrect: 'off'
+              }
+            }}
           />
           <ValidatedPasswordField
             fieldErrors={fieldErrors}
@@ -181,7 +131,13 @@ const SignIn: FC = () => {
           />
         </Box>
 
-        <Button variant="contained" 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()}
         </Button>

interface/src/api/ap.ts

@@ -1,7 +1,9 @@
+import type { APSettingsType, APStatusType } from 'types';
+
 import { alovaInstance } from './endpoints';
 
-import type { APSettings, APStatus } from 'types';
+export const readAPStatus = () => alovaInstance.Get<APStatusType>('/rest/apStatus');
-
+export const readAPSettings = () =>
-export const readAPStatus = () => alovaInstance.Get<APStatus>('/rest/apStatus');
+  alovaInstance.Get<APSettingsType>('/rest/apSettings');
-export const readAPSettings = () => alovaInstance.Get<APSettings>('/rest/apSettings');
+export const updateAPSettings = (data: APSettingsType) =>
-export const updateAPSettings = (data: APSettings) => alovaInstance.Post<APSettings>('/rest/apSettings', data);
+  alovaInstance.Post<APSettingsType>('/rest/apSettings', data);

interface/src/api/app.ts

@@ -0,0 +1,152 @@
+import { alovaInstance } from 'api/endpoints';
+
+import type {
+  APIcall,
+  Action,
+  Activity,
+  CoreData,
+  DashboardData,
+  DeviceData,
+  DeviceEntity,
+  Entities,
+  EntityItem,
+  ModuleItem,
+  Modules,
+  Schedule,
+  ScheduleItem,
+  SensorData,
+  Settings,
+  WriteAnalogSensor,
+  WriteTemperatureSensor
+} from '../app/main/types';
+
+// Dashboard
+export const readDashboard = () =>
+  alovaInstance.Get<DashboardData>('/rest/dashboardData', {
+    responseType: 'arraybuffer' // uses msgpack
+  });
+
+// Devices
+export const readCoreData = () => alovaInstance.Get<CoreData>(`/rest/coreData`);
+export const readDeviceData = (id: number) =>
+  alovaInstance.Get<DeviceData>('/rest/deviceData', {
+    // alovaInstance.Get<DeviceData>(`/rest/deviceData/${id}`, {
+    params: { id },
+    responseType: 'arraybuffer' // uses msgpack
+  });
+export const writeDeviceValue = (data: { id: number; c: string; v: unknown }) =>
+  alovaInstance.Post('/rest/writeDeviceValue', data);
+
+// Application Settings
+export const readSettings = () => alovaInstance.Get<Settings>('/rest/settings');
+export const writeSettings = (data: Settings) =>
+  alovaInstance.Post('/rest/settings', data);
+export const getBoardProfile = (boardProfile: string) =>
+  alovaInstance.Get('/rest/boardProfile', {
+    params: { boardProfile }
+  });
+
+// Sensors
+export const readSensorData = () =>
+  alovaInstance.Get<SensorData>('/rest/sensorData');
+export const writeTemperatureSensor = (ts: WriteTemperatureSensor) =>
+  alovaInstance.Post('/rest/writeTemperatureSensor', ts);
+export const writeAnalogSensor = (as: WriteAnalogSensor) =>
+  alovaInstance.Post('/rest/writeAnalogSensor', as);
+
+// Activity
+export const readActivity = () => alovaInstance.Get<Activity>('/rest/activity');
+
+// API
+export const API = (apiCall: APIcall) => alovaInstance.Post('/api', apiCall);
+
+// Generic action
+export const callAction = (action: Action) =>
+  alovaInstance.Post('/rest/action', action);
+
+// SettingsCustomization
+export const readDeviceEntities = (id: number) =>
+  // alovaInstance.Get<DeviceEntity[]>(`/rest/deviceEntities/${id}`, {
+  alovaInstance.Get<DeviceEntity[]>(`/rest/deviceEntities`, {
+    params: { id },
+    responseType: 'arraybuffer',
+    transform(data) {
+      return (data as DeviceEntity[]).map((de: DeviceEntity) => ({
+        ...de,
+        o_m: de.m,
+        o_cn: de.cn,
+        o_mi: de.mi,
+        o_ma: de.ma
+      }));
+    }
+  });
+export const resetCustomizations = () =>
+  alovaInstance.Post('/rest/resetCustomizations');
+export const writeCustomizationEntities = (data: {
+  id: number;
+  entity_ids: string[];
+}) => alovaInstance.Post('/rest/customizationEntities', data);
+export const writeDeviceName = (data: { id: number; name: string }) =>
+  alovaInstance.Post('/rest/writeDeviceName', data);
+
+// SettingsScheduler
+export const readSchedule = () =>
+  alovaInstance.Get<ScheduleItem[]>('/rest/schedule', {
+    transform(data) {
+      return (data as Schedule).schedule.map((si: ScheduleItem) => ({
+        ...si,
+        o_id: si.id,
+        o_active: si.active,
+        o_deleted: si.deleted,
+        o_flags: si.flags,
+        o_time: si.time,
+        o_cmd: si.cmd,
+        o_value: si.value,
+        o_name: si.name
+      }));
+    }
+  });
+export const writeSchedule = (data: Schedule) =>
+  alovaInstance.Post('/rest/schedule', data);
+
+// Modules
+export const readModules = () =>
+  alovaInstance.Get<ModuleItem[]>('/rest/modules', {
+    transform(data) {
+      return (data as Modules).modules.map((mi: ModuleItem) => ({
+        ...mi,
+        o_enabled: mi.enabled,
+        o_license: mi.license
+      }));
+    }
+  });
+export const writeModules = (data: {
+  key: string;
+  enabled: boolean;
+  license: string;
+}) => alovaInstance.Post('/rest/modules', data);
+
+// CustomEntities
+export const readCustomEntities = () =>
+  alovaInstance.Get<EntityItem[]>('/rest/customEntities', {
+    transform(data) {
+      return (data as Entities).entities.map((ei: EntityItem) => ({
+        ...ei,
+        o_id: ei.id,
+        o_ram: ei.ram,
+        o_device_id: ei.device_id,
+        o_type_id: ei.type_id,
+        o_offset: ei.offset,
+        o_factor: ei.factor,
+        o_uom: ei.uom,
+        o_value_type: ei.value_type,
+        o_name: ei.name,
+        o_writeable: ei.writeable,
+        o_value: ei.value,
+        o_deleted: ei.deleted,
+        o_hide: ei.hide
+      }));
+    }
+  });
+export const writeCustomEntities = (data: Entities) =>
+  alovaInstance.Post('/rest/customEntities', data);

interface/src/api/endpoints.ts

@@ -1,33 +1,36 @@
-import { xhrRequestAdapter } from '@alova/adapter-xhr';
+import { type AlovaXHRResponse, xhrRequestAdapter } from '@alova/adapter-xhr';
 import { createAlova } from 'alova';
 import ReactHook from 'alova/react';
-import { unpack } from '../api/unpack';
+
+import { unpack } from './unpack';
 
 export const ACCESS_TOKEN = 'access_token';
 
-const host = window.location.host;
-export const WEB_SOCKET_ROOT = 'ws://' + host + '/ws/';
-export const EVENT_SOURCE_ROOT = 'http://' + host + '/es/';
-
 export const alovaInstance = createAlova({
   statesHook: ReactHook,
-  timeout: 3000, // 3 seconds but throwing a timeout error
+  // timeout: 3000, // 3 seconds before throwing a timeout error, default is 0 = none
-  localCache: null,
+  cacheFor: null, // disable cache
-  // localCache: {
+  // cacheFor: {
   //   GET: {
-  //     mode: 'placeholder', // see https://alova.js.org/learning/response-cache/#cache-replaceholder-mode
+  //     mode: 'memory',
-  //     expire: 2000
+  //     expire: 60 * 10 * 1000 // 60 seconds in cache
   //   }
   // },
   requestAdapter: xhrRequestAdapter(),
   beforeRequest(method) {
     if (localStorage.getItem(ACCESS_TOKEN)) {
-      method.config.headers.Authorization = 'Bearer ' + localStorage.getItem(ACCESS_TOKEN);
+      method.config.headers.Authorization =
+        'Bearer ' + localStorage.getItem(ACCESS_TOKEN);
     }
+    // for simulating very slow networks
+    // return new Promise((resolve) => {
+    //   const random = 3000 + Math.random() * 2000;
+    //   setTimeout(resolve, Math.floor(random));
+    // });
   },
 
   responded: {
-    onSuccess: async (response) => {
+    onSuccess: async (response: AlovaXHRResponse) => {
       // if (response.status === 202) {
       //   throw new Error('Wait'); // wifi scan in progress
       // } else
@@ -38,9 +41,9 @@ export const alovaInstance = createAlova({
       } else if (response.status >= 400) {
         throw new Error(response.statusText);
       }
-      const data = await response.data;
+      const data: ArrayBuffer = (await response.data) as ArrayBuffer;
       if (response.data instanceof ArrayBuffer) {
-        return unpack(data);
+        return unpack(data) as ArrayBuffer;
       }
       return data;
     }
@@ -54,7 +57,10 @@ export const alovaInstance = createAlova({
 });
 
 export const alovaInstanceGH = createAlova({
-  baseURL: 'https://api.github.com/repos/emsesp/EMS-ESP32/releases',
+  baseURL:
+    process.env.NODE_ENV === 'development'
+      ? '/gh'
+      : 'https://api.github.com/repos/emsesp/EMS-ESP32/releases',
   statesHook: ReactHook,
   requestAdapter: xhrRequestAdapter()
 });

interface/src/api/features.ts

@@ -1,5 +0,0 @@
-import { alovaInstance } from './endpoints';
-
-import type { Features } from 'types';
-
-export const readFeatures = () => alovaInstance.Get<Features>('/rest/features');

interface/src/api/mqtt.ts

@@ -1,6 +1,10 @@
-import { alovaInstance } from './endpoints';
+import type { MqttSettingsType, MqttStatusType } from 'types';
-import type { MqttSettings, MqttStatus } from 'types';
 
-export const readMqttStatus = () => alovaInstance.Get<MqttStatus>('/rest/mqttStatus');
+import { alovaInstance } from './endpoints';
-export const readMqttSettings = () => alovaInstance.Get<MqttSettings>('/rest/mqttSettings');
+
-export const updateMqttSettings = (data: MqttSettings) => alovaInstance.Post<MqttSettings>('/rest/mqttSettings', data);
+export const readMqttStatus = () =>
+  alovaInstance.Get<MqttStatusType>('/rest/mqttStatus');
+export const readMqttSettings = () =>
+  alovaInstance.Get<MqttSettingsType>('/rest/mqttSettings');
+export const updateMqttSettings = (data: MqttSettingsType) =>
+  alovaInstance.Post<MqttSettingsType>('/rest/mqttSettings', data);

interface/src/api/network.ts

@@ -1,15 +1,15 @@
+import type { NetworkSettingsType, NetworkStatusType, WiFiNetworkList } from 'types';
+
 import { alovaInstance } from './endpoints';
 
-import type { WiFiNetworkList, NetworkSettings, NetworkStatus } from 'types';
+export const readNetworkStatus = () =>
-
+  alovaInstance.Get<NetworkStatusType>('/rest/networkStatus');
-export const readNetworkStatus = () => alovaInstance.Get<NetworkStatus>('/rest/networkStatus');
 export const scanNetworks = () => alovaInstance.Get('/rest/scanNetworks');
 export const listNetworks = () =>
   alovaInstance.Get<WiFiNetworkList>('/rest/listNetworks', {
-    name: 'listNetworks',
+    timeout: 20000 // 20 seconds
-    timeout: 20000 // timeout 20 seconds
   });
 export const readNetworkSettings = () =>
-  alovaInstance.Get<NetworkSettings>('/rest/networkSettings', { name: 'networkSettings' });
+  alovaInstance.Get<NetworkSettingsType>('/rest/networkSettings');
-export const updateNetworkSettings = (wifiSettings: NetworkSettings) =>
+export const updateNetworkSettings = (wifiSettings: NetworkSettingsType) =>
-  alovaInstance.Post<NetworkSettings>('/rest/networkSettings', wifiSettings);
+  alovaInstance.Post<NetworkSettingsType>('/rest/networkSettings', wifiSettings);

interface/src/api/ntp.ts

@@ -1,11 +1,14 @@
+import type { NTPSettingsType, NTPStatusType, Time } from 'types';
+
 import { alovaInstance } from './endpoints';
-import type { NTPSettings, NTPStatus, Time } from 'types';
 
-export const readNTPStatus = () => alovaInstance.Get<NTPStatus>('/rest/ntpStatus');
+export const readNTPStatus = () =>
+  alovaInstance.Get<NTPStatusType>('/rest/ntpStatus');
+
 export const readNTPSettings = () =>
-  alovaInstance.Get<NTPSettings>('/rest/ntpSettings', {
+  alovaInstance.Get<NTPSettingsType>('/rest/ntpSettings', {});
-    name: 'ntpSettings'
+export const updateNTPSettings = (data: NTPSettingsType) =>
-  });
+  alovaInstance.Post<NTPSettingsType>('/rest/ntpSettings', data);
-export const updateNTPSettings = (data: NTPSettings) => alovaInstance.Post<NTPSettings>('/rest/ntpSettings', data);
 
-export const updateTime = (data: Time) => alovaInstance.Post<Time>('/rest/time', data);
+export const updateTime = (data: Time) =>
+  alovaInstance.Post<Time>('/rest/time', data);

interface/src/api/security.ts

@@ -1,10 +1,11 @@
+import type { SecuritySettingsType, Token } from 'types';
+
 import { alovaInstance } from './endpoints';
 
-import type { SecuritySettings, Token } from 'types';
+export const readSecuritySettings = () =>
+  alovaInstance.Get<SecuritySettingsType>('/rest/securitySettings');
 
-export const readSecuritySettings = () => alovaInstance.Get<SecuritySettings>('/rest/securitySettings');
+export const updateSecuritySettings = (securitySettings: SecuritySettingsType) =>
-
-export const updateSecuritySettings = (securitySettings: SecuritySettings) =>
   alovaInstance.Post('/rest/securitySettings', securitySettings);
 
 export const generateToken = (username?: string) =>

interface/src/api/system.ts

@@ -1,34 +1,38 @@
+import type { LogSettings, SystemStatus } from 'types';
+
 import { alovaInstance, alovaInstanceGH } from './endpoints';
-import type { OTASettings, SystemStatus, LogSettings } from 'types';
 
-// SystemStatus - also used to ping in Restart monitor for pinging
+// systemStatus - also used to ping in System Monitor for pinging
-export const readSystemStatus = () => alovaInstance.Get<SystemStatus>('/rest/systemStatus');
+export const readSystemStatus = () =>
-
+  alovaInstance.Get<SystemStatus>('/rest/systemStatus');
-// commands
-export const restart = () => alovaInstance.Post('/rest/restart');
-export const partition = () => alovaInstance.Post('/rest/partition');
-export const factoryReset = () => alovaInstance.Post('/rest/factoryReset');
-
-// OTA
-export const readOTASettings = () => alovaInstance.Get<OTASettings>(`/rest/otaSettings`);
-export const updateOTASettings = (data: any) => alovaInstance.Post('/rest/otaSettings', data);
 
 // SystemLog
-export const readLogSettings = () => alovaInstance.Get<LogSettings>(`/rest/logSettings`);
+export const readLogSettings = () =>
-export const updateLogSettings = (data: any) => alovaInstance.Post('/rest/logSettings', data);
+  alovaInstance.Get<LogSettings>(`/rest/logSettings`);
-export const fetchLog = () => alovaInstance.Post('/rest/fetchLog');
+export const updateLogSettings = (data: LogSettings) =>
+  alovaInstance.Post('/rest/logSettings', data);
+export const fetchLogES = () => alovaInstance.Get('/es/log');
 
-// Get versions from github
+// Get versions from GitHub
+// cache for 10 minutes to stop getting the IP blocked by GitHub
 export const getStableVersion = () =>
   alovaInstanceGH.Get('latest', {
-    transformData(response: any) {
+    cacheFor: 60 * 10 * 1000,
-      return response.data.name.substring(1);
+    transform(response: { data: { name: string; published_at: string } }) {
+      return {
+        name: response.data.name.substring(1),
+        published_at: response.data.published_at
+      };
     }
   });
 export const getDevVersion = () =>
   alovaInstanceGH.Get('tags/latest', {
-    transformData(response: any) {
+    cacheFor: 60 * 10 * 1000,
-      return response.data.name.split(/\s+/).splice(-1)[0].substring(1);
+    transform(response: { data: { name: string; published_at: string } }) {
+      return {
+        name: response.data.name.split(/\s+/).splice(-1)[0].substring(1),
+        published_at: response.data.published_at
+      };
     }
   });
 
@@ -36,7 +40,6 @@ export const uploadFile = (file: File) => {
   const formData = new FormData();
   formData.append('file', file);
   return alovaInstance.Post('/rest/uploadFile', formData, {
-    timeout: 60000, // override timeout for uploading firmware - 1 minute
+    timeout: 60000 // override timeout for uploading firmware - 1 minute
-    enableUpload: true
   });
 };

interface/src/api/unpack.ts

@@ -38,7 +38,8 @@ try {
 export class Unpackr {
   constructor(options) {
     if (options) {
-      if (options.useRecords === false && options.mapsAsObjects === undefined) options.mapsAsObjects = true;
+      if (options.useRecords === false && options.mapsAsObjects === undefined)
+        options.mapsAsObjects = true;
       if (options.sequential && options.trusted !== false) {
         options.trusted = true;
         if (!options.structures && options.useRecords != false) {
@@ -46,7 +47,8 @@ export class Unpackr {
           if (!options.maxSharedStructures) options.maxSharedStructures = 0;
         }
       }
-      if (options.structures) options.structures.sharedLength = options.structures.length;
+      if (options.structures)
+        options.structures.sharedLength = options.structures.length;
       else if (options.getStructures) {
         (options.structures = []).uninitialized = true; // this is what we use to denote an uninitialized structures
         options.structures.sharedLength = 0;
@@ -63,11 +65,14 @@ export class Unpackr {
       // re-entrant execution, save the state and restore it after we do this unpack
       return saveState(() => {
         clearSource();
-        return this ? this.unpack(source, options) : Unpackr.prototype.unpack.call(defaultOptions, source, options);
+        return this
+          ? this.unpack(source, options)
+          : Unpackr.prototype.unpack.call(defaultOptions, source, options);
       });
     }
     if (!source.buffer && source.constructor === ArrayBuffer)
-      source = typeof Buffer !== 'undefined' ? Buffer.from(source) : new Uint8Array(source);
+      source =
+        typeof Buffer !== 'undefined' ? Buffer.from(source) : new Uint8Array(source);
     if (typeof options === 'object') {
       srcEnd = options.end || source.length;
       position = options.start || 0;
@@ -86,14 +91,21 @@ export class Unpackr {
     // new ones
     try {
       dataView =
-        source.dataView || (source.dataView = new DataView(source.buffer, source.byteOffset, source.byteLength));
+        source.dataView ||
+        (source.dataView = new DataView(
+          source.buffer,
+          source.byteOffset,
+          source.byteLength
+        ));
     } catch (error) {
       // if it doesn't have a buffer, maybe it is the wrong type of object
       src = null;
       if (source instanceof Uint8Array) throw error;
       throw new Error(
         'Source must be a Uint8Array or Buffer but was a ' +
-          (source && typeof source == 'object' ? source.constructor.name : typeof source)
+          (source && typeof source == 'object'
+            ? source.constructor.name
+            : typeof source)
       );
     }
     if (this instanceof Unpackr) {
@@ -117,7 +129,9 @@ export class Unpackr {
     try {
       sequentialMode = true;
       const size = source.length;
-      const value = this ? this.unpack(source, size) : defaultUnpackr.unpack(source, size);
+      const value = this
+        ? this.unpack(source, size)
+        : defaultUnpackr.unpack(source, size);
       if (forEach) {
         if (forEach(value) === false) return;
         while (position < size) {
@@ -145,9 +159,11 @@ export class Unpackr {
   }
 
   _mergeStructures(loadedStructures, existingStructures) {
-    if (onLoadedStructures) loadedStructures = onLoadedStructures.call(this, loadedStructures);
+    if (onLoadedStructures)
+      loadedStructures = onLoadedStructures.call(this, loadedStructures);
     loadedStructures = loadedStructures || [];
-    if (Object.isFrozen(loadedStructures)) loadedStructures = loadedStructures.map((structure) => structure.slice(0));
+    if (Object.isFrozen(loadedStructures))
+      loadedStructures = loadedStructures.map((structure) => structure.slice(0));
     for (let i = 0, l = loadedStructures.length; i < l; i++) {
       const structure = loadedStructures[i];
       if (structure) {
@@ -162,7 +178,8 @@ export class Unpackr {
         const existing = existingStructures[id];
         if (existing) {
           if (structure)
-            (loadedStructures.restoreStructures || (loadedStructures.restoreStructures = []))[id] = structure;
+            (loadedStructures.restoreStructures ||
+              (loadedStructures.restoreStructures = []))[id] = structure;
           loadedStructures[id] = existing;
         }
       }
@@ -181,10 +198,16 @@ export function checkedRead(options: any) {
   try {
     if (!currentUnpackr.trusted && !sequentialMode) {
       const sharedLength = currentStructures.sharedLength || 0;
-      if (sharedLength < currentStructures.length) currentStructures.length = sharedLength;
+      if (sharedLength < currentStructures.length)
+        currentStructures.length = sharedLength;
     }
     let result;
-    if (currentUnpackr.randomAccessStructure && src[position] < 0x40 && src[position] >= 0x20 && readStruct) {
+    if (
+      currentUnpackr.randomAccessStructure &&
+      src[position] < 0x40 &&
+      src[position] >= 0x20 &&
+      readStruct
+    ) {
       result = readStruct(src, position, srcEnd, currentUnpackr);
       src = null; // dispose of this so that recursive unpack calls don't save state
       if (!(options && options.lazy) && result) result = result.toJSON();
@@ -198,7 +221,8 @@ export function checkedRead(options: any) {
 
     if (position == srcEnd) {
       // finished reading this source, cleanup references
-      if (currentStructures && currentStructures.restoreStructures) restoreStructures();
+      if (currentStructures && currentStructures.restoreStructures)
+        restoreStructures();
       currentStructures = null;
       src = null;
       if (referenceMap) referenceMap = null;
@@ -208,10 +232,9 @@ export function checkedRead(options: any) {
     } else if (!sequentialMode) {
       let jsonView;
       try {
-        jsonView = JSON.stringify(result, (_, value) => (typeof value === 'bigint' ? `${value}n` : value)).slice(
+        jsonView = JSON.stringify(result, (_, value) =>
-          0,
+          typeof value === 'bigint' ? `${value}n` : value
-          100
+        ).slice(0, 100);
-        );
       } catch (error) {
         jsonView = '(JSON view not available ' + error + ')';
       }
@@ -220,9 +243,14 @@ export function checkedRead(options: any) {
     // else more to read, but we are reading sequentially, so don't clear source yet
     return result;
   } catch (error) {
-    if (currentStructures && currentStructures.restoreStructures) restoreStructures();
+    if (currentStructures && currentStructures.restoreStructures)
+      restoreStructures();
     clearSource();
-    if (error instanceof RangeError || error.message.startsWith('Unexpected end of buffer') || position > srcEnd) {
+    if (
+      error instanceof RangeError ||
+      error.message.startsWith('Unexpected end of buffer') ||
+      position > srcEnd
+    ) {
       error.incomplete = true;
     }
     throw error;
@@ -243,7 +271,8 @@ export function read() {
       if (token < 0x40) return token;
       else {
         const structure =
-          currentStructures[token & 0x3f] || (currentUnpackr.getStructures && loadStructures()[token & 0x3f]);
+          currentStructures[token & 0x3f] ||
+          (currentUnpackr.getStructures && loadStructures()[token & 0x3f]);
         if (structure) {
           if (!structure.read) {
             structure.read = createStructureReader(structure, token & 0x3f);
@@ -282,7 +311,10 @@ export function read() {
     // fixstr
     const length = token - 0xa0;
     if (srcStringEnd >= position) {
-      return srcString.slice(position - srcStringStart, (position += length) - srcStringStart);
+      return srcString.slice(
+        position - srcStringStart,
+        (position += length) - srcStringStart
+      );
     }
     if (srcStringEnd == 0 && srcEnd < 140) {
       // for small blocks, avoiding the overhead of the extract call is helpful
@@ -298,8 +330,16 @@ export function read() {
       case 0xc1:
         if (bundledStrings) {
           value = read(); // followed by the length of the string in characters (not bytes!)
-          if (value > 0) return bundledStrings[1].slice(bundledStrings.position1, (bundledStrings.position1 += value));
+          if (value > 0)
-          else return bundledStrings[0].slice(bundledStrings.position0, (bundledStrings.position0 -= value));
+            return bundledStrings[1].slice(
+              bundledStrings.position1,
+              (bundledStrings.position1 += value)
+            );
+          else
+            return bundledStrings[0].slice(
+              bundledStrings.position0,
+              (bundledStrings.position0 -= value)
+            );
         }
         return C1; // "never-used", return special object to denote that
       case 0xc2:
@@ -338,7 +378,8 @@ export function read() {
         value = dataView.getFloat32(position);
         if (currentUnpackr.useFloat32 > 2) {
           // this does rounding of numbers that were encoded in 32-bit float to nearest significant decimal digit that could be preserved
-          const multiplier = mult10[((src[position] & 0x7f) << 1) | (src[position + 1] >> 7)];
+          const multiplier =
+            mult10[((src[position] & 0x7f) << 1) | (src[position + 1] >> 7)];
           position += 4;
           return ((multiplier * value + (value > 0 ? 0.5 : -0.5)) >> 0) / multiplier;
         }
@@ -391,7 +432,8 @@ export function read() {
           value = dataView.getBigInt64(position).toString();
         } else if (currentUnpackr.int64AsType === 'auto') {
           value = dataView.getBigInt64(position);
-          if (value >= BigInt(-2) << BigInt(52) && value <= BigInt(2) << BigInt(52)) value = Number(value);
+          if (value >= BigInt(-2) << BigInt(52) && value <= BigInt(2) << BigInt(52))
+            value = Number(value);
         } else value = dataView.getBigInt64(position);
         position += 8;
         return value;
@@ -433,7 +475,10 @@ export function read() {
         // str 8
         value = src[position++];
         if (srcStringEnd >= position) {
-          return srcString.slice(position - srcStringStart, (position += value) - srcStringStart);
+          return srcString.slice(
+            position - srcStringStart,
+            (position += value) - srcStringStart
+          );
         }
         return readString8(value);
       case 0xda:
@@ -441,7 +486,10 @@ export function read() {
         value = dataView.getUint16(position);
         position += 2;
         if (srcStringEnd >= position) {
-          return srcString.slice(position - srcStringStart, (position += value) - srcStringStart);
+          return srcString.slice(
+            position - srcStringStart,
+            (position += value) - srcStringStart
+          );
         }
         return readString16(value);
       case 0xdb:
@@ -449,7 +497,10 @@ export function read() {
         value = dataView.getUint32(position);
         position += 4;
         if (srcStringEnd >= position) {
-          return srcString.slice(position - srcStringStart, (position += value) - srcStringStart);
+          return srcString.slice(
+            position - srcStringStart,
+            (position += value) - srcStringStart
+          );
         }
         return readString32(value);
       case 0xdc:
@@ -498,13 +549,14 @@ function createStructureReader(structure, firstId) {
               key === '__proto__'
                 ? '__proto_:r()'
                 : validName.test(key)
-                ? key + ':r()'
+                  ? key + ':r()'
-                : '[' + JSON.stringify(key) + ']:r()'
+                  : '[' + JSON.stringify(key) + ']:r()'
             )
             .join(',') +
           '})}'
       )(read));
-      if (structure.highByte === 0) structure.read = createSecondByteReader(firstId, structure.read);
+      if (structure.highByte === 0)
+        structure.read = createSecondByteReader(firstId, structure.read);
       return readObject(); // second byte is already read, if there is one so immediately read object
     }
     const object = {};
@@ -527,7 +579,8 @@ const createSecondByteReader = (firstId, read0) =>
   function () {
     const highByte = src[position++];
     if (highByte === 0) return read0();
-    const id = firstId < 32 ? -(firstId + (highByte << 5)) : firstId + (highByte << 5);
+    const id =
+      firstId < 32 ? -(firstId + (highByte << 5)) : firstId + (highByte << 5);
     const structure = currentStructures[id] || loadStructures()[id];
     if (!structure) {
       throw new Error('Record id is not defined for ' + id);
@@ -542,7 +595,10 @@ export function loadStructures() {
     src = null;
     return currentUnpackr.getStructures();
   });
-  return (currentStructures = currentUnpackr._mergeStructures(loadedStructures, currentStructures));
+  return (currentStructures = currentUnpackr._mergeStructures(
+    loadedStructures,
+    currentStructures
+  ));
 }
 
 var readFixedString = readStringJS;
@@ -563,7 +619,11 @@ export function setExtractor(extractStrings) {
       if (string == null) {
         if (bundledStrings) return readStringJS(length);
         const byteOffset = src.byteOffset;
-        const extraction = extractStrings(position - headerLength + byteOffset, srcEnd + byteOffset, src.buffer);
+        const extraction = extractStrings(
+          position - headerLength + byteOffset,
+          srcEnd + byteOffset,
+          src.buffer
+        );
         if (typeof extraction == 'string') {
           string = extraction;
           strings = EMPTY_ARRAY;
@@ -593,7 +653,8 @@ function readStringJS(length) {
   if (length < 16) {
     if ((result = shortStringInJS(length))) return result;
   }
-  if (length > 64 && decoder) return decoder.decode(src.subarray(position, (position += length)));
+  if (length > 64 && decoder)
+    return decoder.decode(src.subarray(position, (position += length)));
   const end = position + length;
   const units = [];
   result = '';
@@ -616,7 +677,8 @@ function readStringJS(length) {
       const byte2 = src[position++] & 0x3f;
       const byte3 = src[position++] & 0x3f;
       const byte4 = src[position++] & 0x3f;
-      let unit = ((byte1 & 0x07) << 0x12) | (byte2 << 0x0c) | (byte3 << 0x06) | byte4;
+      let unit =
+        ((byte1 & 0x07) << 0x12) | (byte2 << 0x0c) | (byte3 << 0x06) | byte4;
       if (unit > 0xffff) {
         unit -= 0x10000;
         units.push(((unit >>> 10) & 0x3ff) | 0xd800);
@@ -810,7 +872,8 @@ function shortStringInJS(length) {
             position -= 14;
             return;
           }
-          if (length < 15) return fromCharCode(a, b, c, d, e, f, g, h, i, j, k, l, m, n);
+          if (length < 15)
+            return fromCharCode(a, b, c, d, e, f, g, h, i, j, k, l, m, n);
           const o = src[position++];
           if ((o & 0x80) > 0) {
             position -= 15;
@@ -862,14 +925,17 @@ function readExt(length) {
   const type = src[position++];
   if (currentExtensions[type]) {
     let end;
-    return currentExtensions[type](src.subarray(position, (end = position += length)), (readPosition) => {
+    return currentExtensions[type](
-      position = readPosition;
+      src.subarray(position, (end = position += length)),
-      try {
+      (readPosition) => {
-        return read();
+        position = readPosition;
-      } finally {
+        try {
-        position = end;
+          return read();
+        } finally {
+          position = end;
+        }
       }
-    });
+    );
   } else throw new Error('Unknown extension type ' + type);
 }
 
@@ -881,14 +947,20 @@ function readKey() {
     length = length - 0xa0;
     if (srcStringEnd >= position)
       // if it has been extracted, must use it (and faster anyway)
-      return srcString.slice(position - srcStringStart, (position += length) - srcStringStart);
+      return srcString.slice(
+        position - srcStringStart,
+        (position += length) - srcStringStart
+      );
     else if (!(srcStringEnd == 0 && srcEnd < 180)) return readFixedString(length);
   } else {
     // not cacheable, go back and do a standard read
     position--;
     return read().toString();
   }
-  const key = ((length << 5) ^ (length > 1 ? dataView.getUint16(position) : length > 0 ? src[position] : 0)) & 0xfff;
+  const key =
+    ((length << 5) ^
+      (length > 1 ? dataView.getUint16(position) : length > 0 ? src[position] : 0)) &
+    0xfff;
   let entry = keyCache[key];
   let checkPosition = position;
   let end = position + length - 3;
@@ -947,7 +1019,8 @@ const recordDefinition = (id, highByte) => {
   }
   const existingStructure = currentStructures[id];
   if (existingStructure && existingStructure.isShared) {
-    (currentStructures.restoreStructures || (currentStructures.restoreStructures = []))[id] = existingStructure;
+    (currentStructures.restoreStructures ||
+      (currentStructures.restoreStructures = []))[id] = existingStructure;
   }
   currentStructures[id] = structure;
   structure.read = createStructureReader(structure, firstByte);
@@ -1009,7 +1082,8 @@ export const typedArrays = [
 currentExtensions[0x74] = (data) => {
   const typeCode = data[0];
   const typedArrayName = typedArrays[typeCode];
-  if (!typedArrayName) throw new Error('Could not find typed array for code ' + typeCode);
+  if (!typedArrayName)
+    throw new Error('Could not find typed array for code ' + typeCode);
   // we have to always slice/copy here to get a new ArrayBuffer that is word/byte aligned
   return new glbl[typedArrayName](Uint8Array.prototype.slice.call(data, 1).buffer);
 };
@@ -1033,11 +1107,20 @@ currentExtensions[0x62] = (data) => {
 
 currentExtensions[0xff] = (data) => {
   // 32-bit date extension
-  if (data.length == 4) return new Date((data[0] * 0x1000000 + (data[1] << 16) + (data[2] << 8) + data[3]) * 1000);
+  if (data.length == 4)
+    return new Date(
+      (data[0] * 0x1000000 + (data[1] << 16) + (data[2] << 8) + data[3]) * 1000
+    );
   else if (data.length == 8)
     return new Date(
-      ((data[0] << 22) + (data[1] << 14) + (data[2] << 6) + (data[3] >> 2)) / 1000000 +
+      ((data[0] << 22) + (data[1] << 14) + (data[2] << 6) + (data[3] >> 2)) /
-        ((data[3] & 0x3) * 0x100000000 + data[4] * 0x1000000 + (data[5] << 16) + (data[6] << 8) + data[7]) * 1000
+        1000000 +
+        ((data[3] & 0x3) * 0x100000000 +
+          data[4] * 0x1000000 +
+          (data[5] << 16) +
+          (data[6] << 8) +
+          data[7]) *
+          1000
     );
   else if (data.length == 12)
     return new Date(
@@ -1070,7 +1153,10 @@ function saveState(callback) {
 
   const savedSrc = new Uint8Array(src.slice(0, srcEnd)); // we copy the data in case it changes while external data is processed
   const savedStructures = currentStructures;
-  const savedStructuresContents = currentStructures.slice(0, currentStructures.length);
+  const savedStructuresContents = currentStructures.slice(
+    0,
+    currentStructures.length
+  );
   const savedPackr = currentUnpackr;
   const savedSequentialMode = sequentialMode;
   const value = callback();
@@ -1122,7 +1208,10 @@ const u8Array = new Uint8Array(f32Array.buffer, 0, 4);
 export function roundFloat32(float32Number) {
   f32Array[0] = float32Number;
   const multiplier = mult10[((u8Array[3] & 0x7f) << 1) | (u8Array[2] >> 7)];
-  return ((multiplier * float32Number + (float32Number > 0 ? 0.5 : -0.5)) >> 0) / multiplier;
+  return (
+    ((multiplier * float32Number + (float32Number > 0 ? 0.5 : -0.5)) >> 0) /
+    multiplier
+  );
 }
 export function setReadStruct(updatedReadStruct, loadedStructs, saveState) {
   readStruct = updatedReadStruct;

interface/src/app/main/CustomEntities.tsx

@@ -1,27 +1,41 @@
-import AddIcon from '@mui/icons-material/Add';
+import { useCallback, useState } from 'react';
-import CancelIcon from '@mui/icons-material/Cancel';
+import { useBlocker } from 'react-router';
-import WarningIcon from '@mui/icons-material/Warning';
-import { Button, Typography, Box } from '@mui/material';
-import { Table, Header, HeaderRow, HeaderCell, Body, Row, Cell } from '@table-library/react-table-library/table';
-import { useTheme } from '@table-library/react-table-library/theme';
-// eslint-disable-next-line import/named
-import { updateState, useRequest } from 'alova';
-import { useState, useCallback } from 'react';
-import { unstable_useBlocker as useBlocker } from 'react-router-dom';
-
 import { toast } from 'react-toastify';
 
-import SettingsEntitiesDialog from './SettingsEntitiesDialog';
+import AddIcon from '@mui/icons-material/Add';
-import * as EMSESP from './api';
+import CancelIcon from '@mui/icons-material/Cancel';
-import { DeviceValueUOM_s } from './types';
+import EditOutlinedIcon from '@mui/icons-material/EditOutlined';
-import { entityItemValidation } from './validators';
+import WarningIcon from '@mui/icons-material/Warning';
-import type { EntityItem } from './types';
+import { Box, Button, Typography } from '@mui/material';
-import type { FC } from 'react';
-import { ButtonRow, FormLoader, SectionContent, BlockNavigation } from 'components';
 
+import {
+  Body,
+  Cell,
+  Header,
+  HeaderCell,
+  HeaderRow,
+  Row,
+  Table
+} from '@table-library/react-table-library/table';
+import { useTheme } from '@table-library/react-table-library/theme';
+import { updateState, useRequest } from 'alova/client';
+import {
+  BlockNavigation,
+  ButtonRow,
+  FormLoader,
+  SectionContent,
+  useLayoutTitle
+} from 'components';
 import { useI18nContext } from 'i18n/i18n-react';
+import { useInterval } from 'utils';
 
-const SettingsEntities: FC = () => {
+import { readCustomEntities, writeCustomEntities } from '../../api/app';
+import SettingsCustomEntitiesDialog from './CustomEntitiesDialog';
+import { DeviceValueTypeNames, DeviceValueUOM_s } from './types';
+import type { Entities, EntityItem } from './types';
+import { entityItemValidation } from './validators';
+
+const CustomEntities = () => {
   const { LL } = useI18nContext();
   const [numChanges, setNumChanges] = useState<number>(0);
   const blocker = useBlocker(numChanges !== 0);
@@ -29,20 +43,31 @@ const SettingsEntities: FC = () => {
   const [creating, setCreating] = useState<boolean>(false);
   const [dialogOpen, setDialogOpen] = useState<boolean>(false);
 
+  useLayoutTitle(LL.CUSTOM_ENTITIES(0));
+
   const {
     data: entities,
     send: fetchEntities,
     error
-  } = useRequest(EMSESP.readEntities, {
+  } = useRequest(readCustomEntities, {
-    initialData: [],
+    initialData: []
-    force: true
   });
 
-  const { send: writeEntities } = useRequest((data) => EMSESP.writeEntities(data), { immediate: false });
+  useInterval(() => {
+    if (!dialogOpen && !numChanges) {
+      void fetchEntities();
+    }
+  });
+
+  const { send: writeEntities } = useRequest(
+    (data: Entities) => writeCustomEntities(data),
+    { immediate: false }
+  );
 
   function hasEntityChanged(ei: EntityItem) {
     return (
       ei.id !== ei.o_id ||
+      ei.ram !== ei.o_ram ||
       (ei?.name || '') !== (ei?.o_name || '') ||
       ei.device_id !== ei.o_device_id ||
       ei.type_id !== ei.o_type_id ||
@@ -51,13 +76,15 @@ const SettingsEntities: FC = () => {
       ei.factor !== ei.o_factor ||
       ei.value_type !== ei.o_value_type ||
       ei.writeable !== ei.o_writeable ||
-      ei.deleted !== ei.o_deleted
+      ei.hide !== ei.o_hide ||
+      ei.deleted !== ei.o_deleted ||
+      (ei.value || '') !== (ei.o_value || '')
     );
   }
 
   const entity_theme = useTheme({
     Table: `
-      --data-table-library_grid-template-columns: repeat(1, minmax(60px, 1fr)) minmax(80px, auto) 80px 80px 80px;
+      --data-table-library_grid-template-columns: repeat(1, minmax(60px, 1fr)) minmax(80px, auto) 80px 80px 80px 120px;
     `,
     BaseRow: `
       font-size: 14px;
@@ -81,6 +108,9 @@ const SettingsEntities: FC = () => {
       &:nth-of-type(5) {
         text-align: center;
       }
+      &:nth-of-type(6) {
+        text-align: center;
+      }
     `,
     HeaderRow: `
       text-transform: uppercase;
@@ -96,15 +126,10 @@ const SettingsEntities: FC = () => {
       position: relative;
       cursor: pointer;
       .td {
-        border-top: 1px solid #565656;
         border-bottom: 1px solid #565656;
       }
       &:hover .td {
-        border-top: 1px solid #177ac9;
+        background-color: #177ac9;
-        border-bottom: 1px solid #177ac9;
-      }
-      &:nth-of-type(odd) .td {
-        background-color: #303030;
       }
     `
   });
@@ -115,6 +140,7 @@ const SettingsEntities: FC = () => {
         .filter((ei) => !ei.deleted)
         .map((condensed_ei) => ({
           id: condensed_ei.id,
+          ram: condensed_ei.ram,
           name: condensed_ei.name,
           device_id: condensed_ei.device_id,
           type_id: condensed_ei.type_id,
@@ -122,14 +148,16 @@ const SettingsEntities: FC = () => {
           factor: condensed_ei.factor,
           uom: condensed_ei.uom,
           writeable: condensed_ei.writeable,
-          value_type: condensed_ei.value_type
+          hide: condensed_ei.hide,
+          value_type: condensed_ei.value_type,
+          value: condensed_ei.value
         }))
     })
       .then(() => {
         toast.success(LL.ENTITIES_UPDATED());
       })
-      .catch((err) => {
+      .catch((error: Error) => {
-        toast.error(err.message);
+        toast.error(error.message);
       })
       .finally(async () => {
         await fetchEntities();
@@ -155,39 +183,66 @@ const SettingsEntities: FC = () => {
 
   const onDialogSave = (updatedItem: EntityItem) => {
     setDialogOpen(false);
-
+    void updateState(readCustomEntities(), (data: EntityItem[]) => {
-    updateState('entities', (data) => {
       const new_data = creating
-        ? [...data.filter((ei) => creating || ei.o_id !== updatedItem.o_id), updatedItem]
+        ? [
-        : data.map((ei) => (ei.id === updatedItem.id ? { ...ei, ...updatedItem } : ei));
+            ...data.filter((ei) => creating || ei.o_id !== updatedItem.o_id),
+            updatedItem
+          ]
+        : data.map((ei) =>
+            ei.id === updatedItem.id ? { ...ei, ...updatedItem } : ei
+          );
       setNumChanges(new_data.filter((ei) => hasEntityChanged(ei)).length);
       return new_data;
     });
   };
 
+  const onDialogDup = (item: EntityItem) => {
+    setCreating(true);
+    setSelectedEntityItem({
+      id: Math.floor(Math.random() * (Math.floor(200) - 100) + 100),
+      name: item.name + '_',
+      ram: item.ram,
+      device_id: item.device_id,
+      type_id: item.type_id,
+      offset: item.offset,
+      factor: item.factor,
+      uom: item.uom,
+      value_type: item.value_type,
+      writeable: item.writeable,
+      deleted: false,
+      hide: item.hide,
+      value: item.value
+    });
+    setDialogOpen(true);
+  };
+
   const addEntityItem = () => {
     setCreating(true);
     setSelectedEntityItem({
       id: Math.floor(Math.random() * (Math.floor(200) - 100) + 100),
       name: '',
-      device_id: '',
+      ram: 0,
-      type_id: '',
+      device_id: '0',
+      type_id: '0',
       offset: 0,
       factor: 1,
       uom: 0,
       value_type: 0,
       writeable: false,
-      deleted: false
+      deleted: false,
+      value: ''
     });
     setDialogOpen(true);
   };
 
-  function formatValue(value: any, uom: number) {
+  function formatValue(value: unknown, uom: number) {
-    return value === undefined || uom === undefined
+    return value === undefined
       ? ''
       : typeof value === 'number'
-      ? new Intl.NumberFormat().format(value) + (uom === 0 ? '' : ' ' + DeviceValueUOM_s[uom])
+        ? new Intl.NumberFormat().format(value) +
-      : value;
+          (uom === 0 ? '' : ' ' + DeviceValueUOM_s[uom])
+        : (value as string) + (uom === 0 ? '' : ' ' + DeviceValueUOM_s[uom]);
   }
 
   function showHex(value: number, digit: number) {
@@ -200,25 +255,44 @@ const SettingsEntities: FC = () => {
     }
 
     return (
-      <Table data={{ nodes: entities.filter((ei) => !ei.deleted) }} theme={entity_theme} layout={{ custom: true }}>
+      <Table
-        {(tableList: any) => (
+        data={{
+          nodes: entities
+            .filter((ei) => !ei.deleted)
+            .sort((a, b) => a.name.localeCompare(b.name))
+        }}
+        theme={entity_theme}
+        layout={{ custom: true }}
+      >
+        {(tableList: EntityItem[]) => (
           <>
             <Header>
               <HeaderRow>
                 <HeaderCell>{LL.NAME(0)}</HeaderCell>
                 <HeaderCell stiff>{LL.ID_OF(LL.DEVICE())}</HeaderCell>
                 <HeaderCell stiff>{LL.ID_OF(LL.TYPE(1))}</HeaderCell>
-                <HeaderCell stiff>Offset</HeaderCell>
+                <HeaderCell stiff>{LL.OFFSET()}</HeaderCell>
+                <HeaderCell stiff>{LL.TYPE(0)}</HeaderCell>
                 <HeaderCell stiff>{LL.VALUE(0)}</HeaderCell>
               </HeaderRow>
             </Header>
             <Body>
               {tableList.map((ei: EntityItem) => (
                 <Row key={ei.name} item={ei} onClick={() => editEntityItem(ei)}>
-                  <Cell>{ei.name}</Cell>
+                  <Cell>
-                  <Cell>{showHex(ei.device_id as number, 2)}</Cell>
+                    {ei.name}&nbsp;
-                  <Cell>{showHex(ei.type_id as number, 3)}</Cell>
+                    {ei.writeable && (
-                  <Cell>{ei.offset}</Cell>
+                      <EditOutlinedIcon color="primary" sx={{ fontSize: 12 }} />
+                    )}
+                  </Cell>
+                  <Cell>
+                    {ei.ram === 1 ? '' : showHex(ei.device_id as number, 2)}
+                  </Cell>
+                  <Cell>{ei.ram === 1 ? '' : showHex(ei.type_id as number, 3)}</Cell>
+                  <Cell>{ei.ram === 1 ? '' : ei.offset}</Cell>
+                  <Cell>
+                    {ei.ram === 1 ? 'RAM' : DeviceValueTypeNames[ei.value_type]}
+                  </Cell>
                   <Cell>{formatValue(ei.value, ei.uom)}</Cell>
                 </Row>
               ))}
@@ -230,30 +304,36 @@ const SettingsEntities: FC = () => {
   };
 
   return (
-    <SectionContent title={LL.CUSTOM_ENTITIES(0)} titleGutter>
+    <SectionContent>
       {blocker ? <BlockNavigation blocker={blocker} /> : null}
       <Box mb={2} color="warning.main">
-        <Typography variant="body2">{LL.ENTITIES_HELP_1()}</Typography>
+        <Typography variant="body1">{LL.ENTITIES_HELP_1()}.</Typography>
       </Box>
 
       {renderEntity()}
 
       {selectedEntityItem && (
-        <SettingsEntitiesDialog
+        <SettingsCustomEntitiesDialog
           open={dialogOpen}
           creating={creating}
           onClose={onDialogClose}
           onSave={onDialogSave}
+          onDup={onDialogDup}
           selectedItem={selectedEntityItem}
-          validator={entityItemValidation()}
+          validator={entityItemValidation(entities, selectedEntityItem)}
         />
       )}
 
-      <Box display="flex" flexWrap="wrap">
+      <Box mt={1} display="flex" flexWrap="wrap">
         <Box flexGrow={1}>
           {numChanges > 0 && (
             <ButtonRow>
-              <Button startIcon={<CancelIcon />} variant="outlined" onClick={onDialogCancel} color="secondary">
+              <Button
+                startIcon={<CancelIcon />}
+                variant="outlined"
+                onClick={onDialogCancel}
+                color="secondary"
+              >
                 {LL.CANCEL()}
               </Button>
               <Button
@@ -268,15 +348,18 @@ const SettingsEntities: FC = () => {
           )}
         </Box>
         <Box flexWrap="nowrap" whiteSpace="nowrap">
-          <ButtonRow>
+          <Button
-            <Button startIcon={<AddIcon />} variant="outlined" color="secondary" onClick={addEntityItem}>
+            startIcon={<AddIcon />}
-              {LL.ADD(0)}
+            variant="outlined"
-            </Button>
+            color="primary"
-          </ButtonRow>
+            onClick={addEntityItem}
+          >
+            {LL.ADD(0)}
+          </Button>
         </Box>
       </Box>
     </SectionContent>
   );
 };
 
-export default SettingsEntities;
+export default CustomEntities;

interface/src/app/main/CustomEntitiesDialog.tsx

@@ -0,0 +1,431 @@
+import { useEffect, useState } from 'react';
+
+import AddIcon from '@mui/icons-material/Add';
+import CancelIcon from '@mui/icons-material/Cancel';
+import CommentsDisabledOutlinedIcon from '@mui/icons-material/CommentsDisabledOutlined';
+import DoneIcon from '@mui/icons-material/Done';
+import EditOffOutlinedIcon from '@mui/icons-material/EditOffOutlined';
+import EditOutlinedIcon from '@mui/icons-material/EditOutlined';
+import InsertCommentOutlinedIcon from '@mui/icons-material/InsertCommentOutlined';
+import RemoveIcon from '@mui/icons-material/RemoveCircleOutline';
+import {
+  Box,
+  Button,
+  Checkbox,
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogTitle,
+  Grid,
+  InputAdornment,
+  MenuItem,
+  TextField
+} from '@mui/material';
+
+import { dialogStyle } from 'CustomTheme';
+import type Schema from 'async-validator';
+import type { ValidateFieldsError } from 'async-validator';
+import { BlockFormControlLabel, ValidatedTextField } from 'components';
+import { useI18nContext } from 'i18n/i18n-react';
+import { numberValue, updateValue } from 'utils';
+import { validate } from 'validators';
+
+import { DeviceValueType, DeviceValueTypeNames, DeviceValueUOM_s } from './types';
+import type { EntityItem } from './types';
+
+interface CustomEntitiesDialogProps {
+  open: boolean;
+  creating: boolean;
+  onClose: () => void;
+  onSave: (ei: EntityItem) => void;
+  onDup: (ei: EntityItem) => void;
+  selectedItem: EntityItem;
+  validator: Schema;
+}
+
+const CustomEntitiesDialog = ({
+  open,
+  creating,
+  onClose,
+  onSave,
+  onDup,
+  selectedItem,
+  validator
+}: CustomEntitiesDialogProps) => {
+  const { LL } = useI18nContext();
+  const [editItem, setEditItem] = useState<EntityItem>(selectedItem);
+  const [fieldErrors, setFieldErrors] = useState<ValidateFieldsError>();
+  const updateFormValue = updateValue(setEditItem);
+
+  useEffect(() => {
+    if (open) {
+      setFieldErrors(undefined);
+      setEditItem(selectedItem);
+      // convert to hex strings straight away
+      setEditItem({
+        ...selectedItem,
+        device_id: selectedItem.device_id.toString(16).toUpperCase(),
+        type_id: selectedItem.type_id.toString(16).toUpperCase(),
+        factor:
+          selectedItem.value_type === DeviceValueType.BOOL
+            ? selectedItem.factor.toString(16).toUpperCase()
+            : selectedItem.factor
+      });
+    }
+  }, [open, selectedItem]);
+
+  const handleClose = (_event, reason: 'backdropClick' | 'escapeKeyDown') => {
+    if (reason !== 'backdropClick') {
+      onClose();
+    }
+  };
+
+  const save = async () => {
+    try {
+      setFieldErrors(undefined);
+      await validate(validator, editItem);
+      if (typeof editItem.device_id === 'string') {
+        editItem.device_id = parseInt(editItem.device_id, 16);
+      }
+      if (typeof editItem.type_id === 'string') {
+        editItem.type_id = parseInt(editItem.type_id, 16);
+      }
+      if (
+        editItem.value_type === DeviceValueType.BOOL &&
+        typeof editItem.factor === 'string'
+      ) {
+        editItem.factor = parseInt(editItem.factor, 16);
+      }
+      onSave(editItem);
+    } catch (error) {
+      setFieldErrors(error as ValidateFieldsError);
+    }
+  };
+
+  const remove = () => {
+    editItem.deleted = true;
+    onSave(editItem);
+  };
+
+  const dup = () => {
+    onDup(editItem);
+  };
+
+  return (
+    <Dialog sx={dialogStyle} open={open} onClose={handleClose}>
+      <DialogTitle>
+        {creating ? LL.ADD(1) + ' ' + LL.NEW(1) : LL.EDIT()}&nbsp;{LL.ENTITY()}
+      </DialogTitle>
+      <DialogContent dividers>
+        <Box display="flex" flexWrap="wrap" mb={1}>
+          <Box flexWrap="nowrap" whiteSpace="nowrap" />
+        </Box>
+        <Grid container spacing={2} rowSpacing={0}>
+          <Grid size={12}>
+            <ValidatedTextField
+              fieldErrors={fieldErrors}
+              name="name"
+              label={LL.NAME(0)}
+              value={editItem.name}
+              margin="normal"
+              fullWidth
+              onChange={updateFormValue}
+            />
+          </Grid>
+          <Grid mt={3}>
+            <BlockFormControlLabel
+              control={
+                <Checkbox
+                  icon={<InsertCommentOutlinedIcon htmlColor="white" />}
+                  checkedIcon={<CommentsDisabledOutlinedIcon color="primary" />}
+                  checked={editItem.hide}
+                  onChange={updateFormValue}
+                  name="hide"
+                />
+              }
+              label="API/MQTT"
+            />
+          </Grid>
+          <Grid>
+            <TextField
+              name="ram"
+              label={LL.VALUE(0) + ' ' + LL.TYPE(1)}
+              value={editItem.ram}
+              variant="outlined"
+              onChange={updateFormValue}
+              margin="normal"
+              fullWidth
+              select
+            >
+              <MenuItem value={0}>EMS-{LL.VALUE(1)}</MenuItem>
+              <MenuItem value={1}>RAM-{LL.VALUE(1)}</MenuItem>
+            </TextField>
+          </Grid>
+          {editItem.ram === 1 && (
+            <>
+              <Grid>
+                <TextField
+                  name="value"
+                  label={LL.DEFAULT(0) + ' ' + LL.VALUE(0)}
+                  type="string"
+                  value={editItem.value as string}
+                  variant="outlined"
+                  onChange={updateFormValue}
+                  fullWidth
+                  margin="normal"
+                />
+              </Grid>
+              <Grid>
+                <TextField
+                  name="uom"
+                  label={LL.UNIT()}
+                  value={editItem.uom}
+                  margin="normal"
+                  onChange={updateFormValue}
+                  select
+                >
+                  {DeviceValueUOM_s.map((val, i) => (
+                    <MenuItem key={val} value={i}>
+                      {val}
+                    </MenuItem>
+                  ))}
+                </TextField>
+              </Grid>
+            </>
+          )}
+          {editItem.ram === 0 && (
+            <>
+              <Grid mt={3}>
+                <BlockFormControlLabel
+                  control={
+                    <Checkbox
+                      icon={<EditOffOutlinedIcon color="primary" />}
+                      checkedIcon={<EditOutlinedIcon htmlColor="white" />}
+                      checked={editItem.writeable}
+                      onChange={updateFormValue}
+                      name="writeable"
+                    />
+                  }
+                  label={LL.WRITEABLE()}
+                />
+              </Grid>
+              <Grid>
+                <ValidatedTextField
+                  fieldErrors={fieldErrors}
+                  name="device_id"
+                  label={LL.ID_OF(LL.DEVICE())}
+                  margin="normal"
+                  sx={{ width: '11ch' }}
+                  type="string"
+                  value={editItem.device_id as string}
+                  onChange={updateFormValue}
+                  slotProps={{
+                    input: {
+                      startAdornment: (
+                        <InputAdornment position="start">0x</InputAdornment>
+                      )
+                    },
+                    htmlInput: { style: { textTransform: 'uppercase' } }
+                  }}
+                />
+              </Grid>
+              <Grid>
+                <ValidatedTextField
+                  fieldErrors={fieldErrors}
+                  name="type_id"
+                  label={LL.ID_OF(LL.TYPE(1))}
+                  margin="normal"
+                  sx={{ width: '11ch' }}
+                  type="string"
+                  value={editItem.type_id as string}
+                  onChange={updateFormValue}
+                  slotProps={{
+                    input: {
+                      startAdornment: (
+                        <InputAdornment position="start">0x</InputAdornment>
+                      )
+                    },
+                    htmlInput: { style: { textTransform: 'uppercase' } }
+                  }}
+                />
+              </Grid>
+              <Grid>
+                <ValidatedTextField
+                  fieldErrors={fieldErrors}
+                  name="offset"
+                  label={LL.OFFSET()}
+                  margin="normal"
+                  sx={{ width: '11ch' }}
+                  type="number"
+                  value={numberValue(editItem.offset)}
+                  onChange={updateFormValue}
+                />
+              </Grid>
+              <Grid>
+                <TextField
+                  name="value_type"
+                  label={LL.VALUE(0) + ' ' + LL.TYPE(1)}
+                  value={editItem.value_type}
+                  variant="outlined"
+                  sx={{ width: '11ch' }}
+                  onChange={updateFormValue}
+                  margin="normal"
+                  select
+                >
+                  <MenuItem value={DeviceValueType.BOOL}>
+                    {DeviceValueTypeNames[DeviceValueType.BOOL]}
+                  </MenuItem>
+                  <MenuItem value={DeviceValueType.INT8}>
+                    {DeviceValueTypeNames[DeviceValueType.INT8]}
+                  </MenuItem>
+                  <MenuItem value={DeviceValueType.UINT8}>
+                    {DeviceValueTypeNames[DeviceValueType.UINT8]}
+                  </MenuItem>
+                  <MenuItem value={DeviceValueType.INT16}>
+                    {DeviceValueTypeNames[DeviceValueType.INT16]}
+                  </MenuItem>
+                  <MenuItem value={DeviceValueType.UINT16}>
+                    {DeviceValueTypeNames[DeviceValueType.UINT16]}
+                  </MenuItem>
+                  <MenuItem value={DeviceValueType.UINT24}>
+                    {DeviceValueTypeNames[DeviceValueType.UINT24]}
+                  </MenuItem>
+                  <MenuItem value={DeviceValueType.TIME}>
+                    {DeviceValueTypeNames[DeviceValueType.TIME]}
+                  </MenuItem>
+                  <MenuItem value={DeviceValueType.UINT32}>
+                    {DeviceValueTypeNames[DeviceValueType.UINT32]}
+                  </MenuItem>
+                  <MenuItem value={DeviceValueType.STRING}>
+                    {DeviceValueTypeNames[DeviceValueType.STRING]}
+                  </MenuItem>
+                </TextField>
+              </Grid>
+
+              {editItem.value_type !== DeviceValueType.BOOL &&
+                editItem.value_type !== DeviceValueType.STRING && (
+                  <>
+                    <Grid>
+                      <TextField
+                        name="factor"
+                        label={LL.FACTOR()}
+                        value={numberValue(editItem.factor as number)}
+                        variant="outlined"
+                        onChange={updateFormValue}
+                        sx={{ width: '11ch' }}
+                        margin="normal"
+                        type="number"
+                        slotProps={{
+                          htmlInput: { step: '0.001' }
+                        }}
+                      />
+                    </Grid>
+                    <Grid>
+                      <TextField
+                        name="uom"
+                        label={LL.UNIT()}
+                        value={editItem.uom}
+                        margin="normal"
+                        sx={{ width: '11ch' }}
+                        onChange={updateFormValue}
+                        select
+                      >
+                        {DeviceValueUOM_s.map((val, i) => (
+                          <MenuItem key={val} value={i}>
+                            {val}
+                          </MenuItem>
+                        ))}
+                      </TextField>
+                    </Grid>
+                  </>
+                )}
+              {editItem.value_type === DeviceValueType.STRING &&
+                editItem.device_id !== '0' && (
+                  <Grid>
+                    <ValidatedTextField
+                      fieldErrors={fieldErrors}
+                      name="factor"
+                      label={LL.BYTES()}
+                      value={numberValue(editItem.factor as number)}
+                      sx={{ width: '11ch' }}
+                      variant="outlined"
+                      onChange={updateFormValue}
+                      margin="normal"
+                      type="number"
+                      slotProps={{
+                        htmlInput: { step: '1', min: '1', max: '255' }
+                      }}
+                    />
+                  </Grid>
+                )}
+              {editItem.value_type === DeviceValueType.BOOL && (
+                <Grid>
+                  <ValidatedTextField
+                    fieldErrors={fieldErrors}
+                    name="factor"
+                    label={LL.BITMASK()}
+                    value={editItem.factor as string}
+                    sx={{ width: '11ch' }}
+                    variant="outlined"
+                    onChange={updateFormValue}
+                    margin="normal"
+                    type="string"
+                    slotProps={{
+                      input: {
+                        startAdornment: (
+                          <InputAdornment position="start">0x</InputAdornment>
+                        )
+                      },
+                      htmlInput: { style: { textTransform: 'uppercase' } }
+                    }}
+                  />
+                </Grid>
+              )}
+            </>
+          )}
+        </Grid>
+      </DialogContent>
+      <DialogActions>
+        {!creating && (
+          <Box flexGrow={1}>
+            <Button
+              startIcon={<RemoveIcon />}
+              variant="outlined"
+              color="warning"
+              onClick={remove}
+            >
+              {LL.REMOVE()}
+            </Button>
+            <Button
+              sx={{ ml: 1 }}
+              startIcon={<AddIcon />}
+              variant="outlined"
+              color="primary"
+              onClick={dup}
+            >
+              {LL.DUPLICATE()}
+            </Button>
+          </Box>
+        )}
+        <Button
+          startIcon={<CancelIcon />}
+          variant="outlined"
+          onClick={onClose}
+          color="secondary"
+        >
+          {LL.CANCEL()}
+        </Button>
+        <Button
+          startIcon={creating ? <AddIcon /> : <DoneIcon />}
+          variant="outlined"
+          onClick={save}
+          color="primary"
+        >
+          {creating ? LL.ADD(0) : LL.UPDATE()}
+        </Button>
+      </DialogActions>
+    </Dialog>
+  );
+};
+
+export default CustomEntitiesDialog;

interface/src/app/main/Customizations.tsx

@@ -1,50 +1,70 @@
+import { useCallback, useEffect, useState } from 'react';
+import { useBlocker, useLocation } from 'react-router';
+import { toast } from 'react-toastify';
+
 import CancelIcon from '@mui/icons-material/Cancel';
+import EditIcon from '@mui/icons-material/Edit';
 import PowerSettingsNewIcon from '@mui/icons-material/PowerSettingsNew';
+import SaveIcon from '@mui/icons-material/Save';
 import SearchIcon from '@mui/icons-material/Search';
 import SettingsBackupRestoreIcon from '@mui/icons-material/SettingsBackupRestore';
 import WarningIcon from '@mui/icons-material/Warning';
 import {
-  Button,
-  Typography,
   Box,
-  MenuItem,
+  Button,
   Dialog,
   DialogActions,
   DialogContent,
   DialogTitle,
+  Grid,
+  InputAdornment,
+  Link,
+  MenuItem,
+  TextField,
   ToggleButton,
   ToggleButtonGroup,
-  Grid,
+  Typography
-  TextField,
-  Link,
-  InputAdornment
 } from '@mui/material';
-import { Table, Header, HeaderRow, HeaderCell, Body, Row, Cell } from '@table-library/react-table-library/table';
-import { useTheme } from '@table-library/react-table-library/theme';
-import { useRequest } from 'alova';
-import { useState, useEffect, useCallback } from 'react';
-import { unstable_useBlocker as useBlocker } from 'react-router-dom';
-import { toast } from 'react-toastify';
 
+import {
+  Body,
+  Cell,
+  Header,
+  HeaderCell,
+  HeaderRow,
+  Row,
+  Table
+} from '@table-library/react-table-library/table';
+import { useTheme } from '@table-library/react-table-library/theme';
+import { dialogStyle } from 'CustomTheme';
+import { useRequest } from 'alova/client';
+import SystemMonitor from 'app/status/SystemMonitor';
+import {
+  BlockNavigation,
+  ButtonRow,
+  MessageBox,
+  SectionContent,
+  useLayoutTitle
+} from 'components';
+import { useI18nContext } from 'i18n/i18n-react';
+
+import {
+  API,
+  readCoreData,
+  readDeviceEntities,
+  resetCustomizations,
+  writeCustomizationEntities,
+  writeDeviceName
+} from '../../api/app';
+import SettingsCustomizationsDialog from './CustomizationsDialog';
 import EntityMaskToggle from './EntityMaskToggle';
 import OptionIcon from './OptionIcon';
-import SettingsCustomizationDialog from './SettingsCustomizationDialog';
-
-import * as EMSESP from './api';
-
 import { DeviceEntityMask } from './types';
-import type { DeviceShort, DeviceEntity } from './types';
+import type { APIcall, Device, DeviceEntity } from './types';
-import type { FC } from 'react';
-import { dialogStyle } from 'CustomTheme';
-import * as SystemApi from 'api/system';
-import { ButtonRow, SectionContent, MessageBox, BlockNavigation } from 'components';
-
-import RestartMonitor from 'framework/system/RestartMonitor';
-import { useI18nContext } from 'i18n/i18n-react';
 
 export const APIURL = window.location.origin + '/api/';
 
-const SettingsCustomization: FC = () => {
+const Customizations = () => {
   const { LL } = useI18nContext();
   const [numChanges, setNumChanges] = useState<number>(0);
   const blocker = useBlocker(numChanges !== 0);
@@ -52,41 +72,81 @@ const SettingsCustomization: FC = () => {
   const [restarting, setRestarting] = useState<boolean>(false);
   const [restartNeeded, setRestartNeeded] = useState<boolean>(false);
   const [deviceEntities, setDeviceEntities] = useState<DeviceEntity[]>([]);
-  const [selectedDevice, setSelectedDevice] = useState<number>(-1);
   const [confirmReset, setConfirmReset] = useState<boolean>(false);
   const [selectedFilters, setSelectedFilters] = useState<number>(0);
   const [search, setSearch] = useState('');
   const [selectedDeviceEntity, setSelectedDeviceEntity] = useState<DeviceEntity>();
   const [dialogOpen, setDialogOpen] = useState<boolean>(false);
+  const [rename, setRename] = useState<boolean>(false);
 
-  const { send: resetCustomizations } = useRequest(EMSESP.resetCustomizations(), {
+  useLayoutTitle(LL.CUSTOMIZATIONS());
+
+  // fetch devices first from coreData
+  const { data: devices, send: fetchCoreData } = useRequest(readCoreData);
+
+  const { send: sendAPI } = useRequest((data: APIcall) => API(data), {
     immediate: false
   });
 
-  const { data: devices } = useRequest(EMSESP.readDevices);
+  const [selectedDevice, setSelectedDevice] = useState<number>(
+    Number(useLocation().state) || -1
+  );
+  const [selectedDeviceTypeNameURL, setSelectedDeviceTypeNameURL] =
+    useState<string>(''); // needed for API URL
+  const [selectedDeviceName, setSelectedDeviceName] = useState<string>('');
 
-  const { send: writeCustomEntities } = useRequest((data) => EMSESP.writeCustomEntities(data), { immediate: false });
+  const { send: sendResetCustomizations } = useRequest(resetCustomizations(), {
-
-  const { send: readDeviceEntities, onSuccess: onSuccess } = useRequest((data) => EMSESP.readDeviceEntities(data), {
-    initialData: [],
     immediate: false
   });
 
-  const setOriginalSettings = (data: DeviceEntity[]) => {
+  const { send: sendDeviceName } = useRequest(
-    setDeviceEntities(data.map((de) => ({ ...de, o_m: de.m, o_cn: de.cn, o_mi: de.mi, o_ma: de.ma })));
+    (data: { id: number; name: string }) => writeDeviceName(data),
-  };
+    {
+      immediate: false
+    }
+  );
 
-  onSuccess((event) => {
+  const { send: sendCustomizationEntities } = useRequest(
+    (data: { id: number; entity_ids: string[] }) => writeCustomizationEntities(data),
+    {
+      immediate: false
+    }
+  );
+
+  const { send: sendDeviceEntities } = useRequest(
+    (data: number) => readDeviceEntities(data),
+    {
+      initialData: [],
+      immediate: false
+    }
+  ).onSuccess((event) => {
     setOriginalSettings(event.data);
   });
 
-  const { send: restartCommand } = useRequest(SystemApi.restart(), {
+  const setOriginalSettings = (data: DeviceEntity[]) => {
-    immediate: false
+    setDeviceEntities(
-  });
+      data.map((de) => ({
+        ...de,
+        o_m: de.m,
+        o_cn: de.cn,
+        o_mi: de.mi,
+        o_ma: de.ma
+      }))
+    );
+  };
+
+  const doRestart = async () => {
+    setRestarting(true);
+    await sendAPI({ device: 'system', cmd: 'restart', id: 0 }).catch(
+      (error: Error) => {
+        toast.error(error.message);
+      }
+    );
+  };
 
   const entities_theme = useTheme({
     Table: `
-      --data-table-library_grid-template-columns: 150px repeat(1, minmax(80px, 1fr)) 45px minmax(45px, auto) minmax(120px, auto);
+      --data-table-library_grid-template-columns: 156px repeat(1, minmax(80px, 1fr)) 45px minmax(45px, auto) minmax(120px, auto);
     `,
     BaseRow: `
       font-size: 14px;
@@ -130,10 +190,7 @@ const SettingsCustomization: FC = () => {
       }
       &:hover .td {
         border-top: 1px solid #177ac9;
-        border-bottom: 1px solid #177ac9;
+        background-color: #177ac9;
-      }
-      &:nth-of-type(odd) .td {
-        background-color: #303030;
       }
     `,
     Cell: `
@@ -153,7 +210,12 @@ const SettingsCustomization: FC = () => {
   });
 
   function hasEntityChanged(de: DeviceEntity) {
-    return (de?.cn || '') !== (de?.o_cn || '') || de.m !== de.o_m || de.ma !== de.o_ma || de.mi !== de.o_mi;
+    return (
+      (de?.cn || '') !== (de?.o_cn || '') ||
+      de.m !== de.o_m ||
+      de.ma !== de.o_ma ||
+      de.mi !== de.o_mi
+    );
   }
 
   useEffect(() => {
@@ -174,14 +236,23 @@ const SettingsCustomization: FC = () => {
     }
   }, [deviceEntities]);
 
-  const restart = async () => {
+  useEffect(() => {
-    await restartCommand().catch((error) => {
+    if (devices && selectedDevice !== -1) {
-      toast.error(error.message);
+      void sendDeviceEntities(selectedDevice);
-    });
+      const index = devices.devices.findIndex((d) => d.id === selectedDevice);
-    setRestarting(true);
+      if (index === -1) {
-  };
+        setSelectedDevice(-1);
+        setSelectedDeviceTypeNameURL('');
+      } else {
+        setSelectedDeviceTypeNameURL(devices.devices[index].url || '');
+        setSelectedDeviceName(devices.devices[index].n);
+        setNumChanges(0);
+        setRestartNeeded(false);
+      }
+    }
+  }, [devices, selectedDevice]);
 
-  function formatValue(value: any) {
+  function formatValue(value: unknown) {
     if (typeof value === 'number') {
       return new Intl.NumberFormat().format(value);
     } else if (value === undefined) {
@@ -189,20 +260,21 @@ const SettingsCustomization: FC = () => {
     } else if (typeof value === 'boolean') {
       return value ? 'true' : 'false';
     }
-    return value;
+    return value as string;
   }
 
-  function formatName(de: DeviceEntity) {
+  const formatName = (de: DeviceEntity, withShortname: boolean) =>
-    return (
+    (de.n && de.n[0] === '!'
-      <>
+      ? de.t
-        {de.n && (de.n[0] === '!' ? LL.COMMAND(1) + ': ' + de.n.slice(1) : de.cn && de.cn !== '' ? de.cn : de.n) + ' '}(
+        ? LL.COMMAND(1) + ': ' + de.t + ' ' + de.n.slice(1)
-        <Link target="_blank" href={APIURL + devices?.devices[selectedDevice].tn + '/' + de.id}>
+        : LL.COMMAND(1) + ': ' + de.n.slice(1)
-          {de.id}
+      : de.cn && de.cn !== ''
-        </Link>
+        ? de.t
-        )
+          ? de.t + ' ' + de.cn
-      </>
+          : de.cn
-    );
+        : de.t
-  }
+          ? de.t + ' ' + de.n
+          : de.n) + (withShortname ? ' ' + de.id : '');
 
   const getMaskNumber = (newMask: string[]) => {
     let new_mask = 0;
@@ -232,15 +304,25 @@ const SettingsCustomization: FC = () => {
     return new_masks;
   };
 
+  const filter_entity = (de: DeviceEntity) =>
+    (de.m & selectedFilters || !selectedFilters) &&
+    formatName(de, true).toLowerCase().includes(search.toLowerCase());
+
   const maskDisabled = (set: boolean) => {
     setDeviceEntities(
       deviceEntities.map(function (de) {
-        if ((de.m & selectedFilters || !selectedFilters) && de.id.toLowerCase().includes(search.toLowerCase())) {
+        if (filter_entity(de)) {
           return {
             ...de,
             m: set
-              ? de.m | (DeviceEntityMask.DV_API_MQTT_EXCLUDE | DeviceEntityMask.DV_WEB_EXCLUDE)
+              ? de.m |
-              : de.m & ~(DeviceEntityMask.DV_API_MQTT_EXCLUDE | DeviceEntityMask.DV_WEB_EXCLUDE)
+                (DeviceEntityMask.DV_API_MQTT_EXCLUDE |
+                  DeviceEntityMask.DV_WEB_EXCLUDE)
+              : de.m &
+                ~(
+                  DeviceEntityMask.DV_API_MQTT_EXCLUDE |
+                  DeviceEntityMask.DV_WEB_EXCLUDE
+                )
           };
         } else {
           return de;
@@ -249,22 +331,12 @@ const SettingsCustomization: FC = () => {
     );
   };
 
-  const changeSelectedDevice = (event: React.ChangeEvent<HTMLInputElement>) => {
-    if (devices) {
-      const selected_device = parseInt(event.target.value, 10);
-      setSelectedDevice(selected_device);
-      setNumChanges(0);
-      void readDeviceEntities(devices?.devices[selected_device].i);
-      setRestartNeeded(false);
-    }
-  };
-
   const resetCustomization = async () => {
     try {
-      await resetCustomizations();
+      await sendResetCustomizations();
       toast.info(LL.CUSTOMIZATIONS_RESTART());
     } catch (error) {
-      toast.error(error.message);
+      toast.error((error as Error).message);
     } finally {
       setConfirmReset(false);
     }
@@ -275,7 +347,11 @@ const SettingsCustomization: FC = () => {
   };
 
   const updateDeviceEntity = (updatedItem: DeviceEntity) => {
-    setDeviceEntities(deviceEntities?.map((de) => (de.id === updatedItem.id ? { ...de, ...updatedItem } : de)));
+    setDeviceEntities(
+      deviceEntities?.map((de) =>
+        de.id === updatedItem.id ? { ...de, ...updatedItem } : de
+      )
+    );
   };
 
   const onDialogSave = (updatedItem: DeviceEntity) => {
@@ -317,67 +393,135 @@ const SettingsCustomization: FC = () => {
         return;
       }
 
-      await writeCustomEntities({ id: devices?.devices[selectedDevice].i, entity_ids: masked_entities }).catch(
+      await sendCustomizationEntities({
-        (error) => {
+        id: selectedDevice,
-          if (error.message === 'Reboot required') {
+        entity_ids: masked_entities
-            setRestartNeeded(true);
+      }).catch((error: Error) => {
-          } else {
+        if (error.message === 'Reboot required') {
-            toast.error(error.message);
+          setRestartNeeded(true);
-          }
+        } else {
+          toast.error(error.message);
         }
-      );
+      });
       setOriginalSettings(deviceEntities);
     }
   };
 
+  const renameDevice = async () => {
+    await sendDeviceName({ id: selectedDevice, name: selectedDeviceName })
+      .then(() => {
+        toast.success(LL.UPDATED_OF(LL.NAME(1)));
+      })
+      .catch(() => {
+        toast.error(LL.UPDATE_OF(LL.NAME(1)) + ' ' + LL.FAILED(1));
+      })
+      .finally(async () => {
+        setRename(false);
+        await fetchCoreData();
+      });
+  };
+
   const renderDeviceList = () => (
     <>
-      <Box mb={2} color="warning.main">
+      <Box mb={1} color="warning.main">
-        <Typography variant="body2">{LL.CUSTOMIZATIONS_HELP_1()}.</Typography>
+        <Typography variant="body1">{LL.CUSTOMIZATIONS_HELP_1()}.</Typography>
-        <Typography variant="body2" mt={1}>
+      </Box>
-          <OptionIcon type="favorite" isSet={true} />={LL.CUSTOMIZATIONS_HELP_2()}&nbsp;&nbsp;
+      <Box display="flex" flexWrap="wrap" alignItems="center" gap={2}>
-          <OptionIcon type="readonly" isSet={true} />={LL.CUSTOMIZATIONS_HELP_3()}&nbsp;&nbsp;
+        {rename ? (
-          <OptionIcon type="api_mqtt_exclude" isSet={true} />={LL.CUSTOMIZATIONS_HELP_4()}&nbsp;&nbsp;
+          <TextField
-          <OptionIcon type="web_exclude" isSet={true} />={LL.CUSTOMIZATIONS_HELP_5()}&nbsp;&nbsp;
+            name="device"
-          <OptionIcon type="deleted" isSet={true} />={LL.CUSTOMIZATIONS_HELP_6()}
+            label={LL.EMS_DEVICE()}
-        </Typography>
+            fullWidth
+            variant="outlined"
+            value={selectedDeviceName}
+            onChange={(e) => setSelectedDeviceName(e.target.value)}
+            margin="normal"
+          />
+        ) : (
+          <TextField
+            name="device"
+            label={LL.EMS_DEVICE()}
+            variant="outlined"
+            value={selectedDevice}
+            disabled={numChanges !== 0}
+            onChange={(e) => setSelectedDevice(parseInt(e.target.value))}
+            margin="normal"
+            style={{ minWidth: '50%' }}
+            select
+          >
+            <MenuItem disabled key={-1} value={-1}>
+              {LL.SELECT_DEVICE()}...
+            </MenuItem>
+            {devices.devices.map(
+              (device: Device) =>
+                device.id < 90 && (
+                  <MenuItem key={device.id} value={device.id}>
+                    {device.n}&nbsp;({device.tn})
+                  </MenuItem>
+                )
+            )}
+          </TextField>
+        )}
+        {selectedDevice !== -1 &&
+          (rename ? (
+            <>
+              <Button
+                startIcon={<CancelIcon />}
+                variant="outlined"
+                color="secondary"
+                onClick={() => setRename(false)}
+              >
+                {LL.CANCEL()}
+              </Button>
+              <Button
+                startIcon={<SaveIcon />}
+                variant="outlined"
+                onClick={() => renameDevice()}
+              >
+                {LL.RENAME()}
+              </Button>
+            </>
+          ) : (
+            <Button
+              startIcon={<EditIcon />}
+              variant="outlined"
+              onClick={() => setRename(true)}
+            >
+              {LL.RENAME()}
+            </Button>
+          ))}
       </Box>
-      <TextField
-        name="device"
-        label={LL.EMS_DEVICE()}
-        variant="outlined"
-        fullWidth
-        value={selectedDevice}
-        disabled={numChanges !== 0}
-        onChange={changeSelectedDevice}
-        margin="normal"
-        select
-      >
-        <MenuItem disabled key={0} value={-1}>
-          {LL.SELECT_DEVICE()}...
-        </MenuItem>
-        {devices.devices.map((device: DeviceShort, index) => (
-          <MenuItem key={index} value={index}>
-            {device.s}
-          </MenuItem>
-        ))}
-      </TextField>
     </>
   );
 
   const renderDeviceData = () => {
-    if (deviceEntities.length === 0) {
+    const shown_data = deviceEntities.filter((de) => filter_entity(de));
-      return;
-    }
-
-    const shown_data = deviceEntities.filter(
-      (de) => (de.m & selectedFilters || !selectedFilters) && de.id.toLowerCase().includes(search.toLowerCase())
-    );
 
     return (
       <>
-        <Grid container mb={1} mt={0} spacing={1} direction="row" justifyContent="flex-start" alignItems="center">
+        <Box color="warning.main">
-          <Grid item xs={2}>
+          <Typography variant="body2" mt={1}>
+            <OptionIcon type="favorite" isSet={true} />={LL.CUSTOMIZATIONS_HELP_2()}
+            &nbsp;&nbsp;
+            <OptionIcon type="readonly" isSet={true} />={LL.CUSTOMIZATIONS_HELP_3()}
+            &nbsp;&nbsp;
+            <OptionIcon type="api_mqtt_exclude" isSet={true} />=
+            {LL.CUSTOMIZATIONS_HELP_4()}&nbsp;&nbsp;
+            <OptionIcon type="web_exclude" isSet={true} />=
+            {LL.CUSTOMIZATIONS_HELP_5()}&nbsp;&nbsp;
+            <OptionIcon type="deleted" isSet={true} />={LL.CUSTOMIZATIONS_HELP_6()}
+          </Typography>
+        </Box>
+        <Grid
+          container
+          mb={1}
+          mt={0}
+          spacing={2}
+          direction="row"
+          justifyContent="flex-start"
+          alignItems="center"
+        >
+          <Grid>
             <TextField
               size="small"
               variant="outlined"
@@ -385,21 +529,23 @@ const SettingsCustomization: FC = () => {
               onChange={(event) => {
                 setSearch(event.target.value);
               }}
-              InputProps={{
+              slotProps={{
-                startAdornment: (
+                input: {
-                  <InputAdornment position="start">
+                  startAdornment: (
-                    <SearchIcon color="primary" sx={{ fontSize: 16 }} />
+                    <InputAdornment position="start">
-                  </InputAdornment>
+                      <SearchIcon color="primary" sx={{ fontSize: 16 }} />
-                )
+                    </InputAdornment>
+                  )
+                }
               }}
             />
           </Grid>
-          <Grid item>
+          <Grid>
             <ToggleButtonGroup
               size="small"
               color="secondary"
               value={getMaskString(selectedFilters)}
-              onChange={(event, mask) => {
+              onChange={(event, mask: string[]) => {
                 setSelectedFilters(getMaskNumber(mask));
               }}
             >
@@ -420,7 +566,7 @@ const SettingsCustomization: FC = () => {
               </ToggleButton>
             </ToggleButtonGroup>
           </Grid>
-          <Grid item>
+          <Grid>
             <Button
               size="small"
               sx={{ fontSize: 10 }}
@@ -433,7 +579,7 @@ const SettingsCustomization: FC = () => {
               <OptionIcon type="web_exclude" isSet={false} />
             </Button>
           </Grid>
-          <Grid item>
+          <Grid>
             <Button
               size="small"
               sx={{ fontSize: 10 }}
@@ -446,14 +592,19 @@ const SettingsCustomization: FC = () => {
               <OptionIcon type="web_exclude" isSet={true} />
             </Button>
           </Grid>
-          <Grid item>
+          <Grid>
-            <Typography variant="subtitle2" color="primary">
+            <Typography variant="subtitle2" color="grey">
               {LL.SHOWING()}&nbsp;{shown_data.length}/{deviceEntities.length}
+              &nbsp;{LL.ENTITIES(deviceEntities.length)}
             </Typography>
           </Grid>
         </Grid>
-        <Table data={{ nodes: shown_data }} theme={entities_theme} layout={{ custom: true }}>
+        <Table
-          {(tableList: any) => (
+          data={{ nodes: shown_data }}
+          theme={entities_theme}
+          layout={{ custom: true }}
+        >
+          {(tableList: DeviceEntity[]) => (
             <>
               <Header>
                 <HeaderRow>
@@ -470,9 +621,22 @@ const SettingsCustomization: FC = () => {
                     <Cell stiff>
                       <EntityMaskToggle onUpdate={updateDeviceEntity} de={de} />
                     </Cell>
-                    <Cell>{formatName(de)}</Cell>
+                    <Cell>
-                    <Cell>{!(de.m & DeviceEntityMask.DV_READONLY) && formatValue(de.mi)}</Cell>
+                      {formatName(de, false)}&nbsp;(
-                    <Cell>{!(de.m & DeviceEntityMask.DV_READONLY) && formatValue(de.ma)}</Cell>
+                      <Link
+                        target="_blank"
+                        href={APIURL + selectedDeviceTypeNameURL + '/' + de.id}
+                      >
+                        {de.id}
+                      </Link>
+                      )
+                    </Cell>
+                    <Cell>
+                      {!(de.m & DeviceEntityMask.DV_READONLY) && formatValue(de.mi)}
+                    </Cell>
+                    <Cell>
+                      {!(de.m & DeviceEntityMask.DV_READONLY) && formatValue(de.ma)}
+                    </Cell>
                     <Cell>{formatValue(de.v)}</Cell>
                   </Row>
                 ))}
@@ -485,14 +649,28 @@ const SettingsCustomization: FC = () => {
   };
 
   const renderResetDialog = () => (
-    <Dialog sx={dialogStyle} open={confirmReset} onClose={() => setConfirmReset(false)}>
+    <Dialog
+      sx={dialogStyle}
+      open={confirmReset}
+      onClose={() => setConfirmReset(false)}
+    >
       <DialogTitle>{LL.RESET(1)}</DialogTitle>
       <DialogContent dividers>{LL.CUSTOMIZATIONS_RESET()}</DialogContent>
       <DialogActions>
-        <Button startIcon={<CancelIcon />} variant="outlined" onClick={() => setConfirmReset(false)} color="secondary">
+        <Button
+          startIcon={<CancelIcon />}
+          variant="outlined"
+          onClick={() => setConfirmReset(false)}
+          color="secondary"
+        >
           {LL.CANCEL()}
         </Button>
-        <Button startIcon={<SettingsBackupRestoreIcon />} variant="outlined" onClick={resetCustomization} color="error">
+        <Button
+          startIcon={<SettingsBackupRestoreIcon />}
+          variant="outlined"
+          onClick={resetCustomization}
+          color="error"
+        >
           {LL.RESET(0)}
         </Button>
       </DialogActions>
@@ -501,19 +679,20 @@ const SettingsCustomization: FC = () => {
 
   const renderContent = () => (
     <>
-      <Typography sx={{ pt: 2, pb: 2 }} variant="h6" color="primary">
-        {LL.DEVICE_ENTITIES()}
-      </Typography>
       {devices && renderDeviceList()}
-      {renderDeviceData()}
+      {selectedDevice !== -1 && !rename && renderDeviceData()}
-      {restartNeeded && (
+      {restartNeeded ? (
-        <MessageBox my={2} level="warning" message={LL.RESTART_TEXT()}>
+        <MessageBox my={2} level="warning" message={LL.RESTART_TEXT(0)}>
-          <Button startIcon={<PowerSettingsNewIcon />} variant="contained" color="error" onClick={restart}>
+          <Button
+            startIcon={<PowerSettingsNewIcon />}
+            variant="contained"
+            color="error"
+            onClick={doRestart}
+          >
             {LL.RESTART()}
           </Button>
         </MessageBox>
-      )}
+      ) : (
-      {!restartNeeded && (
         <Box display="flex" flexWrap="wrap">
           <Box flexGrow={1}>
             {numChanges !== 0 && (
@@ -522,7 +701,7 @@ const SettingsCustomization: FC = () => {
                   startIcon={<CancelIcon />}
                   variant="outlined"
                   color="secondary"
-                  onClick={() => devices && readDeviceEntities(devices.devices[selectedDevice].i)}
+                  onClick={() => devices && sendDeviceEntities(selectedDevice)}
                 >
                   {LL.CANCEL()}
                 </Button>
@@ -537,16 +716,18 @@ const SettingsCustomization: FC = () => {
               </ButtonRow>
             )}
           </Box>
-          <ButtonRow>
+          {!rename && (
-            <Button
+            <ButtonRow mt={1}>
-              startIcon={<SettingsBackupRestoreIcon />}
+              <Button
-              variant="outlined"
+                startIcon={<SettingsBackupRestoreIcon />}
-              color="error"
+                variant="outlined"
-              onClick={() => setConfirmReset(true)}
+                color="error"
-            >
+                onClick={() => setConfirmReset(true)}
-              {LL.RESET(0)}
+              >
-            </Button>
+                {LL.RESET(0)}
-          </ButtonRow>
+              </Button>
+            </ButtonRow>
+          )}
         </Box>
       )}
       {renderResetDialog()}
@@ -554,11 +735,11 @@ const SettingsCustomization: FC = () => {
   );
 
   return (
-    <SectionContent title={LL.CUSTOMIZATIONS()} titleGutter>
+    <SectionContent>
       {blocker ? <BlockNavigation blocker={blocker} /> : null}
-      {restarting ? <RestartMonitor /> : renderContent()}
+      {restarting ? <SystemMonitor /> : renderContent()}
       {selectedDeviceEntity && (
-        <SettingsCustomizationDialog
+        <SettingsCustomizationsDialog
           open={dialogOpen}
           onClose={onDialogClose}
           onSave={onDialogSave}
@@ -569,4 +750,4 @@ const SettingsCustomization: FC = () => {
   );
 };
 
-export default SettingsCustomization;
+export default Customizations;

interface/src/app/main/CustomizationsDialog.tsx

@@ -1,6 +1,8 @@
-import CancelIcon from '@mui/icons-material/Cancel';
+import { useEffect, useState } from 'react';
-import DoneIcon from '@mui/icons-material/Done';
 
+import CancelIcon from '@mui/icons-material/Cancel';
+import CloseIcon from '@mui/icons-material/Close';
+import DoneIcon from '@mui/icons-material/Done';
 import {
   Box,
   Button,
@@ -12,25 +14,28 @@ import {
   TextField,
   Typography
 } from '@mui/material';
-import { useEffect, useState } from 'react';
+
+import { dialogStyle } from 'CustomTheme';
+import { useI18nContext } from 'i18n/i18n-react';
+import { numberValue, updateValue } from 'utils';
 
 import EntityMaskToggle from './EntityMaskToggle';
 import { DeviceEntityMask } from './types';
 import type { DeviceEntity } from './types';
 
-import { dialogStyle } from 'CustomTheme';
+interface SettingsCustomizationsDialogProps {
-import { useI18nContext } from 'i18n/i18n-react';
-
-import { updateValue } from 'utils';
-
-type SettingsCustomizationDialogProps = {
   open: boolean;
   onClose: () => void;
   onSave: (di: DeviceEntity) => void;
   selectedItem: DeviceEntity;
-};
+}
 
-const SettingsCustomizationDialog = ({ open, onClose, onSave, selectedItem }: SettingsCustomizationDialogProps) => {
+const CustomizationsDialog = ({
+  open,
+  onClose,
+  onSave,
+  selectedItem
+}: SettingsCustomizationsDialogProps) => {
   const { LL } = useI18nContext();
   const [editItem, setEditItem] = useState<DeviceEntity>(selectedItem);
   const [error, setError] = useState<boolean>(false);
@@ -38,7 +43,9 @@ const SettingsCustomizationDialog = ({ open, onClose, onSave, selectedItem }: Se
   const updateFormValue = updateValue(setEditItem);
 
   const isWriteableNumber =
-    typeof editItem.v === 'number' && editItem.w && !(editItem.m & DeviceEntityMask.DV_READONLY);
+    typeof editItem.v === 'number' &&
+    editItem.w &&
+    !(editItem.m & DeviceEntityMask.DV_READONLY);
 
   useEffect(() => {
     if (open) {
@@ -47,12 +54,19 @@ const SettingsCustomizationDialog = ({ open, onClose, onSave, selectedItem }: Se
     }
   }, [open, selectedItem]);
 
-  const close = () => {
+  const handleClose = (_event, reason: 'backdropClick' | 'escapeKeyDown') => {
-    onClose();
+    if (reason !== 'backdropClick') {
+      onClose();
+    }
   };
 
   const save = () => {
-    if (isWriteableNumber && editItem.mi && editItem.ma && editItem.mi > editItem?.ma) {
+    if (
+      isWriteableNumber &&
+      editItem.mi &&
+      editItem.ma &&
+      editItem.mi > editItem?.ma
+    ) {
       setError(true);
     } else {
       onSave(editItem);
@@ -64,49 +78,67 @@ const SettingsCustomizationDialog = ({ open, onClose, onSave, selectedItem }: Se
   };
 
   return (
-    <Dialog sx={dialogStyle} open={open} onClose={close}>
+    <Dialog sx={dialogStyle} open={open} onClose={handleClose}>
       <DialogTitle>{LL.EDIT() + ' ' + LL.ENTITY()}</DialogTitle>
       <DialogContent dividers>
-        <Box color="warning.main">
+        <Grid container>
-          <Typography variant="body2">{editItem.id}</Typography>
+          <Typography variant="body2" color="warning.main">
-        </Box>
+            {LL.ID_OF(LL.ENTITY())}:&nbsp;
-        <Box color="warning.main" mt={1} mb={2}>
-          <Typography variant="body2">
-            {LL.DEFAULT(1) + ' ' + LL.ENTITY_NAME(1)}:&nbsp;{editItem.n}
           </Typography>
-        </Box>
+          <Typography variant="body2">{editItem.id}</Typography>
-        <Box mb={3}>
+        </Grid>
+
+        <Grid container direction="row">
+          <Typography variant="body2" color="warning.main">
+            {LL.DEFAULT(1) + ' ' + LL.ENTITY_NAME(1)}:&nbsp;
+          </Typography>
+          <Typography variant="body2">{editItem.n}</Typography>
+        </Grid>
+
+        <Grid container direction="row">
+          <Typography variant="body2" color="warning.main">
+            {LL.WRITEABLE()}:&nbsp;
+          </Typography>
+          <Typography variant="body2">
+            {editItem.w ? (
+              <DoneIcon color="success" sx={{ fontSize: 16 }} />
+            ) : (
+              <CloseIcon color="error" sx={{ fontSize: 16 }} />
+            )}
+          </Typography>
+        </Grid>
+
+        <Box mt={1} mb={2}>
           <EntityMaskToggle onUpdate={updateDeviceEntity} de={editItem} />
         </Box>
-        <Grid container spacing={1}>
+        <Grid container spacing={2}>
-          <Grid item>
+          <Grid>
             <TextField
               name="cn"
               label={LL.NEW_NAME_OF(LL.ENTITY())}
               value={editItem.cn}
-              autoFocus
               sx={{ width: '30ch' }}
               onChange={updateFormValue}
             />
           </Grid>
           {isWriteableNumber && (
             <>
-              <Grid item>
+              <Grid>
                 <TextField
                   name="mi"
                   label={LL.MIN()}
-                  value={editItem.mi}
+                  value={numberValue(editItem.mi)}
-                  sx={{ width: '8ch' }}
+                  sx={{ width: '11ch' }}
                   type="number"
                   onChange={updateFormValue}
                 />
               </Grid>
-              <Grid item>
+              <Grid>
                 <TextField
                   name="ma"
                   label={LL.MAX()}
-                  value={editItem.ma}
+                  value={numberValue(editItem.ma)}
-                  sx={{ width: '8ch' }}
+                  sx={{ width: '11ch' }}
                   type="number"
                   onChange={updateFormValue}
                 />
@@ -121,10 +153,20 @@ const SettingsCustomizationDialog = ({ open, onClose, onSave, selectedItem }: Se
         )}
       </DialogContent>
       <DialogActions>
-        <Button startIcon={<CancelIcon />} variant="outlined" onClick={close} color="secondary">
+        <Button
+          startIcon={<CancelIcon />}
+          variant="outlined"
+          onClick={onClose}
+          color="secondary"
+        >
           {LL.CANCEL()}
         </Button>
-        <Button startIcon={<DoneIcon />} variant="outlined" onClick={save} color="primary">
+        <Button
+          startIcon={<DoneIcon />}
+          variant="outlined"
+          onClick={save}
+          color="primary"
+        >
           {LL.UPDATE()}
         </Button>
       </DialogActions>
@@ -132,4 +174,4 @@ const SettingsCustomizationDialog = ({ open, onClose, onSave, selectedItem }: Se
   );
 };
 
-export default SettingsCustomizationDialog;
+export default CustomizationsDialog;

interface/src/app/main/Dashboard.tsx

@@ -0,0 +1,380 @@
+import { useContext, useEffect, useState } from 'react';
+import { IconContext } from 'react-icons/lib';
+import { Link } from 'react-router';
+import { toast } from 'react-toastify';
+
+import ChevronRightIcon from '@mui/icons-material/ChevronRight';
+import EditIcon from '@mui/icons-material/Edit';
+import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
+import HelpOutlineIcon from '@mui/icons-material/HelpOutline';
+import UnfoldLessIcon from '@mui/icons-material/UnfoldLess';
+import UnfoldMoreIcon from '@mui/icons-material/UnfoldMore';
+import {
+  Box,
+  IconButton,
+  ToggleButton,
+  ToggleButtonGroup,
+  Typography
+} from '@mui/material';
+
+import { Body, Cell, Row, Table } from '@table-library/react-table-library/table';
+import { useTheme } from '@table-library/react-table-library/theme';
+import { CellTree, useTree } from '@table-library/react-table-library/tree';
+import { useRequest } from 'alova/client';
+import {
+  ButtonTooltip,
+  FormLoader,
+  MessageBox,
+  SectionContent,
+  useLayoutTitle
+} from 'components';
+import { AuthenticatedContext } from 'contexts/authentication';
+import { useI18nContext } from 'i18n/i18n-react';
+import { useInterval, usePersistState } from 'utils';
+
+import { readDashboard, writeDeviceValue } from '../../api/app';
+import DeviceIcon from './DeviceIcon';
+import DevicesDialog from './DevicesDialog';
+import { formatValue } from './deviceValue';
+import {
+  type DashboardItem,
+  DeviceEntityMask,
+  DeviceType,
+  type DeviceValue
+} from './types';
+import { deviceValueItemValidation } from './validators';
+
+const Dashboard = () => {
+  const { LL } = useI18nContext();
+  const { me } = useContext(AuthenticatedContext);
+
+  useLayoutTitle(LL.DASHBOARD());
+
+  const [showAll, setShowAll] = usePersistState(true, 'showAll');
+
+  const [deviceValueDialogOpen, setDeviceValueDialogOpen] = useState<boolean>(false);
+  const [parentNodes, setParentNodes] = useState<number>(0);
+  const [selectedDashboardItem, setSelectedDashboardItem] =
+    useState<DashboardItem>();
+
+  const {
+    data,
+    send: fetchDashboard,
+    error
+  } = useRequest(readDashboard, {
+    initialData: { connected: true, nodes: [] }
+  }).onSuccess((event) => {
+    if (event.data.nodes.length !== parentNodes) {
+      setParentNodes(event.data.nodes.length); // count number of parents/devices
+    }
+  });
+
+  const { loading: submitting, send: sendDeviceValue } = useRequest(
+    (data: { id: number; c: string; v: unknown }) => writeDeviceValue(data),
+    {
+      immediate: false
+    }
+  );
+
+  const deviceValueDialogSave = async (devicevalue: DeviceValue) => {
+    if (!selectedDashboardItem) {
+      return;
+    }
+    const id = selectedDashboardItem.parentNode.id; // this is the parent ID
+    await sendDeviceValue({ id, c: devicevalue.c ?? '', v: devicevalue.v })
+      .then(() => {
+        toast.success(LL.WRITE_CMD_SENT());
+      })
+      .catch((error: Error) => {
+        toast.error(error.message);
+      })
+      .finally(() => {
+        setDeviceValueDialogOpen(false);
+        setSelectedDashboardItem(undefined);
+      });
+  };
+
+  const dashboard_theme = useTheme({
+    Table: `
+      --data-table-library_grid-template-columns: minmax(80px, auto) 120px 32px;
+    `,
+    BaseRow: `
+      font-size: 14px;
+      .td {
+        height: 28px;
+      }
+    `,
+    Row: `
+      cursor: pointer;
+      background-color: #1e1e1e;
+      &:nth-of-type(odd) .td {
+          background-color: #303030;
+      },
+      &:hover .td {
+        background-color: #177ac9;
+      },
+    `,
+    BaseCell: `
+      &:nth-of-type(2) {
+        text-align: right;
+      }
+      &:nth-of-type(3) {
+        text-align: right;
+      }
+    `
+  });
+
+  const tree = useTree(
+    { nodes: data.nodes },
+    {
+      onChange: undefined // not used but needed
+    },
+    {
+      treeIcon: {
+        margin: '4px',
+        iconDefault: null,
+        iconRight: (
+          <ChevronRightIcon
+            sx={{ fontSize: 16, verticalAlign: 'middle' }}
+            color="info"
+          />
+        ),
+        iconDown: (
+          <ExpandMoreIcon
+            sx={{ fontSize: 16, verticalAlign: 'middle' }}
+            color="info"
+          />
+        )
+      },
+      indentation: 45
+    }
+  );
+
+  useInterval(() => {
+    if (!deviceValueDialogOpen) {
+      void fetchDashboard();
+    }
+  });
+
+  useEffect(() => {
+    showAll
+      ? tree.fns.onAddAll(data.nodes.map((item: DashboardItem) => item.id)) // expand tree
+      : tree.fns.onRemoveAll(); // collapse tree
+  }, [parentNodes]);
+
+  const showType = (n?: string, t?: number) => {
+    // if we have a name show it
+    if (n) {
+      return n;
+    }
+    if (t) {
+      // otherwise pick translation based on type
+      switch (t) {
+        case DeviceType.CUSTOM:
+          return LL.CUSTOM_ENTITIES(0);
+        case DeviceType.ANALOGSENSOR:
+          return LL.ANALOG_SENSORS();
+        case DeviceType.TEMPERATURESENSOR:
+          return LL.TEMP_SENSORS();
+        case DeviceType.SCHEDULER:
+          return LL.SCHEDULER();
+        default:
+          break;
+      }
+    }
+    return '';
+  };
+
+  const showName = (di: DashboardItem) => {
+    if (di.id < 100) {
+      // if its a device (parent node) and has entities
+      if (di.nodes?.length) {
+        return (
+          <span style={{ fontWeight: 'bold', fontSize: '14px' }}>
+            <DeviceIcon type_id={di.t ?? 0} />
+            &nbsp;&nbsp;{showType(di.n, di.t)}
+            <span style={{ color: 'lightblue' }}>&nbsp;({di.nodes?.length})</span>
+          </span>
+        );
+      }
+    }
+    if (di.dv) {
+      return <span>{di.dv.id.slice(2)}</span>;
+    }
+  };
+
+  const hasMask = (id: string, mask: number) =>
+    (parseInt(id.slice(0, 2), 16) & mask) === mask;
+
+  const editDashboardValue = (di: DashboardItem) => {
+    if (me.admin && di.dv?.c) {
+      setSelectedDashboardItem(di);
+      setDeviceValueDialogOpen(true);
+    }
+  };
+
+  const handleShowAll = (
+    event: React.MouseEvent<HTMLElement>,
+    toggle: boolean | null
+  ) => {
+    if (toggle !== null) {
+      tree.fns.onToggleAll({});
+      setShowAll(toggle);
+    }
+  };
+
+  const renderContent = () => {
+    if (!data) {
+      return <FormLoader onRetry={fetchDashboard} errorMessage={error?.message} />;
+    }
+
+    const hasFavEntities = data.nodes.filter(
+      (item: DashboardItem) => item.id <= 90
+    ).length;
+
+    return (
+      <>
+        {!data.connected && (
+          <MessageBox mb={2} level="error" message={LL.EMS_BUS_WARNING()} />
+        )}
+
+        {data.connected && data.nodes.length > 0 && !hasFavEntities && (
+          <MessageBox mb={2} level="warning">
+            <Typography>
+              {LL.NO_DATA_1()}&nbsp;
+              <Link to="/customizations" style={{ color: 'white' }}>
+                {LL.CUSTOMIZATIONS()}
+              </Link>
+              &nbsp;{LL.NO_DATA_2()}&nbsp;
+              {LL.NO_DATA_3()}&nbsp;
+              <Link to="/devices" style={{ color: 'white' }}>
+                {LL.DEVICES()}
+              </Link>
+              .
+            </Typography>
+          </MessageBox>
+        )}
+
+        {data.nodes.length > 0 && (
+          <>
+            <ToggleButtonGroup
+              color="primary"
+              size="small"
+              value={showAll}
+              exclusive
+              onChange={handleShowAll}
+            >
+              <ButtonTooltip title={LL.ALLVALUES()} arrow>
+                <ToggleButton value={true}>
+                  <UnfoldMoreIcon sx={{ fontSize: 18 }} />
+                </ToggleButton>
+              </ButtonTooltip>
+              <ButtonTooltip title={LL.COMPACT()} arrow>
+                <ToggleButton value={false}>
+                  <UnfoldLessIcon sx={{ fontSize: 18 }} />
+                </ToggleButton>
+              </ButtonTooltip>
+            </ToggleButtonGroup>
+            <ButtonTooltip title={LL.DASHBOARD_1()} arrow>
+              <HelpOutlineIcon color="primary" sx={{ ml: 1, fontSize: 20 }} />
+            </ButtonTooltip>
+
+            <Box
+              padding={1}
+              justifyContent="center"
+              flexDirection="column"
+              sx={{
+                borderRadius: 1,
+                border: '1px solid grey'
+              }}
+            >
+              <IconContext.Provider
+                value={{
+                  color: 'lightblue',
+                  size: '18',
+                  style: { verticalAlign: 'middle' }
+                }}
+              >
+                <Table
+                  data={{ nodes: data.nodes }}
+                  theme={dashboard_theme}
+                  layout={{ custom: true }}
+                  tree={tree}
+                >
+                  {(tableList: DashboardItem[]) => (
+                    <Body>
+                      {tableList.map((di: DashboardItem) => (
+                        <Row
+                          key={di.id}
+                          item={di}
+                          onClick={() => editDashboardValue(di)}
+                        >
+                          {di.id > 99 ? (
+                            <>
+                              <Cell>{showName(di)}</Cell>
+                              <Cell>
+                                <ButtonTooltip
+                                  title={formatValue(LL, di.dv?.v, di.dv?.u)}
+                                >
+                                  <span>{formatValue(LL, di.dv?.v, di.dv?.u)}</span>
+                                </ButtonTooltip>
+                              </Cell>
+
+                              <Cell>
+                                {me.admin &&
+                                  di.dv?.c &&
+                                  !hasMask(
+                                    di.dv.id,
+                                    DeviceEntityMask.DV_READONLY
+                                  ) && (
+                                    <IconButton
+                                      size="small"
+                                      onClick={() => editDashboardValue(di)}
+                                    >
+                                      <EditIcon
+                                        color="primary"
+                                        sx={{ fontSize: 16 }}
+                                      />
+                                    </IconButton>
+                                  )}
+                              </Cell>
+                            </>
+                          ) : (
+                            <>
+                              <CellTree item={di}>{showName(di)}</CellTree>
+                              <Cell />
+                              <Cell />
+                            </>
+                          )}
+                        </Row>
+                      ))}
+                    </Body>
+                  )}
+                </Table>
+              </IconContext.Provider>
+            </Box>
+          </>
+        )}
+      </>
+    );
+  };
+
+  return (
+    <SectionContent>
+      {renderContent()}
+      {selectedDashboardItem && selectedDashboardItem.dv && (
+        <DevicesDialog
+          open={deviceValueDialogOpen}
+          onClose={() => setDeviceValueDialogOpen(false)}
+          onSave={deviceValueDialogSave}
+          selectedItem={selectedDashboardItem.dv}
+          writeable={true}
+          validator={deviceValueItemValidation(selectedDashboardItem.dv)}
+          progress={submitting}
+        />
+      )}
+    </SectionContent>
+  );
+};
+
+export default Dashboard;

interface/src/app/main/DeviceIcon.tsx

@@ -0,0 +1,53 @@
+import { AiOutlineAlert, AiOutlineControl, AiOutlineGateway } from 'react-icons/ai';
+import { CgSmartHomeBoiler } from 'react-icons/cg';
+import { FaSolarPanel } from 'react-icons/fa';
+import { GiHeatHaze, GiTap } from 'react-icons/gi';
+import { MdPlaylistAdd } from 'react-icons/md';
+import { MdMoreTime } from 'react-icons/md';
+import {
+  MdOutlineDevices,
+  MdOutlinePool,
+  MdOutlineSensors,
+  MdThermostatAuto
+} from 'react-icons/md';
+import { PiFan, PiGauge } from 'react-icons/pi';
+import { TiFlowSwitch, TiThermometer } from 'react-icons/ti';
+import { VscVmConnect } from 'react-icons/vsc';
+
+import type { SvgIconProps } from '@mui/material';
+
+import { DeviceType } from './types';
+
+const deviceIconLookup: {
+  [key in DeviceType]: React.ComponentType<SvgIconProps> | undefined;
+} = {
+  [DeviceType.TEMPERATURESENSOR]: TiThermometer,
+  [DeviceType.ANALOGSENSOR]: PiGauge,
+  [DeviceType.BOILER]: CgSmartHomeBoiler,
+  [DeviceType.HEATSOURCE]: CgSmartHomeBoiler,
+  [DeviceType.THERMOSTAT]: MdThermostatAuto,
+  [DeviceType.MIXER]: AiOutlineControl,
+  [DeviceType.SOLAR]: FaSolarPanel,
+  [DeviceType.HEATPUMP]: GiHeatHaze,
+  [DeviceType.GATEWAY]: AiOutlineGateway,
+  [DeviceType.SWITCH]: TiFlowSwitch,
+  [DeviceType.CONTROLLER]: VscVmConnect,
+  [DeviceType.CONNECT]: VscVmConnect,
+  [DeviceType.ALERT]: AiOutlineAlert,
+  [DeviceType.EXTENSION]: MdOutlineDevices,
+  [DeviceType.WATER]: GiTap,
+  [DeviceType.POOL]: MdOutlinePool,
+  [DeviceType.CUSTOM]: MdPlaylistAdd,
+  [DeviceType.UNKNOWN]: MdOutlineSensors,
+  [DeviceType.SYSTEM]: undefined,
+  [DeviceType.SCHEDULER]: MdMoreTime,
+  [DeviceType.GENERIC]: MdOutlineSensors,
+  [DeviceType.VENTILATION]: PiFan
+};
+
+const DeviceIcon = ({ type_id }: { type_id: DeviceType }) => {
+  const Icon = deviceIconLookup[type_id];
+  return Icon ? <Icon /> : null;
+};
+
+export default DeviceIcon;

interface/src/app/main/Devices.tsx

@@ -0,0 +1,797 @@
+import {
+  useCallback,
+  useContext,
+  useEffect,
+  useLayoutEffect,
+  useState
+} from 'react';
+import { IconContext } from 'react-icons';
+import { useNavigate } from 'react-router';
+import { toast } from 'react-toastify';
+
+import CommentsDisabledOutlinedIcon from '@mui/icons-material/CommentsDisabledOutlined';
+import ConstructionIcon from '@mui/icons-material/Construction';
+import EditIcon from '@mui/icons-material/Edit';
+import EditOffOutlinedIcon from '@mui/icons-material/EditOffOutlined';
+import DownloadIcon from '@mui/icons-material/GetApp';
+import HighlightOffIcon from '@mui/icons-material/HighlightOff';
+import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
+import KeyboardArrowDownOutlinedIcon from '@mui/icons-material/KeyboardArrowDownOutlined';
+import KeyboardArrowUpOutlinedIcon from '@mui/icons-material/KeyboardArrowUpOutlined';
+import PlayArrowIcon from '@mui/icons-material/PlayArrow';
+import SearchIcon from '@mui/icons-material/Search';
+import StarIcon from '@mui/icons-material/Star';
+import StarBorderOutlinedIcon from '@mui/icons-material/StarBorderOutlined';
+import UnfoldMoreOutlinedIcon from '@mui/icons-material/UnfoldMoreOutlined';
+import {
+  Box,
+  Button,
+  CircularProgress,
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogTitle,
+  Grid,
+  IconButton,
+  InputAdornment,
+  List,
+  ListItem,
+  ListItemText,
+  TextField,
+  ToggleButton,
+  Typography
+} from '@mui/material';
+
+import { useRowSelect } from '@table-library/react-table-library/select';
+import { SortToggleType, useSort } from '@table-library/react-table-library/sort';
+import {
+  Body,
+  Cell,
+  Header,
+  HeaderCell,
+  HeaderRow,
+  Row,
+  Table
+} from '@table-library/react-table-library/table';
+import { useTheme } from '@table-library/react-table-library/theme';
+import type { Action, State } from '@table-library/react-table-library/types/common';
+import { dialogStyle } from 'CustomTheme';
+import { useRequest } from 'alova/client';
+import {
+  ButtonTooltip,
+  MessageBox,
+  SectionContent,
+  useLayoutTitle
+} from 'components';
+import { AuthenticatedContext } from 'contexts/authentication';
+import { useI18nContext } from 'i18n/i18n-react';
+import { useInterval } from 'utils';
+
+import { readCoreData, readDeviceData, writeDeviceValue } from '../../api/app';
+import DeviceIcon from './DeviceIcon';
+import DevicesDialog from './DevicesDialog';
+import { formatValue } from './deviceValue';
+import { DeviceEntityMask, DeviceType, DeviceValueUOM_s } from './types';
+import type { Device, DeviceValue } from './types';
+import { deviceValueItemValidation } from './validators';
+
+const Devices = () => {
+  const { LL } = useI18nContext();
+  const { me } = useContext(AuthenticatedContext);
+
+  const [size, setSize] = useState([0, 0]);
+  const [selectedDeviceValue, setSelectedDeviceValue] = useState<DeviceValue>();
+  const [onlyFav, setOnlyFav] = useState(false);
+  const [deviceValueDialogOpen, setDeviceValueDialogOpen] = useState(false);
+  const [showDeviceInfo, setShowDeviceInfo] = useState(false);
+  const [selectedDevice, setSelectedDevice] = useState<number>();
+  const [search, setSearch] = useState('');
+
+  const navigate = useNavigate();
+
+  useLayoutTitle(LL.DEVICES());
+
+  const { data: coreData, send: sendCoreData } = useRequest(() => readCoreData(), {
+    initialData: {
+      connected: true,
+      devices: []
+    }
+  });
+
+  const { data: deviceData, send: sendDeviceData } = useRequest(
+    (id: number) => readDeviceData(id),
+    {
+      initialData: {
+        nodes: []
+      },
+      immediate: false
+    }
+  );
+
+  const { loading: submitting, send: sendDeviceValue } = useRequest(
+    (data: { id: number; c: string; v: unknown }) => writeDeviceValue(data),
+    {
+      immediate: false
+    }
+  );
+
+  useLayoutEffect(() => {
+    function updateSize() {
+      setSize([window.innerWidth, window.innerHeight]);
+    }
+    window.addEventListener('resize', updateSize);
+    updateSize();
+    return () => window.removeEventListener('resize', updateSize);
+  }, []);
+
+  const leftOffset = () => {
+    const devicesWindow = document.getElementById('devices-window');
+    if (!devicesWindow) {
+      return 0;
+    }
+
+    const clientRect = devicesWindow.getBoundingClientRect();
+    const left = clientRect.left;
+    const right = clientRect.right;
+
+    if (!left || !right) {
+      return 0;
+    }
+
+    return left + (right - left < 400 ? 0 : 200);
+  };
+
+  const common_theme = useTheme({
+    BaseRow: `
+      font-size: 14px;
+    `,
+    HeaderRow: `
+      text-transform: uppercase;
+      background-color: black;
+      color: #90CAF9;
+      .th {
+        border-bottom: 1px solid #565656;
+      }
+    `,
+    Row: `
+      cursor: pointer;
+      background-color: #1E1E1E;
+      .td {
+        padding: 8px;
+      }
+      &.tr.tr-body.row-select.row-select-single-selected {
+        background-color: #177ac9;
+      }
+    `
+  });
+
+  const device_theme = useTheme([
+    common_theme,
+    {
+      Table: `
+        --data-table-library_grid-template-columns: repeat(1, minmax(0, 1fr)) 130px;
+      `,
+      HeaderRow: `
+        .th {
+          padding: 8px;
+      `,
+      Row: `
+        font-weight: bold;
+        &:hover .td {
+          background-color: #177ac9;
+      `
+    }
+  ]);
+
+  const data_theme = useTheme([
+    common_theme,
+    {
+      Table: `
+        --data-table-library_grid-template-columns: minmax(200px, auto) minmax(150px, auto) 40px;
+        height: auto;
+        max-height: 100%;
+        overflow-y: scroll;
+        ::-webkit-scrollbar {
+          display:none;
+        }
+      `,
+      BaseRow: `
+      .td {
+        height: 32px;
+      }
+     `,
+      BaseCell: `
+        &:nth-of-type(1) {
+          border-left: 1px solid #177ac9;
+        },
+        &:nth-of-type(2) {
+          text-align: right;
+        },
+        &:nth-of-type(3) {
+          border-right: 1px solid #177ac9;
+        }
+      `,
+      HeaderRow: `
+        .th {
+          border-top: 1px solid #565656;
+        }
+      `,
+      Row: `
+        &:nth-of-type(odd) .td {
+          background-color: #303030;
+        },
+        &:hover .td {
+          background-color: #177ac9;
+      }
+      `
+    }
+  ]);
+
+  const getSortIcon = (state: State, sortKey: unknown) => {
+    if (state.sortKey === sortKey && state.reverse) {
+      return <KeyboardArrowDownOutlinedIcon />;
+    }
+    if (state.sortKey === sortKey && !state.reverse) {
+      return <KeyboardArrowUpOutlinedIcon />;
+    }
+    return <UnfoldMoreOutlinedIcon />;
+  };
+
+  const dv_sort = useSort(
+    { nodes: deviceData.nodes },
+    {},
+    {
+      sortIcon: {
+        iconDefault: <UnfoldMoreOutlinedIcon />,
+        iconUp: <KeyboardArrowUpOutlinedIcon />,
+        iconDown: <KeyboardArrowDownOutlinedIcon />
+      },
+      sortToggleType: SortToggleType.AlternateWithReset,
+      sortFns: {
+        NAME: (array) =>
+          array.sort((a, b) =>
+            a.id.toString().slice(2).localeCompare(b.id.toString().slice(2))
+          ),
+
+        VALUE: (array) =>
+          // eslint-disable-next-line @typescript-eslint/no-unsafe-return
+          array.sort((a, b) => a.v.toString().localeCompare(b.v.toString()))
+      }
+    }
+  );
+
+  async function onSelectChange(action: Action, state: State) {
+    setSelectedDevice(state.id as number);
+    if (action.type === 'ADD_BY_ID_EXCLUSIVELY') {
+      await sendDeviceData(state.id as number);
+    }
+  }
+
+  const device_select = useRowSelect(
+    { nodes: coreData.devices },
+    {
+      onChange: onSelectChange
+    }
+  );
+
+  const resetDeviceSelect = () => {
+    device_select.fns.onRemoveAll();
+    setSearch('');
+  };
+
+  const escFunction = useCallback(
+    (event: KeyboardEvent) => {
+      if (event.key === 'Escape') {
+        if (device_select) {
+          device_select.fns.onRemoveAll();
+        }
+      }
+    },
+    [device_select]
+  );
+
+  useEffect(() => {
+    document.addEventListener('keydown', escFunction);
+    return () => {
+      document.removeEventListener('keydown', escFunction);
+    };
+  }, [escFunction]);
+
+  const customize = () => {
+    if (selectedDevice === 99) {
+      void navigate('/customentities');
+    } else {
+      void navigate('/customizations', { state: selectedDevice });
+    }
+  };
+
+  const escapeCsvCell = (cell: string) => {
+    if (cell == null) {
+      return '';
+    }
+    const sc = cell.toString().trim();
+    if (sc === '' || sc === '""') {
+      return sc;
+    }
+    if (
+      sc.includes('"') ||
+      sc.includes(';') ||
+      sc.includes('\n') ||
+      sc.includes('\r')
+    ) {
+      return '"' + sc.replace(/"/g, '""') + '"';
+    }
+    return sc;
+  };
+
+  const hasMask = (id: string, mask: number) =>
+    (parseInt(id.slice(0, 2), 16) & mask) === mask;
+
+  const handleDownloadCsv = () => {
+    const deviceIndex = coreData.devices.findIndex(
+      (d) => d.id === device_select.state.id
+    );
+    if (deviceIndex === -1) {
+      return;
+    }
+    const filename =
+      coreData.devices[deviceIndex].tn + '_' + coreData.devices[deviceIndex].n;
+
+    const columns = [
+      {
+        accessor: (dv: DeviceValue) => dv.id.slice(2),
+        name: LL.ENTITY_NAME(0)
+      },
+      {
+        accessor: (dv: DeviceValue) =>
+          typeof dv.v === 'number' ? new Intl.NumberFormat().format(dv.v) : dv.v,
+        name: LL.VALUE(0)
+      },
+      {
+        accessor: (dv: DeviceValue) =>
+          dv.u !== undefined && DeviceValueUOM_s[dv.u]
+            ? DeviceValueUOM_s[dv.u].replace(/[^a-zA-Z0-9]/g, '')
+            : '',
+        name: 'UoM'
+      },
+      {
+        accessor: (dv: DeviceValue) =>
+          dv.c && !hasMask(dv.id, DeviceEntityMask.DV_READONLY) ? 'yes' : 'no',
+        name: LL.WRITEABLE()
+      },
+      {
+        accessor: (dv: DeviceValue) =>
+          dv.h
+            ? dv.h
+            : dv.l
+              ? dv.l.join(' | ')
+              : dv.m !== undefined && dv.x !== undefined
+                ? dv.m + ', ' + dv.x
+                : '',
+        name: 'Range'
+      }
+    ];
+
+    const data = onlyFav
+      ? deviceData.nodes.filter((dv) => hasMask(dv.id, DeviceEntityMask.DV_FAVORITE))
+      : deviceData.nodes;
+
+    const csvData = data.reduce(
+      (csvString: string, rowItem: DeviceValue) =>
+        csvString +
+        columns
+          .map(({ accessor }: { accessor: (dv: DeviceValue) => unknown }) =>
+            escapeCsvCell(accessor(rowItem) as string)
+          )
+          .join(';') +
+        '\r\n',
+      columns.map(({ name }: { name: string }) => escapeCsvCell(name)).join(';') +
+        '\r\n'
+    );
+
+    const downloadBlob = (blob: Blob) => {
+      const downloadLink = document.createElement('a');
+      downloadLink.download = filename;
+      downloadLink.href = window.URL.createObjectURL(blob);
+      document.body.appendChild(downloadLink);
+      downloadLink.click();
+      document.body.removeChild(downloadLink);
+    };
+
+    const device = { ...{ device: coreData.devices[deviceIndex] }, ...deviceData };
+    downloadBlob(
+      new Blob([JSON.stringify(device, null, 2)], {
+        type: 'text;charset:utf-8'
+      })
+    );
+
+    downloadBlob(new Blob([csvData], { type: 'text/csv;charset:utf-8' }));
+  };
+
+  useInterval(() => {
+    if (!deviceValueDialogOpen) {
+      selectedDevice ? void sendDeviceData(selectedDevice) : void sendCoreData();
+    }
+  });
+
+  const deviceValueDialogSave = async (devicevalue: DeviceValue) => {
+    const id = Number(device_select.state.id);
+    await sendDeviceValue({ id, c: devicevalue.c ?? '', v: devicevalue.v })
+      .then(() => {
+        toast.success(LL.WRITE_CMD_SENT());
+      })
+      .catch((error: Error) => {
+        toast.error(error.message);
+      })
+      .finally(async () => {
+        setDeviceValueDialogOpen(false);
+        await sendDeviceData(id);
+        setSelectedDeviceValue(undefined);
+      });
+  };
+
+  const renderDeviceDetails = () => {
+    if (showDeviceInfo) {
+      const deviceIndex = coreData.devices.findIndex(
+        (d) => d.id === device_select.state.id
+      );
+      if (deviceIndex === -1) {
+        return;
+      }
+
+      return (
+        <Dialog
+          sx={dialogStyle}
+          open={showDeviceInfo}
+          onClose={() => setShowDeviceInfo(false)}
+        >
+          <DialogTitle>{LL.DEVICE_DETAILS()}</DialogTitle>
+          <DialogContent dividers>
+            <List dense={true}>
+              <ListItem>
+                <ListItemText
+                  primary={LL.TYPE(0)}
+                  secondary={coreData.devices[deviceIndex].tn}
+                />
+              </ListItem>
+              <ListItem>
+                <ListItemText
+                  primary={LL.NAME(0)}
+                  secondary={coreData.devices[deviceIndex].n}
+                />
+              </ListItem>
+              {coreData.devices[deviceIndex].t !== DeviceType.CUSTOM && (
+                <>
+                  <ListItem>
+                    <ListItemText
+                      primary={LL.BRAND()}
+                      secondary={coreData.devices[deviceIndex].b}
+                    />
+                  </ListItem>
+                  <ListItem>
+                    <ListItemText
+                      primary={LL.ID_OF(LL.DEVICE())}
+                      secondary={
+                        '0x' +
+                        (
+                          '00' +
+                          coreData.devices[deviceIndex].d.toString(16).toUpperCase()
+                        ).slice(-2)
+                      }
+                    />
+                  </ListItem>
+                  <ListItem>
+                    <ListItemText
+                      primary={LL.ID_OF(LL.PRODUCT())}
+                      secondary={coreData.devices[deviceIndex].p}
+                    />
+                  </ListItem>
+                  <ListItem>
+                    <ListItemText
+                      primary={LL.VERSION()}
+                      secondary={coreData.devices[deviceIndex].v}
+                    />
+                  </ListItem>
+                </>
+              )}
+            </List>
+          </DialogContent>
+          <DialogActions>
+            <Button
+              variant="outlined"
+              onClick={() => setShowDeviceInfo(false)}
+              color="secondary"
+            >
+              {LL.CLOSE()}
+            </Button>
+          </DialogActions>
+        </Dialog>
+      );
+    }
+  };
+
+  const renderCoreData = () => (
+    <>
+      <IconContext.Provider
+        value={{
+          color: 'lightblue',
+          size: '18',
+          style: { verticalAlign: 'middle' }
+        }}
+      >
+        {!coreData.connected && (
+          <MessageBox my={2} level="error" message={LL.EMS_BUS_WARNING()} />
+        )}
+
+        {coreData.connected && (
+          <Table
+            data={{ nodes: coreData.devices }}
+            select={device_select}
+            theme={device_theme}
+            layout={{ custom: true }}
+          >
+            {(tableList: Device[]) => (
+              <>
+                <Header>
+                  <HeaderRow>
+                    <HeaderCell resize>{LL.DESCRIPTION()}</HeaderCell>
+                    <HeaderCell stiff>{LL.TYPE(0)}</HeaderCell>
+                  </HeaderRow>
+                </Header>
+                <Body>
+                  {tableList.length === 0 && (
+                    <CircularProgress sx={{ margin: 1 }} size={18} />
+                  )}
+                  {tableList.map((device: Device) => (
+                    <Row key={device.id} item={device}>
+                      <Cell>
+                        <DeviceIcon type_id={device.t} />
+                        &nbsp;&nbsp;
+                        {device.n}
+                        <span style={{ color: 'lightblue' }}>
+                          &nbsp;&nbsp;({device.e})
+                        </span>
+                      </Cell>
+                      <Cell stiff>{device.tn}</Cell>
+                    </Row>
+                  ))}
+                </Body>
+              </>
+            )}
+          </Table>
+        )}
+      </IconContext.Provider>
+    </>
+  );
+
+  const deviceValueDialogClose = () => {
+    setDeviceValueDialogOpen(false);
+    if (selectedDevice !== undefined) {
+      void sendDeviceData(selectedDevice);
+    }
+  };
+
+  const renderDeviceData = () => {
+    if (!selectedDevice) {
+      return;
+    }
+
+    const showDeviceValue = (dv: DeviceValue) => {
+      setSelectedDeviceValue(dv);
+      setDeviceValueDialogOpen(true);
+    };
+
+    const renderNameCell = (dv: DeviceValue) => (
+      <>
+        {dv.id.slice(2)}&nbsp;
+        {hasMask(dv.id, DeviceEntityMask.DV_FAVORITE) && (
+          <StarIcon color="primary" sx={{ fontSize: 12 }} />
+        )}
+        {hasMask(dv.id, DeviceEntityMask.DV_READONLY) && (
+          <EditOffOutlinedIcon color="primary" sx={{ fontSize: 12 }} />
+        )}
+        {hasMask(dv.id, DeviceEntityMask.DV_API_MQTT_EXCLUDE) && (
+          <CommentsDisabledOutlinedIcon color="primary" sx={{ fontSize: 12 }} />
+        )}
+      </>
+    );
+
+    const shown_data = onlyFav
+      ? deviceData.nodes.filter(
+          (dv) =>
+            hasMask(dv.id, DeviceEntityMask.DV_FAVORITE) &&
+            dv.id.slice(2).toLowerCase().includes(search.toLowerCase())
+        )
+      : deviceData.nodes.filter((dv) =>
+          dv.id.slice(2).toLowerCase().includes(search.toLowerCase())
+        );
+
+    const deviceIndex = coreData.devices.findIndex(
+      (d) => d.id === device_select.state.id
+    );
+    if (deviceIndex === -1) {
+      return;
+    }
+
+    return (
+      <Box
+        sx={{
+          backgroundColor: 'black',
+          position: 'absolute',
+          left: () => leftOffset(),
+          right: 0,
+          bottom: 0,
+          top: 64,
+          zIndex: 'modal',
+          maxHeight: () => size[1] - 126,
+          border: '1px solid #177ac9'
+        }}
+      >
+        <Box sx={{ p: 1 }}>
+          <Grid container justifyContent="space-between">
+            <Typography noWrap variant="subtitle1" color="warning.main">
+              {coreData.devices[deviceIndex].n}&nbsp;(
+              {coreData.devices[deviceIndex].tn})
+            </Typography>
+            <Grid justifyContent="flex-end">
+              <ButtonTooltip title={LL.CLOSE()}>
+                <IconButton onClick={resetDeviceSelect}>
+                  <HighlightOffIcon color="primary" sx={{ fontSize: 18 }} />
+                </IconButton>
+              </ButtonTooltip>
+            </Grid>
+          </Grid>
+
+          <TextField
+            size="small"
+            variant="outlined"
+            sx={{ width: '22ch' }}
+            placeholder={LL.SEARCH()}
+            onChange={(event) => {
+              setSearch(event.target.value);
+            }}
+            slotProps={{
+              input: {
+                startAdornment: (
+                  <InputAdornment position="start">
+                    <SearchIcon color="primary" sx={{ fontSize: 16 }} />
+                  </InputAdornment>
+                )
+              }
+            }}
+          />
+          <ButtonTooltip title={LL.DEVICE_DETAILS()}>
+            <IconButton onClick={() => setShowDeviceInfo(true)}>
+              <InfoOutlinedIcon color="primary" sx={{ fontSize: 18 }} />
+            </IconButton>
+          </ButtonTooltip>
+          {me.admin && (
+            <ButtonTooltip title={LL.CUSTOMIZATIONS()}>
+              <IconButton onClick={customize}>
+                <ConstructionIcon color="primary" sx={{ fontSize: 18 }} />
+              </IconButton>
+            </ButtonTooltip>
+          )}
+          <ButtonTooltip title={LL.EXPORT()}>
+            <IconButton onClick={handleDownloadCsv}>
+              <DownloadIcon color="primary" sx={{ fontSize: 18 }} />
+            </IconButton>
+          </ButtonTooltip>
+
+          <ButtonTooltip title={LL.FAVORITES()}>
+            <ToggleButton
+              value="1"
+              size="small"
+              selected={onlyFav}
+              onChange={() => {
+                setOnlyFav(!onlyFav);
+              }}
+            >
+              {onlyFav ? (
+                <StarIcon color="primary" sx={{ fontSize: 18 }} />
+              ) : (
+                <StarBorderOutlinedIcon color="primary" sx={{ fontSize: 18 }} />
+              )}{' '}
+            </ToggleButton>
+          </ButtonTooltip>
+
+          <span style={{ color: 'grey', fontSize: '12px' }}>
+            &nbsp;
+            {LL.SHOWING() +
+              ' ' +
+              shown_data.length +
+              '/' +
+              coreData.devices[deviceIndex].e +
+              ' ' +
+              LL.ENTITIES(shown_data.length)}
+          </span>
+        </Box>
+
+        <Table
+          data={{ nodes: shown_data }}
+          theme={data_theme}
+          sort={dv_sort}
+          layout={{ custom: true, fixedHeader: true }}
+        >
+          {(tableList: DeviceValue[]) => (
+            <>
+              <Header>
+                <HeaderRow>
+                  <HeaderCell resize>
+                    <Button
+                      fullWidth
+                      style={{ fontSize: '14px', justifyContent: 'flex-start' }}
+                      endIcon={getSortIcon(dv_sort.state, 'NAME')}
+                      onClick={() => dv_sort.fns.onToggleSort({ sortKey: 'NAME' })}
+                    >
+                      {LL.ENTITY_NAME(0)}
+                    </Button>
+                  </HeaderCell>
+                  <HeaderCell resize>
+                    <Button
+                      fullWidth
+                      style={{ fontSize: '14px', justifyContent: 'flex-end' }}
+                      endIcon={getSortIcon(dv_sort.state, 'VALUE')}
+                      onClick={() => dv_sort.fns.onToggleSort({ sortKey: 'VALUE' })}
+                    >
+                      {LL.VALUE(0)}
+                    </Button>
+                  </HeaderCell>
+                  <HeaderCell stiff />
+                </HeaderRow>
+              </Header>
+              <Body>
+                {tableList.map((dv: DeviceValue) => (
+                  <Row key={dv.id} item={dv} onClick={() => showDeviceValue(dv)}>
+                    <Cell>{renderNameCell(dv)}</Cell>
+                    <Cell>{formatValue(LL, dv.v, dv.u)}</Cell>
+                    <Cell stiff>
+                      {me.admin &&
+                        dv.c &&
+                        !hasMask(dv.id, DeviceEntityMask.DV_READONLY) && (
+                          <IconButton
+                            size="small"
+                            onClick={() => showDeviceValue(dv)}
+                          >
+                            {dv.v === '' ? (
+                              <PlayArrowIcon color="primary" sx={{ fontSize: 16 }} />
+                            ) : (
+                              <EditIcon color="primary" sx={{ fontSize: 16 }} />
+                            )}
+                          </IconButton>
+                        )}
+                    </Cell>
+                  </Row>
+                ))}
+              </Body>
+            </>
+          )}
+        </Table>
+      </Box>
+    );
+  };
+
+  return (
+    <SectionContent id="devices-window">
+      {renderCoreData()}
+      {renderDeviceData()}
+      {renderDeviceDetails()}
+      {selectedDeviceValue && (
+        <DevicesDialog
+          open={deviceValueDialogOpen}
+          onClose={deviceValueDialogClose}
+          onSave={deviceValueDialogSave}
+          selectedItem={selectedDeviceValue}
+          writeable={
+            selectedDeviceValue.c !== undefined &&
+            !hasMask(selectedDeviceValue.id, DeviceEntityMask.DV_READONLY)
+          }
+          validator={deviceValueItemValidation(selectedDeviceValue)}
+          progress={submitting}
+        />
+      )}
+    </SectionContent>
+  );
+};
+
+export default Devices;

interface/src/app/main/DevicesDialog.tsx

@@ -1,46 +1,35 @@
+import { useEffect, useState } from 'react';
+
 import CancelIcon from '@mui/icons-material/Cancel';
 import WarningIcon from '@mui/icons-material/Warning';
-
 import {
+  Box,
   Button,
+  CircularProgress,
   Dialog,
-  DialogTitle,
-  DialogContent,
   DialogActions,
+  DialogContent,
+  DialogTitle,
+  FormHelperText,
+  Grid,
   InputAdornment,
   MenuItem,
   TextField,
-  FormHelperText,
+  Typography
-  Grid,
-  Box,
-  Typography,
-  CircularProgress
 } from '@mui/material';
-import { useState, useEffect } from 'react';
+
+import { dialogStyle } from 'CustomTheme';
+import type Schema from 'async-validator';
+import type { ValidateFieldsError } from 'async-validator';
+import { ValidatedTextField } from 'components';
+import { useI18nContext } from 'i18n/i18n-react';
+import { numberValue, updateValue } from 'utils';
+import { validate } from 'validators';
 
 import { DeviceValueUOM, DeviceValueUOM_s } from './types';
 import type { DeviceValue } from './types';
-import type Schema from 'async-validator';
 
-import type { ValidateFieldsError } from 'async-validator';
+interface DevicesDialogProps {
-import { dialogStyle } from 'CustomTheme';
-import { ValidatedTextField } from 'components';
-import { useI18nContext } from 'i18n/i18n-react';
-import { updateValue } from 'utils';
-
-import { validate } from 'validators';
-
-// const dialogStyle = {
-//   '& .MuiDialog-paper': {
-//     borderRadius: '8px',
-//     borderColor: '#565656',
-//     borderStyle: 'solid',
-//     borderWidth: '1px'
-//   },
-//   backdropFilter: 'blur(1px)'
-// };
-
-type DashboardDevicesDialogProps = {
   open: boolean;
   onClose: () => void;
   onSave: (as: DeviceValue) => void;
@@ -48,9 +37,9 @@ type DashboardDevicesDialogProps = {
   writeable: boolean;
   validator: Schema;
   progress: boolean;
-};
+}
 
-const DashboardDevicesDialog = ({
+const DevicesDialog = ({
   open,
   onClose,
   onSave,
@@ -58,7 +47,7 @@ const DashboardDevicesDialog = ({
   writeable,
   validator,
   progress
-}: DashboardDevicesDialogProps) => {
+}: DevicesDialogProps) => {
   const { LL } = useI18nContext();
   const [editItem, setEditItem] = useState<DeviceValue>(selectedItem);
   const [fieldErrors, setFieldErrors] = useState<ValidateFieldsError>();
@@ -81,12 +70,15 @@ const DashboardDevicesDialog = ({
       setFieldErrors(undefined);
       await validate(validator, editItem);
       onSave(editItem);
-    } catch (errors: any) {
+    } catch (error) {
-      setFieldErrors(errors);
+      setFieldErrors(error as ValidateFieldsError);
     }
   };
 
-  const setUom = (uom: number) => {
+  const setUom = (uom?: DeviceValueUOM) => {
+    if (uom === undefined) {
+      return;
+    }
     switch (uom) {
       case DeviceValueUOM.HOURS:
         return LL.HOURS();
@@ -99,46 +91,38 @@ const DashboardDevicesDialog = ({
     }
   };
 
-  const showHelperText = (dv: DeviceValue) => {
+  const showHelperText = (dv: DeviceValue) =>
-    if (dv.h) {
+    dv.h ? (
-      return dv.h;
+      dv.h
-    }
+    ) : dv.l ? (
-    if (dv.l) {
+      dv.l.join(' | ')
-      return '[ ' + dv.l.join(' | ') + ' ]';
+    ) : dv.m !== undefined && dv.x !== undefined ? (
-    }
+      <>
-
+        {dv.m}&nbsp;&rarr;&nbsp;{dv.x}
-    let helperText = '<';
+      </>
-    if (dv.s) {
+    ) : undefined;
-      helperText += 'n';
-      if (dv.m !== undefined && dv.x !== undefined) {
-        helperText += ' between ' + dv.m + ' and ' + dv.x;
-      } else {
-        helperText += ' , step ' + dv.s;
-      }
-    } else {
-      helperText += 'text';
-    }
-    return helperText + '>';
-  };
 
   return (
     <Dialog sx={dialogStyle} open={open} onClose={close}>
       <DialogTitle>
-        {selectedItem.v === '' && selectedItem.c ? LL.RUN_COMMAND() : writeable ? LL.CHANGE_VALUE() : LL.VALUE(0)}
+        {selectedItem.v === '' && selectedItem.c
+          ? LL.RUN_COMMAND()
+          : writeable
+            ? LL.CHANGE_VALUE()
+            : LL.VALUE(0)}
       </DialogTitle>
       <DialogContent dividers>
         <Box color="warning.main" p={0} pl={0} pr={0} mt={0} mb={2}>
           <Typography variant="body2">{editItem.id.slice(2)}</Typography>
         </Box>
-        <Grid>
+        <Grid container>
-          <Grid item>
+          <Grid size={12}>
             {editItem.l ? (
               <TextField
                 name="v"
                 label={LL.VALUE(0)}
                 value={editItem.v}
                 disabled={!writeable}
-                autoFocus
                 sx={{ width: '30ch' }}
                 select
                 onChange={updateFormValue}
@@ -154,15 +138,23 @@ const DashboardDevicesDialog = ({
                 fieldErrors={fieldErrors}
                 name="v"
                 label={LL.VALUE(0)}
-                value={Math.round(editItem.v * 10) / 10}
+                value={numberValue(Math.round((editItem.v as number) * 10) / 10)}
                 autoFocus
                 disabled={!writeable}
                 type="number"
                 sx={{ width: '30ch' }}
                 onChange={updateFormValue}
-                inputProps={editItem.s ? { min: editItem.m, max: editItem.x, step: editItem.s } : {}}
+                slotProps={{
-                InputProps={{
+                  htmlInput: editItem.s
-                  startAdornment: <InputAdornment position="start">{setUom(editItem.u)}</InputAdornment>
+                    ? { min: editItem.m, max: editItem.x, step: editItem.s }
+                    : {},
+                  input: {
+                    startAdornment: (
+                      <InputAdornment position="start">
+                        {setUom(editItem.u)}
+                      </InputAdornment>
+                    )
+                  }
                 }}
               />
             ) : (
@@ -172,16 +164,15 @@ const DashboardDevicesDialog = ({
                 label={LL.VALUE(0)}
                 value={editItem.v}
                 disabled={!writeable}
-                autoFocus
                 sx={{ width: '30ch' }}
-                multiline={editItem.u ? false : true}
+                multiline={!editItem.u}
                 onChange={updateFormValue}
               />
             )}
           </Grid>
           {writeable && (
-            <Grid item>
+            <Grid>
-              <FormHelperText>format:&nbsp;{showHelperText(editItem)}</FormHelperText>
+              <FormHelperText>{showHelperText(editItem)}</FormHelperText>
             </Grid>
           )}
         </Grid>
@@ -197,10 +188,20 @@ const DashboardDevicesDialog = ({
               position: 'relative'
             }}
           >
-            <Button startIcon={<CancelIcon />} variant="outlined" onClick={close} color="secondary">
+            <Button
+              startIcon={<CancelIcon />}
+              variant="outlined"
+              onClick={close}
+              color="secondary"
+            >
               {LL.CANCEL()}
             </Button>
-            <Button startIcon={<WarningIcon color="warning" />} variant="contained" onClick={save} color="info">
+            <Button
+              startIcon={<WarningIcon color="warning" />}
+              variant="outlined"
+              onClick={save}
+              color="primary"
+            >
               {selectedItem.v === '' && selectedItem.c ? LL.EXECUTE() : LL.UPDATE()}
             </Button>
             {progress && (
@@ -225,4 +226,4 @@ const DashboardDevicesDialog = ({
   );
 };
 
-export default DashboardDevicesDialog;
+export default DevicesDialog;

interface/src/app/main/EntityMaskToggle.tsx

@@ -1,12 +1,13 @@
 import { ToggleButton, ToggleButtonGroup } from '@mui/material';
+
 import OptionIcon from './OptionIcon';
 import { DeviceEntityMask } from './types';
 import type { DeviceEntity } from './types';
 
-type EntityMaskToggleProps = {
+interface EntityMaskToggleProps {
   onUpdate: (de: DeviceEntity) => void;
   de: DeviceEntity;
-};
+}
 
 const EntityMaskToggle = ({ onUpdate, de }: EntityMaskToggleProps) => {
   const getMaskNumber = (newMask: string[]) => {
@@ -42,7 +43,7 @@ const EntityMaskToggle = ({ onUpdate, de }: EntityMaskToggleProps) => {
       size="small"
       color="secondary"
       value={getMaskString(de.m)}
-      onChange={(event, mask) => {
+      onChange={(event, mask: string[]) => {
         de.m = getMaskNumber(mask);
         if (de.n === '' && de.m & DeviceEntityMask.DV_READONLY) {
           de.m = de.m | DeviceEntityMask.DV_WEB_EXCLUDE;
@@ -54,25 +55,46 @@ const EntityMaskToggle = ({ onUpdate, de }: EntityMaskToggleProps) => {
       }}
     >
       <ToggleButton value="8" disabled={(de.m & 0x81) !== 0 || de.n === undefined}>
-        <OptionIcon type="favorite" isSet={(de.m & DeviceEntityMask.DV_FAVORITE) === DeviceEntityMask.DV_FAVORITE} />
+        <OptionIcon
+          type="favorite"
+          isSet={
+            (de.m & DeviceEntityMask.DV_FAVORITE) === DeviceEntityMask.DV_FAVORITE
+          }
+        />
       </ToggleButton>
       <ToggleButton value="4" disabled={!de.w || (de.m & 0x83) >= 3}>
-        <OptionIcon type="readonly" isSet={(de.m & DeviceEntityMask.DV_READONLY) === DeviceEntityMask.DV_READONLY} />
+        <OptionIcon
+          type="readonly"
+          isSet={
+            (de.m & DeviceEntityMask.DV_READONLY) === DeviceEntityMask.DV_READONLY
+          }
+        />
       </ToggleButton>
       <ToggleButton value="2" disabled={de.n === '' || (de.m & 0x80) !== 0}>
         <OptionIcon
           type="api_mqtt_exclude"
-          isSet={(de.m & DeviceEntityMask.DV_API_MQTT_EXCLUDE) === DeviceEntityMask.DV_API_MQTT_EXCLUDE}
+          isSet={
+            (de.m & DeviceEntityMask.DV_API_MQTT_EXCLUDE) ===
+            DeviceEntityMask.DV_API_MQTT_EXCLUDE
+          }
         />
       </ToggleButton>
       <ToggleButton value="1" disabled={de.n === undefined || (de.m & 0x80) !== 0}>
         <OptionIcon
           type="web_exclude"
-          isSet={(de.m & DeviceEntityMask.DV_WEB_EXCLUDE) === DeviceEntityMask.DV_WEB_EXCLUDE}
+          isSet={
+            (de.m & DeviceEntityMask.DV_WEB_EXCLUDE) ===
+            DeviceEntityMask.DV_WEB_EXCLUDE
+          }
         />
       </ToggleButton>
       <ToggleButton value="128">
-        <OptionIcon type="deleted" isSet={(de.m & DeviceEntityMask.DV_DELETED) === DeviceEntityMask.DV_DELETED} />
+        <OptionIcon
+          type="deleted"
+          isSet={
+            (de.m & DeviceEntityMask.DV_DELETED) === DeviceEntityMask.DV_DELETED
+          }
+        />
       </ToggleButton>
     </ToggleButtonGroup>
   );

interface/src/app/main/Help.tsx

@@ -0,0 +1,184 @@
+import { useContext, useState } from 'react';
+import { toast } from 'react-toastify';
+
+import CommentIcon from '@mui/icons-material/CommentTwoTone';
+import DownloadIcon from '@mui/icons-material/GetApp';
+import GitHubIcon from '@mui/icons-material/GitHub';
+import MenuBookIcon from '@mui/icons-material/MenuBookTwoTone';
+import {
+  Avatar,
+  Box,
+  Button,
+  Divider,
+  Link,
+  List,
+  ListItem,
+  ListItemAvatar,
+  ListItemButton,
+  ListItemText,
+  Stack,
+  Typography
+} from '@mui/material';
+
+import { useRequest } from 'alova/client';
+import { SectionContent, useLayoutTitle } from 'components';
+import { AuthenticatedContext } from 'contexts/authentication';
+import { useI18nContext } from 'i18n/i18n-react';
+import { saveFile } from 'utils';
+
+import { API, callAction } from '../../api/app';
+import type { APIcall } from './types';
+
+const Help = () => {
+  const { LL } = useI18nContext();
+  useLayoutTitle(LL.HELP());
+
+  const { me } = useContext(AuthenticatedContext);
+
+  const [customSupportIMG, setCustomSupportIMG] = useState<string | null>(null);
+  const [customSupportHTML, setCustomSupportHTML] = useState<string | null>(null);
+  const [notFound, setNotFound] = useState<boolean>(false);
+
+  useRequest(() => callAction({ action: 'getCustomSupport' })).onSuccess((event) => {
+    if (event && event.data && Object.keys(event.data).length !== 0) {
+      const data = (event.data as { Support: { img_url?: string; html?: string[] } })
+        .Support;
+      if (data.img_url) {
+        setCustomSupportIMG(data.img_url);
+      }
+      if (data.html) {
+        setCustomSupportHTML(data.html.join('<br/>'));
+      }
+    }
+  });
+
+  const { send: sendAPI } = useRequest((data: APIcall) => API(data), {
+    immediate: false
+  })
+    .onSuccess((event) => {
+      saveFile(event.data, 'system_info', '.json');
+      toast.info(LL.DOWNLOAD_SUCCESSFUL());
+    })
+    .onError((error) => {
+      toast.error(String(error.error?.message || 'An error occurred'));
+    });
+
+  return (
+    <SectionContent>
+      {customSupportHTML && (
+        <Stack
+          padding={1}
+          mb={2}
+          direction="row"
+          divider={<Divider orientation="vertical" flexItem />}
+          sx={{
+            borderRadius: 3,
+            border: '2px solid grey',
+            justifyContent: 'space-evenly',
+            alignItems: 'center'
+          }}
+        >
+          <Typography variant="subtitle1">
+            <div dangerouslySetInnerHTML={{ __html: customSupportHTML }} />
+          </Typography>
+          <Box
+            component="img"
+            referrerPolicy="no-referrer"
+            sx={{
+              maxHeight: { xs: 100, md: 250 }
+            }}
+            onError={() => setNotFound(true)}
+            src={
+              notFound
+                ? ''
+                : customSupportIMG ||
+                  'https://docs.emsesp.org/_media/images/installer.jpeg'
+            }
+          />
+        </Stack>
+      )}
+
+      {me.admin && (
+        <List sx={{ borderRadius: 3, border: '2px solid grey' }}>
+          <ListItem>
+            <ListItemButton
+              component="a"
+              target="_blank"
+              rel="noreferrer"
+              href="https://docs.emsesp.org"
+            >
+              <ListItemAvatar>
+                <Avatar sx={{ bgcolor: '#72caf9' }}>
+                  <MenuBookIcon />
+                </Avatar>
+              </ListItemAvatar>
+              <ListItemText primary={LL.HELP_INFORMATION_1()} />
+            </ListItemButton>
+          </ListItem>
+
+          <ListItem>
+            <ListItemButton
+              component="a"
+              target="_blank"
+              rel="noreferrer"
+              href="https://discord.gg/3J3GgnzpyT"
+            >
+              <ListItemAvatar>
+                <Avatar sx={{ bgcolor: '#72caf9' }}>
+                  <CommentIcon />
+                </Avatar>
+              </ListItemAvatar>
+              <ListItemText primary={LL.HELP_INFORMATION_2()} />
+            </ListItemButton>
+          </ListItem>
+
+          <ListItem>
+            <ListItemButton
+              component="a"
+              target="_blank"
+              rel="noreferrer"
+              href="https://github.com/emsesp/EMS-ESP32/issues/new/choose"
+            >
+              <ListItemAvatar>
+                <Avatar sx={{ bgcolor: '#72caf9' }}>
+                  <GitHubIcon />
+                </Avatar>
+              </ListItemAvatar>
+              <ListItemText primary={LL.HELP_INFORMATION_3()} />
+            </ListItemButton>
+          </ListItem>
+        </List>
+      )}
+
+      <Box p={2} color="warning.main">
+        <Typography mb={1} variant="body1">
+          {LL.HELP_INFORMATION_4()}.
+        </Typography>
+        <Button
+          startIcon={<DownloadIcon />}
+          variant="outlined"
+          color="primary"
+          onClick={() => sendAPI({ device: 'system', cmd: 'info', id: 0 })}
+        >
+          {LL.SUPPORT_INFORMATION(0)}
+        </Button>
+      </Box>
+
+      <Divider sx={{ mt: 4 }} />
+
+      <Typography color="white" variant="subtitle1" align="center" mt={1}>
+        &copy;&nbsp;
+        <Link
+          target="_blank"
+          rel="noreferrer"
+          href="https://emsesp.org"
+          color="primary"
+        >
+          {'emsesp.org'}
+        </Link>
+      </Typography>
+    </SectionContent>
+  );
+};
+
+export default Help;

interface/src/app/main/Modules.tsx

@@ -0,0 +1,269 @@
+import { useCallback, useState } from 'react';
+import { useBlocker } from 'react-router';
+import { toast } from 'react-toastify';
+
+import CancelIcon from '@mui/icons-material/Cancel';
+import CircleIcon from '@mui/icons-material/Circle';
+import WarningIcon from '@mui/icons-material/Warning';
+import { Box, Button, Typography } from '@mui/material';
+
+import {
+  Body,
+  Cell,
+  Header,
+  HeaderCell,
+  HeaderRow,
+  Row,
+  Table
+} from '@table-library/react-table-library/table';
+import { useTheme } from '@table-library/react-table-library/theme';
+import { updateState, useRequest } from 'alova/client';
+import {
+  BlockNavigation,
+  ButtonRow,
+  FormLoader,
+  SectionContent,
+  useLayoutTitle
+} from 'components';
+import { useI18nContext } from 'i18n/i18n-react';
+
+import { readModules, writeModules } from '../../api/app';
+import ModulesDialog from './ModulesDialog';
+import type { ModuleItem } from './types';
+
+const Modules = () => {
+  const { LL } = useI18nContext();
+  const [numChanges, setNumChanges] = useState<number>(0);
+  const blocker = useBlocker(numChanges !== 0);
+
+  const [selectedModuleItem, setSelectedModuleItem] = useState<ModuleItem>();
+  const [dialogOpen, setDialogOpen] = useState<boolean>(false);
+
+  useLayoutTitle(LL.MODULES());
+
+  const {
+    data: modules,
+    send: fetchModules,
+    error
+  } = useRequest(readModules, {
+    initialData: []
+  });
+
+  const { send: updateModules } = useRequest(
+    (data: { key: string; enabled: boolean; license: string }) => writeModules(data),
+    {
+      immediate: false
+    }
+  );
+
+  const modules_theme = useTheme({
+    Table: `
+      --data-table-library_grid-template-columns: 48px 180px 120px 100px repeat(1, minmax(160px, 1fr)) 180px;
+    `,
+    BaseRow: `
+      font-size: 14px;
+      .td {
+        height: 32px;
+      }
+    `,
+    BaseCell: `
+      &:nth-of-type(1) {
+        text-align: center;
+      }
+    `,
+    HeaderRow: `
+      text-transform: uppercase;
+      background-color: black;
+      color: #90CAF9;
+      .th {
+        border-bottom: 1px solid #565656;
+        height: 36px;
+      }
+    `,
+    Row: `
+      background-color: #1e1e1e;
+      position: relative;
+      cursor: pointer;
+      .td {
+        border-top: 1px solid #565656;
+        border-bottom: 1px solid #565656;
+      }
+      &:hover .td {
+        border-top: 1px solid #177ac9;
+        border-bottom: 1px solid #177ac9;
+      }
+      &:nth-of-type(odd) .td {
+        background-color: #303030;
+      }
+    `
+  });
+
+  const onDialogClose = () => {
+    setDialogOpen(false);
+  };
+
+  const onDialogSave = (updatedItem: ModuleItem) => {
+    setDialogOpen(false);
+    updateModuleItem(updatedItem);
+  };
+
+  const editModuleItem = useCallback((mi: ModuleItem) => {
+    setSelectedModuleItem(mi);
+    setDialogOpen(true);
+  }, []);
+
+  const onCancel = async () => {
+    await fetchModules().then(() => {
+      setNumChanges(0);
+    });
+  };
+
+  function hasModulesChanged(mi: ModuleItem) {
+    return mi.enabled !== mi.o_enabled || mi.license !== mi.o_license;
+  }
+
+  const updateModuleItem = (updatedItem: ModuleItem) => {
+    void updateState(readModules(), (data: ModuleItem[]) => {
+      const new_data = data.map((mi) =>
+        mi.id === updatedItem.id ? { ...mi, ...updatedItem } : mi
+      );
+      setNumChanges(new_data.filter((mi) => hasModulesChanged(mi)).length);
+      return new_data;
+    });
+  };
+
+  const saveModules = async () => {
+    await updateModules({
+      modules: modules.map((condensed_mi) => ({
+        key: condensed_mi.key,
+        enabled: condensed_mi.enabled,
+        license: condensed_mi.license
+      }))
+    })
+      .then(() => {
+        toast.success(LL.MODULES_UPDATED());
+      })
+      .catch((error: Error) => {
+        toast.error(error.message);
+      })
+      .finally(async () => {
+        await fetchModules();
+        setNumChanges(0);
+      });
+  };
+
+  const renderContent = () => {
+    if (!modules) {
+      return <FormLoader onRetry={fetchModules} errorMessage={error?.message} />;
+    }
+
+    if (modules.length === 0) {
+      return (
+        <Typography variant="body2" color="error">
+          {LL.MODULES_NONE()}
+        </Typography>
+      );
+    }
+
+    const colorStatus = (status: number) => {
+      if (status === 1) {
+        return <div style={{ color: 'red' }}>Pending Activation</div>;
+      }
+      return <div style={{ color: '#00FF7F' }}>Activated</div>;
+    };
+
+    return (
+      <>
+        <Box mb={2} color="warning.main">
+          <Typography variant="body1">{LL.MODULES_DESCRIPTION()}.</Typography>
+        </Box>
+        <Table
+          data={{ nodes: modules }}
+          theme={modules_theme}
+          layout={{ custom: true }}
+        >
+          {(tableList: ModuleItem[]) => (
+            <>
+              <Header>
+                <HeaderRow>
+                  <HeaderCell />
+                  <HeaderCell>{LL.NAME(0)}</HeaderCell>
+                  <HeaderCell>Author</HeaderCell>
+                  <HeaderCell>{LL.VERSION()}</HeaderCell>
+                  <HeaderCell>Message</HeaderCell>
+                  <HeaderCell>{LL.STATUS_OF('')}</HeaderCell>
+                </HeaderRow>
+              </Header>
+              <Body>
+                {tableList.map((mi: ModuleItem) => (
+                  <Row key={mi.id} item={mi} onClick={() => editModuleItem(mi)}>
+                    <Cell stiff>
+                      {mi.enabled ? (
+                        <CircleIcon
+                          color="success"
+                          sx={{ fontSize: 16, verticalAlign: 'middle' }}
+                        />
+                      ) : (
+                        <CircleIcon
+                          color="error"
+                          sx={{ fontSize: 16, verticalAlign: 'middle' }}
+                        />
+                      )}
+                    </Cell>
+                    <Cell>{mi.name}</Cell>
+                    <Cell>{mi.author}</Cell>
+                    <Cell>{mi.version}</Cell>
+                    <Cell>{mi.message}</Cell>
+                    <Cell>{colorStatus(mi.status)}</Cell>
+                  </Row>
+                ))}
+              </Body>
+            </>
+          )}
+        </Table>
+
+        <Box mt={1} display="flex" flexWrap="wrap">
+          <Box flexGrow={1}>
+            {numChanges !== 0 && (
+              <ButtonRow>
+                <Button
+                  startIcon={<CancelIcon />}
+                  variant="outlined"
+                  onClick={onCancel}
+                  color="secondary"
+                >
+                  {LL.CANCEL()}
+                </Button>
+                <Button
+                  startIcon={<WarningIcon color="warning" />}
+                  variant="contained"
+                  color="info"
+                  onClick={saveModules}
+                >
+                  {LL.APPLY_CHANGES(numChanges)}
+                </Button>
+              </ButtonRow>
+            )}
+          </Box>
+        </Box>
+      </>
+    );
+  };
+
+  return (
+    <SectionContent>
+      {blocker ? <BlockNavigation blocker={blocker} /> : null}
+      {renderContent()}
+      {selectedModuleItem && (
+        <ModulesDialog
+          open={dialogOpen}
+          onClose={onDialogClose}
+          onSave={onDialogSave}
+          selectedItem={selectedModuleItem}
+        />
+      )}
+    </SectionContent>
+  );
+};
+
+export default Modules;

interface/src/app/main/ModulesDialog.tsx

@@ -0,0 +1,106 @@
+import { useEffect, useState } from 'react';
+
+import CancelIcon from '@mui/icons-material/Cancel';
+import DoneIcon from '@mui/icons-material/Done';
+import {
+  Box,
+  Button,
+  Checkbox,
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogTitle,
+  Grid,
+  TextField
+} from '@mui/material';
+
+import { dialogStyle } from 'CustomTheme';
+import { BlockFormControlLabel } from 'components';
+import { useI18nContext } from 'i18n/i18n-react';
+import { updateValue } from 'utils';
+
+import type { ModuleItem } from './types';
+
+interface ModulesDialogProps {
+  open: boolean;
+  onClose: () => void;
+  onSave: (mi: ModuleItem) => void;
+  selectedItem: ModuleItem;
+}
+
+const ModulesDialog = ({
+  open,
+  onClose,
+  onSave,
+  selectedItem
+}: ModulesDialogProps) => {
+  const { LL } = useI18nContext();
+  const [editItem, setEditItem] = useState<ModuleItem>(selectedItem);
+
+  const updateFormValue = updateValue(setEditItem);
+
+  useEffect(() => {
+    if (open) {
+      setEditItem(selectedItem);
+    }
+  }, [open, selectedItem]);
+
+  const close = () => {
+    onClose();
+  };
+
+  const save = () => {
+    onSave(editItem);
+  };
+
+  return (
+    <Dialog sx={dialogStyle} fullWidth maxWidth="xs" open={open} onClose={onClose}>
+      <DialogTitle>{LL.EDIT() + ' ' + editItem.key}</DialogTitle>
+      <DialogContent dividers>
+        <Grid container>
+          <BlockFormControlLabel
+            control={
+              <Checkbox
+                checked={editItem.enabled}
+                onChange={updateFormValue}
+                name="enabled"
+              />
+            }
+            label="Enabled"
+          />
+        </Grid>
+        <Box mt={2} mb={1}>
+          <TextField
+            name="license"
+            label="License Key"
+            multiline
+            rows={6}
+            fullWidth
+            value={editItem.license}
+            onChange={updateFormValue}
+          />
+        </Box>
+      </DialogContent>
+      <DialogActions>
+        <Button
+          startIcon={<CancelIcon />}
+          variant="outlined"
+          onClick={close}
+          color="secondary"
+        >
+          {LL.CANCEL()}
+        </Button>
+        <Button
+          startIcon={<DoneIcon />}
+          variant="outlined"
+          onClick={save}
+          color="primary"
+        >
+          {LL.UPDATE()}
+        </Button>
+      </DialogActions>
+    </Dialog>
+  );
+};
+
+export default ModulesDialog;

interface/src/app/main/OptionIcon.tsx

@@ -3,20 +3,26 @@ import DeleteForeverIcon from '@mui/icons-material/DeleteForever';
 import DeleteOutlineIcon from '@mui/icons-material/DeleteOutline';
 import EditOffOutlinedIcon from '@mui/icons-material/EditOffOutlined';
 import EditOutlinedIcon from '@mui/icons-material/EditOutlined';
-
 import InsertCommentOutlinedIcon from '@mui/icons-material/InsertCommentOutlined';
 import StarIcon from '@mui/icons-material/Star';
 import StarOutlineIcon from '@mui/icons-material/StarOutline';
-
 import VisibilityOffOutlinedIcon from '@mui/icons-material/VisibilityOffOutlined';
 import VisibilityOutlinedIcon from '@mui/icons-material/VisibilityOutlined';
-
 import type { SvgIconProps } from '@mui/material';
-import type { FC } from 'react';
 
-type OptionType = 'deleted' | 'readonly' | 'web_exclude' | 'api_mqtt_exclude' | 'favorite';
+type OptionType =
+  | 'deleted'
+  | 'readonly'
+  | 'web_exclude'
+  | 'api_mqtt_exclude'
+  | 'favorite';
 
-const OPTION_ICONS: { [type in OptionType]: [React.ComponentType<SvgIconProps>, React.ComponentType<SvgIconProps>] } = {
+const OPTION_ICONS: {
+  [type in OptionType]: [
+    React.ComponentType<SvgIconProps>,
+    React.ComponentType<SvgIconProps>
+  ];
+} = {
   deleted: [DeleteForeverIcon, DeleteOutlineIcon],
   readonly: [EditOffOutlinedIcon, EditOutlinedIcon],
   web_exclude: [VisibilityOffOutlinedIcon, VisibilityOutlinedIcon],
@@ -24,12 +30,7 @@ const OPTION_ICONS: { [type in OptionType]: [React.ComponentType<SvgIconProps>,
   favorite: [StarIcon, StarOutlineIcon]
 };
 
-interface OptionIconProps {
+const OptionIcon = ({ type, isSet }: { type: OptionType; isSet: boolean }) => {
-  type: OptionType;
-  isSet: boolean;
-}
-
-const OptionIcon: FC<OptionIconProps> = ({ type, isSet }) => {
   const Icon = OPTION_ICONS[type][isSet ? 0 : 1];
   return isSet ? (
     <Icon color="primary" sx={{ fontSize: 16, verticalAlign: 'middle' }} />

interface/src/app/main/Scheduler.tsx

@@ -1,28 +1,41 @@
+import { useCallback, useEffect, useState } from 'react';
+import { useBlocker } from 'react-router';
+import { toast } from 'react-toastify';
+
 import AddIcon from '@mui/icons-material/Add';
 import CancelIcon from '@mui/icons-material/Cancel';
-import CheckCircleIcon from '@mui/icons-material/CheckCircle';
+import CircleIcon from '@mui/icons-material/Circle';
 import WarningIcon from '@mui/icons-material/Warning';
+import { Box, Button, Divider, Stack, Typography } from '@mui/material';
 
-import { Box, Typography, Divider, Stack, Button } from '@mui/material';
+import {
-import { Table, Header, HeaderRow, HeaderCell, Body, Row, Cell } from '@table-library/react-table-library/table';
+  Body,
+  Cell,
+  Header,
+  HeaderCell,
+  HeaderRow,
+  Row,
+  Table
+} from '@table-library/react-table-library/table';
 import { useTheme } from '@table-library/react-table-library/theme';
-// eslint-disable-next-line import/named
+import { updateState, useRequest } from 'alova/client';
-import { updateState, useRequest } from 'alova';
+import {
-import { useState, useEffect, useCallback } from 'react';
+  BlockNavigation,
-import { unstable_useBlocker as useBlocker } from 'react-router-dom';
+  ButtonRow,
-import { toast } from 'react-toastify';
+  FormLoader,
-import SettingsSchedulerDialog from './SettingsSchedulerDialog';
+  SectionContent,
-import * as EMSESP from './api';
+  useLayoutTitle
-import { ScheduleFlag } from './types';
+} from 'components';
-import { schedulerItemValidation } from './validators';
-import type { ScheduleItem } from './types';
-import type { FC } from 'react';
-
-import { ButtonRow, FormLoader, SectionContent, BlockNavigation } from 'components';
-
 import { useI18nContext } from 'i18n/i18n-react';
+import { useInterval } from 'utils';
 
-const SettingsScheduler: FC = () => {
+import { readSchedule, writeSchedule } from '../../api/app';
+import SettingsSchedulerDialog from './SchedulerDialog';
+import { ScheduleFlag } from './types';
+import type { Schedule, ScheduleItem } from './types';
+import { schedulerItemValidation } from './validators';
+
+const Scheduler = () => {
   const { LL, locale } = useI18nContext();
   const [numChanges, setNumChanges] = useState<number>(0);
   const blocker = useBlocker(numChanges !== 0);
@@ -31,16 +44,22 @@ const SettingsScheduler: FC = () => {
   const [creating, setCreating] = useState<boolean>(false);
   const [dialogOpen, setDialogOpen] = useState<boolean>(false);
 
+  useLayoutTitle(LL.SCHEDULER());
+
   const {
     data: schedule,
     send: fetchSchedule,
     error
-  } = useRequest(EMSESP.readSchedule, {
+  } = useRequest(readSchedule, {
-    initialData: [],
+    initialData: []
-    force: true
   });
 
-  const { send: writeSchedule } = useRequest((data) => EMSESP.writeSchedule(data), { immediate: false });
+  const { send: updateSchedule } = useRequest(
+    (data: Schedule) => writeSchedule(data),
+    {
+      immediate: false
+    }
+  );
 
   function hasScheduleChanged(si: ScheduleItem) {
     return (
@@ -55,8 +74,17 @@ const SettingsScheduler: FC = () => {
     );
   }
 
+  useInterval(() => {
+    if (numChanges === 0) {
+      void fetchSchedule();
+    }
+  });
+
   useEffect(() => {
-    const formatter = new Intl.DateTimeFormat(locale, { weekday: 'short', timeZone: 'UTC' });
+    const formatter = new Intl.DateTimeFormat(locale, {
+      weekday: 'short',
+      timeZone: 'UTC'
+    });
     const days = [1, 2, 3, 4, 5, 6, 7].map((day) => {
       const dd = day < 10 ? `0${day}` : day;
       return new Date(`2017-01-${dd}T00:00:00+00:00`);
@@ -66,7 +94,7 @@ const SettingsScheduler: FC = () => {
 
   const schedule_theme = useTheme({
     Table: `
-      --data-table-library_grid-template-columns: 36px 324px 50px 192px repeat(1, minmax(100px, 1fr)) 160px;
+      --data-table-library_grid-template-columns: 36px 210px 100px 192px repeat(1, minmax(100px, 1fr)) 160px;
     `,
     BaseRow: `
       font-size: 14px;
@@ -96,21 +124,16 @@ const SettingsScheduler: FC = () => {
       position: relative;
       cursor: pointer;
       .td {
-        border-top: 1px solid #565656;
         border-bottom: 1px solid #565656;
       }
       &:hover .td {
-        border-top: 1px solid #177ac9;
+        background-color: #177ac9;
-        border-bottom: 1px solid #177ac9;
-      }
-      &:nth-of-type(odd) .td {
-        background-color: #303030;
       }
     `
   });
 
   const saveSchedule = async () => {
-    await writeSchedule({
+    await updateSchedule({
       schedule: schedule
         .filter((si) => !si.deleted)
         .map((condensed_si) => ({
@@ -126,8 +149,8 @@ const SettingsScheduler: FC = () => {
       .then(() => {
         toast.success(LL.SCHEDULE_UPDATED());
       })
-      .catch((err) => {
+      .catch((error: Error) => {
-        toast.error(err.message);
+        toast.error(error.message);
       })
       .finally(async () => {
         await fetchSchedule();
@@ -139,6 +162,9 @@ const SettingsScheduler: FC = () => {
     setCreating(false);
     setSelectedScheduleItem(si);
     setDialogOpen(true);
+    if (si.o_name === undefined) {
+      si.o_name = si.name;
+    }
   }, []);
 
   const onDialogClose = () => {
@@ -153,12 +179,18 @@ const SettingsScheduler: FC = () => {
 
   const onDialogSave = (updatedItem: ScheduleItem) => {
     setDialogOpen(false);
-
+    void updateState(readSchedule(), (data: ScheduleItem[]) => {
-    updateState('schedule', (data) => {
       const new_data = creating
-        ? [...data.filter((si) => creating || si.o_id !== updatedItem.o_id), updatedItem]
+        ? [
-        : data.map((si) => (si.id === updatedItem.id ? { ...si, ...updatedItem } : si));
+            ...data.filter((si) => creating || si.o_id !== updatedItem.o_id),
+            updatedItem
+          ]
+        : data.map((si) =>
+            si.id === updatedItem.id ? { ...si, ...updatedItem } : si
+          );
+
       setNumChanges(new_data.filter((si) => hasScheduleChanged(si)).length);
+
       return new_data;
     });
   };
@@ -169,8 +201,8 @@ const SettingsScheduler: FC = () => {
       id: Math.floor(Math.random() * (Math.floor(200) - 100) + 100),
       active: false,
       deleted: false,
-      flags: 0,
+      flags: ScheduleFlag.SCHEDULE_DAY,
-      time: '12:00',
+      time: '',
       cmd: '',
       value: '',
       name: ''
@@ -186,27 +218,52 @@ const SettingsScheduler: FC = () => {
     const dayBox = (si: ScheduleItem, flag: number) => (
       <>
         <Box>
-          <Typography sx={{ fontSize: 11 }} color={(si.flags & flag) === flag ? 'primary' : 'grey'}>
+          <Typography
-            {flag === ScheduleFlag.SCHEDULE_TIMER ? LL.TIMER(0) : dow[Math.log(flag) / Math.log(2)]}
+            sx={{ fontSize: 11 }}
+            color={(si.flags & flag) === flag ? 'primary' : 'grey'}
+          >
+            {dow[Math.log(flag) / Math.log(2)]}
           </Typography>
         </Box>
         <Divider orientation="vertical" flexItem />
       </>
     );
 
+    const scheduleType = (si: ScheduleItem) => (
+      <Box>
+        <Typography sx={{ fontSize: 11 }} color="primary">
+          {si.flags === ScheduleFlag.SCHEDULE_IMMEDIATE ? (
+            <>Immediate</>
+          ) : si.flags === ScheduleFlag.SCHEDULE_TIMER ? (
+            <>Timer</>
+          ) : si.flags === ScheduleFlag.SCHEDULE_CONDITION ? (
+            <>Condition</>
+          ) : si.flags === ScheduleFlag.SCHEDULE_ONCHANGE ? (
+            <>On Change</>
+          ) : (
+            <></>
+          )}
+        </Typography>
+      </Box>
+    );
+
     return (
       <Table
-        data={{ nodes: schedule.filter((si) => !si.deleted).sort((a, b) => a.time.localeCompare(b.time)) }}
+        data={{
+          nodes: schedule
+            .filter((si) => !si.deleted)
+            .sort((a, b) => a.flags - b.flags)
+        }}
         theme={schedule_theme}
         layout={{ custom: true }}
       >
-        {(tableList: any) => (
+        {(tableList: ScheduleItem[]) => (
           <>
             <Header>
               <HeaderRow>
                 <HeaderCell />
                 <HeaderCell stiff>{LL.SCHEDULE(0)}</HeaderCell>
-                <HeaderCell stiff>{LL.TIME(0)}</HeaderCell>
+                <HeaderCell stiff>{LL.TIME(0)}/Cond.</HeaderCell>
                 <HeaderCell stiff>{LL.COMMAND(0)}</HeaderCell>
                 <HeaderCell stiff>{LL.VALUE(0)}</HeaderCell>
                 <HeaderCell stiff>{LL.NAME(0)}</HeaderCell>
@@ -216,19 +273,34 @@ const SettingsScheduler: FC = () => {
               {tableList.map((si: ScheduleItem) => (
                 <Row key={si.id} item={si} onClick={() => editScheduleItem(si)}>
                   <Cell stiff>
-                    {si.active && <CheckCircleIcon sx={{ color: '#79D200', fontSize: 16, verticalAlign: 'middle' }} />}
+                    {si.active ? (
+                      <CircleIcon
+                        color="success"
+                        sx={{ fontSize: 16, verticalAlign: 'middle' }}
+                      />
+                    ) : (
+                      <CircleIcon
+                        color="error"
+                        sx={{ fontSize: 16, verticalAlign: 'middle' }}
+                      />
+                    )}
                   </Cell>
                   <Cell stiff>
-                    <Stack spacing={1} direction="row">
+                    <Stack spacing={0.5} direction="row">
                       <Divider orientation="vertical" flexItem />
-                      {dayBox(si, ScheduleFlag.SCHEDULE_MON)}
+                      {si.flags > 127 ? (
-                      {dayBox(si, ScheduleFlag.SCHEDULE_TUE)}
+                        scheduleType(si)
-                      {dayBox(si, ScheduleFlag.SCHEDULE_WED)}
+                      ) : (
-                      {dayBox(si, ScheduleFlag.SCHEDULE_THU)}
+                        <>
-                      {dayBox(si, ScheduleFlag.SCHEDULE_FRI)}
+                          {dayBox(si, ScheduleFlag.SCHEDULE_MON)}
-                      {dayBox(si, ScheduleFlag.SCHEDULE_SAT)}
+                          {dayBox(si, ScheduleFlag.SCHEDULE_TUE)}
-                      {dayBox(si, ScheduleFlag.SCHEDULE_SUN)}
+                          {dayBox(si, ScheduleFlag.SCHEDULE_WED)}
-                      {dayBox(si, ScheduleFlag.SCHEDULE_TIMER)}
+                          {dayBox(si, ScheduleFlag.SCHEDULE_THU)}
+                          {dayBox(si, ScheduleFlag.SCHEDULE_FRI)}
+                          {dayBox(si, ScheduleFlag.SCHEDULE_SAT)}
+                          {dayBox(si, ScheduleFlag.SCHEDULE_SUN)}
+                        </>
+                      )}
                     </Stack>
                   </Cell>
                   <Cell>{si.time}</Cell>
@@ -245,10 +317,10 @@ const SettingsScheduler: FC = () => {
   };
 
   return (
-    <SectionContent title={LL.SCHEDULER()} titleGutter>
+    <SectionContent>
       {blocker ? <BlockNavigation blocker={blocker} /> : null}
       <Box mb={2} color="warning.main">
-        <Typography variant="body2">{LL.SCHEDULER_HELP_1()}</Typography>
+        <Typography variant="body1">{LL.SCHEDULER_HELP_1()}.</Typography>
       </Box>
       {renderSchedule()}
 
@@ -264,11 +336,16 @@ const SettingsScheduler: FC = () => {
         />
       )}
 
-      <Box display="flex" flexWrap="wrap">
+      <Box mt={1} display="flex" flexWrap="wrap">
         <Box flexGrow={1}>
           {numChanges !== 0 && (
             <ButtonRow>
-              <Button startIcon={<CancelIcon />} variant="outlined" onClick={onDialogCancel} color="secondary">
+              <Button
+                startIcon={<CancelIcon />}
+                variant="outlined"
+                onClick={onDialogCancel}
+                color="secondary"
+              >
                 {LL.CANCEL()}
               </Button>
               <Button
@@ -284,7 +361,12 @@ const SettingsScheduler: FC = () => {
         </Box>
         <Box flexWrap="nowrap" whiteSpace="nowrap">
           <ButtonRow>
-            <Button startIcon={<AddIcon />} variant="outlined" color="secondary" onClick={addScheduleItem}>
+            <Button
+              startIcon={<AddIcon />}
+              variant="outlined"
+              color="primary"
+              onClick={addScheduleItem}
+            >
               {LL.ADD(0)}
             </Button>
           </ButtonRow>
@@ -294,4 +376,4 @@ const SettingsScheduler: FC = () => {
   );
 };
 
-export default SettingsScheduler;
+export default Scheduler;