Update dependency zod to v3.24.3

Reviewed-on: #212

.nvmrc

@@ -1 +1 @@
-23.6.0
+23.11.0

app/[slug]/dashboard/guests/page.tsx

@@ -5,6 +5,7 @@
 import { AbstractApi, } from '@/app/api/abstract-api';
 import { Group, GroupSerializer } from '@/app/lib/group';
 import { Guest, GuestSerializer } from '@/app/lib/guest';
+import { getCsrfToken, getSlug } from '@/app/lib/utils';
 import AffinitiesFormDialog from '@/app/ui/components/affinities-form-dialog';
 import { classNames } from '@/app/ui/components/button';
 import GroupFormDialog from '@/app/ui/components/group-form-dialog';
@@ -31,6 +32,16 @@ export default function Page() {
     });
   }
 
+  function resetAffinities() {
+    fetch(`/api/${getSlug()}/groups/affinities/reset`, {
+      method: 'POST',
+      headers: {
+        'Accept': 'application/json',
+        'X-CSRF-TOKEN': getCsrfToken(),
+      }
+    })
+  }
+
   const [groupsLoaded, setGroupsLoaded] = useState(false);
   const [groups, setGroups] = useState<Array<Group>>([]);
   const [groupBeingEdited, setGroupBeingEdited] = useState<Group | undefined>(undefined);
@@ -70,7 +81,11 @@ export default function Page() {
         <TabPanel header="Groups" leftIcon="pi pi-sitemap mx-2">
           <div className="flex flex-col w-full items-center justify-between">
 
-            <button onClick={() => setGroupBeingEdited({})} className={classNames('primary')}>Add new</button>
+            <div>
+              <button onClick={() => setGroupBeingEdited({})} className={classNames('primary')}>Add new</button>
+              <button onClick={resetAffinities} className={classNames('yellow')}>Reset affinities</button>
+            </div>
+
             <GroupFormDialog
               key={groupBeingEdited?.id}
               groups={groups}

app/[slug]/dashboard/tables/page.tsx

@@ -2,15 +2,41 @@
 
 'use client';
 
+import { AbstractApi } from '@/app/api/abstract-api';
+import { TableSimulation, TableSimulationSerializer } from '@/app/lib/tableSimulation';
 import Arrangement from '@/app/ui/arrangements/arrangement';
-import React, { useState } from 'react';
 import ArrangementsTable from '@/app/ui/arrangements/arrangements-table';
+import { classNames } from '@/app/ui/components/button';
+import { Toast } from 'primereact/toast';
+import React, { useRef, useState } from 'react';
 
 export default function Page() {
+  const toast = useRef<Toast>(null);
+
+  const show = () => {
+    toast.current?.show({
+      severity: 'success',
+      summary: 'Simulation created',
+      detail: 'Table distributions will be calculated shortly, please come back in some minutes'
+    });
+  };
+
   const [currentArrangement, setCurrentArrangement] = useState<string | null>(null);
 
+  function createSimulation() {
+    const api = new AbstractApi<TableSimulation>();
+    const serializer = new TableSimulationSerializer();
+    api.create(serializer, new TableSimulation(), show);
+  }
+
   return (
     <>
+
+      <div className="flex flex-col w-full items-center justify-between">
+        <Toast ref={toast} />
+        <button onClick={createSimulation} className={classNames('primary')}>Add new</button>
+      </div>
+
       <ArrangementsTable onArrangementSelected={setCurrentArrangement} />
       {currentArrangement && <Arrangement key={currentArrangement} id={currentArrangement} />}
     </>

app/api/tableSimulations.tsx

@@ -12,6 +12,7 @@ export function loadTableSimulations(onLoad?: (tableSimulations: TableArrangemen
           id: record.id,
           name: record.name,
           discomfort: record.discomfort,
+          valid: record.valid,
         });
       }));
     }, (error) => {

app/lib/definitions.ts

@@ -12,7 +12,8 @@ export type TableArrangement = {
   number: number;
   name: string;
   guests?: Guest[];
-  discomfort?: number
+  discomfort?: number;
+  valid?: boolean;
 }
 
 export type User = {

app/lib/tableSimulation.tsx

@@ -19,12 +19,12 @@ export type Table = {
 }
 
 export class TableSimulation implements Entity {
-  id: string;
+  id?: string;
   tables: Table[];
 
-  constructor(id: string, tables: Table[]) {
+  constructor(id?: string, tables?: Table[]) {
     this.id = id;
-    this.tables = tables;
+    this.tables = tables || [];
   }
 }
 

app/ui/arrangements/arrangements-table.tsx

@@ -7,42 +7,57 @@ 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, CheckBadgeIcon } from "@heroicons/react/24/outline";
+import { Tooltip } from "primereact/tooltip";
+import clsx from "clsx";
 
-export default function ArrangementsTable ({onArrangementSelected}: {onArrangementSelected: (arrangementId: string) => void}) {
+export default function ArrangementsTable({ onArrangementSelected }: { onArrangementSelected: (arrangementId: string) => void }) {
-    const [arrangements, setArrangements] = useState<Array<TableArrangement>>([]);
+  const [arrangements, setArrangements] = useState<Array<TableArrangement>>([]);
-    const [arrangementsLoaded, setArrangementsLoaded] = useState(false);
+  const [arrangementsLoaded, setArrangementsLoaded] = useState(false);
 
-    function refreshSimulations() {
+  function refreshSimulations() {
-      loadTableSimulations((arrangements) => {
+    loadTableSimulations((arrangements) => {
-        setArrangements(arrangements);
+      setArrangements(arrangements);
-        setArrangementsLoaded(true);
+      setArrangementsLoaded(true);
-      });
+    });
-    }
+  }
 
-    function arrangementClicked(e: React.MouseEvent<HTMLElement>) {
+  function arrangementClicked(e: React.MouseEvent<HTMLElement>) {
-        onArrangementSelected(e.currentTarget.getAttribute('data-arrangement-id') || '');
+    onArrangementSelected(e.currentTarget.getAttribute('data-arrangement-id') || '');
-    }
+  }
-  
-    !arrangementsLoaded && refreshSimulations();
 
-    return(
+  !arrangementsLoaded && refreshSimulations();
-      <TableOfContents
+
-        headers={['Name', 'Discomfort', 'Actions']}
+  return (
-        caption='Simulations'
+    <TableOfContents
-        elements={arrangements}
+      headers={['Name', 'Discomfort', 'Actions', 'Status']}
-        rowRender={(arrangement) => (
+      caption='Simulations'
-          <tr key={arrangement.id} className="bg-white border-b odd:bg-white odd:dark:bg-gray-900 even:bg-gray-50 even:dark:bg-gray-800">
+      elements={arrangements}
-            <th scope="row" className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
+      rowRender={(arrangement) => (
-              {arrangement.name}
+        <tr key={arrangement.id} className={clsx("border-b", {
-            </th>
+          "bg-white odd:bg-white even:bg-gray-50": arrangement.valid,
-            <td className="px-6 py-4">
+          "bg-red-50 odd:bg-red-50 even:bg-red-100": !arrangement.valid
-              {arrangement.discomfort}
+        })}>
-            </td>
+          <th scope="row" className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap">
-            <td>
+            {arrangement.name}
-                <button data-arrangement-id={arrangement.id} onClick={arrangementClicked} className={classNames('primary')}>Load</button>
+          </th>
-            </td>
+          <td className="px-6 py-4">
-          </tr>
+            {arrangement.discomfort}
-        )}
+          </td>
-      />
+          <td>
-    );
+            <button data-arrangement-id={arrangement.id} onClick={arrangementClicked} className={classNames('primary')}>Load</button>
+          </td>
+          <td>
+            <Tooltip target=".tooltip-status" />
+
+            {
+              arrangement.valid ?
+                <CheckBadgeIcon className='size-6 tooltip-status' data-pr-position="right" data-pr-tooltip="Simulation is valid" /> :
+                <ArchiveBoxXMarkIcon className='size-6 tooltip-status' data-pr-position="right" data-pr-tooltip="Simulation is expired due to attendance or affinity changes" />
+            }
+          </td>
+        </tr>
+      )}
+    />
+  );
 }

package.json

@@ -8,31 +8,31 @@
   "dependencies": {
     "@heroicons/react": "^2.1.4",
     "@tailwindcss/forms": "^0.5.7",
-    "autoprefixer": "10.4.20",
+    "autoprefixer": "10.4.21",
     "bcrypt": "^5.1.1",
     "clsx": "^2.1.1",
-    "next": "15.1.4",
+    "next": "15.3.1",
     "next-auth": "5.0.0-beta.25",
-    "postcss": "8.4.49",
+    "postcss": "8.5.3",
     "primeicons": "^7.0.0",
     "primereact": "^10.8.2",
     "react": "19.0.0-rc-f38c22b244-20240704",
     "react-dom": "19.0.0-rc-f38c22b244-20240704",
     "tailwindcss": "3.4.17",
-    "typescript": "5.7.3",
+    "typescript": "5.8.3",
     "use-debounce": "^10.0.1",
-    "uuid": "11.0.5",
+    "uuid": "11.1.0",
     "zod": "^3.23.8"
   },
   "devDependencies": {
     "@playwright/test": "^1.46.0",
     "@types/bcrypt": "^5.0.2",
-    "@types/node": "22.10.5",
+    "@types/node": "22.14.1",
-    "@types/react": "18.3.18",
+    "@types/react": "18.3.20",
-    "@types/react-dom": "18.3.5"
+    "@types/react-dom": "18.3.6"
   },
   "engines": {
     "node": ">=23.0.0"
   },
-  "packageManager": "pnpm@9.15.3+sha512.1f79bc245a66eb0b07c5d4d83131240774642caaa86ef7d0434ab47c0d16f66b04e21e0c086eb61e62c77efc4d7f7ec071afad3796af64892fae66509173893a"
+  "packageManager": "pnpm@9.15.9+sha512.68046141893c66fad01c079231128e9afb89ef87e2691d69e4d40eee228988295fd4682181bae55b58418c3a253bde65a505ec7c5f9403ece5cc3cd37dcf2531"
 }