From 2e0896eaee6101e6bd8c44c87d5f8d8a699b9efd Mon Sep 17 00:00:00 2001 From: caichi Date: Wed, 18 Dec 2024 15:16:27 +0900 Subject: [PATCH] fix: type and multi default value --- web/src/components/molecules/Content/types.ts | 16 +++++++++ web/src/components/molecules/Schema/types.ts | 8 ++--- .../Project/Content/ContentDetails/hooks.ts | 35 ++++++++++++------- .../Project/Content/ContentDetails/utils.ts | 2 +- 4 files changed, 44 insertions(+), 17 deletions(-) diff --git a/web/src/components/molecules/Content/types.ts b/web/src/components/molecules/Content/types.ts index 6a868033f3..feb0ace2ce 100644 --- 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; + 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 index 4239b207e4..27ec7b41f4 100644 --- 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 index 1df55c5ed0..96d18c4f2b 100644 --- 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>({}); + const [initialFormValues, setInitialFormValues] = useState< + Record + >({}); useEffect(() => { if (itemLoading) return; const handleInitialValuesSet = async () => { - // eslint-disable-next-line @typescript-eslint/no-explicit-any - const initialValues: Record = {}; + const initialValues: Record = {}; 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 index 7f6d92a175..bb31c1a1e8 100644 --- 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 {