diff --git a/src/app/api/blocked_slots/validation.ts b/src/app/api/blocked_slots/validation.ts index 3353f5e..1cbe42c 100644 --- a/src/app/api/blocked_slots/validation.ts +++ b/src/app/api/blocked_slots/validation.ts @@ -25,14 +25,6 @@ export const BlockedSlotsSchema = zod created_at: zod.date(), updated_at: zod.date(), }) - .refine( - (data) => { - return new Date(data.start_time) < new Date(data.end_time); - }, - { - message: 'Start time must be before end time', - }, - ) .openapi('BlockedSlotsSchema', { description: 'Blocked time slot in the user calendar', }); @@ -47,11 +39,37 @@ export const BlockedSlotResponseSchema = zod.object({ blocked_slot: BlockedSlotsSchema, }); -export const createBlockedSlotSchema = BlockedSlotsSchema.omit({ - id: true, - created_at: true, - updated_at: true, -}); +export const createBlockedSlotSchema = zod + .object({ + start_time: eventStartTimeSchema, + end_time: eventEndTimeSchema, + reason: zod.string().nullish(), + }) + .refine( + (data) => { + return new Date(data.start_time) < new Date(data.end_time); + }, + { + message: 'Start time must be before end time', + path: ['end_time'], + }, + ); + +export const createBlockedSlotClientSchema = zod + .object({ + start_time: zod.iso.datetime({ local: true }), + end_time: zod.iso.datetime({ local: true }), + reason: zod.string().nullish(), + }) + .refine( + (data) => { + return new Date(data.start_time) < new Date(data.end_time); + }, + { + message: 'Start time must be before end time', + path: ['end_time'], + }, + ); export const updateBlockedSlotSchema = zod.object({ start_time: eventStartTimeSchema.optional(), diff --git a/src/components/forms/blocked-slot-form.tsx b/src/components/forms/blocked-slot-form.tsx index 1293e58..52a119d 100644 --- a/src/components/forms/blocked-slot-form.tsx +++ b/src/components/forms/blocked-slot-form.tsx @@ -3,7 +3,7 @@ import useZodForm from '@/lib/hooks/useZodForm'; import { updateBlockedSlotSchema, - createBlockedSlotSchema, + createBlockedSlotClientSchema, } from '@/app/api/blocked_slots/validation'; import { useGetApiBlockedSlotsSlotID, @@ -40,12 +40,7 @@ export default function BlockedSlotForm({ handleSubmit: handleCreateSubmit, formState: formStateCreate, reset: resetCreate, - } = useZodForm( - createBlockedSlotSchema.extend({ - start_time: eventStartTimeSchema.or(zod.iso.datetime({ local: true })), - end_time: eventStartTimeSchema.or(zod.iso.datetime({ local: true })), - }), - ); + } = useZodForm(createBlockedSlotClientSchema); const { register: registerUpdate, @@ -145,100 +140,146 @@ export default function BlockedSlotForm({ }); }); - return ( -
- - -
-
- + if (existingBlockedSlotId) + return ( +
+ + +
+
+ +
+
+

{'Update Blocker'}

+
+
-
-

- {existingBlockedSlotId ? 'Update Blocker' : 'Create Blocker'} -

-
-
-
- - -
-
- - - -
-
- - {existingBlockedSlotId && ( + + + +
+ + + +
+
+ {existingBlockedSlotId && ( + + )} +
+ {formStateUpdate.errors.root && ( +

+ {formStateUpdate.errors.root.message} +

)} + +
+ +
+ ); + else + return ( +
+ + +
+
+ +
+
+

{'Create Blocker'}

+
+
- {formStateCreate.errors.root && ( -

- {formStateCreate.errors.root.message} -

- )} - {formStateUpdate.errors.root && ( -

- {formStateUpdate.errors.root.message} -

- )} - - -
-
- ); + + +
+
+ + + +
+
+ + {existingBlockedSlotId && ( + + )} +
+ {formStateCreate.errors.root && ( +

+ {formStateCreate.errors.root.message} +

+ )} +
+
+ +
+ ); }