feat: add i18n translated form errors (#509)

apps/nextjs/src/components/manage/boards/add-board-modal.tsx

@@ -1,10 +1,11 @@
 import { Button, Group, Stack, TextInput } from "@mantine/core";
 import { boardSchemas } from "node_modules/@homarr/validation/src/board";
 
-import { useForm, zodResolver } from "@homarr/form";
+import { useZodForm } from "@homarr/form";
 import { createModal } from "@homarr/modals";
 import { useI18n } from "@homarr/translation/client";
 import { z } from "@homarr/validation";
+import { createCustomErrorParams } from "@homarr/validation/form";
 
 interface InnerProps {
   boardNames: string[];
@@ -14,20 +15,21 @@ interface InnerProps {
 export const AddBoardModal = createModal<InnerProps>(
   ({ actions, innerProps }) => {
     const t = useI18n();
-    const form = useForm({
-      initialValues: {
-        name: "",
+    const form = useZodForm(
+      z.object({
+        name: boardSchemas.byName.shape.name.refine(
+          (value) => !innerProps.boardNames.includes(value),
+          {
+            params: createCustomErrorParams("boardAlreadyExists"),
+          },
+        ),
+      }),
+      {
+        initialValues: {
+          name: "",
+        },
       },
-      validate: zodResolver(
-        z.object({
-          name: boardSchemas.byName.shape.name.refine(
-            (value) => !innerProps.boardNames.includes(value),
-          ),
-        }),
-      ),
-      validateInputOnBlur: true,
-      validateInputOnChange: true,
-    });
+    );
 
     return (
       <form