Merge pull request #56 from alleslabs/fix/offchain-param

Fix/offchain param

CHANGELOG.md

@@ -38,6 +38,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ## Unreleased
 
 ### Features
+
 - [#44](https://github.com/alleslabs/celatone-frontend/pull/44) Render query cmds shortcut in contract detail page
 - [#38](https://github.com/alleslabs/celatone-frontend/pull/38) Show execute msg cmds when wallet is not connected
 - [#49](https://github.com/alleslabs/celatone-frontend/pull/49) Add `develop` branch to `main.yml`
@@ -49,6 +50,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Improvements
 
+- [#56](https://github.com/alleslabs/celatone-frontend/pull/56) Refactor offchain form component by not receiving nameField and descriptionField
 - [#50](https://github.com/alleslabs/celatone-frontend/pull/50) Refactor offchain component to use react-form and remove redundant offchain components, and refactor edit contract details modal
 
 ### Bug fixes

src/lib/components/OffChainForm.tsx

@@ -23,9 +23,6 @@ export interface OffchainDetail {
 }
 
 interface OffChainFormProps<T extends OffchainDetail> {
-  // TODO: find a way to remove nameField and descriptionField
-  nameField: FieldPath<T>;
-  descriptionField: FieldPath<T>;
   state: OffchainDetail;
   control: Control<T>;
   setTagsValue: (options: string[]) => void;
@@ -35,8 +32,6 @@ interface OffChainFormProps<T extends OffchainDetail> {
 }
 
 export const OffChainForm = <T extends OffchainDetail>({
-  nameField,
-  descriptionField,
   state,
   control,
   setTagsValue,
@@ -47,7 +42,7 @@ export const OffChainForm = <T extends OffchainDetail>({
   return (
     <VStack gap="16px" w="full">
       <ControllerInput
-        name={nameField}
+        name={"name" as FieldPath<T>}
         control={control}
         label="Name"
         helperText="Set name for your contract"
@@ -59,7 +54,7 @@ export const OffChainForm = <T extends OffchainDetail>({
         labelBgColor={labelBgColor}
       />
       <ControllerTextarea
-        name={descriptionField}
+        name={"description" as FieldPath<T>}
         control={control}
         label="Description"
         helperText="Help understanding what this contract do and how it works"

src/lib/components/modal/contract/ContractDetailsTemplate.tsx

@@ -87,8 +87,6 @@ export const ContractDetailsTemplate = ({
       otherAction={resetForm}
     >
       <OffChainForm<OffchainDetail>
-        nameField="name"
-        descriptionField="description"
         state={offchainState}
         control={control}
         setTagsValue={setTagsValue}

src/lib/components/modal/contract/SaveNewContract.tsx

@@ -193,8 +193,6 @@ export function SaveNewContract({ list, buttonProps }: SaveNewContractProps) {
         />
 
         <OffChainForm<SaveNewContractDetail>
-          nameField="name"
-          descriptionField="description"
           state={offchainState}
           control={control}
           setTagsValue={setTagsValue}

src/lib/pages/instantiate/component/InstantiateOffchainForm.tsx

@@ -90,8 +90,6 @@ export const InstantiateOffChainForm = observer(
           </Flex>
         )}
         <OffChainForm<OffchainDetail>
-          nameField="name"
-          descriptionField="description"
           state={offchainState}
           control={control}
           setTagsValue={setTagsValue}