fix: validate mobile event drawer steps with schema

src/components/event-dialog.tsx

@@ -31,6 +31,7 @@ import { useIsMobile } from "@/hooks/use-mobile";
 import {
 	type EventFormValues,
 	getDefaultEventFormValues,
+	validateEventFormStep,
 	validateEventFormValues,
 } from "@/lib/event-form";
 import { parseRecurrenceRule, validateRecurrence } from "@/lib/recurrence";
@@ -76,13 +77,14 @@ export const EventDialog = ({
 	const saveLabel = editingId ? "Update Event" : "Save Event";
 
 	const {
+		clearErrors,
 		control,
+		getValues,
 		handleSubmit,
 		register,
 		reset,
 		setError,
 		setValue,
-		trigger,
 		watch,
 		formState: { errors },
 	} = useForm<EventFormValues>({
@@ -106,9 +108,23 @@ export const EventDialog = ({
 		onOpenChange(nextOpen);
 	};
 
-	const handleNext = async () => {
-		const valid = await trigger(STEP_FIELDS[step]);
-		if (valid) advanceStep();
+	const handleNext = () => {
+		const stepFields = STEP_FIELDS[step];
+		clearErrors(stepFields);
+		const stepValidation = validateEventFormStep(getValues(), stepFields);
+		if (stepValidation.success) {
+			advanceStep();
+			return;
+		}
+
+		for (const [fieldName, messages] of Object.entries(
+			stepValidation.fieldErrors,
+		)) {
+			const firstMessage = messages?.[0];
+			if (firstMessage) {
+				setError(fieldName as keyof EventFormValues, { message: firstMessage });
+			}
+		}
 	};
 
 	const handleSave = handleSubmit((values) => {