diff --git a/src/frontend/package-lock.json b/src/frontend/package-lock.json index 1c185a3b9..a4128b48e 100644 --- a/src/frontend/package-lock.json +++ b/src/frontend/package-lock.json @@ -3563,7 +3563,7 @@ "version": "16.18.12", "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.12.tgz", "integrity": "sha512-vzLe5NaNMjIE3mcddFVGlAXN1LEWueUsMsOJWaT6wWMJGyljHAWHznqfnKUQWGzu7TLPrGvWdNAsvQYW+C0xtw==", - "devOptional": true + "dev": true }, "node_modules/@types/parse-json": { "version": "4.0.0", @@ -5633,6 +5633,7 @@ "version": "2.3.2", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", + "dev": true, "hasInstallScript": true, "optional": true, "os": [ @@ -6992,9 +6993,9 @@ } }, "node_modules/log-symbols/node_modules/chalk": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.2.0.tgz", - "integrity": "sha512-ree3Gqw/nazQAPuJJEy+avdl7QfZMcUvmHIKgEZkGL+xOBzRvup5Hxo6LHuMceSxOabuJLJm5Yp/92R9eMmMvA==", + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.3.0.tgz", + "integrity": "sha512-dLitG79d+GV1Nb/VYcCDFivJeK1hiukt9QjRNVOsUtTy1rR1YJsmpGGTZ3qJos+uw7WmWF4wUwBd9jxjocFC2w==", "engines": { "node": "^12.17.0 || ^14.13 || >=16.0.0" }, @@ -8262,9 +8263,9 @@ } }, "node_modules/ora/node_modules/chalk": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.2.0.tgz", - "integrity": "sha512-ree3Gqw/nazQAPuJJEy+avdl7QfZMcUvmHIKgEZkGL+xOBzRvup5Hxo6LHuMceSxOabuJLJm5Yp/92R9eMmMvA==", + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.3.0.tgz", + "integrity": "sha512-dLitG79d+GV1Nb/VYcCDFivJeK1hiukt9QjRNVOsUtTy1rR1YJsmpGGTZ3qJos+uw7WmWF4wUwBd9jxjocFC2w==", "engines": { "node": "^12.17.0 || ^14.13 || >=16.0.0" }, diff --git a/src/frontend/src/components/AccordionComponent/index.tsx b/src/frontend/src/components/AccordionComponent/index.tsx index c1174269a..825a2c19d 100644 --- a/src/frontend/src/components/AccordionComponent/index.tsx +++ b/src/frontend/src/components/AccordionComponent/index.tsx @@ -15,9 +15,21 @@ import { export default function AccordionComponent({ trigger, children, - open = false, + open = [], }: AccordionComponentType) { - const [value, setValue] = useState(!open ? "" : trigger); + const [value, setValue] = useState(open.length == 0 ? "" : getOpenAccordion()); + + function getOpenAccordion(){ + let value = ""; + open.forEach(el => { + if(el == trigger){ + value = trigger; + } + }) + + return value; + } + function handleClick() { value == "" ? setValue(trigger) : setValue(""); } diff --git a/src/frontend/src/constants.tsx b/src/frontend/src/constants.tsx index 4aee27d83..9bfb4bcd5 100644 --- a/src/frontend/src/constants.tsx +++ b/src/frontend/src/constants.tsx @@ -71,7 +71,7 @@ FLOW_ID = "${flowId}" # You can tweak the flow by adding a tweaks dictionary # e.g {"OpenAI-XXXXX": {"model_name": "gpt-4"}} TWEAKS = ${ - tweak && tweak.length > 0 ? JSON.stringify(tweak, null, 2) : JSON.stringify(tweaks, null, 2) + tweak && tweak.length > 0 ? JSON.stringify(tweak, null, 2).replace(/\\/g, '') : JSON.stringify(tweaks, null, 2) } def run_flow(message: str, flow_id: str, tweaks: dict = None) -> dict: @@ -111,7 +111,7 @@ export const getCurlCode = (flow: FlowType, tweak?): string => { }/api/v1/process/${flowId} \\ -H 'Content-Type: application/json' \\ -d '{"inputs": {"input": message}, "tweaks": ${ - tweak && tweak.length > 0 ? JSON.stringify(tweak, null, 2) : JSON.stringify(tweaks, null, 2) + tweak && tweak.length > 0 ? JSON.stringify(tweak, null, 2).replace(/\\/g, '') : JSON.stringify(tweaks, null, 2) }}'`; }; /** @@ -124,7 +124,7 @@ export const getPythonCode = (flow: FlowType, tweak?): string => { const tweaks = buildTweaks(flow); return `from langflow import load_flow_from_json TWEAKS = ${ - tweak && tweak.length > 0 ? JSON.stringify(tweak, null, 2) : JSON.stringify(tweaks, null, 2) + tweak && tweak.length > 0 ? JSON.stringify(tweak, null, 2).replace(/\\/g, '') : JSON.stringify(tweaks, null, 2) } flow = load_flow_from_json("${flowName}.json", tweaks=TWEAKS) # Now you can use it like any chain diff --git a/src/frontend/src/modals/ApiModal/index.tsx b/src/frontend/src/modals/ApiModal/index.tsx index 1000a52d6..6f0014f33 100644 --- a/src/frontend/src/modals/ApiModal/index.tsx +++ b/src/frontend/src/modals/ApiModal/index.tsx @@ -58,7 +58,7 @@ export default function ApiModal({ flow }: { flow: FlowType }) { const [activeTab, setActiveTab] = useState("0"); const [isCopied, setIsCopied] = useState(false); const [enabled, setEnabled] = useState(null); - const [openAccordion, setOpenAccordion] = useState(false); + const [openAccordion, setOpenAccordion] = useState([]); const tweak = useRef([]); const tweaksList = useRef([]); const { setTweak, getTweak } = useContext(TabsContext); @@ -87,8 +87,11 @@ export default function ApiModal({ flow }: { flow: FlowType }) { useEffect(() => { if (closeEdit !== "") { setActiveTab("3"); - setOpenAccordion(true); tweak.current = getTweak; + openAccordions(); + } + else{ + startTweaks(); } }, [closeEdit]); @@ -100,6 +103,11 @@ export default function ApiModal({ flow }: { flow: FlowType }) { useEffect(() => { filterNodes(); }, []); + + function startTweaks() { + tweak.current.push(buildTweaks(flow)); + } + function filterNodes() { let arrNodesWithValues = []; @@ -176,25 +184,13 @@ export default function ApiModal({ flow }: { flow: FlowType }) { if (existingTweak) { existingTweak[tw][template["name"]] = changes; - if (template.list === true) { - if (changes.length === 0) { - if (existingTweak[tw] && existingTweak[tw][template["name"]]) { - delete existingTweak[tw][template["name"]]; - } - } - } - if (existingTweak[tw][template["name"]] == template.value) { tweak.current.forEach((element) => { - if (element[tw] && element[tw][template["name"]]) { - delete element[tw][template["name"]]; - } if (element[tw] && Object.keys(element[tw])?.length === 0) { tweak.current = tweak.current.filter((obj) => { const prop = obj[Object.keys(obj)[0]].prop; return prop !== undefined && prop !== null && prop !== ""; }); - delete element[tw]; } }); } @@ -205,6 +201,7 @@ export default function ApiModal({ flow }: { flow: FlowType }) { }, }; tweak.current.push(newTweak); + } const pythonApiCode = getPythonApiCode(flow, tweak.current); @@ -232,17 +229,16 @@ export default function ApiModal({ flow }: { flow: FlowType }) { if (getTweak.length > 0) { for (const obj of getTweak) { - // Obtém a chave do objeto interno - const key = Object.keys(obj)[0]; - // Obtém o valor do objeto interno - const value = obj[key]; - if (key == node["id"]) { - Object.keys(value).forEach((key) => { - if (key == template["name"]) { - returnValue = value[key]; - } - }); - } + Object.keys(obj).forEach(key =>{ + const value = obj[key]; + if (key == node["id"]) { + Object.keys(value).forEach((key) => { + if (key == template["name"]) { + returnValue = value[key]; + } + }); + } + }) } } else { return value ?? ""; @@ -250,6 +246,18 @@ export default function ApiModal({ flow }: { flow: FlowType }) { return returnValue; } + function openAccordions(){ + let accordionsToOpen = []; + tweak.current.forEach((el) => { + Object.keys(el).forEach((key) => { + if (Object.keys(el[key]).length > 0) { + accordionsToOpen.push(key) + setOpenAccordion(accordionsToOpen); + } + }); + }); + } + return ( @@ -270,9 +278,8 @@ export default function ApiModal({ flow }: { flow: FlowType }) { className="w-full h-full overflow-hidden text-center bg-muted rounded-md border" onValueChange={(value) => { setActiveTab(value); - - if (tweak.current.length > 0) { - setOpenAccordion(true); + if(value === "3"){ + openAccordions() } }} > diff --git a/src/frontend/src/types/components/index.ts b/src/frontend/src/types/components/index.ts index 4c936cabe..347554682 100644 --- a/src/frontend/src/types/components/index.ts +++ b/src/frontend/src/types/components/index.ts @@ -121,6 +121,6 @@ export type RadialProgressType = { export type AccordionComponentType = { children?: ReactElement; - open?: boolean; + open?: string[]; trigger?: string; }; \ No newline at end of file