62 lines
2.3 KiB
TypeScript
62 lines
2.3 KiB
TypeScript
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
|
|
'use client'
|
|
|
|
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";
|
|
import { ArchiveBoxXMarkIcon, ArrowsPointingOutIcon, CheckBadgeIcon } from "@heroicons/react/24/outline";
|
|
import { Tooltip } from "primereact/tooltip";
|
|
import clsx from "clsx";
|
|
import { ProgressBar } from "primereact/progressbar";
|
|
import { useEffect } from "react";
|
|
import { TableSimulation, TableSimulationSerializer } from "@/app/lib/tableSimulation";
|
|
import { AbstractApi } from "@/app/api/abstract-api";
|
|
|
|
export default function ArrangementsTable({ onArrangementSelected }: { onArrangementSelected: (arrangementId: string) => void }) {
|
|
const [arrangements, setArrangements] = useState<Array<TableArrangement>>([]);
|
|
const [arrangementsLoaded, setArrangementsLoaded] = useState(false);
|
|
|
|
useEffect(() => {
|
|
refreshSimulations();
|
|
const interval = setInterval(refreshSimulations, 10000);
|
|
return () => clearInterval(interval);
|
|
}, []);
|
|
|
|
function refreshSimulations() {
|
|
loadTableSimulations((arrangements) => {
|
|
setArrangements(arrangements);
|
|
setArrangementsLoaded(true);
|
|
});
|
|
}
|
|
|
|
function arrangementClicked(arrangement: TableArrangement) {
|
|
onArrangementSelected(arrangement.id);
|
|
}
|
|
|
|
return (
|
|
<TableOfContents
|
|
headers={['Name', 'Discomfort', 'Actions']}
|
|
caption='Simulations'
|
|
elements={arrangements}
|
|
rowRender={(arrangement) => (
|
|
<tr key={arrangement.id} className={clsx("border-b", {
|
|
"bg-white odd:bg-white even:bg-gray-50": arrangement.valid,
|
|
"bg-red-50 odd:bg-red-50 even:bg-red-100": !arrangement.valid
|
|
})}>
|
|
<th scope="row" className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap">
|
|
{arrangement.name}
|
|
</th>
|
|
<td className="px-6 py-4">
|
|
{arrangement.discomfort}
|
|
</td>
|
|
<td>
|
|
<ArrowsPointingOutIcon data-arrangement-id={arrangement.id} onClick={() => arrangementClicked(arrangement)} className='size-6 cursor-pointer' />
|
|
</td>
|
|
</tr>
|
|
)}
|
|
/>
|
|
);
|
|
} |