feat: add --hide-settings-* options to tweak UI

victronenergy · Oct 1, 2024 · a75990c · a75990c
1 parent aa8adf4
commit a75990c
Show file tree

Hide file tree

Showing 6 changed files with 121 additions and 21 deletions.
diff --git a/README.md b/README.md
@@ -73,20 +73,25 @@ Configuration details and necessary usernames and passwords are stored in `confi
 Configuration files can either be created manually, or by starting the Venus Influx Loader, and accessing the Admin UI by browsing to `http://localhost:8088`. The default usernname and password is `admin`, `admin`.
 
 ```
-€ npx venus-influx-loader --help
+ € npx venus-influx-loader --help
 Usage: venus-influx-loader [options]
 
 Monitor Venus devices and capture & store realtime data to serve Grafana
 
 Options:
-  -V, --version             output the version number
-  -c, --config-path <path>  path to store config.json and secrets.json (default: "/config")
-  --disable-admin-api       disable Admin Web User Interface and /admin-api/ endpoint
-  --disable-admin-api-auth  disable password protection for Admin Web User Interface and /admin-api/ endpoint
-  --disable-grafana-api     disable Grafana JSON datasource /grafana-api/ endpoint
-  --enable-discovery-api    enable venus-upnp-browser /discovery-api/ endpoint
-  -p, --port <port>         http port used by Admin Web User Interface and Grafana JSON datasource (default: 8088)
-  -h, --help                display help for command
+  -V, --version                    output the version number
+  -c, --config-path <path>         path to store config.json and secrets.json (default: "/config")
+  -p, --port <port>                http port used by Admin Web User Interface and Grafana JSON datasource (default: 8088)
+  --disable-admin-api              disable Admin Web User Interface and /admin-api/ endpoint
+  --disable-admin-api-auth         disable password protection for Admin Web User Interface and /admin-api/ endpoint
+  --disable-grafana-api            disable Grafana JSON datasource /grafana-api/ endpoint
+  --enable-discovery-api           enable venus-upnp-browser /discovery-api/ endpoint
+  --hide-settings-influxdb
+  --hide-settings-security
+  --hide-settings-venus-discovery
+  --hide-settings-venus-manual
+  --hide-settings-venus-vrm
+  -h, --help                       display help for command
 ```
 
 For production use, once the system is configured `--disable-admin-api` can be used to run the `venus-influx-loader` headless.

diff --git a/bin/venus-influx-loader.js b/bin/venus-influx-loader.js
@@ -16,6 +16,11 @@ program
     'path to store config.json and secrets.json',
     '/config'
   )
+  .option(
+    '-p, --port <port>',
+    'http port used by Admin Web User Interface and Grafana JSON datasource',
+    8088
+  )
   .option(
     '--disable-admin-api',
     'disable Admin Web User Interface and /admin-api/ endpoint'
@@ -33,9 +38,19 @@ program
     'enable venus-upnp-browser /discovery-api/ endpoint'
   )
   .option(
-    '-p, --port <port>',
-    'http port used by Admin Web User Interface and Grafana JSON datasource',
-    8088
+    '--hide-settings-influxdb'
+  )
+  .option(
+    '--hide-settings-security'
+  )
+  .option(
+    '--hide-settings-venus-discovery'
+  )
+  .option(
+    '--hide-settings-venus-manual'
+  )
+  .option(
+    '--hide-settings-venus-vrm'
   )
 
 program.parse()
@@ -74,7 +89,12 @@ const server = new Server({
   discoveryApiEndpoint: discoveryApiEndpoint,
   adminApiEndpoint: adminApiEndpoint,
   adminApiEndpointAuthEnabled: adminApiEndpointAuthEnabled,
-  grafanaApiEndpoint: grafanaApiEndpoint
+  grafanaApiEndpoint: grafanaApiEndpoint,
+  showEditDiscoverySettings: !options.hideSettingsVenusDiscovery,
+  showEditVRMSettings: !options.hideSettingsVenusVRM,
+  showEditManualSettings: !options.hideSettingsVenusManual,
+  showEditSecuritySettings: (!options.hideSettingsSecurity && adminApiEndpointAuthEnabled),
+  showEditInfluxDBSettings: !options.hideSettingsInfluxdb,
 })
 
 // start server

diff --git a/src/client/components/AppSidebar.js b/src/client/components/AppSidebar.js
@@ -13,6 +13,7 @@ import navigation from "../navigation"
 const AppSidebar = () => {
   const dispatch = useDispatch()
   const sidebarShow = useSelector((state) => state.sidebarShow)
+  const editSettings = useSelector((state) => state.editSettings)
 
   return (
     <CSidebar
@@ -29,7 +30,7 @@ const AppSidebar = () => {
           <CImage src={logo} width="100%" className="sidebar-brand-narrow" />
         </CSidebarBrand>
       </CSidebarHeader>
-      <AppSidebarNav items={navigation} />
+      <AppSidebarNav items={navigation(editSettings)} />
     </CSidebar>
   )
 }

diff --git a/src/client/navigation.js b/src/client/navigation.js
@@ -7,7 +7,7 @@ import {
 } from "@coreui/icons"
 import { CNavGroup, CNavItem } from "@coreui/react"
 
-const navigation = [
+const navigation = ({ showEditDiscoverySettings, showEditVRMSettings, showEditManualSettings, showEditSecuritySettings, showEditInfluxDBSettings }) => [
   {
     component: CNavItem,
     name: "Dashboard",
@@ -20,32 +20,32 @@ const navigation = [
     to: "/settings",
     icon: <CIcon icon={cilSettings} customClassName="nav-icon" />,
     items: [
-      {
+      showEditDiscoverySettings && {
         component: CNavItem,
         name: "Discovery",
         to: "/settings/discovery",
       },
-      {
+      showEditVRMSettings && {
         component: CNavItem,
         name: "VRM",
         to: "/settings/VRM",
       },
-      {
+      showEditManualSettings && {
         component: CNavItem,
         name: "Manual",
         to: "/settings/manual",
       },
-      {
+      showEditInfluxDBSettings && {
         component: CNavItem,
         name: "InfluxDB",
         to: "/settings/influxdb",
       },
-      {
+      showEditSecuritySettings && {
         component: CNavItem,
         name: "Security",
         to: "/settings/security",
       },
-    ],
+    ].filter(Boolean),
   },
   {
     component: CNavItem,

diff --git a/src/client/store.js b/src/client/store.js
@@ -14,6 +14,14 @@ const initialState = {
     entries: [],
   },
   sidebarShow: true,
+
+  editSettings: {
+    showEditDiscoverySettings: true,
+    showEditVRMSettings: true,
+    showEditManualSettings: true,
+    showEditSecuritySettings: true,
+    showEditInfluxDBSettings: true,
+  }
 }
 
 const changeState = (state = initialState, action) => {
@@ -59,6 +67,51 @@ const changeState = (state = initialState, action) => {
       debug: action.data,
     }
   }
+  if (action.type === "EDIT_SECURITY_SETTINGS_ENABLED") {
+    return {
+      ...state,
+      editSettings: {
+        ...state.editSettings,
+        showEditSecuritySettings: action.data,
+      }
+    }
+  }
+  if (action.type === "EDIT_INFLUXDB_SETTINGS_ENABLED") {
+    return {
+      ...state,
+      editSettings: {
+        ...state.editSettings,
+        showEditInfluxDBSettings: action.data,
+      }
+    }
+  }
+  if (action.type === "EDIT_DISCOVERY_SETTINGS_ENABLED") {
+    return {
+      ...state,
+      editSettings: {
+        ...state.editSettings,
+        showEditDiscoverySettings: action.data,
+      }
+    }
+  }
+  if (action.type === "EDIT_MANUAL_SETTINGS_ENABLED") {
+    return {
+      ...state,
+      editSettings: {
+        ...state.editSettings,
+        showEditManualSettings: action.data,
+      }
+    }
+  }
+  if (action.type === "EDIT_VRM_SETTINGS_ENABLED") {
+    return {
+      ...state,
+      editSettings: {
+        ...state.editSettings,
+        showEditVRMSettings: action.data,
+      }
+    }
+  }
   if (action.type === "LOG") {
     state.log.entries.push(action.data)
     if (state.log.length > 100) {

diff --git a/src/server/server.js b/src/server/server.js
@@ -239,6 +239,27 @@ class Server {
     app.on("settingsChanged", settingsChanged)
     app.emit("settingsChanged", app.config.settings)
 
+    app.emit("serverevent", {
+      type: "EDIT_SECURITY_SETTINGS_ENABLED",
+      data: app.options.showEditSecuritySettings
+    })
+    app.emit("serverevent", {
+      type: "EDIT_INFLUXDB_SETTINGS_ENABLED",
+      data: app.options.showEditInfluxDBSettings
+    })
+    app.emit("serverevent", {
+      type: "EDIT_DISCOVERY_SETTINGS_ENABLED",
+      data: app.options.showEditDiscoverySettings
+    })
+    app.emit("serverevent", {
+      type: "EDIT_MANUAL_SETTINGS_ENABLED",
+      data: app.options.showEditManualSettings
+    })
+    app.emit("serverevent", {
+      type: "EDIT_VRM_SETTINGS_ENABLED",
+      data: app.options.showEditVRMSettings
+    })
+
     return new Promise((resolve, _reject) => {
       app.server = http.createServer(app)