cleanup and fix ship not found error

src/pages/Layout.tsx

@@ -3,15 +3,7 @@ import { Outlet, useLocation, useNavigate } from 'react-router-dom';
 import Gaze from 'src/ui/Gaze';
 // ~~~~~~~ Redux ~~~~~~~
 import { useAppDispatch, useAppSelector } from 'src/redux/hooks';
-import {
-  type InitialMinimapState,
-  addElementToWidget,
-  addWidget,
-  addWidgetToSection,
-  getSections,
-  getWidgets,
-  initializeState,
-} from 'src/redux/slices/minimapSlice';
+import { getSections, getWidgets } from 'src/redux/slices/minimapSlice';
 import {
   addKeyDown,
   getElementsInGaze,
@@ -26,17 +18,9 @@ import { useMousePosition } from 'src/hooks/useMousePosition';
 import { useKeyUp } from 'src/hooks/useKeyUp';
 import { useMouseButtonDown } from 'src/hooks/useMouseButtonDown';
 import { useMouseButtonUp } from 'src/hooks/useMouseButtonUp';
-import useWorldSim from 'src/hooks/useWorldSim';
 import { findElementsInGaze } from 'src/hooks/findElementsInGaze';
-// ~~~~~~~ Prototype ~~~~~~~
-import assimilator from 'src/prototype/assimilator';
-import selector from 'src/prototype/selector';
 // ~~~~~~~ Constants ~~~~~~~
 import { GAZE_RADIUS } from 'src/utils/constants';
-import { ownship, drones, initialShips } from 'src/utils/initialShips';
-import { initialSections } from 'src/utils/initialSections';
-import Home from 'src/components/Home';
-import monitor from 'src/prototype/monitor';
 
 const CIRCLE_PERCENTAGE_THRESH = 0.1;
 const ELEMENT_PERCENTAGE_THRESH = 0.1;
@@ -47,7 +31,6 @@ const Layout = () => {
   const navigate = useNavigate();
 
   // ~~~~~ Custom Hooks ~~~~~~
-  const { messages, stressLevel } = useWorldSim();
   const mousePosition = useMousePosition();
   const keyDown = useKeyDown();
   const keyUp = useKeyUp();
@@ -62,21 +45,6 @@ const Layout = () => {
 
   const dispatch = useAppDispatch();
 
-  useEffect(() => {
-    // Intiailize minimap state
-    const initialState: InitialMinimapState = {
-      visualComplexity: 0,
-      audioComplexity: 0,
-      ownship,
-      drones,
-      widgets: { ...initialShips },
-      messages: [],
-      sections: [...initialSections],
-    };
-
-    dispatch(initializeState(initialState));
-  }, [dispatch]);
-
   // on mouse position move, check for elements in gaze
   useEffect(() => {
     const elementsInGaze = findElementsInGaze(
@@ -103,10 +71,10 @@ const Layout = () => {
     if (keyDown !== '') {
       const time = new Date().toISOString();
       dispatch(
-        addKeyDown({ 
-          elemsInGaze: elemsInGaze, 
-          keyPress: keyDown.toString(), 
-          timeEnteredGaze: time
+        addKeyDown({
+          elemsInGaze: elemsInGaze,
+          keyPress: keyDown.toString(),
+          timeEnteredGaze: time,
         }),
       );
     }
@@ -119,7 +87,7 @@ const Layout = () => {
         addKeyDown({
           elemsInGaze: elemsInGaze,
           keyPress: mouseButtonDown.toString(),
-          timeEnteredGaze: time
+          timeEnteredGaze: time,
         }),
       );
     }
@@ -143,14 +111,12 @@ const Layout = () => {
     }
   }, [mouseButtonUp]);
 
-
   // Redirect to /prototype if the user is on the root path
   useEffect(() => {
     if (pathname === '/') {
       navigate('/prototype');
     }
   }, [pathname, navigate]);
-  
 
   return (
     <div>

src/pages/Prototype.tsx

@@ -11,34 +11,21 @@ import {
   initializeState,
 } from 'src/redux/slices/minimapSlice';
 import {
-  addKeyDown,
   getElementsInGaze,
   getGazesAndKeys,
-  removeKeyDown,
-  setElementsInGaze,
   type ElementInGaze,
 } from 'src/redux/slices/gazeSlice';
 // ~~~~~~~ Cusdom Hooks ~~~~~~~
-import { useKeyDown } from 'src/hooks/useKeyDown';
-import { useMousePosition } from 'src/hooks/useMousePosition';
-import { useKeyUp } from 'src/hooks/useKeyUp';
-import { useMouseButtonDown } from 'src/hooks/useMouseButtonDown';
-import { useMouseButtonUp } from 'src/hooks/useMouseButtonUp';
 import useWorldSim from 'src/hooks/useWorldSim';
-import { findElementsInGaze } from 'src/hooks/findElementsInGaze';
 // ~~~~~~~ Prototype ~~~~~~~
 import assimilator from 'src/prototype/assimilator';
 import selector from 'src/prototype/selector';
 // ~~~~~~~ Constants ~~~~~~~
-import { GAZE_RADIUS } from 'src/utils/constants';
 import { ownship, drones, initialShips } from 'src/utils/initialShips';
 import { initialSections } from 'src/utils/initialSections';
 import Home from 'src/components/Home';
 import monitor from 'src/prototype/monitor';
 
-const CIRCLE_PERCENTAGE_THRESH = 0.1;
-const ELEMENT_PERCENTAGE_THRESH = 0.1;
-
 const Prototype = () => {
   // ~~~~~ Custom Hooks ~~~~~~
   const { messages, stressLevel } = useWorldSim();
@@ -66,14 +53,14 @@ const Prototype = () => {
     dispatch(initializeState(initialState));
   }, [dispatch]);
 
-    //call the monitor
-    useEffect(() => {
-      const intervalID = setInterval(() =>  {
-          monitor({dispatch})
-      }, 100);
-  
-      return () => clearInterval(intervalID);
-    }, []);
+  //call the monitor
+  useEffect(() => {
+    const intervalID = setInterval(() => {
+      monitor({ dispatch });
+    }, 100);
+
+    return () => clearInterval(intervalID);
+  }, []);
 
   // run whenever messages array changes
   useEffect(() => {

src/redux/slices/minimapSlice.ts

@@ -76,7 +76,7 @@ export const minimapSlice = createSlice({
 
         // check if ship exists
         if (!ship) {
-          //console.error(`Ship with id ${shipId} not found`);
+          console.error(`Ship with id ${shipId} not found`);
           return;
         }
 
@@ -122,41 +122,43 @@ export const minimapSlice = createSlice({
       });
     },
 
-    updateElementExpiration: { //update the time until window of interaction expires
+    updateElementExpiration: {
+      //update the time until window of interaction expires
       prepare(widgetId: string, elementId: string) {
         return {
-          payload: {widgetId, elementId}
+          payload: { widgetId, elementId },
         };
       },
       reducer: (
         state,
-        action: PayloadAction<{ widgetId: string; elementId: string}>,
+        action: PayloadAction<{ widgetId: string; elementId: string }>,
       ) => {
-        const {widgetId, elementId} = action.payload;
+        const { widgetId, elementId } = action.payload;
         const widget = state.widgets[widgetId];
 
         // if widget exists
         if (widget) {
           const tempElements = state.widgets[widgetId].elements;
-          tempElements.forEach(function(element, elementIndex){
-            if(element.id === elementId && element.expirationInterval){
-              const newExpiration = new Date()
+          tempElements.forEach(function (element, elementIndex) {
+            if (element.id === elementId && element.expirationInterval) {
+              const newExpiration = new Date();
               newExpiration.setSeconds(
-                newExpiration.getSeconds()+element.expirationInterval
+                newExpiration.getSeconds() + element.expirationInterval,
               );
-              tempElements[elementIndex].expiration = newExpiration.toISOString();
+              tempElements[elementIndex].expiration =
+                newExpiration.toISOString();
             }
           });
           state.widgets[widgetId] = {
             ...widget,
-            elements: tempElements
+            elements: tempElements,
           };
         } else {
           console.error(`Widget with id ${widgetId} not found`);
         }
-      }
+      },
     },
-    
+
     deleteElementFromWidget: {
       prepare(widgetId: string, elementId: string) {
         return {