Showing Server Action errors in the client form

I use this example https://tanstack.com/form/latest/docs/framework/react/examples/next-server-actions. How best to show the error that occurs already in the server action, after

await serverValidate(formData);

await serverValidate(formData);

await serverValidate(formData);

await serverValidate(formData);

For example

  ...
try {
  await serverValidate(formData);

  const { user } = await validateRequest();
  if (!user) {
    return {error: ["no user"]};
  }
  ...

  ...
try {
  await serverValidate(formData);

  const { user } = await validateRequest();
  if (!user) {
    return {error: ["no user"]};
  }
  ...

  ...
try {
  await serverValidate(formData);

  const { user } = await validateRequest();
  if (!user) {
    return {error: ["no user"]};
  }
  ...

  ...
try {
  await serverValidate(formData);

  const { user } = await validateRequest();
  if (!user) {
    return {error: ["no user"]};
  }
  ...

Here's how to show it in the client form?

(I came up with it only directly through state, i.e.

{state?.errors?.[0]}

{state?.errors?.[0]}

{state?.errors?.[0]}

{state?.errors?.[0]}

And through

const formErrorMap = form.useStore((formState) => formState.errors);
...

 {formErrorMap.map((error) => (
 <p key={error as string}>{error}</p>
 ))}

const formErrorMap = form.useStore((formState) => formState.errors);
...

 {formErrorMap.map((error) => (
 <p key={error as string}>{error}</p>
 ))}

const formErrorMap = form.useStore((formState) => formState.errors);
...

 {formErrorMap.map((error) => (
 <p key={error as string}>{error}</p>
 ))}

const formErrorMap = form.useStore((formState) => formState.errors);
...

 {formErrorMap.map((error) => (
 <p key={error as string}>{error}</p>
 ))}

I can't do it.
Can someone tell me how to do it better? thank you

An example showing how to implement Next Server Actions. in React using TanStack Form.