Extract a table simulations API

app/api/tableSimulations.tsx

@@ -0,0 +1,17 @@
+import { TableArrangement } from '@/app/lib/definitions';
+
+export function loadTableSimulations(onLoad?: (tableSimulations: TableArrangement[]) => void) {
+  fetch('/api/tables_arrangements')
+    .then((response) => response.json())
+    .then((data) => {
+      onLoad && onLoad(data.map((record: any) => {
+        return ({
+          id: record.id,
+          name: record.name,
+          discomfort: record.discomfort,
+        });
+      }));
+    }, (error) => {
+      return [];
+    });
+}

app/ui/arrangements/arrangements-table.tsx

@@ -6,31 +6,24 @@ import React, { useState } from "react"
 import { TableArrangement } from '@/app/lib/definitions';
 import { classNames } from "../components/button";
 import TableOfContents from "../components/table-of-contents";
+import { loadTableSimulations } from "@/app/api/tableSimulations";
 
 export default function ArrangementsTable ({onArrangementSelected}: {onArrangementSelected: (arrangementId: string) => void}) {
     const [arrangements, setArrangements] = useState<Array<TableArrangement>>([]);
+    const [arrangementsLoaded, setArrangementsLoaded] = useState(false);
 
-    function loadArrangements() {
+    function refreshSimulations() {
-      fetch("/api/tables_arrangements")
+      loadTableSimulations((arrangements) => {
-        .then((response) => response.json())
+        setArrangements(arrangements);
-        .then((data) => {
+        setArrangementsLoaded(true);
-          setArrangements(data.map((record: any) => {
+      });
-            return ({
-              id: record.id,
-              name: record.name,
-              discomfort: record.discomfort
-            });
-          }));
-        }, (error) => {
-          return [];
-        });
     }
 
     function arrangementClicked(e: React.MouseEvent<HTMLElement>) {
         onArrangementSelected(e.currentTarget.getAttribute('data-arrangement-id') || '');
     }
   
-    arrangements.length === 0 && loadArrangements();
+    !arrangementsLoaded && refreshSimulations();
 
     return(
       <TableOfContents