Fix serial port persistence

Dashboard/package.json

@@ -66,6 +66,7 @@
     "electron-squirrel-startup": "1.0.0",
     "electron-store": "^8.0.1",
     "fs-extra": "10.0.0",
+    "lodash": "^4.17.21",
     "react": "17.0.2",
     "react-dom": "17.0.2",
     "react-redux": "7.2.5",

Dashboard/src/App.tsx

@@ -6,6 +6,7 @@ import SerialPort from "serialport";
 import { connect, disconnect } from "./redux/actions/asyncSerialConnectionActions";
 import { setSerialPort } from "./redux/actions/serialConnectionActions";
 import KnobSection from "./Components/KnobSection";
+import { electronStore } from "./redux/store/index";
 
 const GlobalStyle = createGlobalStyle`
   html {
@@ -58,6 +59,14 @@ const App = () => {
       >
         disconnect
       </button>
+      <button
+        type="button"
+        onClick={() => {
+          electronStore.clear();
+        }}
+      >
+        reset storage
+      </button>
       <Select
         value={portSelectionValue}
         onChange={handlePortChange}

Dashboard/src/Components/KnobSection.tsx

@@ -21,29 +21,29 @@ const KnobSection = () => {
   };
 
   useEffect(() => {
-    if (serialConnection.portController !== null) {
+    if (serialConnection.portController !== null && serialConnection.portController !== undefined) {
       serialConnection.portController.parser.on("data", SerialDataListener);
     }
 
     return () => {
-      if (serialConnection.portController !== null) {
+      if (serialConnection.portController !== null && serialConnection.portController !== undefined) {
         serialConnection.portController.parser.removeListener("data", SerialDataListener);
       }
     };
   }, [serialConnection]);
 
   const sendIncreaseHandler = (index: number) => {
-    if (serialConnection.portController !== null && serialConnection.portController.port !== null) {
+    if (serialConnection.portController !== null && serialConnection.portController.port !== null && serialConnection.portController !== undefined) {
       serialConnection.portController.port.write(`${index}i`);
     }
   };
   const sendDecreaseHandler = (index: number) => {
-    if (serialConnection.portController !== null && serialConnection.portController.port !== null) {
+    if (serialConnection.portController !== null && serialConnection.portController.port !== null && serialConnection.portController !== undefined) {
       serialConnection.portController.port.write(`${index}d`);
     }
   };
   const sendToggleHandler = (index: number) => {
-    if (serialConnection.portController !== null && serialConnection.portController.port !== null) {
+    if (serialConnection.portController !== null && serialConnection.portController.port !== null && serialConnection.portController !== undefined) {
       serialConnection.portController.port.write(`${index}t`);
     }
   };

Dashboard/src/redux/store/index.ts

@@ -1,10 +1,11 @@
 import thunk from "redux-thunk";
 import { createStore, applyMiddleware } from "redux";
 import { RootAction, RootState } from "typesafe-actions";
-import { persistStore, persistReducer } from "redux-persist";
+import { persistStore, persistReducer, createTransform } from "redux-persist";
 import createElectronStorage from "redux-persist-electron-storage";
 
 import ElectronStore from "electron-store";
+import omit from "lodash/omit";
 import composeEnhancers from "./utils";
 import rootReducer from "./root-reducer";
 
@@ -12,18 +13,26 @@ const middlewares = [thunk];
 
 const enhancer = composeEnhancers(applyMiddleware(...middlewares));
 
-const electronStore = new ElectronStore();
+export const electronStore = new ElectronStore();
 
 createElectronStorage({
   electronStore,
 });
 
+const blacklistPaths = ["serialConnection.portController", "serialConnection.status"];
 const persistConfig = {
   key: "root",
-  whitelist: ["port"],
   storage: createElectronStorage({
     electronStore,
   }),
+  blacklist: blacklistPaths.filter((a) => !a.includes(".")),
+  transforms: [
+    // nested blacklist-paths require a custom transform to be applied
+    createTransform((inboundState: object, key) => {
+      const blacklistPathsForKey = blacklistPaths.filter((path) => path.startsWith(`${String(key)}.`)).map((path) => path.substr(String(key).length + 1));
+      return omit(inboundState, ...blacklistPathsForKey);
+    }, null),
+  ],
 };
 
 export const persistedReducer = persistReducer(persistConfig, rootReducer);