diff --git a/components/forms/CreateTxForm/Fields/FieldString.tsx b/components/forms/CreateTxForm/Fields/FieldString.tsx new file mode 100644 index 0000000..1d999a9 --- /dev/null +++ b/components/forms/CreateTxForm/Fields/FieldString.tsx @@ -0,0 +1,54 @@ +import { FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form"; +import { Input } from "@/components/ui/input"; +import { prettyFieldName } from "@/lib/form"; +import * as z from "zod"; +import type { FieldProps } from "./types"; + +const isFieldString = (fieldName: string) => + ["sourcePort", "sourceChannel", "memo"].includes(fieldName); + +const isOptionalFieldString = (fieldName: string) => fieldName === "label"; + +export const getFieldString = (fieldName: string) => + isFieldString(fieldName) || isOptionalFieldString(fieldName) ? FieldString : null; + +export const getFieldStringSchema = (fieldName: string) => { + if (!isFieldString(fieldName) && !isOptionalFieldString(fieldName)) { + return null; + } + + const zodString = z + .string({ invalid_type_error: "Must be a string", required_error: "Required" }) + .trim() + .min(1, "Required"); + + if (isFieldString(fieldName)) { + return zodString; + } + + if (isOptionalFieldString(fieldName)) { + return z.optional(zodString); + } + + return null; +}; + +export default function FieldString({ form, fieldFormName }: FieldProps) { + const prettyLabel = prettyFieldName(fieldFormName); + + return ( + ( + + {prettyLabel} + + + + + + )} + /> + ); +} diff --git a/components/forms/CreateTxForm/Fields/index.ts b/components/forms/CreateTxForm/Fields/index.ts index 65c8cff..abadf20 100644 --- a/components/forms/CreateTxForm/Fields/index.ts +++ b/components/forms/CreateTxForm/Fields/index.ts @@ -1,2 +1,3 @@ export * from "./FieldAddress"; export * from "./FieldAmount"; +export * from "./FieldString"; diff --git a/lib/form.ts b/lib/form.ts index 18daebe..06f3148 100644 --- a/lib/form.ts +++ b/lib/form.ts @@ -3,6 +3,8 @@ import { getFieldAddressSchema, getFieldAmount, getFieldAmountSchema, + getFieldString, + getFieldStringSchema, } from "@/components/forms/CreateTxForm/Fields"; import { FieldSchemaInput } from "@/components/forms/CreateTxForm/Fields/types"; import { z } from "zod"; @@ -16,10 +18,13 @@ export const prettyFieldName = (fieldName: string) => { }; export const getField = (fieldName: string) => - getFieldAddress(fieldName) || getFieldAmount(fieldName) || null; + getFieldAddress(fieldName) || getFieldAmount(fieldName) || getFieldString(fieldName) || null; const getFieldSchema = (fieldName: string, schemaInput: FieldSchemaInput) => - getFieldAddressSchema(fieldName, schemaInput) || getFieldAmountSchema(fieldName) || null; + getFieldAddressSchema(fieldName, schemaInput) || + getFieldAmountSchema(fieldName) || + getFieldStringSchema(fieldName) || + null; export const getMsgSchema = (fieldNames: readonly string[], schemaInput: FieldSchemaInput) => { const fieldEntries = fieldNames.map((fieldName) => [