src/pages/MonitoringPage/MonitoringPage.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useState } from 'react';
+import React, { useCallback, useRef, useState } from 'react';
 import styles from './MonitoringPage.module.css';
 
 // Store & API
@@ -52,12 +52,16 @@ function useExperimentLogic() {
   const [phaseIndex, setPhaseIndex] = useState(0);
   const [isFinished, setIsFinished] = useState(false);
 
+  // Ref to suppress stream updates during the "Reset Phase" fast-forward sequence
+  const suppressUpdates = useRef(false);
+
   const phaseIds = getPhaseIds();
   const phaseNames = getPhaseNames();
 
   // --- Stream Handlers ---
 
   const handleStreamUpdate = useCallback((data: ExperimentStreamData) => {
+    if (suppressUpdates.current) return;
     if (data.type === 'phase_update' && data.id) {
       const payload = data as PhaseUpdate;
       console.log(`${data.type} received, id : ${data.id}`);
@@ -101,7 +105,7 @@ function useExperimentLogic() {
   }, [getPhaseIds, getGoalsInPhase, phaseIds, phaseIndex, phaseNames]);
 
   const handleStatusUpdate = useCallback((data: unknown) => {
-
+    if (suppressUpdates.current) return;
     const payload = data as CondNormsStateUpdate;
     if (payload.type !== 'cond_norms_state_update') return;
 
@@ -156,7 +160,30 @@ function useExperimentLogic() {
         case "nextPhase":
           await nextPhase();
           break;
-        // Case for resetPhase if implemented in API
+        case "resetPhase":
+          //make sure you don't see the phases pass to arrive back at current phase
+          suppressUpdates.current = true;
+
+          const targetIndex = phaseIndex;
+          console.log(`Resetting phase: Restarting and skipping to index ${targetIndex}`);
+          const phases = graphReducer();
+          setProgramState({ phases });
+          
+          setActiveIds({});
+          setPhaseIndex(0); // Visually reset to start
+          setGoalIndex(0);
+          setIsFinished(false);
+          
+          // Restart backend
+          await runProgramm();
+          for (let i = 0; i < targetIndex; i++) {
+            console.log(`Skipping phase ${i}...`);
+            await nextPhase();
+          }
+          suppressUpdates.current = false;
+          setPhaseIndex(targetIndex);
+          setIsPlaying(true); //Maybe you pause and then reset
+          break;
       }
     } catch (err) {
       console.error(err);