React 18.3.1, bootstrap 5.3.3, @rjsf/core 5.23.1

.github/workflows/test.yml

@@ -12,7 +12,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [16.x, 18.x, 20.x]
+        node-version: [18.x, 20.x]
 
     steps:
     - uses: actions/checkout@v4

.gitignore

@@ -28,3 +28,7 @@ test/server-test-config/ssl-key.pem
 test/server-test-config/plugin-config-data/
 
 docs/built
+.signalk
+packages/server-admin-ui/scss.bs4
+packages/server-admin-ui/scss.bs5
+packages/server-admin-ui/_scss

package.json

@@ -149,7 +149,6 @@
     "@types/mocha": "^10.0.1",
     "@types/ncp": "^2.0.5",
     "@types/node-fetch": "^2.5.3",
-    "@types/rmfr": "^2.0.1",
     "@types/semver": "^7.1.0",
     "@types/serialport": "^8.0.2",
     "@types/split": "^1.0.0",
@@ -168,8 +167,7 @@
     "lint-staged": "^10.0.3",
     "mocha": "^10.2.0",
     "prettier": "^2.7.1",
-    "rimraf": "^3.0.2",
-    "rmfr": "^2.0.0",
+    "rimraf": "^6.0.1",
     "ts-node": "^10.9.1",
     "typedoc": "^0.26.11",
     "typescript": "5.6.x"

packages/resources-provider-plugin/package.json

@@ -26,9 +26,9 @@
         "build-declaration": "tsc --declaration --allowJs false",
         "watch": "npm run build -- -w",
         "prettier": "prettier -w src/",
-        "lint": "eslint -c .eslintrc.js --ext .ts --ext .js --fix src/",
+        "lint": "eslint --ext .ts --ext .js --fix src/",
         "format": "npm run prettier && npm run lint",
-        "ci-lint": "eslint -c .eslintrc.js --ext .ts --ext .js src/ && prettier --check src/",
+        "ci-lint": "eslint --ext .ts --ext .js src/ && prettier --check src/",
         "prepublishOnly": "npm run build && npm run build-declaration",
         "test": "npm run build && npm run build-declaration && npm run ci-lint"
     },

packages/resources-provider-plugin/src/index.ts

@@ -256,7 +256,7 @@ module.exports = (server: ResourceProviderApp): Plugin => {
             }
           }
         })
-      } catch (error) {
+      } catch (_error) {
         failed.push(resType)
       }
     })

packages/resources-provider-plugin/src/lib/filestorage.ts

@@ -57,7 +57,7 @@ export class FileStore implements IResourceStore {
 
     try {
       await this.checkPath(this.savePath)
-    } catch (error) {
+    } catch (_error) {
       throw new Error(`Unable to create ${this.savePath}!`)
     }
     return await this.createSavePaths(enabledResTypes)
@@ -74,13 +74,13 @@ export class FileStore implements IResourceStore {
         try {
           await access(this.resources[t].path, constants.W_OK | constants.R_OK)
           this.debug(`${this.resources[t].path} - OK....`)
-        } catch (error) {
+        } catch (_error) {
           this.debug(`${this.resources[t].path} NOT available...`)
           this.debug(`Creating ${this.resources[t].path} ...`)
           try {
             await mkdir(this.resources[t].path, { recursive: true })
             this.debug(`Created ${this.resources[t].path} - OK....`)
-          } catch (error) {
+          } catch (_error) {
             result.error = true
             result.message += `ERROR creating ${this.resources[t].path} folder\r\n `
           }
@@ -217,15 +217,15 @@ export class FileStore implements IResourceStore {
       )
       this.debug(`${path} - OK...`)
       return true
-    } catch (error) {
+    } catch (_error) {
       // if not then create it
       this.debug(`${path} does NOT exist...`)
       this.debug(`Creating ${path} ...`)
       try {
         await mkdir(path, { recursive: true })
         this.debug(`Created ${path} - OK...`)
         return true
-      } catch (error) {
+      } catch (_error) {
         throw new Error(`Unable to create ${path}!`)
       }
     }

packages/server-admin-ui-dependencies/package.json

@@ -6,19 +6,19 @@
   "author": "[email protected]",
   "license": "Apache-2.0",
   "optionalDependencies": {
-    "validate-peer-dependencies": "^1.1.0"
+    "validate-peer-dependencies": "2.2.0"
   },
   "peerDependencies": {
-    "@fortawesome/fontawesome-free": "^5.15.1",
-    "bootstrap": "^4.5.3",
-    "font-awesome": "^4.7.0",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
-    "react-redux": "^5.1.2",
-    "react-select": "^3.1.0",
-    "reactstrap": "^5.0.0",
-    "redux": "^3.7.2",
-    "redux-thunk": "2.3.0",
+    "@fortawesome/fontawesome-free": "6.7.1",
+    "bootstrap": "5.3.3",
+    "font-awesome": "4.7.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
+    "react-redux": "9.1.2",
+    "react-select": "5.8.3",
+    "reactstrap": "9.2.3",
+    "redux": "5.0.1",
+    "redux-thunk": "3.1.0",
     "simple-line-icons": "^2.5.5"
   }
 }

packages/server-admin-ui/_scss/_custom.scss

@@ -0,0 +1,30 @@
+// Here you can add other styles
+
+
+form.rjsf  label {
+  margin-bottom: 0;
+}
+
+form.rjsf  div>p.field-description {
+  font-size: 0.7rem;
+  font-style: italic;
+  margin-bottom: 0px;
+}
+
+form.rjsf input {
+  width: auto;
+}
+
+form.rjsf div.row.array-item {
+  background-color: aliceblue;
+  margin-bottom: 3px;
+}
+
+@media (max-width: 767px) {
+  .container-fluid, .row {
+    padding:0 2px !important;
+  }
+  .navbar-header {
+    margin:0px;
+  }
+}

packages/server-admin-ui/_scss/core/_badge.scss

@@ -0,0 +1,3 @@
+.badge-pill {
+  border-radius: .25rem
+}

packages/server-admin-ui/_scss/style.scss

@@ -0,0 +1,22 @@
+/*!
+ * CoreUI - Open Source Bootstrap Admin Template
+ * @version v1.0.6
+ * @link http://coreui.io
+ * Copyright (c) 2017 creativeLabs Łukasz Holeczek
+ * @license MIT
+ */
+
+// Override Boostrap variables
+@import 'bootstrap-variables';
+
+// Import Bootstrap source files
+@import '~bootstrap/scss/bootstrap';
+
+// Override core variables
+@import 'core-variables';
+
+// Import core styles
+@import 'core/core';
+
+// Custom styles
+@import 'custom';

packages/server-admin-ui/package.json

@@ -15,50 +15,51 @@
   "devDependencies": {
     "@babel/core": "^7.11.6",
     "@babel/preset-react": "^7.10.4",
-    "@fortawesome/fontawesome-free": "^5.15.1",
-    "@fortawesome/fontawesome-svg-core": "^6.5.1",
-    "@fortawesome/free-regular-svg-icons": "^6.5.1",
-    "@fortawesome/free-solid-svg-icons": "^6.5.1",
-    "@fortawesome/react-fontawesome": "^0.2.0",
+    "@fortawesome/fontawesome-free": "6.7.1",
+    "@fortawesome/fontawesome-svg-core": "6.7.1",
+    "@fortawesome/free-regular-svg-icons": "6.7.1",
+    "@fortawesome/free-solid-svg-icons": "6.7.1",
+    "@fortawesome/react-fontawesome": "0.2.2",
     "@signalk/server-admin-ui-dependencies": "1.0.1",
-    "ansi-to-html": "^0.6.14",
+    "@coreui/coreui": "5.2.0",
+    "ansi-to-html": "0.7.2",
     "babel-loader": "^8.1.0",
-    "bootstrap": "^4.5.3",
+    "bootstrap": "5.3.3",
     "buffer": "^6.0.3",
     "copy-webpack-plugin": "^11.0.0",
     "css-loader": "^5.0.0",
     "eslint": "^8.57.0",
     "eslint-plugin-react": "^7.34.1",
     "file-loader": "^6.1.1",
-    "font-awesome": "^4.7.0",
-    "html-webpack-plugin": "^5.0.0-alpha.6",
+    "html-webpack-plugin": "5.6.3",
     "jsonlint-mod": "^1.7.6",
-    "lodash.get": "^4.4.2",
-    "lodash.remove": "^4.7.0",
-    "lodash.set": "^4.3.2",
-    "lodash.uniq": "^4.5.0",
+    "lodash.get": "4.4.2",
+    "lodash.remove": "4.7.0",
+    "lodash.set": "4.3.2",
+    "lodash.uniq": "4.5.0",
     "moment": "^2.29.1",
     "prettier": "^2.3.2",
-    "react": "^16.13.1",
-    "react-copy-to-clipboard": "^5.0.3",
-    "react-dom": "^16.13.1",
-    "react-html-parser": "^2.0.2",
-    "react-json-tree": "^0.13.0",
-    "react-jsonschema-form-bs4": "^1.7.1",
-    "react-redux": "^5.1.2",
-    "react-router-dom": "^4.3.1",
-    "react-select": "^3.1.0",
-    "reactstrap": "^5.0.0",
+    "react": "18.3.1",
+    "react-copy-to-clipboard": "5.1.0",
+    "react-dom": "18.3.1",
+    "html-react-parser": "5.1.19",
+    "react-json-tree": "0.19.0",
+    "@rjsf/core": "5.23.1",
+    "@rjsf/validator-ajv8": "5.23.1",
+    "react-redux": "9.1.2",
+    "react-router": "7.0.2",
+    "react-select": "5.8.3",
+    "reactstrap": "9.2.3",
     "reconnecting-websocket": "^4.4.0",
-    "redux": "^3.7.2",
-    "redux-thunk": "2.3.0",
+    "redux": "5.0.1",
+    "redux-thunk": "3.1.0",
     "sass": "^1.81.0",
     "sass-loader": "^16.0.3",
     "simple-line-icons": "^2.5.5",
     "style-loader": "^2.0.0",
-    "webpack": "^5.96.1",
-    "webpack-bundle-analyzer": "^3.9.0",
-    "webpack-cli": "^4.2.0"
+    "webpack": "5.96.1",
+    "webpack-bundle-analyzer": "4.10.2",
+    "webpack-cli": "5.1.4"
   },
   "scripts": {
     "prepublishOnly": "npm run clean && npm run build",

packages/server-admin-ui/public_src/index.html

@@ -41,7 +41,7 @@
   -->
 
   <body class="app header-fixed sidebar-fixed aside-menu-fixed aside-menu-hidden">
-    <div id="root"></div>
+    <div id="app"></div>
     <!--
       This HTML file is a template.
       If you open it directly in the browser, you will see an empty page.