Add generic table and populate with reactionsteps from tocomo

Author: haralde

backend/src/acidwatch_api/models/datamodel.py

@@ -44,7 +44,13 @@ class TextResult(BaseModel):
     data: str
 
 
-AnyPanel: TypeAlias = JsonResult | TextResult | ReactionPathsResult
+class TableResult(BaseModel):
+    type: Literal["table"] = "table"
+    label: str | None = None
+    data: Any
+
+
+AnyPanel: TypeAlias = JsonResult | TextResult | ReactionPathsResult | TableResult
 
 
 class ModelInfo(BaseModel):
@@ -63,16 +69,6 @@ class ModelInfo(BaseModel):
     parameters: dict[str, Any]
 
 
-class InitFinalDiff(BaseModel):
-    initial: Dict[str, float]
-    final: Dict[str, float]
-    change: Dict[str, float]
-
-
-class Results(BaseModel):
-    initfinaldiff: InitFinalDiff
-
-
 class CommonPaths(BaseModel):
     paths: Optional[Dict[str, Optional[str]]] = Field(default_factory=dict)
     k: Optional[Dict[str, Optional[str]]] = Field(default_factory=dict)
@@ -97,13 +93,6 @@ class ChartData(BaseModel):
     variance_minus: Dict[str, float]
 
 
-class SimulationResults(BaseModel):
-    results: Results
-    analysis: Optional[Analysis] = None
-    chart_data: ChartData
-    table_data: Optional[Any] = None
-
-
 class SimulationRequest(BaseModel):
     model_config = ConfigDict(
         alias_generator=to_camel,

backend/src/acidwatch_api/models/tocomo.py

@@ -1,9 +1,7 @@
 from __future__ import annotations
-
 from acidwatch_api.models.base import BaseAdapter, RunResult
-from acidwatch_api.models.datamodel import InitFinalDiff
+from acidwatch_api.models.datamodel import TableResult
 from fastapi import APIRouter
-
 from acidwatch_api.configuration import SETTINGS
 
 router = APIRouter()
@@ -52,7 +50,9 @@ async def run(self) -> RunResult:
             timeout=60.0,
         )
         res.raise_for_status()
+        result = res.json()
 
-        data = InitFinalDiff.model_validate(res.json())
-
-        return {name.upper(): value for name, value in data.final.items()}
+        return (
+            {key.upper(): value for key, value in result["final"].items()},
+            TableResult(data=result["steps"], label="Reaction Steps"),
+        )

frontend/src/components/GenericTable.tsx

@@ -0,0 +1,41 @@
+import React from "react";
+import { Table } from "@equinor/eds-core-react";
+
+interface GenericTableProps {
+    data: Record<string, any>[];
+}
+
+const GenericTable: React.FC<GenericTableProps> = ({ data }) => {
+    if (!data || data.length === 0) return <div>No data</div>;
+
+    const columns = Object.keys(data[0]);
+
+    return (
+        <Table>
+            <Table.Head>
+                <Table.Row>
+                    {columns.map((col) => (
+                        <Table.Cell key={col}>{col}</Table.Cell>
+                    ))}
+                </Table.Row>
+            </Table.Head>
+            <Table.Body>
+                {data.map((row, idx) => (
+                    <Table.Row key={idx}>
+                        {columns.map((col) => (
+                            <Table.Cell key={col}>
+                                {typeof row[col] === "number"
+                                    ? Math.abs(row[col]) < 0.001
+                                        ? "-"
+                                        : row[col].toFixed(2)
+                                    : (row[col] ?? "-")}
+                            </Table.Cell>
+                        ))}
+                    </Table.Row>
+                ))}
+            </Table.Body>
+        </Table>
+    );
+};
+
+export default GenericTable;

frontend/src/dto/SimulationResults.tsx

@@ -19,7 +19,13 @@ interface ReactionPathsPanel {
     stats: any;
 }
 
-export type Panel = TextPanel | JsonPanel | ReactionPathsPanel;
+interface TablePanel {
+    type: "table";
+    label?: string;
+    data: Record<string, any>[];
+}
+
+export type Panel = TextPanel | JsonPanel | ReactionPathsPanel | TablePanel;
 export interface SimulationResults {
     modelInput: ModelInput;
     finalConcentrations: { [key: string]: number };

frontend/src/pages/Results.tsx

@@ -10,6 +10,7 @@ import { getSimulationResults } from "../api/api";
 import { MassBalanceError } from "../components/MassBalanceError";
 import { extractPlotData } from "../functions/Formatting";
 import BarChart from "../components/BarChart";
+import GenericTable from "../components/GenericTable";
 
 interface ResultsProps {
     simulationResults?: SimulationResults;
@@ -28,6 +29,9 @@ function getPanelName(panel: Panel): string {
         case "reaction_paths":
             return "Reactions";
 
+        case "table":
+            return panel.label ?? "Table data";
+
         default:
             return "(Unknown panel)";
     }
@@ -44,6 +48,9 @@ function getPanelContent(panel: Panel): React.ReactElement {
         case "reaction_paths":
             return <Reactions commonPaths={panel.common_paths} reactions={panel.stats} />;
 
+        case "table":
+            return <GenericTable data={panel.data} />;
+
         default:
             return <Typography color="red">Unknown panel type</Typography>;
     }