From ef5a3fb3552350e763550c39e59ad83c88ce2681 Mon Sep 17 00:00:00 2001 From: Cristhian Zanforlin Lousa Date: Fri, 15 Sep 2023 15:49:37 -0300 Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A7=20fix(parameterComponent):=20remov?= =?UTF-8?q?e=20unused=20imports=20and=20variables=20to=20improve=20code=20?= =?UTF-8?q?cleanliness=20and=20readability=20=F0=9F=94=A7=20fix(parameterC?= =?UTF-8?q?omponent):=20update=20useState=20initial=20value=20for=20dictAr?= =?UTF-8?q?r=20to=20be=20an=20array=20of=20objects=20instead=20of=20an=20e?= =?UTF-8?q?mpty=20array=20=F0=9F=94=A7=20fix(parameterComponent):=20update?= =?UTF-8?q?=20value=20prop=20in=20ParameterInputListComponent=20to=20handl?= =?UTF-8?q?e=20cases=20where=20data.node!.template[name].value=20is=20null?= =?UTF-8?q?=20or=20an=20empty=20array=20=F0=9F=94=A7=20fix(parameterCompon?= =?UTF-8?q?ent):=20update=20onChange=20prop=20in=20ParameterInputListCompo?= =?UTF-8?q?nent=20to=20handle=20any=20type=20of=20newValue=20instead=20of?= =?UTF-8?q?=20just=20string[]=20=F0=9F=94=A7=20fix(keypairListComponent):?= =?UTF-8?q?=20update=20className=20condition=20to=20check=20if=20value=20i?= =?UTF-8?q?s=20null=20or=20undefined=20before=20checking=20its=20length=20?= =?UTF-8?q?=F0=9F=94=A7=20fix(editNodeModal):=20remove=20unused=20imports?= =?UTF-8?q?=20and=20variables=20to=20improve=20code=20cleanliness=20and=20?= =?UTF-8?q?readability=20=F0=9F=94=A7=20fix(editNodeModal):=20update=20use?= =?UTF-8?q?State=20initial=20value=20for=20dictArr=20to=20be=20an=20array?= =?UTF-8?q?=20of=20objects=20instead=20of=20an=20empty=20array=20?= =?UTF-8?q?=F0=9F=94=A7=20fix(editNodeModal):=20update=20value=20prop=20in?= =?UTF-8?q?=20KeypairListComponent=20to=20handle=20cases=20where=20myData.?= =?UTF-8?q?node.template[templateParam].value=20is=20null=20or=20an=20empt?= =?UTF-8?q?y=20array=20=F0=9F=94=A7=20fix(editNodeModal):=20update=20onCha?= =?UTF-8?q?nge=20prop=20in=20KeypairListComponent=20to=20handle=20any=20ty?= =?UTF-8?q?pe=20of=20newValue=20instead=20of=20just=20string[]=20?= =?UTF-8?q?=F0=9F=94=A7=20fix(types):=20update=20onChange=20type=20in=20Ke?= =?UTF-8?q?yPairListComponentType=20to=20accept=20an=20array=20of=20object?= =?UTF-8?q?s=20instead=20of=20an=20array=20of=20strings=20=F0=9F=94=A7=20f?= =?UTF-8?q?ix(reactflowUtils):=20remove=20unused=20convertArrayToObj=20fun?= =?UTF-8?q?ction?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/parameterComponent/index.tsx | 24 ++++++------ .../components/keypairListComponent/index.tsx | 4 +- .../src/modals/EditNodeModal/index.tsx | 39 ++++++++++--------- src/frontend/src/types/components/index.ts | 26 ++++++------- src/frontend/src/utils/reactflowUtils.ts | 14 ------- 5 files changed, 47 insertions(+), 60 deletions(-) diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx index 5be56e31c..3bb92d34e 100644 --- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx @@ -27,8 +27,6 @@ import { typesContext } from "../../../../contexts/typesContext"; import { ParameterComponentType } from "../../../../types/components"; import { TabsState } from "../../../../types/tabs"; import { - convertArrayToObj, - convertObjToArray, hasDuplicateKeys, isValidConnection, } from "../../../../utils/reactflowUtils"; @@ -113,10 +111,9 @@ export default function ParameterComponent({ }); const [errorDuplicateKey, setErrorDuplicateKey] = useState(false); - const [dict, setDict] = useState({ - yourKey: "yourValue", - } as {}); - const [dictArr, setDictArr] = useState([] as string[]); + const [dictArr, setDictArr] = useState([ + { yourKey: "yourValue" }, + ] as Object[]); useEffect(() => { if (name === "openai_api_base") console.log(info); @@ -384,18 +381,21 @@ export default function ParameterComponent({ disabled={disabled} editNode={false} value={ - convertObjToArray(data.node!.template[name].value).length === 0 - ? convertObjToArray(dict) - : convertObjToArray(data.node!.template[name].value) + data.node!.template[name].value?.length === 0 || + !data.node!.template[name].value + ? dictArr + : data.node!.template[name].value } duplicateKey={errorDuplicateKey} - onChange={(newValue: string[]) => { + onChange={(newValue) => { setErrorDuplicateKey(hasDuplicateKeys(newValue)); if (hasDuplicateKeys(newValue)) { setDictArr(newValue); } else { - setDict(convertArrayToObj(newValue)); - data.node!.template[name].value = convertArrayToObj(newValue); + setDictArr(newValue); + console.log(newValue); + + data.node!.template[name].value = newValue; } }} /> diff --git a/src/frontend/src/components/keypairListComponent/index.tsx b/src/frontend/src/components/keypairListComponent/index.tsx index f33c3aa2b..580de2cfd 100644 --- a/src/frontend/src/components/keypairListComponent/index.tsx +++ b/src/frontend/src/components/keypairListComponent/index.tsx @@ -37,11 +37,11 @@ export default function KeypairListComponent({ return (
1 && editNode ? "my-1" : "", + value?.length > 1 && editNode ? "my-1" : "", "flex flex-col gap-3" )} > - {value.map((obj, index) => { + {value?.map((obj, index) => { return Object.keys(obj).map((key, idx) => { return (
diff --git a/src/frontend/src/modals/EditNodeModal/index.tsx b/src/frontend/src/modals/EditNodeModal/index.tsx index abc9e0aff..390904ef4 100644 --- a/src/frontend/src/modals/EditNodeModal/index.tsx +++ b/src/frontend/src/modals/EditNodeModal/index.tsx @@ -28,11 +28,7 @@ import { TabsContext } from "../../contexts/tabsContext"; import { typesContext } from "../../contexts/typesContext"; import { NodeDataType } from "../../types/flow"; import { TabsState } from "../../types/tabs"; -import { - convertArrayToObj, - convertObjToArray, - hasDuplicateKeys, -} from "../../utils/reactflowUtils"; +import { hasDuplicateKeys } from "../../utils/reactflowUtils"; import { classNames } from "../../utils/utils"; import BaseModal from "../baseModal"; @@ -100,14 +96,9 @@ const EditNodeModal = forwardRef( }); const [errorDuplicateKey, setErrorDuplicateKey] = useState(false); - const [dict, setDict] = useState({ - yourKey: "yourValue", - } as {}); - const [dictArr, setDictArr] = useState([] as string[]); - - useEffect(() => { - setDictArr(convertObjToArray(dict)); - }, [dict]); + const [dictArr, setDictArr] = useState([ + { yourKey: "yourValue" }, + ] as Object[]); return ( @@ -214,19 +205,29 @@ const EditNodeModal = forwardRef(
{ + onChange={(newValue) => { setErrorDuplicateKey( hasDuplicateKeys(newValue) ); if (hasDuplicateKeys(newValue)) { setDictArr(newValue); } else { - setDict( - convertArrayToObj(newValue) - ); + setDictArr(newValue); + myData.node!.template[ + templateParam + ].value = newValue; } }} /> diff --git a/src/frontend/src/types/components/index.ts b/src/frontend/src/types/components/index.ts index e63a21482..3749a80c7 100644 --- a/src/frontend/src/types/components/index.ts +++ b/src/frontend/src/types/components/index.ts @@ -56,7 +56,7 @@ export type InputListComponentType = { export type KeyPairListComponentType = { value: any; - onChange: (value: string[]) => void; + onChange: (value: Object[]) => void; disabled: boolean; editNode?: boolean; duplicateKey?: boolean; @@ -123,18 +123,18 @@ export type TooltipComponentType = { children: ReactElement; title: string | ReactElement; placement?: - | "bottom-end" - | "bottom-start" - | "bottom" - | "left-end" - | "left-start" - | "left" - | "right-end" - | "right-start" - | "right" - | "top-end" - | "top-start" - | "top"; + | "bottom-end" + | "bottom-start" + | "bottom" + | "left-end" + | "left-start" + | "left" + | "right-end" + | "right-start" + | "right" + | "top-end" + | "top-start" + | "top"; }; export type ProgressBarType = { diff --git a/src/frontend/src/utils/reactflowUtils.ts b/src/frontend/src/utils/reactflowUtils.ts index 250ce4054..07f289132 100644 --- a/src/frontend/src/utils/reactflowUtils.ts +++ b/src/frontend/src/utils/reactflowUtils.ts @@ -298,23 +298,9 @@ export function convertObjToArray(singleObject) { arrConverted.push(newObj); } } - return arrConverted; } -export function convertArrayToObj(newValue) { - const flattenedObject = {}; - for (const obj of newValue) { - for (const key in obj) { - if (obj.hasOwnProperty(key)) { - flattenedObject[key] = obj[key]; //added space to dont order when add new keys to object - } - } - } - let newData = _.cloneDeep(flattenedObject); - return newData; -} - export function hasDuplicateKeys(array) { const keys = {}; for (const obj of array) {