remix-forms
remix-forms copied to clipboard
Render inputErrors for fields that are not part of the schema as global errors
Let's say we're updating a user at /users/$userId/edit
:
const formSchema = z.object({
firstName: z.string().min(1),
email: z.string().min(1).email(),
})
const mutationSchema = formSchema.extend({ userId: z.string() })
const mutation = makeDomainFunction(mutationSchema)(async (values) => values)
export const action: ActionFunction = async ({ request, params }) =>
formAction({
request,
schema,
mutation,
transformValues: (values) => ({ ...params, ...values }),
})
export default () => <Form schema={formSchema} />
If for any reason the userId
is not present in the params, the mutation
will not succeed but formAction
will not return an error for the missing userId.
It would be nice if we could show them as global errors and give feedback to the developer that something is off with the wiring between Form and action. Right now, the form submission will not succeed but no error will be shown.
I'm looking for a generic way to implement this as a convention in Remix Forms: whenever we have an inputError
for a field that's not part of the form schema, we make it a global error.