From 505a72a704793938dd0de2a914093dd31143873d Mon Sep 17 00:00:00 2001
From: songwongtp <16089160+songwongtp@users.noreply.github.com>
Date: Thu, 10 Aug 2023 11:41:39 +0700
Subject: [PATCH 1/3] fix: json array field

---
 CHANGELOG.md                                  |  1 +
 .../templates/ObjectFieldTemplate.tsx         | 38 ++++++++++++++++---
 src/lib/pages/home/index.tsx                  |  2 +
 3 files changed, 35 insertions(+), 6 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index ae26ce189..05f8b4500 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -68,6 +68,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Bug fixes
 
+- [#470](https://github.com/alleslabs/celatone-frontend/pull/470) Fix json schema array field default behavior
 - [#456](https://github.com/alleslabs/celatone-frontend/pull/456) Fix pool count chip in pool transaction table
 - [#454](https://github.com/alleslabs/celatone-frontend/pull/454) Fix contract selection loading state for other folders
 - [#452](https://github.com/alleslabs/celatone-frontend/pull/452) Fix public project data on the account details and code details page still remains when switching network
diff --git a/src/lib/components/json-schema/templates/ObjectFieldTemplate.tsx b/src/lib/components/json-schema/templates/ObjectFieldTemplate.tsx
index 06617cdfd..b2ab1fa5a 100644
--- a/src/lib/components/json-schema/templates/ObjectFieldTemplate.tsx
+++ b/src/lib/components/json-schema/templates/ObjectFieldTemplate.tsx
@@ -1,7 +1,20 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { Grid, GridItem } from "@chakra-ui/react";
-import type { ObjectFieldTemplateProps } from "@rjsf/utils";
-import { canExpand, getTemplate, getUiOptions } from "@rjsf/utils";
+import type {
+  ObjectFieldTemplatePropertyType,
+  ObjectFieldTemplateProps,
+} from "@rjsf/utils";
+import {
+  canExpand,
+  getSchemaType,
+  getTemplate,
+  getUiOptions,
+} from "@rjsf/utils";
+
+interface ObjectFieldTemplatePropertyTypeWithRequired
+  extends ObjectFieldTemplatePropertyType {
+  required?: boolean;
+}
 
 const ObjectFieldTemplate = <T = any, F = any>(
   props: ObjectFieldTemplateProps<T, F>
@@ -39,8 +52,21 @@ const ObjectFieldTemplate = <T = any, F = any>(
         />
       )}
       <Grid gap={4} my={2}>
-        {properties.map((element, index) =>
-          element.hidden ? (
+        {properties.map((element, index) => {
+          // NOTE: required array field doesn't create an empty array as a default
+          const elementType = getSchemaType(element.content.props.schema);
+          const elementRequired = (
+            element as ObjectFieldTemplatePropertyTypeWithRequired
+          ).required;
+          if (
+            typeof elementType === "string" &&
+            elementType === "array" &&
+            elementRequired &&
+            !(element.name in (formData as Record<string, object>))
+          )
+            (formData as Record<string, object>)[element.name] = [];
+
+          return element.hidden ? (
             element.content
           ) : (
             <GridItem
@@ -48,8 +74,8 @@ const ObjectFieldTemplate = <T = any, F = any>(
             >
               {element.content}
             </GridItem>
-          )
-        )}
+          );
+        })}
         {canExpand<T, F>(schema, uiSchema, formData) && (
           <GridItem justifySelf="flex-end">
             <AddButton
diff --git a/src/lib/pages/home/index.tsx b/src/lib/pages/home/index.tsx
index f83c50f01..e8230e416 100644
--- a/src/lib/pages/home/index.tsx
+++ b/src/lib/pages/home/index.tsx
@@ -7,6 +7,7 @@ import { CURR_THEME } from "env";
 import { useCelatoneApp, useInternalNavigate } from "lib/app-provider";
 import { ConnectWalletAlert } from "lib/components/ConnectWalletAlert";
 import { CustomIcon } from "lib/components/icon";
+import { DummyJsonSchema } from "lib/components/json-schema";
 import PageContainer from "lib/components/PageContainer";
 import { ViewMore } from "lib/components/table";
 import { Tooltip } from "lib/components/Tooltip";
@@ -141,6 +142,7 @@ const Home = () => {
 
   return (
     <PageContainer>
+      <DummyJsonSchema />
       <Flex
         direction="column"
         p={{ base: 3, md: 12 }}

From 9118a0eab17cd23bc999df00a9961ccd82202b51 Mon Sep 17 00:00:00 2001
From: songwongtp <16089160+songwongtp@users.noreply.github.com>
Date: Thu, 10 Aug 2023 11:44:59 +0700
Subject: [PATCH 2/3] fix: remove dummy

---
 src/lib/pages/home/index.tsx | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/lib/pages/home/index.tsx b/src/lib/pages/home/index.tsx
index e8230e416..f83c50f01 100644
--- a/src/lib/pages/home/index.tsx
+++ b/src/lib/pages/home/index.tsx
@@ -7,7 +7,6 @@ import { CURR_THEME } from "env";
 import { useCelatoneApp, useInternalNavigate } from "lib/app-provider";
 import { ConnectWalletAlert } from "lib/components/ConnectWalletAlert";
 import { CustomIcon } from "lib/components/icon";
-import { DummyJsonSchema } from "lib/components/json-schema";
 import PageContainer from "lib/components/PageContainer";
 import { ViewMore } from "lib/components/table";
 import { Tooltip } from "lib/components/Tooltip";
@@ -142,7 +141,6 @@ const Home = () => {
 
   return (
     <PageContainer>
-      <DummyJsonSchema />
       <Flex
         direction="column"
         p={{ base: 3, md: 12 }}

From df4b22efd282cfd8ecddadd791f6c205e4474e4d Mon Sep 17 00:00:00 2001
From: songwongtp <16089160+songwongtp@users.noreply.github.com>
Date: Thu, 10 Aug 2023 13:49:48 +0700
Subject: [PATCH 3/3] fix: if condition isArray

---
 .../components/json-schema/templates/ObjectFieldTemplate.tsx    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/lib/components/json-schema/templates/ObjectFieldTemplate.tsx b/src/lib/components/json-schema/templates/ObjectFieldTemplate.tsx
index b2ab1fa5a..f41476afa 100644
--- a/src/lib/components/json-schema/templates/ObjectFieldTemplate.tsx
+++ b/src/lib/components/json-schema/templates/ObjectFieldTemplate.tsx
@@ -62,7 +62,7 @@ const ObjectFieldTemplate = <T = any, F = any>(
             typeof elementType === "string" &&
             elementType === "array" &&
             elementRequired &&
-            !(element.name in (formData as Record<string, object>))
+            !Array.isArray((formData as Record<string, object>)[element.name])
           )
             (formData as Record<string, object>)[element.name] = [];