Standalone REST Error Mapper

Map arbitrary backend error envelopes to RHF field errors with one option.

Impact

Alto

Differential

Integrates with legacy API contracts without backend refactors.

Message

Adapte erro legado para RHF sem reescrever a API.

type ApiError = {
  ok: false;
  errors: Array<{ field: string; message: string }>;
};

const form = useActionForm({
  submit: async (values) => {
    const res = await fetch("/api/users", {
      method: "POST",
      body: JSON.stringify(values),
    });
    return res.json() as Promise<ApiError | { ok: true }>;
  },
  defaultValues: { name: "", email: "" },
  errorMapper: (result) => {
    if (!result || result.ok !== false) return {};
    return Object.fromEntries(result.errors.map((item) => [item.field, [item.message]]));
  },
});

Strategic point: this removes one of the most common adoption blockers in enterprise apps.