fix: type and multi default value

reearth · Dec 18, 2024 · 2e0896e · 2e0896e
1 parent 8dbb8dc
commit 2e0896e
Show file tree

Hide file tree

Showing 4 changed files with 44 additions and 17 deletions.
diff --git a/web/src/components/molecules/Content/types.ts b/web/src/components/molecules/Content/types.ts
@@ -1,9 +1,25 @@
+import { type Dayjs } from "dayjs";
+
 import { User } from "@reearth-cms/components/molecules/AccountSettings/types";
 import { Request } from "@reearth-cms/components/molecules/Request/types";
 import { FieldType } from "@reearth-cms/components/molecules/Schema/types";
 
 export type ItemStatus = "DRAFT" | "PUBLIC" | "REVIEW" | "PUBLIC_REVIEW" | "PUBLIC_DRAFT";
 
+export type FormValue =
+  | string
+  | string[]
+  | number
+  | number[]
+  | boolean
+  | boolean[]
+  | Dayjs
+  | ("" | Dayjs)[]
+  | null
+  | undefined;
+
+export type FormGroupValue = Record<string, FormValue>;
+
 export type ItemValue = string | string[] | number | number[] | boolean | boolean[];
 
 export type ItemField = {

diff --git a/web/src/components/molecules/Schema/types.ts b/web/src/components/molecules/Schema/types.ts
@@ -81,11 +81,11 @@ export type CorrespondingField = {
 };
 
 export type TypeProperty = {
-  defaultValue?: string | boolean | string[] | boolean[];
+  defaultValue?: string | string[] | boolean | boolean[] | null;
   maxLength?: number;
-  assetDefaultValue?: string;
-  selectDefaultValue?: string | string[];
-  integerDefaultValue?: number;
+  assetDefaultValue?: string | string[] | null;
+  selectDefaultValue?: string | string[] | null;
+  integerDefaultValue?: number | number[] | null;
   min?: number;
   max?: number;
   numberMin?: number;

diff --git a/web/src/components/organisms/Project/Content/ContentDetails/hooks.ts b/web/src/components/organisms/Project/Content/ContentDetails/hooks.ts
@@ -4,6 +4,8 @@ import { useLocation, useNavigate, useParams } from "react-router-dom";
 import Notification from "@reearth-cms/components/atoms/Notification";
 import { User } from "@reearth-cms/components/molecules/AccountSettings/types";
 import {
+  FormValue,
+  FormGroupValue,
   FormItem,
   Item,
   ItemStatus,
@@ -366,18 +368,27 @@ export default () => {
   );
 
   const valueGet = useCallback((field: Field) => {
+    let result: FormValue;
     switch (field.type) {
       case "Select":
-        return field.typeProperty?.selectDefaultValue;
+        result = field.typeProperty?.selectDefaultValue;
+        break;
       case "Integer":
-        return field.typeProperty?.integerDefaultValue;
+        result = field.typeProperty?.integerDefaultValue;
+        break;
       case "Asset":
-        return field.typeProperty?.assetDefaultValue;
+        result = field.typeProperty?.assetDefaultValue;
+        break;
       case "Date":
-        return dateConvert(field.typeProperty?.defaultValue);
+        result = dateConvert(field.typeProperty?.defaultValue);
+        break;
       default:
-        return field.typeProperty?.defaultValue;
+        result = field.typeProperty?.defaultValue;
     }
+    if (field.multiple && !result) {
+      result = [];
+    }
+    return result;
   }, []);
 
   const updateValueConvert = useCallback(({ type, value }: ItemField) => {
@@ -394,18 +405,18 @@ export default () => {
     }
   }, []);
 
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const [initialFormValues, setInitialFormValues] = useState<Record<string, any>>({});
+  const [initialFormValues, setInitialFormValues] = useState<
+    Record<string, FormValue | FormGroupValue>
+  >({});
 
   useEffect(() => {
     if (itemLoading) return;
     const handleInitialValuesSet = async () => {
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const initialValues: Record<string, any> = {};
+      const initialValues: Record<string, FormValue | FormGroupValue> = {};
       const groupInitialValuesUpdate = (group: Group, itemGroupId: string) => {
         group?.schema?.fields?.forEach(field => {
           initialValues[field.id] = {
-            ...initialValues[field.id],
+            ...(initialValues[field.id] as FormGroupValue),
             ...{ [itemGroupId]: valueGet(field) },
           };
         });
@@ -415,7 +426,7 @@ export default () => {
         currentItem?.fields?.forEach(field => {
           if (field.itemGroupId) {
             initialValues[field.schemaFieldId] = {
-              ...initialValues[field.schemaFieldId],
+              ...(initialValues[field.schemaFieldId] as FormGroupValue),
               ...{ [field.itemGroupId]: updateValueConvert(field) },
             };
           } else {
@@ -549,7 +560,7 @@ export default () => {
   const handleCheckItemReference = useCallback(
     async (itemId: string, correspondingFieldId: string, groupId?: string) => {
       const initialValue = groupId
-        ? initialFormValues[groupId][correspondingFieldId]
+        ? (initialFormValues[groupId] as FormGroupValue)[correspondingFieldId]
         : initialFormValues[correspondingFieldId];
       if (initialValue === itemId) {
         return false;

diff --git a/web/src/components/organisms/Project/Content/ContentDetails/utils.ts b/web/src/components/organisms/Project/Content/ContentDetails/utils.ts
@@ -2,7 +2,7 @@ import dayjs from "dayjs";
 
 import { ItemValue } from "@reearth-cms/components/molecules/Content/types";
 
-export function dateConvert(value?: ItemValue) {
+export function dateConvert(value?: ItemValue | null) {
   if (Array.isArray(value)) {
     return (value as string[]).map(valueItem => (valueItem ? dayjs(valueItem) : ""));
   } else {