jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

🔧 fix(parameterComponent): remove unused imports and variables to improve code cleanliness and readability

Browse source 
🔧 fix(parameterComponent): update useState initial value for dictArr to be an array of objects instead of an empty array
🔧 fix(parameterComponent): update value prop in ParameterInputListComponent to handle cases where data.node!.template[name].value is null or an empty array
🔧 fix(parameterComponent): update onChange prop in ParameterInputListComponent to handle any type of newValue instead of just string[]
🔧 fix(keypairListComponent): update className condition to check if value is null or undefined before checking its length
🔧 fix(editNodeModal): remove unused imports and variables to improve code cleanliness and readability
🔧 fix(editNodeModal): update useState initial value for dictArr to be an array of objects instead of an empty array
🔧 fix(editNodeModal): update value prop in KeypairListComponent to handle cases where myData.node.template[templateParam].value is null or an empty array
🔧 fix(editNodeModal): update onChange prop in KeypairListComponent to handle any type of newValue instead of just string[]
🔧 fix(types): update onChange type in KeyPairListComponentType to accept an array of objects instead of an array of strings
🔧 fix(reactflowUtils): remove unused convertArrayToObj function
This commit is contained in:
Cristhian Zanforlin Lousa 2023-09-15 15:49:37 -03:00
commit ef5a3fb355
5 changed files with 47 additions and 60 deletions
Download patch file Download diff file Expand all files Collapse all files

24
src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
View file

@ -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;
}
}}
/>

4
src/frontend/src/components/keypairListComponent/index.tsx
View file

@ -37,11 +37,11 @@ export default function KeypairListComponent({
return (
<div
className={classNames(
value.length > 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 (
<div key={idx} className="flex w-full gap-3">

39
src/frontend/src/modals/EditNodeModal/index.tsx
View file

@ -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 (
<BaseModal size="large-h-full" open={modalOpen} setOpen={setModalOpen}>
@ -214,19 +205,29 @@ const EditNodeModal = forwardRef(
<div className="mt-2 w-full">
<KeypairListComponent
disabled={disabled}
editNode={true}
value={dictArr}
editNode={false}
value={
myData.node.template[templateParam]
.value?.length === 0 ||
!myData.node.template[templateParam]
.value
? dictArr
: myData.node.template[
templateParam
].value
}
duplicateKey={errorDuplicateKey}
onChange={(newValue: string[]) => {
onChange={(newValue) => {
setErrorDuplicateKey(
hasDuplicateKeys(newValue)
);
if (hasDuplicateKeys(newValue)) {
setDictArr(newValue);
} else {
setDict(
convertArrayToObj(newValue)
);
setDictArr(newValue);
myData.node!.template[
templateParam
].value = newValue;
}
}}
/>

26
src/frontend/src/types/components/index.ts
View file

@ -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 = {

14
src/frontend/src/utils/reactflowUtils.ts
View file

@ -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) {