Hey guys, I was working on my application and as I was working on the forms I was using the example found in the nextjs books. where forms use the action and then call a server action. However I ran into a problem. I don't know how to get feed back or if somehow a form has invalid data and zod catches it the user will get an error page, but not feedback on what went wrong. Did I perhaps do something wrong or miss something?
I will show part of my code since the form is quite long.

jsx 
return (
    <form action={editMaintenanceRecord.bind(null, maintenance.id)}>
{/* Sections: Description Vehicle components */}
<div className='mt-6 bg-white dark:bg-gray-800 rounded-md shadow-md p-4'>
<h2 className='flex items-center text-lg font-semibold text-gray-900 dark:text-gray-300'>
<IoBuildOutline className='mr-2 h-6 w-6 text-blue-700' />
 Maintenance Details
</h2>
        <div className='grid grid-cols-1 md:grid-cols-2 gap-4'>
  {/* description */}
<div className='py-4'>
<label
htmlFor='description'
className='block text-sm font-medium text-gray-700 dark:text-gray-300'
>
Description *
</label>
  <div className='mt-1'></div>
<input
type='text'
name='description'
id='description'
defaultValue={maintenance?.description || ''}
className='block w-full border border-gray-300 rounded-md shadow-sm p-2 focus:ring focus:ring-blue-500 dark:bg-gray-800 dark:border-gray-600 dark:text-gray-300'
required
/>
</div>

jsx 
export async function editMaintenanceRecord(id, formData) {
const raw = Object.fromEntries(formData); // convert FormData to object
  let result = maintenanceRecordSchema.safeParse(raw);
  result.data.description = 123; // test
if (!result.success) {
return {
errors: result.error.flatten().fieldErrors,
};
  }
  await updateMaintenanceRecord(id, result.data);
  // redirect back to maintenance list after editing
  redirect('/maintenance');
}