diff --git a/components/forms/CreateMultisigForm/MemberFormField.tsx b/components/forms/CreateMultisigForm/MemberFormField.tsx index 5c9f428..ea364dc 100644 --- a/components/forms/CreateMultisigForm/MemberFormField.tsx +++ b/components/forms/CreateMultisigForm/MemberFormField.tsx @@ -8,18 +8,25 @@ import { } from "@/components/ui/form"; import { Input } from "@/components/ui/input"; import { ClipboardEventHandler } from "react"; -import { UseFormReturn, useFieldArray } from "react-hook-form"; +import { UseFieldArrayReplace, UseFormReturn } from "react-hook-form"; import { useChains } from "../../../context/ChainsContext"; import { exampleAddress, examplePubkey } from "../../../lib/displayHelpers"; interface MemberFormFieldProps { readonly createMultisigForm: UseFormReturn<{ members: { member: string }[]; threshold: number }>; readonly index: number; + readonly membersReplace: UseFieldArrayReplace< + { members: { member: string }[]; threshold: number }, + "members" + >; } -export default function MemberFormField({ createMultisigForm, index }: MemberFormFieldProps) { +export default function MemberFormField({ + createMultisigForm, + index, + membersReplace, +}: MemberFormFieldProps) { const { chain } = useChains(); - const { replace } = useFieldArray({ name: "members", control: createMultisigForm.control }); const onPaste: ClipboardEventHandler = (ev) => { const rawData = ev.clipboardData.getData("text"); @@ -33,7 +40,7 @@ export default function MemberFormField({ createMultisigForm, index }: MemberFor .map((el) => el.trim()) .filter((el) => el !== ""); - replace(finalValues.map((el) => ({ member: el }))); + membersReplace(finalValues.map((el) => ({ member: el }))); ev.preventDefault(); }; diff --git a/components/forms/CreateMultisigForm/index.tsx b/components/forms/CreateMultisigForm/index.tsx index 0be29c2..5a91588 100644 --- a/components/forms/CreateMultisigForm/index.tsx +++ b/components/forms/CreateMultisigForm/index.tsx @@ -37,6 +37,7 @@ export default function CreateMultisigForm() { fields: membersFields, append: membersAppend, remove: membersRemove, + replace: membersReplace, } = useFieldArray({ name: "members", control: createMultisigForm.control }); const watchedMembers = useWatch({ control: createMultisigForm.control, name: "members" }); @@ -135,6 +136,7 @@ export default function CreateMultisigForm() { key={arrayField.id} createMultisigForm={createMultisigForm} index={index} + membersReplace={membersReplace} /> ))}