From 64141420d2e76c24c9e074d1bf7bfc28dd3d2ed8 Mon Sep 17 00:00:00 2001
From: Manuel Bustillo <bustikiller@bustikiller.com>
Date: Sun, 8 Dec 2024 13:51:14 +0100
Subject: [PATCH] Make group optional in groups form

---
 app/api/guests.tsx                      |  4 ++--
 app/ui/components/guest-form-dialog.tsx | 12 ++++++------
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/app/api/guests.tsx b/app/api/guests.tsx
index ce4f232..f433a53 100644
--- a/app/api/guests.tsx
+++ b/app/api/guests.tsx
@@ -12,8 +12,8 @@ export function loadGuests(onLoad?: (guests: Guest[]) => void) {
           id: record.id,
           name: record.name,
           status: record.status,
-          group_name: record.group.name,
-          groupId: record.group.id,
+          group_name: record.group?.name || 'Not grouped',
+          groupId: record.group?.id,
         });
       }));
     }, (error) => {
diff --git a/app/ui/components/guest-form-dialog.tsx b/app/ui/components/guest-form-dialog.tsx
index bf94230..8e77e54 100644
--- a/app/ui/components/guest-form-dialog.tsx
+++ b/app/ui/components/guest-form-dialog.tsx
@@ -21,17 +21,17 @@ export default function GuestFormDialog({ groups, onCreate, onHide, guest, visib
 }) {
 
   const [name, setName] = useState(guest?.name || '');
-  const [group, setGroup] = useState(guest?.groupId || null);
-  const [status, setStatus] = useState<GuestStatus | null>(guest?.status || null);
+  const [group, setGroup] = useState(guest?.groupId || undefined);
+  const [status, setStatus] = useState<GuestStatus | undefined>(guest?.status || undefined);
 
   function resetForm() {
     setName('');
-    setGroup(null);
-    setStatus(null);
+    setGroup(undefined);
+    setStatus(undefined);
   }
 
   function submitGuest() {
-    if (!(name && group && status)) {
+    if (!(name && status)) {
       return
     }
 
@@ -76,7 +76,7 @@ export default function GuestFormDialog({ groups, onCreate, onHide, guest, visib
             } />
             <label htmlFor="status">Status</label>
           </FloatLabel>
-          <button className={classNames('primary')} onClick={submitGuest} disabled={!(name.length > 0 && group && status)}>
+          <button className={classNames('primary')} onClick={submitGuest} disabled={!(name.length > 0 && status)}>
             {guest?.id !== undefined ? 'Update' : 'Create'}
           </button>
         </div>