Transform reducers to slices

Dashboard/src/interfaces/ISerialConnectionState.ts

@@ -1,12 +1,10 @@
-import PortController from "../PortController";
-
 export default interface ISerialConnectionState {
-  port: string | null;
+  port: string;
-  portController: PortController | null;
+  message: string;
   status: {
     connecting: boolean;
     connected: boolean;
-    error: string | null;
+    error: string;
   };
 // eslint-disable-next-line semi
 }

Dashboard/src/redux/reducers/serialConnectionReducer.ts

@@ -1,58 +0,0 @@
-import { createReducer } from "typesafe-actions";
-import ISerialConnectionState from "../../interfaces/ISerialConnectionState";
-import { SerialConnectionActionTypes } from "../actions/serialConnectionActions";
-
-const initialState: ISerialConnectionState = {
-  port: null,
-  portController: null,
-  status: {
-    connecting: false,
-    connected: false,
-    error: null,
-  },
-};
-
-const SerialConnectionReducer = createReducer(initialState)
-  .handleType(SerialConnectionActionTypes.SET_SERIAL_PORT, (state, action) => ({
-    ...state,
-    port: action.payload,
-  }))
-  .handleType(SerialConnectionActionTypes.CONNECTION_START, (state) => ({
-    ...state,
-    status: {
-      connecting: true,
-      connected: false,
-      error: null,
-    },
-  }))
-  .handleType(SerialConnectionActionTypes.CONNECTION_FAILURE, (state, action) => ({
-    ...state,
-    status: {
-      connecting: false,
-      connected: false,
-      error: action.payload.message,
-    },
-  }))
-  .handleType(SerialConnectionActionTypes.CONNECTION_SUCCESS, (state) => ({
-    ...state,
-    status: {
-      connecting: false,
-      connected: true,
-      error: null,
-    },
-  }))
-  .handleType(SerialConnectionActionTypes.CONNECTION_END, (state) => ({
-    ...state,
-    portController: null,
-    status: {
-      ...state.status,
-      connecting: false,
-      connected: false,
-    },
-  }))
-  .handleType(SerialConnectionActionTypes.SET_PORT_CONTROLLER, (state, action) => ({
-    ...state,
-    portController: action.payload,
-  }));
-
-export default SerialConnectionReducer;

Dashboard/src/redux/slices/serialConnectionSlice.ts

@@ -0,0 +1,59 @@
+/* eslint-disable no-param-reassign */
+import { createSlice, PayloadAction } from "@reduxjs/toolkit";
+import ISerialConnectionState from "../../interfaces/ISerialConnectionState";
+// import type { RootState } from "../store/types.d";
+
+// Define the initial state using that type
+const initialState: ISerialConnectionState = {
+  port: "",
+  message: "",
+  status: {
+    connecting: false,
+    connected: false,
+    error: "",
+  },
+};
+
+export const serialConnectionSlice = createSlice({
+  name: "serialConnection",
+  initialState,
+  reducers: {
+    setSerialPort: (state, action: PayloadAction<string>) => {
+      state.port = action.payload;
+    },
+    connectionStart: (state) => {
+      state.status.connecting = true;
+      state.status.connected = false;
+      state.status.error = "";
+    },
+    connectionSuccess: (state) => {
+      state.status.connecting = false;
+      state.status.connected = true;
+      state.status.error = "";
+    },
+    connectionFailure: (state, action: PayloadAction<string>) => {
+      state.status.connecting = false;
+      state.status.connected = false;
+      state.status.error = action.payload;
+    },
+    connectionEnd: (state) => {
+      state.status.connecting = false;
+      state.status.connected = false;
+    },
+    connect: () => {},
+    disconnect: () => {},
+    setMessage: (state, action: PayloadAction<string>) => {
+      state.message = action.payload;
+    },
+  },
+});
+
+export const {
+  setSerialPort, connectionStart, connectionSuccess, connectionFailure, connectionEnd,
+  connect, disconnect, setMessage,
+} = serialConnectionSlice.actions;
+
+// Other code such as selectors can use the imported `RootState` type
+// export const selectCount = (state: RootState) => state.counter.value;
+
+export default serialConnectionSlice.reducer;