diff --git a/src/pages/SimpleProgram/SimpleProgram.tsx b/src/pages/SimpleProgram/SimpleProgram.tsx
index d548108..16cb512 100644
--- a/src/pages/SimpleProgram/SimpleProgram.tsx
+++ b/src/pages/SimpleProgram/SimpleProgram.tsx
@@ -1,5 +1,6 @@
import React from "react";
import styles from "./SimpleProgram.module.css";
+import useProgramStore from "../../utils/programStore.ts";
/* ---------- Types ---------- */
@@ -36,10 +37,6 @@ type Phase = {
triggers: KeywordTrigger[];
};
-type SimpleProgramProps = {
- phases: Phase[];
-};
-
/* ---------- Reusable UI ---------- */
type BoxProps = {
@@ -63,11 +60,7 @@ const GoalList: React.FC<{ goals: Goal[] }> = ({ goals }) => {
{goals.map((goal) => (
-
-
+
{goal.achieved ? "✔" : "✖"}
{goal.description}
@@ -77,11 +70,8 @@ const GoalList: React.FC<{ goals: Goal[] }> = ({ goals }) => {
);
};
-const TriggerList: React.FC<{ triggers: KeywordTrigger[] }> = ({
- triggers,
-}) => {
- if (triggers.length === 0)
- return
No triggers defined.
;
+const TriggerList: React.FC<{ triggers: KeywordTrigger[] }> = ({ triggers }) => {
+ if (triggers.length === 0) return No triggers defined.
;
return (
@@ -133,48 +123,37 @@ const PhaseGrid: React.FC<{ phase: Phase }> = ({ phase }) => {
/* ---------- Main Component ---------- */
-const SimpleProgram: React.FC = ({ phases }) => {
+const SimpleProgram: React.FC = () => {
+ // Get the phases from the program store
+ const phases = useProgramStore((state) => state.currentProgram.phases) as Phase[];
const [phaseIndex, setPhaseIndex] = React.useState(0);
+
+ // If no phases are available, display a message
+ if (phases.length === 0) return No program loaded.
;
+
const phase = phases[phaseIndex];
return (
);
};
diff --git a/src/pages/VisProgPage/VisProg.tsx b/src/pages/VisProgPage/VisProg.tsx
index e289580..3db9a00 100644
--- a/src/pages/VisProgPage/VisProg.tsx
+++ b/src/pages/VisProgPage/VisProg.tsx
@@ -181,21 +181,23 @@ function graphReducer() {
*/
function VisProgPage() {
const [showSimpleProgram, setShowSimpleProgram] = useState(false);
- const [phases, setPhases] = useState([]);
+ const setProgramState = useProgramStore((state) => state.setProgramState);
const runProgram = () => {
- const reducedPhases = graphReducer();
- setPhases(reducedPhases);
- setShowSimpleProgram(true);
- runProgramm();
+ const phases = graphReducer(); // reduce graph
+ setProgramState({ phases }); // <-- save to store
+ setShowSimpleProgram(true); // show SimpleProgram
+ runProgramm(); // send to backend if needed
};
if (showSimpleProgram) {
return (
-
+
+
+
+
);
}