diff --git a/src/pages/MonitoringPage/MonitoringPage.tsx b/src/pages/MonitoringPage/MonitoringPage.tsx
index 3fe3b24..32f7b6b 100644
--- a/src/pages/MonitoringPage/MonitoringPage.tsx
+++ b/src/pages/MonitoringPage/MonitoringPage.tsx
@@ -1,7 +1,32 @@
import React from 'react';
import styles from './MonitoringPage.module.css';
+import useProgramStore from "../../utils/programStore.ts";
-export default function MonitoringPage() {
+type Goal = { id?: string | number; description?: string; achieved?: boolean };
+type Trigger = { id?: string | number; label?: string ; achieved?: boolean };
+type Norm = { id?: string | number; norm?: string };
+
+
+const MonitoringPage: React.FC = () => {
+ const getPhaseIds = useProgramStore((s) => s.getPhaseIds);
+ const getNormsInPhase = useProgramStore((s) => s.getNormsInPhase);
+ const getGoalsInPhase = useProgramStore((s) => s.getGoalsInPhase);
+ const getTriggersInPhase = useProgramStore((s) => s.getTriggersInPhase);
+
+ const phaseIds = getPhaseIds();
+ const [phaseIndex, setPhaseIndex] = React.useState(0);
+
+ if (phaseIds.length === 0) {
+ return
No program loaded.
;
+ }
+
+ const phaseId = phaseIds[phaseIndex];
+
+ const goals = getGoalsInPhase(phaseId) as Goal[];
+ const triggers = getTriggersInPhase(phaseId) as Trigger[];
+ const norms = getNormsInPhase(phaseId) as Norm[];
+
+
return (
{/* HEADER */}
@@ -44,26 +69,45 @@ export default function MonitoringPage() {
Goals
- - Convince the RP that you are a fish
- - Reference Shakespeare
- - Give a compliment
+ {goals.length > 0 ? (
+ goals.map((goal, idx) => (
+ -
+ {goal.achieved ? "✔️" : "❌"} {goal.description}
+
+ ))) : (
+ No goals defined.
+ )
+ }
Triggers
- - Convince the RP that you are a fish
- - Reference Shakespeare
- - Give a compliment
+ {triggers.length > 0 ? (
+ triggers.map((trigger, idx) => (
+ -
+ {trigger.achieved ? "✔️" : "❌"} {trigger.label}
+
+ ))) : (
+ No triggers defined.
+ )
+ }
Norms
- - Rhyme when talking
- - Talk like a fish
+ {norms.length > 0 ? (
+ norms.map((norm, idx) => (
+ -
+ {norm.norm}
+
+ ))) : (
+ No norms defined.
+ )
+ }
@@ -125,3 +169,5 @@ export default function MonitoringPage() {
);
}
+
+export default MonitoringPage;
\ No newline at end of file
diff --git a/src/pages/VisProgPage/VisProg.tsx b/src/pages/VisProgPage/VisProg.tsx
index 3db9a00..f1b5f30 100644
--- a/src/pages/VisProgPage/VisProg.tsx
+++ b/src/pages/VisProgPage/VisProg.tsx
@@ -17,6 +17,7 @@ import styles from './VisProg.module.css'
import { NodeReduces, NodeTypes } from './visualProgrammingUI/NodeRegistry.ts';
import SaveLoadPanel from './visualProgrammingUI/components/SaveLoadPanel.tsx';
import SimpleProgram from "../SimpleProgram/SimpleProgram.tsx";
+import MonitoringPage from '../MonitoringPage/MonitoringPage.tsx';
// --| config starting params for flow |--
@@ -196,7 +197,7 @@ function VisProgPage() {
-
+
);
}