fixing lint and typecheck errors

Author: GWSzeto

apps/dashboard/src/app/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/BatchMetadata.tsx

@@ -41,7 +41,7 @@ export type UploadMetadataFormValues = NFTMetadataInputLimited & {
   tokenId?: string;
 };
 
-export function BatchMetadataModule(props: ModuleInstanceProps) {
+function BatchMetadataModule(props: ModuleInstanceProps) {
   const { contract, ownerAccount } = props;
 
   const uploadMetadata = useCallback(
@@ -181,10 +181,7 @@ function UploadMetadataNFTSection(props: {
                 )}
               />
 
-              <PropertiesFormControl
-                control={form.control}
-                setValue={form.setValue}
-              />
+              <PropertiesFormControl form={form} />
 
               {/* Advanced options */}
               <Accordion

apps/dashboard/src/app/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/Mintable.tsx

@@ -24,7 +24,6 @@ import { Skeleton } from "@/components/ui/skeleton";
 import { Textarea } from "@/components/ui/textarea";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useMutation } from "@tanstack/react-query";
-import { PropertiesFormControl } from "components/contract-pages/forms/properties.shared";
 import { CircleAlertIcon } from "lucide-react";
 import { useCallback } from "react";
 import { useForm } from "react-hook-form";
@@ -40,6 +39,7 @@ import { ModuleCardUI, type ModuleCardUIProps } from "./module-card";
 import type { ModuleInstanceProps } from "./module-instance";
 import { AdvancedNFTMetadataFormGroup } from "./nft/AdvancedNFTMetadataFormGroup";
 import { NFTMediaFormGroup } from "./nft/NFTMediaFormGroup";
+import { PropertiesFormControl } from "./nft/PropertiesFormControl";
 
 export type UpdateFormValues = {
   primarySaleRecipient: string;
@@ -369,14 +369,7 @@ function MintNFTSection(props: {
                   )}
                 />
 
-                {/* TODO - convert to shadcn + tailwind */}
-                <PropertiesFormControl
-                  watch={form.watch}
-                  errors={form.formState.errors}
-                  control={form.control}
-                  register={form.register}
-                  setValue={form.setValue}
-                />
+                <PropertiesFormControl form={form} />
 
                 {/* Advanced options */}
                 <Accordion

apps/dashboard/src/app/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/OpenEditionMetadata.tsx

@@ -110,7 +110,7 @@ export function OpenEditionMetadataModuleUI(
   );
 }
 
-export function SetSharedMetadataSection(props: {
+function SetSharedMetadataSection(props: {
   setSharedMetadata: (values: SetSharedMetadataFormValues) => Promise<void>;
 }) {
   const form = useForm<SetSharedMetadataFormValues>({

apps/dashboard/src/app/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/module-instance.tsx

@@ -3,7 +3,7 @@
 import { lazy } from "react";
 import type { ThirdwebContract } from "thirdweb";
 import type { Account } from "thirdweb/wallets";
-import { BatchMetadataModule } from "./BatchMetadata";
+import BatchMetadataModule from "./BatchMetadata";
 import ClaimableModule from "./Claimable";
 import OpenEditionMetadataModule from "./OpenEditionMetadata";
 import { ModuleCardUI, type ModuleCardUIProps } from "./module-card";

apps/dashboard/src/app/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/nft/PropertiesFormControl.tsx

@@ -10,6 +10,8 @@ import { BanIcon, PlusIcon, Trash2Icon } from "lucide-react";
 import {
   type ArrayPath,
   type FieldValues,
+  type Path,
+  type PathValue,
   type UseFormReturn,
   useFieldArray,
 } from "react-hook-form";
@@ -29,7 +31,7 @@ export function PropertiesFormControl<
 }: {
   form: UseFormReturn<TFieldValues>;
 }) {
-  const { fields, append, remove, replace } = useFieldArray({
+  const { fields, append, remove } = useFieldArray({
     control: form.control,
     name: "attributes" as ArrayPath<TFieldValues>,
   });
@@ -42,9 +44,15 @@ export function PropertiesFormControl<
           className="flex items-center gap-2"
           variant="destructive"
           size="sm"
-          // biome-ignore lint/suspicious/noExplicitAny: FIXME
           onClick={() =>
-            form.setValue("attributes", [{ trait_type: "", value: "" } as any])
+            form.setValue(
+              "attributes" as Path<TFieldValues>,
+              // biome-ignore lint/suspicious/noExplicitAny: FIXME
+              [{ trait_type: "", value: "" } as any] as PathValue<
+                TFieldValues,
+                Path<TFieldValues>
+              >,
+            )
           }
         >
           Reset
@@ -58,7 +66,7 @@ export function PropertiesFormControl<
           <div className="flex items-start gap-3" key={fieldItem.id}>
             <FormField
               control={form.control}
-              name={`attributes.${index}.trait_type`}
+              name={`attributes.${index}.trait_type` as Path<TFieldValues>}
               render={({ field }) => (
                 <FormItem className="grow">
                   <FormControl>
@@ -71,7 +79,7 @@ export function PropertiesFormControl<
 
             <FormField
               control={form.control}
-              name={`attributes.${index}.value`}
+              name={`attributes.${index}.trait_type` as Path<TFieldValues>}
               render={({ field }) => (
                 <FormItem className="grow">
                   <FormControl>