upgrade to conform v0.8

app/routes/_auth+/forgot-password/index.tsx

@@ -51,7 +51,6 @@ export async function action({ request }: DataFunctionArgs) {
 			}
 		}),
 		async: true,
-		acceptMultipleErrors: () => true,
 	})
 	if (submission.intent !== 'submit') {
 		return json({ status: 'idle', submission } as const)
@@ -90,7 +89,7 @@ export async function action({ request }: DataFunctionArgs) {
 	if (response.status === 'success') {
 		return redirect(redirectTo.toString())
 	} else {
-		submission.error[''] = response.error.message
+		submission.error[''] = [response.error.message]
 		return json({ status: 'error', submission } as const, { status: 500 })
 	}
 }

app/routes/_auth+/onboarding.tsx

@@ -29,7 +29,6 @@ import {
 	passwordSchema,
 	usernameSchema,
 } from '~/utils/user-validation.ts'
-import { checkboxSchema } from '~/utils/zod-extensions.ts'
 import { type VerifyFunctionArgs } from '../resources+/verify.tsx'
 
 export const onboardingEmailSessionKey = 'onboardingEmail'
@@ -38,24 +37,30 @@ const OnboardingFormSchema = z
 	.object({
 		username: usernameSchema,
 		name: nameSchema,
-		password: passwordSchema,
-		confirmPassword: passwordSchema,
-		agreeToTermsOfServiceAndPrivacyPolicy: checkboxSchema(
-			'You must agree to the terms of service and privacy policy',
-		),
-		agreeToMailingList: checkboxSchema(),
-		remember: checkboxSchema(),
+		agreeToTermsOfServiceAndPrivacyPolicy: z.boolean({
+			required_error:
+				'You must agree to the terms of service and privacy policy',
+		}),
+		agreeToMailingList: z.boolean().optional(),
+		remember: z.boolean().optional(),
 		redirectTo: z.string().optional(),
 	})
-	.superRefine(({ confirmPassword, password }, ctx) => {
-		if (confirmPassword !== password) {
-			ctx.addIssue({
-				path: ['confirmPassword'],
-				code: 'custom',
-				message: 'The passwords did not match',
+	.and(
+		z
+			.object({
+				password: passwordSchema,
+				confirmPassword: passwordSchema,
 			})
-		}
-	})
+			.superRefine(({ confirmPassword, password }, ctx) => {
+				if (confirmPassword !== password) {
+					ctx.addIssue({
+						path: ['confirmPassword'],
+						code: 'custom',
+						message: 'The passwords did not match',
+					})
+				}
+			}),
+	)
 
 export async function loader({ request }: DataFunctionArgs) {
 	await requireAnonymous(request)
@@ -95,7 +100,6 @@ export async function action({ request }: DataFunctionArgs) {
 				return
 			}
 		}),
-		acceptMultipleErrors: () => true,
 		async: true,
 	})
 	if (submission.intent !== 'submit') {

app/routes/_auth+/reset-password.tsx

@@ -55,7 +55,6 @@ export async function action({ request }: DataFunctionArgs) {
 	const formData = await request.formData()
 	const submission = parse(formData, {
 		schema: ResetPasswordSchema,
-		acceptMultipleErrors: () => true,
 	})
 	if (submission.intent !== 'submit') {
 		return json({ status: 'idle', submission } as const)

app/routes/_auth+/signup/index.tsx

@@ -43,7 +43,6 @@ export async function action({ request }: DataFunctionArgs) {
 				return
 			}
 		}),
-		acceptMultipleErrors: () => true,
 		async: true,
 	})
 	if (submission.intent !== 'submit') {
@@ -69,7 +68,7 @@ export async function action({ request }: DataFunctionArgs) {
 	if (response.status === 'success') {
 		return redirect(redirectTo.toString())
 	} else {
-		submission.error[''] = response.error.message
+		submission.error[''] = [response.error.message]
 		return json({ status: 'error', submission } as const, { status: 500 })
 	}
 }

app/routes/resources+/delete-image.tsx

@@ -17,7 +17,6 @@ export async function action({ request }: DataFunctionArgs) {
 	const formData = await request.formData()
 	const submission = parse(formData, {
 		schema: DeleteFormSchema,
-		acceptMultipleErrors: () => true,
 	})
 	if (!submission.value) {
 		return json({ status: 'error', submission } as const, { status: 400 })

app/routes/resources+/login.tsx

@@ -27,7 +27,6 @@ import {
 	getSession,
 } from '~/utils/session.server.ts'
 import { passwordSchema, usernameSchema } from '~/utils/user-validation.ts'
-import { checkboxSchema } from '~/utils/zod-extensions.ts'
 import {
 	type VerificationTypes,
 	isCodeValid,
@@ -57,7 +56,7 @@ const LoginFormSchema = z.object({
 	username: usernameSchema,
 	password: passwordSchema,
 	redirectTo: z.string().optional(),
-	remember: checkboxSchema(),
+	remember: z.boolean().optional(),
 })
 
 const verifiedTimeKey = 'verified-time'
@@ -151,7 +150,6 @@ async function inlineLoginAction({ request }: DataFunctionArgs) {
 				}
 			}),
 		async: true,
-		acceptMultipleErrors: () => true,
 	})
 	// get the password off the payload that's sent back
 	delete submission.payload.password
@@ -377,7 +375,6 @@ async function inlineTwoFAAction({ request }: DataFunctionArgs) {
 			}
 		}),
 		async: true,
-		acceptMultipleErrors: () => true,
 	})
 
 	if (submission.intent !== 'submit') {

app/routes/resources+/note-editor.tsx

@@ -14,16 +14,15 @@ import { redirectWithToast } from '~/utils/flash-session.server.ts'
 
 export const NoteEditorSchema = z.object({
 	id: z.string().optional(),
-	title: z.string().min(1),
-	content: z.string().min(1),
+	title: z.string(),
+	content: z.string(),
 })
 
 export async function action({ request }: DataFunctionArgs) {
 	const userId = await requireUserId(request)
 	const formData = await request.formData()
 	const submission = parse(formData, {
 		schema: NoteEditorSchema,
-		acceptMultipleErrors: () => true,
 	})
 	if (submission.intent !== 'submit') {
 		return json({ status: 'idle', submission } as const)

app/routes/resources+/theme/index.tsx

@@ -22,7 +22,6 @@ export async function action({ request }: DataFunctionArgs) {
 	const formData = await request.formData()
 	const submission = parse(formData, {
 		schema: ThemeFormSchema,
-		acceptMultipleErrors: () => true,
 	})
 	if (!submission.value) {
 		return json({ status: 'error', submission } as const, { status: 400 })

app/routes/resources+/verify.tsx

@@ -156,7 +156,6 @@ export async function validateRequest(
 					return
 				}
 			}),
-		acceptMultipleErrors: () => true,
 		async: true,
 	})
 

app/routes/settings+/profile.change-email.index/index.tsx

@@ -68,7 +68,6 @@ export async function action({ request }: DataFunctionArgs) {
 			}
 		}),
 		async: true,
-		acceptMultipleErrors: () => true,
 	})
 
 	if (submission.intent !== 'submit') {
@@ -99,7 +98,7 @@ export async function action({ request }: DataFunctionArgs) {
 			},
 		})
 	} else {
-		submission.error[''] = response.error.message
+		submission.error[''] = [response.error.message]
 		return json({ status: 'error', submission } as const, { status: 500 })
 	}
 }

app/routes/settings+/profile.index.tsx

@@ -25,10 +25,8 @@ import { twoFAVerificationType } from './profile.two-factor.tsx'
 const ProfileFormSchema = z.object({
 	name: nameSchema.optional(),
 	username: usernameSchema,
-	currentPassword: z
-		.union([passwordSchema, z.string().min(0).max(0)])
-		.optional(),
-	newPassword: z.union([passwordSchema, z.string().min(0).max(0)]).optional(),
+	currentPassword: passwordSchema.optional(),
+	newPassword: passwordSchema.optional(),
 })
 
 export async function loader({ request }: DataFunctionArgs) {
@@ -90,7 +88,6 @@ export async function action({ request }: DataFunctionArgs) {
 				}
 			},
 		),
-		acceptMultipleErrors: () => true,
 	})
 	if (submission.intent !== 'submit') {
 		return json({ status: 'idle', submission } as const)

app/routes/settings+/profile.photo.tsx

@@ -37,8 +37,7 @@ const MAX_SIZE = 1024 * 1024 * 3 // 3MB
 
 const PhotoFormSchema = z.object({
 	photoFile: z
-		.instanceof(File)
-		.refine(file => file.name !== '' && file.size !== 0, 'Image is required')
+		.instanceof(File, { message: 'Image is required' })
 		.refine(file => {
 			return file.size <= MAX_SIZE
 		}, 'Image size must be less than 3MB'),

app/routes/users+/$username_+/notes.$noteId.tsx

@@ -59,7 +59,6 @@ export async function action({ request }: DataFunctionArgs) {
 	const formData = await request.formData()
 	const submission = parse(formData, {
 		schema: DeleteFormSchema,
-		acceptMultipleErrors: () => true,
 	})
 	if (!submission.value || submission.intent !== 'submit') {
 		return json(

app/utils/user-validation.ts

@@ -1,7 +1,7 @@
 import { z } from 'zod'
 
 export const usernameSchema = z
-	.string()
+	.string({ required_error: 'Username is required' })
 	.min(3, { message: 'Username is too short' })
 	.max(20, { message: 'Username is too long' })
 	.regex(/^[a-zA-Z0-9_]+$/, {
@@ -11,15 +11,15 @@ export const usernameSchema = z
 	.transform(value => value.toLowerCase())
 
 export const passwordSchema = z
-	.string()
+	.string({ required_error: 'Password is required' })
 	.min(6, { message: 'Password is too short' })
 	.max(100, { message: 'Password is too long' })
 export const nameSchema = z
-	.string()
+	.string({ required_error: 'Name is required' })
 	.min(3, { message: 'Name is too short' })
 	.max(40, { message: 'Name is too long' })
 export const emailSchema = z
-	.string()
+	.string({ required_error: 'Email is required' })
 	.email({ message: 'Email is invalid' })
 	.min(3, { message: 'Email is too short' })
 	.max(100, { message: 'Email is too long' })

package.json

@@ -37,8 +37,8 @@
     "/server-build"
   ],
   "dependencies": {
-    "@conform-to/react": "^0.7.4",
-    "@conform-to/zod": "^0.7.4",
+    "@conform-to/react": "^0.8.0",
+    "@conform-to/zod": "^0.8.0",
     "@epic-web/totp": "^1.0.2",
     "@prisma/client": "^5.0.0",
     "@radix-ui/react-checkbox": "^1.0.4",