Pass data to table under accordion

Author: UsamaEquinorAFK

frontend/src/pages/LabResults.tsx

@@ -9,6 +9,7 @@ import { ExperimentResult } from "@/dto/ExperimentResult.tsx";
 import { useSimulationQueries } from "@/hooks/useSimulationQueriesResult.ts";
 import DownloadButton from "@/components/DownloadButton.tsx";
 import LabResultSimulationRunsStatus from "@/components/LabResultSimulationRunsStatus.tsx";
+
 const LabResults: React.FC = () => {
     const [selectedExperiments, setSelectedExperiments] = useState<ExperimentResult[]>([]);
 
@@ -29,6 +30,26 @@ const LabResults: React.FC = () => {
 
     const simulationQueryResults = useSimulationQueries(selectedExperiments);
 
+    const simulationStatusData = useMemo(() => {
+        const modelIds: string[] = [];
+        const experimentNames: string[] = [];
+        const statuses: string[] = [];
+
+        Object.entries(simulationQueryResults.data).forEach(([experimentName, simulations]) => {
+            simulations.forEach((simulation) => {
+                modelIds.push(simulation.modelInput.modelId);
+                experimentNames.push(experimentName);
+                statuses.push(simulation.status);
+            });
+        });
+        
+        return {
+            modelIds,
+            experimentNames,
+            statuses,
+        };
+    }, [simulationQueryResults.data]);
+
     if (isLoading) return <>Fetching results ...</>;
 
     let issueRetrievingDataInfo = null;
@@ -55,10 +76,10 @@ const LabResults: React.FC = () => {
             {issueRetrievingDataInfo}
 
             <LabResultSimulationRunsStatus 
-                modelId={[]}
-                experimentName={[]}
-                simulationStatus={[]}
-                />
+                modelId={simulationStatusData.modelIds}
+                experimentName={simulationStatusData.experimentNames}
+                simulationStatus={simulationStatusData.statuses}
+            />
 
             <LabResultsPlot
                 selectedExperiments={selectedExperiments}