feat: stop experiment button

This commit is contained in:
2026-02-02 14:39:07 +01:00
parent 4dcbe78abf
commit 901159ae2d
3 changed files with 80 additions and 59 deletions

View File

@@ -98,6 +98,11 @@ University within the Software Project course.
color: white; color: white;
} }
.stop {
background-color: red;
color: white;
}
.restartExperiment{ .restartExperiment{
background-color: red; background-color: red;
color: white; color: white;

View File

@@ -8,6 +8,7 @@ import styles from './MonitoringPage.module.css';
import useProgramStore from "../../utils/programStore"; import useProgramStore from "../../utils/programStore";
import { import {
nextPhase, nextPhase,
stopExperiment,
useExperimentLogger, useExperimentLogger,
useStatusLogger, useStatusLogger,
pauseExperiment, pauseExperiment,
@@ -144,7 +145,7 @@ function useExperimentLogic() {
} }
}, [setProgramState]); }, [setProgramState]);
const handleControlAction = async (action: "pause" | "play" | "nextPhase") => { const handleControlAction = async (action: "pause" | "play" | "nextPhase" | "stop") => {
try { try {
setLoading(true); setLoading(true);
switch (action) { switch (action) {
@@ -159,6 +160,9 @@ function useExperimentLogic() {
case "nextPhase": case "nextPhase":
await nextPhase(); await nextPhase();
break; break;
case "stop":
await stopExperiment();
break;
} }
} catch (err) { } catch (err) {
console.error(err); console.error(err);
@@ -226,7 +230,7 @@ function ControlPanel({
}: { }: {
loading: boolean, loading: boolean,
isPlaying: boolean, isPlaying: boolean,
onAction: (a: "pause" | "play" | "nextPhase") => void, onAction: (a: "pause" | "play" | "nextPhase" | "stop") => void,
onReset: () => void onReset: () => void
}) { }) {
return ( return (
@@ -256,6 +260,12 @@ function ControlPanel({
onClick={onReset} onClick={onReset}
disabled={loading} disabled={loading}
></button> ></button>
<button
className={styles.stop}
onClick={() => onAction("stop")}
disabled={loading}
></button>
</div> </div>
</div> </div>
); );

View File

@@ -32,6 +32,12 @@ export async function nextPhase(): Promise<void> {
sendAPICall(type, context) sendAPICall(type, context)
} }
export async function stopExperiment(): Promise<void> {
const type = "stop"
const context = ""
sendAPICall(type, context)
}
/** /**
* Sends an API call to the CB for going to pause experiment * Sends an API call to the CB for going to pause experiment