[SolidJS]: How to handle errors from server? about modular-forms HOT 3 OPEN

//@types/action.d.ts
import { FieldValues, FormErrors } from "@modular-forms/solid";
import { Action } from "@solidjs/router";

export type ActionForm<Schema extends FieldValues> = Action<
  [data: Schema],
  { success?: boolean; error?: string; fields?: FormErrors<Schema> } | void
>;
// autocomplete on fields from TS

//lib/utils.ts
export function flatIssues<K extends string | number>(
  issues: SchemaIssues,
): { [key in K]?: string } {
  let errors: { [key in K]?: string } = issues ? {} : {};

  return issues.reduce((acc, issue) => {
    if (
      issue.path?.every(
        ({ key }) => typeof key === "string" || typeof key === "number",
      )
    ) {
      const key = issue.path!.map(({ key }) => key).join(".") as K;
      if (acc[key]) {
        acc[key] = acc[key] + "\n" + issue.message; // merge multiple issues, split in components
      } else acc[key] = issue.message;
    }
    return acc;
  }, errors);
}

//login.tsx
export default function Index() {
  const action = useAction(login);
  const submission = useSubmission(login);
  const [loginForm, { Form, Field }] = createForm<LoginForm>({
    validate: valiForm(LoginSchema),
  });
  const handleSubmit: SubmitHandler<LoginForm> = async (values) => {
    await action(values);
    if (submission.result) {
      const { error = "", fields = {} } = submission.result;
      throw new FormError<LoginForm>(error, fields);
    }
  };
  return ( ... );
};

const LoginSchema = v.object({ ... })
type LoginForm = v.Input<typeof LoginSchema>;

const login: ActionForm<LoginForm> = action(async (data) => {
  "use server";
  const result = v.safeParse(LoginSchema, data);
  if (!result.success) {
    const errors = flatIssues<keyof LoginForm>(result.issues);
    return { fields: errors };
  }

  const { username, password } = result.output;

  // db call
  if (failed) return { error: "user does not exist" };

  // all good
  throw redirect("/");
}, "login");

const login = action(async (values: LoginForm) => {
  "use server";

  const result = safeParse(LoginSchema, values);
  if (!result.success) {
    const flattened = flatten<typeof LoginSchema>(result.issues);
    const errors = Object.entries(flattened.nested).reduce(
      (acc, [key, value]) => {
        acc[key] = value[0];
        return acc;
      },
      {} as { [key: string]: string },
    );

    if (flattened.root && flattened.root.length > 0) {
      return new FormError<LoginForm>(flattened.root[0], errors);
    }

    return new FormError<LoginForm>(errors);
  }

  return new FormError<LoginForm>("Email exists in database");
});

  const [loginForm, { Form, Field }] = createForm<LoginForm>({});
  const act = useAction(login);
  const sub = useSubmission(login);
  const handleSubmit: SubmitHandler<LoginForm> = async (values) => {
    await act(values);
    if (sub.result) {
      Object.entries(sub.result.errors).forEach(([field, message]) => {
        setError(loginForm, field as keyof LoginForm, message);
      });
      throw new FormError<LoginForm>(sub.result.message);
    }
  };