From f5b370a8e5833302243e5a9c3aed2790c10c384f Mon Sep 17 00:00:00 2001
From: Dammshine <84041999+Dammshine@users.noreply.github.com>
Date: Wed, 13 Mar 2024 16:49:30 +1100
Subject: [PATCH] improve frontendStateStore (#606)

Co-authored-by: david zhou <davidzhou@davids-MBP-3.modem>
---
 .../Component/VisualizerMain.tsx              | 46 ++-----------------
 ...zerStateStore.ts => frontendStateStore.ts} |  5 +-
 2 files changed, 6 insertions(+), 45 deletions(-)
 rename client/src/visualiser-debugger/Store/{visualizerStateStore.ts => frontendStateStore.ts} (90%)

diff --git a/client/src/visualiser-debugger/Component/VisualizerMain.tsx b/client/src/visualiser-debugger/Component/VisualizerMain.tsx
index d62a3873b..44878d542 100644
--- a/client/src/visualiser-debugger/Component/VisualizerMain.tsx
+++ b/client/src/visualiser-debugger/Component/VisualizerMain.tsx
@@ -1,7 +1,6 @@
-import { useEffect, useRef, useState } from 'react';
-import { NodeEntity } from 'visualiser-debugger/Component/Visualizer/Entities/BaseEntity/nodeEntity';
+import { useEffect, useRef } from 'react';
 import { useGlobalStore } from '../Store/globalStateStore';
-import { useFrontendStateStore } from '../Store/visualizerStateStore';
+import { useFrontendStateStore } from '../Store/frontendStateStore';
 import { BackendState } from '../Types/backendType';
 
 export interface RoutesProps {
@@ -14,13 +13,11 @@ const VisualizerMain: React.FC<RoutesProps> = ({ backendState }: RoutesProps) =>
     return store.currState();
   });
 
-  // TODO:I believe CTF code is ready to removed, a good onboarding task
-  const [flagViewed, setFlagViewed] = useState(false);
-
   useEffect(() => {
     if (backendState && userAnnotation) {
       const newParsedState = parser.parseState(backendState, userAnnotation);
-      useFrontendStateStore.getState().newState(newParsedState);
+      useFrontendStateStore.getState().appendNewState(newParsedState);
+      useFrontendStateStore.getState().setNextState();
     } else {
       let issue = 'something';
       if (!backendState) {
@@ -30,41 +27,6 @@ const VisualizerMain: React.FC<RoutesProps> = ({ backendState }: RoutesProps) =>
       }
       console.error(`Unable to parse backend state: ${issue} is undefined`);
     }
-
-    const isDev = () => {
-      // TODO: DEBUG THIS
-      if (!currState) return false;
-      if (currState.nodes.length !== 3) {
-        return false;
-      }
-
-      const first = currState.nodes.find((node: NodeEntity) => node.label === 'd');
-      if (!first || first.edgeUids.length === 0) {
-        return false;
-      }
-
-      const second = currState.nodes.find(
-        (node: NodeEntity) => node.uid === first.edgeUids[0].split('-')[1]
-      );
-      if (second.label !== 'e' || second.edgeUids.length === 0) {
-        return false;
-      }
-
-      const third = currState.nodes.find(
-        (node: NodeEntity) => node.uid === second.edgeUids[0].split('-')[1]
-      );
-
-      return third.label === 'v';
-    };
-
-    if (isDev() && !flagViewed) {
-      alert(
-        `Olli has now made it to the fair and is contemplating joining structs, here's the flag: ${
-          import.meta.env.VITE_CTF_FLAG
-        }`
-      );
-      setFlagViewed(true);
-    }
   }, [backendState, userAnnotation]);
 
   const visualizerRef = useRef(null);
diff --git a/client/src/visualiser-debugger/Store/visualizerStateStore.ts b/client/src/visualiser-debugger/Store/frontendStateStore.ts
similarity index 90%
rename from client/src/visualiser-debugger/Store/visualizerStateStore.ts
rename to client/src/visualiser-debugger/Store/frontendStateStore.ts
index 63af79f74..5133ca22f 100644
--- a/client/src/visualiser-debugger/Store/visualizerStateStore.ts
+++ b/client/src/visualiser-debugger/Store/frontendStateStore.ts
@@ -7,7 +7,7 @@ type State = {
   currState: () => GenericGraph;
 };
 type Action = {
-  newState: (newState: GenericGraph) => void;
+  appendNewState: (newState: GenericGraph) => void;
   setNextState: () => void;
   setLastState: () => void;
 };
@@ -23,10 +23,9 @@ export const useFrontendStateStore: UseBoundStore<StoreApi<State & Action>> = cr
     }
     return useFrontendStateStore.getState().states[useFrontendStateStore.getState().currStateIdx];
   },
-  newState: (newState: GenericGraph) => {
+  appendNewState: (newState: GenericGraph) => {
     set((state) => ({
       states: [...state.states, newState],
-      currStateIdx: state.currStateIdx + 1,
     }));
   },
   setNextState: () => {