From 4ac1326f3a252a698df09df0e3efbd4d78c5f0b7 Mon Sep 17 00:00:00 2001 From: Cristhian Zanforlin Lousa Date: Tue, 27 Jun 2023 23:35:27 -0300 Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix(AccordionComponent):=20remov?= =?UTF-8?q?e=20extra=20whitespace=20in=20AccordionTrigger=20className=20fo?= =?UTF-8?q?r=20consistent=20styling?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ✨ feat(tabsContext): add setTweak and getTweak functions to TabsContext to manage tweak state 🐛 fix(ApiModal): remove unused imports and console.log statements ✨ feat(ApiModal): add functionality to get and set tweak state in TabsContext 🐛 fix(ApiModal): fix key prop warning in map function 🐛 fix(ApiModal): fix unused variable warning ✨ feat(ApiModal): add getValue function to get the value from tweak state or default value 🐛 fix(ApiModal): remove unused onChange functions 🐛 fix(ApiModal): fix key prop warning in map function 🐛 fix(ApiModal): fix unused variable warning ✨ feat(ApiModal): add functionality to get and set tweak state in TabsContext 🐛 fix(ApiModal): remove unused imports and console.log statements ✨ feat(tabsContext): add setTweak and getTweak functions to TabsContext to manage tweak state --- .../components/AccordionComponent/index.tsx | 3 +- src/frontend/src/contexts/tabsContext.tsx | 5 ++ src/frontend/src/modals/ApiModal/index.tsx | 78 ++++++++++++++----- src/frontend/src/types/tabs/index.ts | 2 + 4 files changed, 67 insertions(+), 21 deletions(-) diff --git a/src/frontend/src/components/AccordionComponent/index.tsx b/src/frontend/src/components/AccordionComponent/index.tsx index 1c2b41b46..19a811f87 100644 --- a/src/frontend/src/components/AccordionComponent/index.tsx +++ b/src/frontend/src/components/AccordionComponent/index.tsx @@ -14,10 +14,11 @@ export default function AccordionComponent({ children, }: AccordionComponentType) { + return <> - {trigger} + {trigger} {children} diff --git a/src/frontend/src/contexts/tabsContext.tsx b/src/frontend/src/contexts/tabsContext.tsx index 7637699e3..1cccd4b06 100644 --- a/src/frontend/src/contexts/tabsContext.tsx +++ b/src/frontend/src/contexts/tabsContext.tsx @@ -53,6 +53,8 @@ const TabsContextInitialValue: TabsContextType = { tabsState: {}, setTabsState: (state: TabsState) => {}, getNodeId: (nodeType: string) => "", + setTweak: (tweak: any) => {}, + getTweak: {}, paste: ( selection: { nodes: any; edges: any }, position: { x: number; y: number; paneX?: number; paneY?: number } @@ -73,6 +75,7 @@ export function TabsProvider({ children }: { children: ReactNode }) { const { templates, reactFlowInstance } = useContext(typesContext); const [lastCopiedSelection, setLastCopiedSelection] = useState(null); const [tabsState, setTabsState] = useState({}); + const [getTweak, setTweak] = useState({}); const newNodeId = useRef(uid()); function incrementNodeId() { @@ -634,6 +637,8 @@ export function TabsProvider({ children }: { children: ReactNode }) { tabsState, setTabsState, paste, + getTweak, + setTweak }} > {children} diff --git a/src/frontend/src/modals/ApiModal/index.tsx b/src/frontend/src/modals/ApiModal/index.tsx index 5d4241338..27522ece8 100644 --- a/src/frontend/src/modals/ApiModal/index.tsx +++ b/src/frontend/src/modals/ApiModal/index.tsx @@ -48,6 +48,8 @@ import PromptAreaComponent from "../../components/promptComponent"; import TextAreaComponent from "../../components/textAreaComponent"; import ToggleShadComponent from "../../components/toggleShadComponent"; import ShadTooltip from "../../components/ShadTooltipComponent"; +import { cloneDeep } from "lodash"; +import { TabsContext } from "../../contexts/tabsContext"; export default function ApiModal({ flow }: { flow: FlowType }) { const [open, setOpen] = useState(true); @@ -57,7 +59,7 @@ export default function ApiModal({ flow }: { flow: FlowType }) { const [isCopied, setIsCopied] = useState(false); const [enabled, setEnabled] = useState(null); const tweak = useRef([]); - + const { setTweak, getTweak } = useContext(TabsContext); const copyToClipboard = () => { if (!navigator.clipboard || !navigator.clipboard.writeText) { return; @@ -78,7 +80,6 @@ export default function ApiModal({ flow }: { flow: FlowType }) { } } - const pythonApiCode = getPythonApiCode(flow, tweak.current); const curl_code = getCurlCode(flow, tweak.current); const pythonCode = getPythonCode(flow, tweak.current); @@ -171,8 +172,8 @@ export default function ApiModal({ flow }: { flow: FlowType }) { tabs[0].code = curl_code; tabs[1].code = pythonApiCode; tabs[2].code = pythonCode; - - console.log(tweak.current); + + setTweak(tweak.current); } function buildContent(value) { @@ -184,6 +185,33 @@ export default function ApiModal({ flow }: { flow: FlowType }) { return htmlContent; } + function getValue(value, node, template){ + + let returnValue = value ?? ""; + + 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]; + } + }) + } + } + } + else{ + return value ?? ""; + } + return returnValue; + } + + + return ( @@ -251,7 +279,7 @@ export default function ApiModal({ flow }: { flow: FlowType }) { )} > {flow["data"]["nodes"].map((t: any, index) => ( -
+
@@ -318,7 +346,9 @@ export default function ApiModal({ flow }: { flow: FlowType }) { : t.data.node .template[n].value } - onChange={(k) => {}} + onChange={(k) => { + + }} onAddInput={(k) => { buildTweakObject( t["data"]["id"], @@ -348,7 +378,8 @@ export default function ApiModal({ flow }: { flow: FlowType }) { .template[n] .value ?? "" } - onChange={(k) => {}} + onChange={(k) => { + }} /> @@ -361,8 +392,10 @@ export default function ApiModal({ flow }: { flow: FlowType }) { .password ?? false } value={ - t.data.node.template[n] - .value ?? "" + + getValue(t.data.node.template[n] + .value, t.data, t.data.node.template[n]) + } onChange={(k) => { buildTweakObject( @@ -420,7 +453,6 @@ export default function ApiModal({ flow }: { flow: FlowType }) { .value ?? "" } onChange={(k: any) => { - }} fileTypes={ t.data.node.template[n] @@ -444,8 +476,8 @@ export default function ApiModal({ flow }: { flow: FlowType }) { disabled={false} editNode={true} value={ - t.data.node.template[n] - .value ?? "" + getValue(t.data.node.template[n] + .value, t.data, t.data.node.template[n]) } onChange={(k) => { buildTweakObject( @@ -468,17 +500,21 @@ export default function ApiModal({ flow }: { flow: FlowType }) { t.data.node.template[n] .options } - onSelect={(k) => + onSelect={(k) =>{ + + + buildTweakObject( t["data"]["id"], k, t.data.node.template[n] ) } + + } value={ - t.data.node.template[n] - .value ?? - "Choose an option" + getValue(t.data.node.template[n] + .value, t.data, t.data.node.template[n]) } > @@ -489,8 +525,8 @@ export default function ApiModal({ flow }: { flow: FlowType }) { disabled={false} editNode={true} value={ - t.data.node.template[n] - .value ?? "" + getValue(t.data.node.template[n] + .value, t.data, t.data.node.template[n]) } onChange={(k) => { buildTweakObject( @@ -518,7 +554,8 @@ export default function ApiModal({ flow }: { flow: FlowType }) { t.data.node.template[n] .value ?? "" } - onChange={(k) => {}} + onChange={(k) => { + }} /> @@ -539,7 +576,8 @@ export default function ApiModal({ flow }: { flow: FlowType }) { t.data.node.template[n] .value ?? "" } - onChange={(k) => {}} + onChange={(k) => { + }} /> diff --git a/src/frontend/src/types/tabs/index.ts b/src/frontend/src/types/tabs/index.ts index 55829d6ca..8f823535c 100644 --- a/src/frontend/src/types/tabs/index.ts +++ b/src/frontend/src/types/tabs/index.ts @@ -28,6 +28,8 @@ export type TabsContextType = { ) => void; lastCopiedSelection: { nodes: any; edges: any }; setLastCopiedSelection: (selection: { nodes: any; edges: any }) => void; + setTweak: (tweak: any) => void; + getTweak: any; }; export type TabsState = {