Update dependency react to v19.0.0

Reviewed-on: #141

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

@@ -7,6 +7,7 @@ import { loadGuests } from '@/app/api/guests';
 import { Group, Guest } from '@/app/lib/definitions';
 import { classNames } from '@/app/ui/components/button';
 import GuestFormDialog from '@/app/ui/components/guest-form-dialog';
+import GroupFormDialog from '@/app/ui/components/group-form-dialog';
 import GroupsTable from '@/app/ui/groups/table';
 import SkeletonTable from '@/app/ui/guests/skeleton-row';
 import GuestsTable from '@/app/ui/guests/table';
@@ -31,6 +32,7 @@ export default function Page() {
 
   const [groupsLoaded, setGroupsLoaded] = useState(false);
   const [groups, setGroups] = useState<Array<Group>>([]);
+  const [groupBeingEdited, setGroupBeingEdited] = useState<Group | undefined>(undefined);
 
   const [guestsLoaded, setGuestsLoaded] = useState(false);
   const [guests, setGuests] = useState<Array<Guest>>([]);
@@ -54,14 +56,33 @@ export default function Page() {
               onHide={() => { setGuestBeingEdited(undefined) }}
             />
             <Suspense fallback={<SkeletonTable />}>
-              <GuestsTable guests={guests} onUpdate={refreshGuests} onEdit={(guest) => setGuestBeingEdited(guest)} />
+              <GuestsTable
+                guests={guests}
+                onUpdate={refreshGuests}
+                onEdit={(guest) => setGuestBeingEdited(guest)}
+              />
             </Suspense>
           </div>
         </ TabPanel>
         <TabPanel header="Groups" leftIcon="pi pi-sitemap mx-2">
-          <div className="flex w-full items-center justify-between">
+          <div className="flex flex-col w-full items-center justify-between">
+
+            <button onClick={() => setGroupBeingEdited({})} className={classNames('primary')}>Add new</button>
+            <GroupFormDialog
+              key={groupBeingEdited?.id}
+              groups={groups}
+              onCreate={() => { refreshGroups(); setGroupBeingEdited(undefined) }}
+              group={groupBeingEdited}
+              visible={groupBeingEdited !== undefined}
+              onHide={() => { setGroupBeingEdited(undefined) }}
+            />
+
             <Suspense fallback={<SkeletonTable />}>
-              <GroupsTable groups={groups} />
+              <GroupsTable 
+                groups={groups}
+                onUpdate={refreshGroups}
+                onEdit={(group) => setGroupBeingEdited(group)}
+              />
             </Suspense>
           </div>
         </ TabPanel>

app/[slug]/page.tsx

@@ -5,10 +5,22 @@
 import LoginForm from '@/app/ui/components/login-form';
 import RegistrationForm from '@/app/ui/components/registration-form';
 import { useParams } from 'next/navigation'
+import { useEffect } from 'react';
+import { retrieveCSRFToken } from '../api/authentication';
+import { getCsrfToken } from '../lib/utils';
 
 export default async function Page() {
   const params = useParams<{ slug: string }>()
-  localStorage.setItem('slug', await params.slug);
+
+  useEffect(() => {
+    if (getCsrfToken() == 'unknown') {
+      retrieveCSRFToken();
+    }
+  }, []);
+
+  if (typeof window !== 'undefined') {
+    localStorage.setItem('slug', await params.slug);
+  }
 
   return (
     <main className="flex min-h-screen flex-col p-6">

app/api/authentication.tsx

@@ -35,7 +35,7 @@ export function logout({ onLogout }: { onLogout: () => void }) {
 }
 
 function flattenErrors(errors: StructuredErrors): string[] {
-  if(errors instanceof Array) {
+  if (errors instanceof Array) {
     return errors;
   }
   return Object.keys(errors).map((key) => {
@@ -43,7 +43,16 @@ function flattenErrors(errors: StructuredErrors): string[] {
   });
 }
 
-export function register({slug, email, password, passwordConfirmation, captcha, onRegister, onError}: {
+// At this moment we're making an initial request to get a valid CSRF token
+export function retrieveCSRFToken() {
+  return fetch(`/api/token`, {
+    headers: {
+      'Accept': 'application/json',
+    }
+  }).then((response) => { return null });
+}
+
+export function register({ slug, email, password, passwordConfirmation, captcha, onRegister, onError }: {
   slug: string,
   email: string,
   password: string,
@@ -51,7 +60,7 @@ export function register({slug, email, password, passwordConfirmation, captcha,
   captcha: Captcha,
   onRegister: () => void,
   onError: (errors: string[]) => void
-}){
+}) {
   fetch(`/api/${slug}/users`, {
     method: 'POST',
     body: JSON.stringify(
@@ -66,7 +75,7 @@ export function register({slug, email, password, passwordConfirmation, captcha,
       'X-CSRF-TOKEN': getCsrfToken(),
     }
   }).then((response) => {
-    if(response.ok) {
+    if (response.ok) {
       response.json().then(onRegister);
     } else {
       response.json().then((data: any) => {

app/api/groups.tsx

@@ -1,7 +1,7 @@
 /* Copyright (C) 2024 Manuel Bustillo*/
 
 import { Group } from '@/app/lib/definitions';
-import { getSlug } from '../lib/utils';
+import { getCsrfToken, getSlug } from '../lib/utils';
 
 export function loadGroups(onLoad?: (groups: Group[]) => void) {
   fetch(`/api/${getSlug()}/groups`)
@@ -26,3 +26,56 @@ export function loadGroups(onLoad?: (groups: Group[]) => void) {
       return [];
     });
 }
+
+export function updateGroup(group: Group) {
+  return fetch(`/api/${getSlug()}/groups/${group.id}`,
+    {
+      method: 'PUT',
+      body: JSON.stringify({ group: { 
+        name: group.name, 
+        color: group.color, 
+        icon: group.icon,
+        parent_id: group.parentId
+       } }),
+      headers: {
+        'Content-Type': 'application/json',
+        'X-CSRF-TOKEN': getCsrfToken(),
+      }
+    })
+    .catch((error) => console.error(error));
+}
+
+export function createGroup(group: Group, onCreate?: () => void) {
+  fetch(`/api/${getSlug()}/groups`, {
+    method: 'POST',
+    body: JSON.stringify({ 
+      name: group.name, 
+      color: group.color, 
+      icon: group.icon,
+      parent_id: group.parentId
+     }),
+    headers: {
+      'Content-Type': 'application/json',
+      'X-CSRF-TOKEN': getCsrfToken(),
+    }
+  })
+    .then((response) => response.json())
+    .then((data) => {
+      onCreate && onCreate();
+    })
+    .catch((error) => console.error(error));
+}
+
+export function destroyGroup(group: Group, onDestroy?: () => void) {
+  fetch(`/api/${getSlug()}/groups/${group.id}`, {
+    method: 'DELETE',
+    headers: {
+      'X-CSRF-TOKEN': getCsrfToken(),
+    }
+  })
+    .then((response) => response.json())
+    .then((data) => {
+      onDestroy && onDestroy();
+    })
+    .catch((error) => console.error(error));
+}

app/lib/definitions.ts

@@ -32,11 +32,12 @@ export type TableArrangement = {
 }
 
 export type Group = {
-  id: string;
+  id?: string;
-  name: string;
+  name?: string;
-  guest_count: number;
+  guest_count?: number;
-  icon: string;
+  icon?: string;
-  children: Group[];
+  children?: Group[];
+  parentId?: string;
   color?: string;
   attendance?: AttendanceSummary
 };

app/ui/arrangements/arrangement.tsx

@@ -6,13 +6,14 @@ import React, { useState } from 'react';
 import { TableArrangement, Guest } from '@/app/lib/definitions';
 import { lusitana } from '@/app/ui/fonts';
 import { Table } from '@/app/ui/components/table';
+import { getSlug } from '@/app/lib/utils';
 
 export default function Arrangement({ id }: { id: string }) {
 
     const [tables, setTables] = useState<Array<TableArrangement>>([]);
 
     function loadTables() {
-        fetch(`/api/tables_arrangements/${id}`)
+        fetch(`/api/${getSlug()}/tables_arrangements/${id}`)
             .then((response) => response.json())
             .then((data) => {
                 setTables(data.map((record: any) => {

app/ui/components/group-form-dialog.tsx

@@ -0,0 +1,91 @@
+/* Copyright (C) 2024 Manuel Bustillo*/
+
+'use client';
+
+import { createGroup, updateGroup } from '@/app/api/groups';
+import { Group } from '@/app/lib/definitions';
+import { classNames } from '@/app/ui/components/button';
+import { Dialog } from 'primereact/dialog';
+import { ColorPicker } from 'primereact/colorpicker';
+import { Dropdown } from 'primereact/dropdown';
+import { FloatLabel } from 'primereact/floatlabel';
+import { InputText } from 'primereact/inputtext';
+import { useState } from 'react';
+
+export default function GroupFormDialog({groups, onCreate, onHide, group, visible }: {
+  groups: Group[],
+  onCreate?: () => void,
+  onHide: () => void,
+  group?: Group,
+  visible: boolean,
+}) {
+
+  const [name, setName] = useState(group?.name || '');
+  const [icon, setIcon] = useState(group?.icon || '');
+  const [color, setColor] = useState<string>(group?.color || '');
+  const [parentId, setParentId] = useState(group?.parentId || '');
+
+  function resetForm() {
+    setName('');
+    setIcon('');
+    setColor('');
+    setParentId('');
+  }
+
+  function submitGroup() {
+    if (!(name)) {
+      return
+    }
+
+    if (group?.id !== undefined) {
+      group.name = name;
+      group.icon = icon;
+      group.color = color;
+      group.parentId = parentId;
+
+      updateGroup(group).then(() => {
+        resetForm();
+        onCreate && onCreate();
+      });
+    } else {
+      group && createGroup({name, icon, color, parentId}, () => {
+        resetForm();
+        onCreate && onCreate();
+      });
+    }
+  }
+
+  return (
+    <>
+
+      <Dialog header="Add group" visible={visible} style={{ width: '60vw' }} onHide={onHide}>
+        <div className="card flex justify-evenly py-5">
+          <FloatLabel>
+            <InputText id="name" className='rounded-sm' value={name} onChange={(e) => setName(e.target.value)} />
+            <label htmlFor="name">Name</label>
+          </FloatLabel>
+          <FloatLabel>
+            <InputText id="icon" className='rounded-sm' value={icon} onChange={(e) => setIcon(e.target.value)} />
+            <label htmlFor="icon">Icon</label>
+          </FloatLabel>
+          <FloatLabel>
+            <ColorPicker value={color} format='hex' onChange={(e) => setColor(`#${e.value}`)} />
+            <label htmlFor="color" />
+          </FloatLabel>
+          <FloatLabel>
+            <Dropdown id="parentId" className='rounded-sm min-w-32' value={parentId} onChange={(e) => setParentId(e.target.value)} options={
+              groups.map((group) => {
+                return { label: group.name, value: group.id };
+              })
+            } />
+            <label htmlFor="parentId">Parent</label>
+          </FloatLabel>
+
+          <button className={classNames('primary')} onClick={submitGroup} disabled={!(name.length > 0)}>
+            {group?.id !== undefined ? 'Update' : 'Create'}
+          </button>
+        </div>
+      </Dialog>
+    </>
+  );
+}

app/ui/components/guest-form-dialog.tsx

@@ -54,7 +54,7 @@ export default function GuestFormDialog({ groups, onCreate, onHide, guest, visib
   return (
     <>
 
-      <Dialog header="Add guest" visible={visible} style={{ width: '50vw' }} onHide={onHide}>
+      <Dialog header="Add guest" visible={visible} style={{ width: '60vw' }} onHide={onHide}>
         <div className="card flex justify-evenly py-5">
           <FloatLabel>
             <InputText id="username" className='rounded-sm' value={name} onChange={(e) => setName(e.target.value)} />

app/ui/groups/table.tsx

@@ -4,12 +4,18 @@
 
 import { Group } from '@/app/lib/definitions';
 import TableOfContents from '../components/table-of-contents';
+import { PencilIcon, TrashIcon } from '@heroicons/react/24/outline';
+import { destroyGroup } from '@/app/api/groups';
 
-export default function GroupsTable({ groups }: { groups: Group[] }) {
+export default function GroupsTable({ groups, onUpdate, onEdit }: {
+  groups: Group[],
+  onUpdate: () => void,
+  onEdit: (group: Group) => void,
+}) {
 
   return (
     <TableOfContents
-      headers={['Name', 'Color', 'Confirmed', 'Tentative', 'Pending', 'Declined', 'Considered', 'Total']}
+      headers={['Name', 'Color', 'Confirmed', 'Tentative', 'Pending', 'Declined', 'Considered', 'Total', 'Actions']}
       caption='Groups'
       elements={groups}
       rowRender={(group) => (
@@ -38,6 +44,12 @@ export default function GroupsTable({ groups }: { groups: Group[] }) {
           <td className="px-6 text-sm">
             {group.attendance?.total}
           </td>
+          <td>
+            <div className="flex flex-row items-center">
+              <TrashIcon className='size-6 cursor-pointer' onClick={() => { destroyGroup(group, () => onUpdate()) }} />
+              <PencilIcon className='size-6 cursor-pointer' onClick={() => onEdit(group)} />
+            </div>
+          </td>
         </tr>
       )}
     />

package.json

@@ -16,7 +16,7 @@
     "postcss": "8.4.49",
     "primeicons": "^7.0.0",
     "primereact": "^10.8.2",
-    "react": "19.0.0-rc-f38c22b244-20240704",
+    "react": "19.0.0",
     "react-dom": "19.0.0-rc-f38c22b244-20240704",
     "tailwindcss": "3.4.16",
     "typescript": "5.7.2",
@@ -27,11 +27,11 @@
     "@playwright/test": "^1.46.0",
     "@types/bcrypt": "^5.0.2",
     "@types/node": "22.10.1",
-    "@types/react": "18.3.12",
+    "@types/react": "19.0.1",
     "@types/react-dom": "18.3.1"
   },
   "engines": {
     "node": ">=23.0.0"
   },
-  "packageManager": "pnpm@9.14.4+sha512.c8180b3fbe4e4bca02c94234717896b5529740a6cbadf19fa78254270403ea2f27d4e1d46a08a0f56c89b63dc8ebfd3ee53326da720273794e6200fcf0d184ab"
+  "packageManager": "pnpm@9.15.0+sha512.76e2379760a4328ec4415815bcd6628dee727af3779aaa4c914e3944156c4299921a89f976381ee107d41f12cfa4b66681ca9c718f0668fa0831ed4c6d8ba56c"
 }

pnpm-lock.yaml

@@ -10,7 +10,7 @@ importers:
     dependencies:
       '@heroicons/react':
         specifier: ^2.1.4
-        version: 2.2.0(react@19.0.0-rc-f38c22b244-20240704)
+        version: 2.2.0(react@19.0.0)
       '@tailwindcss/forms':
         specifier: ^0.5.7
         version: 0.5.9(tailwindcss@3.4.16)
@@ -25,10 +25,10 @@ importers:
         version: 2.1.1
       next:
         specifier: 15.0.3
-        version: 15.0.3(@playwright/test@1.49.0)(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0-rc-f38c22b244-20240704))(react@19.0.0-rc-f38c22b244-20240704)
+        version: 15.0.3(@playwright/test@1.49.0)(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0))(react@19.0.0)
       next-auth:
         specifier: 5.0.0-beta.25
-        version: 5.0.0-beta.25(next@15.0.3(@playwright/test@1.49.0)(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0-rc-f38c22b244-20240704))(react@19.0.0-rc-f38c22b244-20240704))(react@19.0.0-rc-f38c22b244-20240704)
+        version: 5.0.0-beta.25(next@15.0.3(@playwright/test@1.49.0)(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0))(react@19.0.0))(react@19.0.0)
       postcss:
         specifier: 8.4.49
         version: 8.4.49
@@ -37,13 +37,13 @@ importers:
         version: 7.0.0
       primereact:
         specifier: ^10.8.2
-        version: 10.8.5(@types/react@18.3.12)(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0-rc-f38c22b244-20240704))(react@19.0.0-rc-f38c22b244-20240704)
+        version: 10.8.5(@types/react@19.0.1)(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0))(react@19.0.0)
       react:
-        specifier: 19.0.0-rc-f38c22b244-20240704
+        specifier: 19.0.0
-        version: 19.0.0-rc-f38c22b244-20240704
+        version: 19.0.0
       react-dom:
         specifier: 19.0.0-rc-f38c22b244-20240704
-        version: 19.0.0-rc-f38c22b244-20240704(react@19.0.0-rc-f38c22b244-20240704)
+        version: 19.0.0-rc-f38c22b244-20240704(react@19.0.0)
       tailwindcss:
         specifier: 3.4.16
         version: 3.4.16
@@ -52,7 +52,7 @@ importers:
         version: 5.7.2
       use-debounce:
         specifier: ^10.0.1
-        version: 10.0.4(react@19.0.0-rc-f38c22b244-20240704)
+        version: 10.0.4(react@19.0.0)
       zod:
         specifier: ^3.23.8
         version: 3.23.8
@@ -67,8 +67,8 @@ importers:
         specifier: 22.10.1
         version: 22.10.1
       '@types/react':
-        specifier: 18.3.12
+        specifier: 19.0.1
-        version: 18.3.12
+        version: 19.0.1
       '@types/react-dom':
         specifier: 18.3.1
         version: 18.3.1
@@ -331,17 +331,14 @@ packages:
   '@types/node@22.10.1':
     resolution: {integrity: sha512-qKgsUwfHZV2WCWLAnVP1JqnpE6Im6h3Y0+fYgMTasNQ7V++CBX5OT1as0g0f+OyubbFqhf6XVNIsmN4IIhEgGQ==}
 
-  '@types/prop-types@15.7.12':
-    resolution: {integrity: sha512-5zvhXYtRNRluoE/jAp4GVsSduVUzNWKkOZrCDBWYtE7biZywwdC2AcEzg+cSMLFRfVgeAFqpfNabiPjxFddV1Q==}
-
   '@types/react-dom@18.3.1':
     resolution: {integrity: sha512-qW1Mfv8taImTthu4KoXgDfLuk4bydU6Q/TkADnDWWHwi4NX4BR+LWfTp2sVmTqRrsHvyDDTelgelxJ+SsejKKQ==}
 
   '@types/react-transition-group@4.4.11':
     resolution: {integrity: sha512-RM05tAniPZ5DZPzzNFP+DmrcOdD0efDUxMy3145oljWSl3x9ZV5vhme98gTxFrj2lhXvmGNnUiuDyJgY9IKkNA==}
 
-  '@types/react@18.3.12':
+  '@types/react@19.0.1':
-    resolution: {integrity: sha512-D2wOSq/d6Agt28q7rSI3jhU7G6aiuzljDGZ2hTZHIkrTLUI+AF3WMeKkEZ9nN2fkBAlcktT6vcZjDFiIhMYEQw==}
+    resolution: {integrity: sha512-YW6614BDhqbpR5KtUYzTA+zlA7nayzJRA9ljz9CQoxthR0sDisYZLuvSMsil36t4EH/uAt8T52Xb4sVw17G+SQ==}
 
   abbrev@1.1.1:
     resolution: {integrity: sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==}
@@ -935,8 +932,8 @@ packages:
       react: '>=16.6.0'
       react-dom: '>=16.6.0'
 
-  react@19.0.0-rc-f38c22b244-20240704:
+  react@19.0.0:
-    resolution: {integrity: sha512-OP8O6Oc1rdR9IdIKJRKaL1PYd4eGkn6f88VqiygWyyG4P4RmPPix5pp7MatqSt9TnBOcVT+lBMGoVxRgUFeudQ==}
+    resolution: {integrity: sha512-V8AVnmPIICiWpGfm6GLzCR/W5FXLchHop40W4nXBmdlEceh16rCN8O8LNWm5bh5XUX91fh7KpA+W0TgMKmgTpQ==}
     engines: {node: '>=0.10.0'}
 
   read-cache@1.0.0:
@@ -1174,9 +1171,9 @@ snapshots:
       tslib: 2.6.3
     optional: true
 
-  '@heroicons/react@2.2.0(react@19.0.0-rc-f38c22b244-20240704)':
+  '@heroicons/react@2.2.0(react@19.0.0)':
     dependencies:
-      react: 19.0.0-rc-f38c22b244-20240704
+      react: 19.0.0
 
   '@img/sharp-darwin-arm64@0.33.5':
     optionalDependencies:
@@ -1362,19 +1359,16 @@ snapshots:
     dependencies:
       undici-types: 6.20.0
 
-  '@types/prop-types@15.7.12': {}
-
   '@types/react-dom@18.3.1':
     dependencies:
-      '@types/react': 18.3.12
+      '@types/react': 19.0.1
 
   '@types/react-transition-group@4.4.11':
     dependencies:
-      '@types/react': 18.3.12
+      '@types/react': 19.0.1
 
-  '@types/react@18.3.12':
+  '@types/react@19.0.1':
     dependencies:
-      '@types/prop-types': 15.7.12
       csstype: 3.1.3
 
   abbrev@1.1.1: {}
@@ -1729,13 +1723,13 @@ snapshots:
 
   nanoid@3.3.7: {}
 
-  next-auth@5.0.0-beta.25(next@15.0.3(@playwright/test@1.49.0)(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0-rc-f38c22b244-20240704))(react@19.0.0-rc-f38c22b244-20240704))(react@19.0.0-rc-f38c22b244-20240704):
+  next-auth@5.0.0-beta.25(next@15.0.3(@playwright/test@1.49.0)(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0))(react@19.0.0))(react@19.0.0):
     dependencies:
       '@auth/core': 0.37.2
-      next: 15.0.3(@playwright/test@1.49.0)(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0-rc-f38c22b244-20240704))(react@19.0.0-rc-f38c22b244-20240704)
+      next: 15.0.3(@playwright/test@1.49.0)(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0))(react@19.0.0)
-      react: 19.0.0-rc-f38c22b244-20240704
+      react: 19.0.0
 
-  next@15.0.3(@playwright/test@1.49.0)(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0-rc-f38c22b244-20240704))(react@19.0.0-rc-f38c22b244-20240704):
+  next@15.0.3(@playwright/test@1.49.0)(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0))(react@19.0.0):
     dependencies:
       '@next/env': 15.0.3
       '@swc/counter': 0.1.3
@@ -1743,9 +1737,9 @@ snapshots:
       busboy: 1.6.0
       caniuse-lite: 1.0.30001651
       postcss: 8.4.31
-      react: 19.0.0-rc-f38c22b244-20240704
+      react: 19.0.0
-      react-dom: 19.0.0-rc-f38c22b244-20240704(react@19.0.0-rc-f38c22b244-20240704)
+      react-dom: 19.0.0-rc-f38c22b244-20240704(react@19.0.0)
-      styled-jsx: 5.1.6(react@19.0.0-rc-f38c22b244-20240704)
+      styled-jsx: 5.1.6(react@19.0.0)
     optionalDependencies:
       '@next/swc-darwin-arm64': 15.0.3
       '@next/swc-darwin-x64': 15.0.3
@@ -1877,14 +1871,14 @@ snapshots:
 
   primeicons@7.0.0: {}
 
-  primereact@10.8.5(@types/react@18.3.12)(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0-rc-f38c22b244-20240704))(react@19.0.0-rc-f38c22b244-20240704):
+  primereact@10.8.5(@types/react@19.0.1)(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0))(react@19.0.0):
     dependencies:
       '@types/react-transition-group': 4.4.11
-      react: 19.0.0-rc-f38c22b244-20240704
+      react: 19.0.0
-      react-dom: 19.0.0-rc-f38c22b244-20240704(react@19.0.0-rc-f38c22b244-20240704)
+      react-dom: 19.0.0-rc-f38c22b244-20240704(react@19.0.0)
-      react-transition-group: 4.4.5(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0-rc-f38c22b244-20240704))(react@19.0.0-rc-f38c22b244-20240704)
+      react-transition-group: 4.4.5(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0))(react@19.0.0)
     optionalDependencies:
-      '@types/react': 18.3.12
+      '@types/react': 19.0.1
 
   prop-types@15.8.1:
     dependencies:
@@ -1894,23 +1888,23 @@ snapshots:
 
   queue-microtask@1.2.3: {}
 
-  react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0-rc-f38c22b244-20240704):
+  react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0):
     dependencies:
-      react: 19.0.0-rc-f38c22b244-20240704
+      react: 19.0.0
       scheduler: 0.25.0-rc-f38c22b244-20240704
 
   react-is@16.13.1: {}
 
-  react-transition-group@4.4.5(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0-rc-f38c22b244-20240704))(react@19.0.0-rc-f38c22b244-20240704):
+  react-transition-group@4.4.5(react-dom@19.0.0-rc-f38c22b244-20240704(react@19.0.0))(react@19.0.0):
     dependencies:
       '@babel/runtime': 7.26.0
       dom-helpers: 5.2.1
       loose-envify: 1.4.0
       prop-types: 15.8.1
-      react: 19.0.0-rc-f38c22b244-20240704
+      react: 19.0.0
-      react-dom: 19.0.0-rc-f38c22b244-20240704(react@19.0.0-rc-f38c22b244-20240704)
+      react-dom: 19.0.0-rc-f38c22b244-20240704(react@19.0.0)
 
-  react@19.0.0-rc-f38c22b244-20240704: {}
+  react@19.0.0: {}
 
   read-cache@1.0.0:
     dependencies:
@@ -2027,10 +2021,10 @@ snapshots:
     dependencies:
       ansi-regex: 6.0.1
 
-  styled-jsx@5.1.6(react@19.0.0-rc-f38c22b244-20240704):
+  styled-jsx@5.1.6(react@19.0.0):
     dependencies:
       client-only: 0.0.1
-      react: 19.0.0-rc-f38c22b244-20240704
+      react: 19.0.0
 
   sucrase@3.35.0:
     dependencies:
@@ -2108,9 +2102,9 @@ snapshots:
       escalade: 3.1.2
       picocolors: 1.1.1
 
-  use-debounce@10.0.4(react@19.0.0-rc-f38c22b244-20240704):
+  use-debounce@10.0.4(react@19.0.0):
     dependencies:
-      react: 19.0.0-rc-f38c22b244-20240704
+      react: 19.0.0
 
   util-deprecate@1.0.2: {}