🐛 fix(ApiModal/index.tsx): import the 'filter' function from lodash to fix missing reference error
✨ feat(ApiModal/index.tsx): add functionality to filter nodes and display only nodes with certain types in the tweaks list 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the tweaks list not updating when the flow changes 🐛 fix(ApiModal/index.tsx): fix issue with the
This commit is contained in:
Cristhian Zanforlin Lousa
parent
ab0fcc9cb0
commit
4f0d928a57
1 changed files with 73 additions and 17 deletions
|
|
@ -48,7 +48,7 @@ import PromptAreaComponent from "../../components/promptComponent";
|
||||||
import TextAreaComponent from "../../components/textAreaComponent";
|
import TextAreaComponent from "../../components/textAreaComponent";
|
||||||
import ToggleShadComponent from "../../components/toggleShadComponent";
|
import ToggleShadComponent from "../../components/toggleShadComponent";
|
||||||
import ShadTooltip from "../../components/ShadTooltipComponent";
|
import ShadTooltip from "../../components/ShadTooltipComponent";
|
||||||
import { cloneDeep } from "lodash";
|
import { cloneDeep, filter } from "lodash";
|
||||||
import { TabsContext } from "../../contexts/tabsContext";
|
import { TabsContext } from "../../contexts/tabsContext";
|
||||||
|
|
||||||
export default function ApiModal({ flow }: { flow: FlowType }) {
|
export default function ApiModal({ flow }: { flow: FlowType }) {
|
||||||
|
|
@ -60,6 +60,7 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
|
||||||
const [enabled, setEnabled] = useState(null);
|
const [enabled, setEnabled] = useState(null);
|
||||||
const [openAccordion, setOpenAccordion] = useState(false);
|
const [openAccordion, setOpenAccordion] = useState(false);
|
||||||
const tweak = useRef([]);
|
const tweak = useRef([]);
|
||||||
|
const tweaksList = useRef([]);
|
||||||
const { setTweak, getTweak } = useContext(TabsContext);
|
const { setTweak, getTweak } = useContext(TabsContext);
|
||||||
const copyToClipboard = () => {
|
const copyToClipboard = () => {
|
||||||
if (!navigator.clipboard || !navigator.clipboard.writeText) {
|
if (!navigator.clipboard || !navigator.clipboard.writeText) {
|
||||||
|
|
@ -91,11 +92,54 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
|
||||||
}
|
}
|
||||||
}, [closeEdit]);
|
}, [closeEdit]);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const pythonApiCode = getPythonApiCode(flow, tweak.current);
|
const pythonApiCode = getPythonApiCode(flow, tweak.current);
|
||||||
const curl_code = getCurlCode(flow, tweak.current);
|
const curl_code = getCurlCode(flow, tweak.current);
|
||||||
const pythonCode = getPythonCode(flow, tweak.current);
|
const pythonCode = getPythonCode(flow, tweak.current);
|
||||||
const tweaksCode = buildTweaks(flow);
|
const tweaksCode = buildTweaks(flow);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
filterNodes();
|
||||||
|
|
||||||
|
}, [])
|
||||||
|
function filterNodes(){
|
||||||
|
|
||||||
|
let arrNodesWithValues = [];
|
||||||
|
|
||||||
|
flow["data"]["nodes"].forEach(t => {
|
||||||
|
|
||||||
|
Object.keys(t['data']['node']['template']).filter(
|
||||||
|
(n) =>
|
||||||
|
n.charAt(0) !== "_" &&
|
||||||
|
t.data.node.template[n].show &&
|
||||||
|
(t.data.node.template[n].type ===
|
||||||
|
"str" ||
|
||||||
|
t.data.node.template[n].type ===
|
||||||
|
"bool" ||
|
||||||
|
t.data.node.template[n].type ===
|
||||||
|
"float" ||
|
||||||
|
t.data.node.template[n].type ===
|
||||||
|
"code" ||
|
||||||
|
t.data.node.template[n].type ===
|
||||||
|
"prompt" ||
|
||||||
|
t.data.node.template[n].type ===
|
||||||
|
"file" ||
|
||||||
|
t.data.node.template[n].type ===
|
||||||
|
"int")
|
||||||
|
)
|
||||||
|
.map((n, i) => {
|
||||||
|
arrNodesWithValues.push(t['id'])
|
||||||
|
})
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
tweaksList.current = arrNodesWithValues.filter((value, index, self) => {
|
||||||
|
return self.indexOf(value) === index;
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
const tabs = [
|
const tabs = [
|
||||||
{
|
{
|
||||||
name: "cURL",
|
name: "cURL",
|
||||||
|
|
@ -238,9 +282,9 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
|
||||||
value={activeTab}
|
value={activeTab}
|
||||||
className="w-full h-full overflow-hidden text-center bg-muted rounded-md border"
|
className="w-full h-full overflow-hidden text-center bg-muted rounded-md border"
|
||||||
onValueChange={(value) => {
|
onValueChange={(value) => {
|
||||||
setActiveTab(value)
|
setActiveTab(value);
|
||||||
|
|
||||||
if(tweak.current.length > 0){
|
if (tweak.current.length > 0) {
|
||||||
setOpenAccordion(true);
|
setOpenAccordion(true);
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
|
|
@ -293,6 +337,12 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
|
||||||
>
|
>
|
||||||
{flow["data"]["nodes"].map((t: any, index) => (
|
{flow["data"]["nodes"].map((t: any, index) => (
|
||||||
<div className="px-3" key={index}>
|
<div className="px-3" key={index}>
|
||||||
|
{(
|
||||||
|
|
||||||
|
|
||||||
|
tweaksList.current.includes(t["data"]["id"]) &&
|
||||||
|
|
||||||
|
|
||||||
<AccordionComponent
|
<AccordionComponent
|
||||||
trigger={t["data"]["id"]}
|
trigger={t["data"]["id"]}
|
||||||
open={openAccordion}
|
open={openAccordion}
|
||||||
|
|
@ -331,7 +381,7 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
|
||||||
"int")
|
"int")
|
||||||
)
|
)
|
||||||
.map((n, i) => {
|
.map((n, i) => {
|
||||||
// console.log(t.data.node.template[n]);
|
//console.log(t.data.node.template[n]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<TableRow
|
<TableRow
|
||||||
|
|
@ -375,16 +425,14 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
|
||||||
/>
|
/>
|
||||||
) : t.data.node.template[n]
|
) : t.data.node.template[n]
|
||||||
.multiline ? (
|
.multiline ? (
|
||||||
<ShadTooltip
|
<ShadTooltip
|
||||||
delayDuration={1000}
|
delayDuration={1000}
|
||||||
content={buildContent(
|
content={buildContent(
|
||||||
t.data.node.template[
|
t.data.node.template[n]
|
||||||
n
|
.value
|
||||||
].value
|
)}
|
||||||
)}
|
>
|
||||||
>
|
<div>
|
||||||
<div>
|
|
||||||
|
|
||||||
<TextAreaComponent
|
<TextAreaComponent
|
||||||
disabled={false}
|
disabled={false}
|
||||||
editNode={true}
|
editNode={true}
|
||||||
|
|
@ -405,9 +453,8 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
|
||||||
);
|
);
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</ShadTooltip>
|
</ShadTooltip>
|
||||||
|
|
||||||
) : (
|
) : (
|
||||||
<InputComponent
|
<InputComponent
|
||||||
editNode={true}
|
editNode={true}
|
||||||
|
|
@ -648,6 +695,15 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
|
||||||
</Table>
|
</Table>
|
||||||
</div>
|
</div>
|
||||||
</AccordionComponent>
|
</AccordionComponent>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{(
|
||||||
|
tweaksList.current.length === 0 &&
|
||||||
|
<>
|
||||||
|
<div className="pt-3">No tweaks are available for this flow.</div>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue