format code and fix merge errors generated after conflict
This commit is contained in:
anovazzi1
parent
303387a3ec
commit
fccb004248
13 changed files with 439 additions and 277 deletions
|
|
@ -69,7 +69,8 @@ export default function ParameterComponent({
|
|||
|
||||
const { reactFlowInstance } = useContext(typesContext);
|
||||
let disabled =
|
||||
reactFlowInstance?.getEdges().some((edge) => edge.targetHandle === id) ?? false;
|
||||
reactFlowInstance?.getEdges().some((edge) => edge.targetHandle === id) ??
|
||||
false;
|
||||
|
||||
const { data: myData } = useContext(typesContext);
|
||||
|
||||
|
|
|
|||
|
|
@ -166,8 +166,9 @@ export default function GenericNode({
|
|||
!data.node.template[templateName].advanced ? (
|
||||
<ParameterComponent
|
||||
key={
|
||||
(data.node.template[templateName].input_types?.join(";") ??
|
||||
data.node.template[templateName].type) +
|
||||
(data.node.template[templateName].input_types?.join(
|
||||
";"
|
||||
) ?? data.node.template[templateName].type) +
|
||||
"|" +
|
||||
templateName +
|
||||
"|" +
|
||||
|
|
@ -176,7 +177,9 @@ export default function GenericNode({
|
|||
data={data}
|
||||
setData={setData}
|
||||
color={
|
||||
nodeColors[types[data.node.template[templateName].type]] ??
|
||||
nodeColors[
|
||||
types[data.node.template[templateName].type]
|
||||
] ??
|
||||
nodeColors[data.node.template[templateName].type] ??
|
||||
nodeColors.unknown
|
||||
}
|
||||
|
|
@ -190,13 +193,15 @@ export default function GenericNode({
|
|||
info={data.node.template[templateName].info}
|
||||
name={templateName}
|
||||
tooltipTitle={
|
||||
data.node.template[templateName].input_types?.join("\n") ??
|
||||
data.node.template[templateName].type
|
||||
data.node.template[templateName].input_types?.join(
|
||||
"\n"
|
||||
) ?? data.node.template[templateName].type
|
||||
}
|
||||
required={data.node.template[templateName].required}
|
||||
id={
|
||||
(data.node.template[templateName].input_types?.join(";") ??
|
||||
data.node.template[templateName].type) +
|
||||
(data.node.template[templateName].input_types?.join(
|
||||
";"
|
||||
) ?? data.node.template[templateName].type) +
|
||||
"|" +
|
||||
templateName +
|
||||
"|" +
|
||||
|
|
@ -204,7 +209,9 @@ export default function GenericNode({
|
|||
}
|
||||
left={true}
|
||||
type={data.node.template[templateName].type}
|
||||
optionalHandle={data.node.template[templateName].input_types}
|
||||
optionalHandle={
|
||||
data.node.template[templateName].input_types
|
||||
}
|
||||
/>
|
||||
) : (
|
||||
<></>
|
||||
|
|
|
|||
|
|
@ -207,7 +207,9 @@ export default function CodeTabsComponent({
|
|||
>
|
||||
{data.map((node: any, index) => (
|
||||
<div className="px-3" key={index}>
|
||||
{tweaks.tweaksList.current.includes(node["data"]["id"]) && (
|
||||
{tweaks.tweaksList.current.includes(
|
||||
node["data"]["id"]
|
||||
) && (
|
||||
<AccordionComponent
|
||||
trigger={node["data"]["id"]}
|
||||
open={openAccordion}
|
||||
|
|
@ -230,19 +232,22 @@ export default function CodeTabsComponent({
|
|||
.filter(
|
||||
(templateName) =>
|
||||
templateName.charAt(0) !== "_" &&
|
||||
node.data.node.template[templateName].show &&
|
||||
(node.data.node.template[templateName].type === "str" ||
|
||||
node.data.node.template[templateName].type ===
|
||||
"bool" ||
|
||||
node.data.node.template[templateName].type ===
|
||||
"float" ||
|
||||
node.data.node.template[templateName].type ===
|
||||
"code" ||
|
||||
node.data.node.template[templateName].type ===
|
||||
"prompt" ||
|
||||
node.data.node.template[templateName].type ===
|
||||
"file" ||
|
||||
node.data.node.template[templateName].type === "int")
|
||||
node.data.node.template[templateName]
|
||||
.show &&
|
||||
(node.data.node.template[templateName]
|
||||
.type === "str" ||
|
||||
node.data.node.template[templateName]
|
||||
.type === "bool" ||
|
||||
node.data.node.template[templateName]
|
||||
.type === "float" ||
|
||||
node.data.node.template[templateName]
|
||||
.type === "code" ||
|
||||
node.data.node.template[templateName]
|
||||
.type === "prompt" ||
|
||||
node.data.node.template[templateName]
|
||||
.type === "file" ||
|
||||
node.data.node.template[templateName]
|
||||
.type === "int")
|
||||
)
|
||||
.map((templateName, index) => {
|
||||
return (
|
||||
|
|
@ -255,22 +260,29 @@ export default function CodeTabsComponent({
|
|||
</TableCell>
|
||||
<TableCell className="p-0 text-xs text-foreground">
|
||||
<div className="m-auto w-[250px]">
|
||||
{node.data.node.template[templateName].type ===
|
||||
"str" &&
|
||||
!node.data.node.template[templateName].options ? (
|
||||
{node.data.node.template[
|
||||
templateName
|
||||
].type === "str" &&
|
||||
!node.data.node.template[
|
||||
templateName
|
||||
].options ? (
|
||||
<div className="mx-auto">
|
||||
{node.data.node.template[templateName]
|
||||
.list ? (
|
||||
{node.data.node.template[
|
||||
templateName
|
||||
].list ? (
|
||||
<InputListComponent
|
||||
editNode={true}
|
||||
disabled={false}
|
||||
value={
|
||||
!node.data.node.template[templateName]
|
||||
.value ||
|
||||
node.data.node.template[templateName]
|
||||
.value === ""
|
||||
!node.data.node.template[
|
||||
templateName
|
||||
].value ||
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].value === ""
|
||||
? [""]
|
||||
: node.data.node.template[
|
||||
: node.data.node
|
||||
.template[
|
||||
templateName
|
||||
].value
|
||||
}
|
||||
|
|
@ -288,16 +300,20 @@ export default function CodeTabsComponent({
|
|||
tweaks.buildTweakObject(
|
||||
node["data"]["id"],
|
||||
target,
|
||||
node.data.node.template[templateName]
|
||||
node.data.node.template[
|
||||
templateName
|
||||
]
|
||||
);
|
||||
}}
|
||||
/>
|
||||
) : node.data.node.template[templateName]
|
||||
.multiline ? (
|
||||
) : node.data.node.template[
|
||||
templateName
|
||||
].multiline ? (
|
||||
<ShadTooltip
|
||||
content={tweaks.buildContent(
|
||||
node.data.node.template[templateName]
|
||||
.value
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].value
|
||||
)}
|
||||
>
|
||||
<div>
|
||||
|
|
@ -305,16 +321,19 @@ export default function CodeTabsComponent({
|
|||
disabled={false}
|
||||
editNode={true}
|
||||
value={
|
||||
!node.data.node.template[
|
||||
!node.data.node
|
||||
.template[
|
||||
templateName
|
||||
].value ||
|
||||
node.data.node.template[
|
||||
node.data.node
|
||||
.template[
|
||||
templateName
|
||||
].value === ""
|
||||
? ""
|
||||
: node.data.node
|
||||
.template[templateName]
|
||||
.value
|
||||
.template[
|
||||
templateName
|
||||
].value
|
||||
}
|
||||
onChange={(target) => {
|
||||
setData((old) => {
|
||||
|
|
@ -331,7 +350,9 @@ export default function CodeTabsComponent({
|
|||
node["data"]["id"],
|
||||
target,
|
||||
node.data.node
|
||||
.template[templateName]
|
||||
.template[
|
||||
templateName
|
||||
]
|
||||
);
|
||||
}}
|
||||
/>
|
||||
|
|
@ -342,16 +363,20 @@ export default function CodeTabsComponent({
|
|||
editNode={true}
|
||||
disabled={false}
|
||||
password={
|
||||
node.data.node.template[templateName]
|
||||
.password ?? false
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].password ?? false
|
||||
}
|
||||
value={
|
||||
!node.data.node.template[templateName]
|
||||
.value ||
|
||||
node.data.node.template[templateName]
|
||||
.value === ""
|
||||
!node.data.node.template[
|
||||
templateName
|
||||
].value ||
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].value === ""
|
||||
? ""
|
||||
: node.data.node.template[
|
||||
: node.data.node
|
||||
.template[
|
||||
templateName
|
||||
].value
|
||||
}
|
||||
|
|
@ -369,20 +394,24 @@ export default function CodeTabsComponent({
|
|||
tweaks.buildTweakObject(
|
||||
node["data"]["id"],
|
||||
target,
|
||||
node.data.node.template[templateName]
|
||||
node.data.node.template[
|
||||
templateName
|
||||
]
|
||||
);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
) : node.data.node.template[templateName].type ===
|
||||
"bool" ? (
|
||||
) : node.data.node.template[
|
||||
templateName
|
||||
].type === "bool" ? (
|
||||
<div className="ml-auto">
|
||||
{" "}
|
||||
<ToggleShadComponent
|
||||
enabled={
|
||||
node.data.node.template[templateName]
|
||||
.value
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].value
|
||||
}
|
||||
setEnabled={(e) => {
|
||||
setData((old) => {
|
||||
|
|
@ -398,24 +427,30 @@ export default function CodeTabsComponent({
|
|||
tweaks.buildTweakObject(
|
||||
node["data"]["id"],
|
||||
e,
|
||||
node.data.node.template[templateName]
|
||||
node.data.node.template[
|
||||
templateName
|
||||
]
|
||||
);
|
||||
}}
|
||||
size="small"
|
||||
disabled={false}
|
||||
/>
|
||||
</div>
|
||||
) : node.data.node.template[templateName].type ===
|
||||
"file" ? (
|
||||
) : node.data.node.template[
|
||||
templateName
|
||||
].type === "file" ? (
|
||||
<ShadTooltip
|
||||
content={tweaks.buildContent(
|
||||
!node.data.node.template[templateName]
|
||||
.value ||
|
||||
node.data.node.template[templateName]
|
||||
.value === ""
|
||||
!node.data.node.template[
|
||||
templateName
|
||||
].value ||
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].value === ""
|
||||
? ""
|
||||
: node.data.node.template[templateName]
|
||||
.value
|
||||
: node.data.node.template[
|
||||
templateName
|
||||
].value
|
||||
)}
|
||||
>
|
||||
<div className="mx-auto">
|
||||
|
|
@ -423,17 +458,22 @@ export default function CodeTabsComponent({
|
|||
editNode={true}
|
||||
disabled={false}
|
||||
value={
|
||||
node.data.node.template[templateName]
|
||||
.value ?? ""
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].value ?? ""
|
||||
}
|
||||
onChange={(target: any) => {}}
|
||||
onChange={(
|
||||
target: any
|
||||
) => {}}
|
||||
fileTypes={
|
||||
node.data.node.template[templateName]
|
||||
.fileTypes
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].fileTypes
|
||||
}
|
||||
suffixes={
|
||||
node.data.node.template[templateName]
|
||||
.suffixes
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].suffixes
|
||||
}
|
||||
onFileChange={(
|
||||
value: any
|
||||
|
|
@ -445,20 +485,24 @@ export default function CodeTabsComponent({
|
|||
></InputFileComponent>
|
||||
</div>
|
||||
</ShadTooltip>
|
||||
) : node.data.node.template[templateName].type ===
|
||||
"float" ? (
|
||||
) : node.data.node.template[
|
||||
templateName
|
||||
].type === "float" ? (
|
||||
<div className="mx-auto">
|
||||
<FloatComponent
|
||||
disabled={false}
|
||||
editNode={true}
|
||||
value={
|
||||
!node.data.node.template[templateName]
|
||||
.value ||
|
||||
node.data.node.template[templateName]
|
||||
.value === ""
|
||||
!node.data.node.template[
|
||||
templateName
|
||||
].value ||
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].value === ""
|
||||
? ""
|
||||
: node.data.node.template[templateName]
|
||||
.value
|
||||
: node.data.node.template[
|
||||
templateName
|
||||
].value
|
||||
}
|
||||
onChange={(target) => {
|
||||
setData((old) => {
|
||||
|
|
@ -474,22 +518,27 @@ export default function CodeTabsComponent({
|
|||
tweaks.buildTweakObject(
|
||||
node["data"]["id"],
|
||||
target,
|
||||
node.data.node.template[templateName]
|
||||
node.data.node.template[
|
||||
templateName
|
||||
]
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
) : node.data.node.template[templateName].type ===
|
||||
"str" &&
|
||||
node.data.node.template[templateName]
|
||||
.options ? (
|
||||
) : node.data.node.template[
|
||||
templateName
|
||||
].type === "str" &&
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].options ? (
|
||||
<div className="mx-auto">
|
||||
<Dropdown
|
||||
editNode={true}
|
||||
apiModal={true}
|
||||
options={
|
||||
node.data.node.template[templateName]
|
||||
.options
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].options
|
||||
}
|
||||
onSelect={(target) => {
|
||||
setData((old) => {
|
||||
|
|
@ -505,34 +554,43 @@ export default function CodeTabsComponent({
|
|||
tweaks.buildTweakObject(
|
||||
node["data"]["id"],
|
||||
target,
|
||||
node.data.node.template[templateName]
|
||||
node.data.node.template[
|
||||
templateName
|
||||
]
|
||||
);
|
||||
}}
|
||||
value={
|
||||
!node.data.node.template[templateName]
|
||||
.value ||
|
||||
node.data.node.template[templateName]
|
||||
.value === ""
|
||||
!node.data.node.template[
|
||||
templateName
|
||||
].value ||
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].value === ""
|
||||
? ""
|
||||
: node.data.node.template[templateName]
|
||||
.value
|
||||
: node.data.node.template[
|
||||
templateName
|
||||
].value
|
||||
}
|
||||
></Dropdown>
|
||||
</div>
|
||||
) : node.data.node.template[templateName].type ===
|
||||
"int" ? (
|
||||
) : node.data.node.template[
|
||||
templateName
|
||||
].type === "int" ? (
|
||||
<div className="mx-auto">
|
||||
<IntComponent
|
||||
disabled={false}
|
||||
editNode={true}
|
||||
value={
|
||||
!node.data.node.template[templateName]
|
||||
.value ||
|
||||
node.data.node.template[templateName]
|
||||
.value === ""
|
||||
!node.data.node.template[
|
||||
templateName
|
||||
].value ||
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].value === ""
|
||||
? ""
|
||||
: node.data.node.template[templateName]
|
||||
.value
|
||||
: node.data.node.template[
|
||||
templateName
|
||||
].value
|
||||
}
|
||||
onChange={(target) => {
|
||||
setData((old) => {
|
||||
|
|
@ -548,22 +606,28 @@ export default function CodeTabsComponent({
|
|||
tweaks.buildTweakObject(
|
||||
node["data"]["id"],
|
||||
target,
|
||||
node.data.node.template[templateName]
|
||||
node.data.node.template[
|
||||
templateName
|
||||
]
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
) : node.data.node.template[templateName].type ===
|
||||
"prompt" ? (
|
||||
) : node.data.node.template[
|
||||
templateName
|
||||
].type === "prompt" ? (
|
||||
<ShadTooltip
|
||||
content={tweaks.buildContent(
|
||||
!node.data.node.template[templateName]
|
||||
.value ||
|
||||
node.data.node.template[templateName]
|
||||
.value === ""
|
||||
!node.data.node.template[
|
||||
templateName
|
||||
].value ||
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].value === ""
|
||||
? ""
|
||||
: node.data.node.template[templateName]
|
||||
.value
|
||||
: node.data.node.template[
|
||||
templateName
|
||||
].value
|
||||
)}
|
||||
>
|
||||
<div className="mx-auto">
|
||||
|
|
@ -571,12 +635,15 @@ export default function CodeTabsComponent({
|
|||
editNode={true}
|
||||
disabled={false}
|
||||
value={
|
||||
!node.data.node.template[templateName]
|
||||
.value ||
|
||||
node.data.node.template[templateName]
|
||||
.value === ""
|
||||
!node.data.node.template[
|
||||
templateName
|
||||
].value ||
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].value === ""
|
||||
? ""
|
||||
: node.data.node.template[
|
||||
: node.data.node
|
||||
.template[
|
||||
templateName
|
||||
].value
|
||||
}
|
||||
|
|
@ -594,21 +661,27 @@ export default function CodeTabsComponent({
|
|||
tweaks.buildTweakObject(
|
||||
node["data"]["id"],
|
||||
target,
|
||||
node.data.node.template[templateName]
|
||||
node.data.node.template[
|
||||
templateName
|
||||
]
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</ShadTooltip>
|
||||
) : node.data.node.template[templateName].type ===
|
||||
"code" ? (
|
||||
) : node.data.node.template[
|
||||
templateName
|
||||
].type === "code" ? (
|
||||
<ShadTooltip
|
||||
content={tweaks.buildContent(
|
||||
tweaks.getValue(
|
||||
node.data.node.template[templateName]
|
||||
.value,
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].value,
|
||||
node.data,
|
||||
node.data.node.template[templateName]
|
||||
node.data.node.template[
|
||||
templateName
|
||||
]
|
||||
)
|
||||
)}
|
||||
>
|
||||
|
|
@ -617,12 +690,15 @@ export default function CodeTabsComponent({
|
|||
disabled={false}
|
||||
editNode={true}
|
||||
value={
|
||||
!node.data.node.template[templateName]
|
||||
.value ||
|
||||
node.data.node.template[templateName]
|
||||
.value === ""
|
||||
!node.data.node.template[
|
||||
templateName
|
||||
].value ||
|
||||
node.data.node.template[
|
||||
templateName
|
||||
].value === ""
|
||||
? ""
|
||||
: node.data.node.template[
|
||||
: node.data.node
|
||||
.template[
|
||||
templateName
|
||||
].value
|
||||
}
|
||||
|
|
@ -640,14 +716,17 @@ export default function CodeTabsComponent({
|
|||
tweaks.buildTweakObject(
|
||||
node["data"]["id"],
|
||||
target,
|
||||
node.data.node.template[templateName]
|
||||
node.data.node.template[
|
||||
templateName
|
||||
]
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</ShadTooltip>
|
||||
) : node.data.node.template[templateName].type ===
|
||||
"Any" ? (
|
||||
) : node.data.node.template[
|
||||
templateName
|
||||
].type === "Any" ? (
|
||||
"-"
|
||||
) : (
|
||||
<div className="hidden"></div>
|
||||
|
|
|
|||
|
|
@ -34,9 +34,8 @@ export default function Header() {
|
|||
<Link to="/">
|
||||
<span className="ml-4 text-2xl">⛓️</span>
|
||||
</Link>
|
||||
{flows.findIndex((flow) => tabId === flow.id) !== -1 && tabId !== "" && (
|
||||
<MenuBar flows={flows} tabId={tabId} />
|
||||
)}
|
||||
{flows.findIndex((flow) => tabId === flow.id) !== -1 &&
|
||||
tabId !== "" && <MenuBar flows={flows} tabId={tabId} />}
|
||||
</div>
|
||||
<div className="round-button-div">
|
||||
<Link to="/">
|
||||
|
|
|
|||
|
|
@ -509,49 +509,12 @@ export const URL_EXCLUDED_FROM_ERROR_RETRIES = [
|
|||
"/api/v1/validate/prompt",
|
||||
];
|
||||
|
||||
export const tabsCode = []
|
||||
export const tabsCode = [];
|
||||
|
||||
export function tabsArray(codes: string[], method: number) {
|
||||
if (!method) return
|
||||
if (!method) return;
|
||||
if (method === 0) {
|
||||
return (
|
||||
[
|
||||
{
|
||||
name: "cURL",
|
||||
mode: "bash",
|
||||
image: "https://curl.se/logo/curl-symbol-transparent.png",
|
||||
language: "sh",
|
||||
code: codes[0],
|
||||
},
|
||||
{
|
||||
name: "Python API",
|
||||
mode: "python",
|
||||
image:
|
||||
"https://images.squarespace-cdn.com/content/v1/5df3d8c5d2be5962e4f87890/1628015119369-OY4TV3XJJ53ECO0W2OLQ/Python+API+Training+Logo.png?format=1000w",
|
||||
language: "py",
|
||||
code: codes[1],
|
||||
},
|
||||
{
|
||||
name: "Python Code",
|
||||
mode: "python",
|
||||
image: "https://cdn-icons-png.flaticon.com/512/5968/5968350.png",
|
||||
language: "py",
|
||||
code: codes[2],
|
||||
},
|
||||
{
|
||||
name: "Chat Widget HTML",
|
||||
description:
|
||||
"Insert this code anywhere in your <body> tag. To use with react and other libs, check our <a class='link-color' href='https://langflow.org/guidelines/widget'>documentation</a>.",
|
||||
mode: "html",
|
||||
image: "https://cdn-icons-png.flaticon.com/512/5968/5968350.png",
|
||||
language: "py",
|
||||
code: codes[3],
|
||||
},
|
||||
]
|
||||
);
|
||||
}
|
||||
return (
|
||||
[
|
||||
return [
|
||||
{
|
||||
name: "cURL",
|
||||
mode: "bash",
|
||||
|
|
@ -570,8 +533,8 @@ export function tabsArray(codes: string[], method: number) {
|
|||
{
|
||||
name: "Python Code",
|
||||
mode: "python",
|
||||
language: "py",
|
||||
image: "https://cdn-icons-png.flaticon.com/512/5968/5968350.png",
|
||||
language: "py",
|
||||
code: codes[2],
|
||||
},
|
||||
{
|
||||
|
|
@ -583,13 +546,46 @@ export function tabsArray(codes: string[], method: number) {
|
|||
language: "py",
|
||||
code: codes[3],
|
||||
},
|
||||
{
|
||||
name: "Tweaks",
|
||||
mode: "python",
|
||||
image: "https://cdn-icons-png.flaticon.com/512/5968/5968350.png",
|
||||
language: "py",
|
||||
code: codes[4],
|
||||
},
|
||||
]
|
||||
);
|
||||
};
|
||||
];
|
||||
}
|
||||
return [
|
||||
{
|
||||
name: "cURL",
|
||||
mode: "bash",
|
||||
image: "https://curl.se/logo/curl-symbol-transparent.png",
|
||||
language: "sh",
|
||||
code: codes[0],
|
||||
},
|
||||
{
|
||||
name: "Python API",
|
||||
mode: "python",
|
||||
image:
|
||||
"https://images.squarespace-cdn.com/content/v1/5df3d8c5d2be5962e4f87890/1628015119369-OY4TV3XJJ53ECO0W2OLQ/Python+API+Training+Logo.png?format=1000w",
|
||||
language: "py",
|
||||
code: codes[1],
|
||||
},
|
||||
{
|
||||
name: "Python Code",
|
||||
mode: "python",
|
||||
language: "py",
|
||||
image: "https://cdn-icons-png.flaticon.com/512/5968/5968350.png",
|
||||
code: codes[2],
|
||||
},
|
||||
{
|
||||
name: "Chat Widget HTML",
|
||||
description:
|
||||
"Insert this code anywhere in your <body> tag. To use with react and other libs, check our <a class='link-color' href='https://langflow.org/guidelines/widget'>documentation</a>.",
|
||||
mode: "html",
|
||||
image: "https://cdn-icons-png.flaticon.com/512/5968/5968350.png",
|
||||
language: "py",
|
||||
code: codes[3],
|
||||
},
|
||||
{
|
||||
name: "Tweaks",
|
||||
mode: "python",
|
||||
image: "https://cdn-icons-png.flaticon.com/512/5968/5968350.png",
|
||||
language: "py",
|
||||
code: codes[4],
|
||||
},
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -318,7 +318,9 @@ export function TabsProvider({ children }: { children: ReactNode }) {
|
|||
// add a change event listener to the file input
|
||||
input.onchange = (event: Event) => {
|
||||
// check if the file type is application/json
|
||||
if ((event.target as HTMLInputElement).files[0].type === "application/json") {
|
||||
if (
|
||||
(event.target as HTMLInputElement).files[0].type === "application/json"
|
||||
) {
|
||||
// get the file from the file input
|
||||
const file = (event.target as HTMLInputElement).files[0];
|
||||
// read the file as text
|
||||
|
|
|
|||
|
|
@ -50,8 +50,12 @@ export function UndoRedoProvider({ children }) {
|
|||
|
||||
useEffect(() => {
|
||||
// whenever the flows variable changes, we need to add one array to the past and future states
|
||||
setPast((old) => flows.map((flow, index) => (old[index] ? old[index] : [])));
|
||||
setFuture((old) => flows.map((flow, index) => (old[index] ? old[index] : [])));
|
||||
setPast((old) =>
|
||||
flows.map((flow, index) => (old[index] ? old[index] : []))
|
||||
);
|
||||
setFuture((old) =>
|
||||
flows.map((flow, index) => (old[index] ? old[index] : []))
|
||||
);
|
||||
setTabIndex(flows.findIndex((flow) => flow.id === tabId));
|
||||
}, [flows, tabId]);
|
||||
|
||||
|
|
|
|||
|
|
@ -49,13 +49,15 @@ const EditNodeModal = forwardRef(
|
|||
const { reactFlowInstance } = useContext(typesContext);
|
||||
|
||||
let disabled =
|
||||
reactFlowInstance?.getEdges().some((edge) => edge.targetHandle === data.id) ??
|
||||
false;
|
||||
reactFlowInstance
|
||||
?.getEdges()
|
||||
.some((edge) => edge.targetHandle === data.id) ?? false;
|
||||
|
||||
function changeAdvanced(templateParam) {
|
||||
setMyData((old) => {
|
||||
let newData = cloneDeep(old);
|
||||
newData.node.template[templateParam].advanced = !newData.node.template[templateParam].advanced;
|
||||
newData.node.template[templateParam].advanced =
|
||||
!newData.node.template[templateParam].advanced;
|
||||
return newData;
|
||||
});
|
||||
}
|
||||
|
|
@ -115,23 +117,32 @@ const EditNodeModal = forwardRef(
|
|||
(templateParam) =>
|
||||
templateParam.charAt(0) !== "_" &&
|
||||
myData.node.template[templateParam].show &&
|
||||
(myData.node.template[templateParam].type === "str" ||
|
||||
myData.node.template[templateParam].type === "bool" ||
|
||||
myData.node.template[templateParam].type === "float" ||
|
||||
myData.node.template[templateParam].type === "code" ||
|
||||
myData.node.template[templateParam].type === "prompt" ||
|
||||
myData.node.template[templateParam].type === "file" ||
|
||||
myData.node.template[templateParam].type === "int")
|
||||
(myData.node.template[templateParam].type ===
|
||||
"str" ||
|
||||
myData.node.template[templateParam].type ===
|
||||
"bool" ||
|
||||
myData.node.template[templateParam].type ===
|
||||
"float" ||
|
||||
myData.node.template[templateParam].type ===
|
||||
"code" ||
|
||||
myData.node.template[templateParam].type ===
|
||||
"prompt" ||
|
||||
myData.node.template[templateParam].type ===
|
||||
"file" ||
|
||||
myData.node.template[templateParam].type ===
|
||||
"int")
|
||||
)
|
||||
.map((templateParam, index) => (
|
||||
<TableRow key={index} className="h-10">
|
||||
<TableCell className="truncate p-0 text-center text-sm text-foreground sm:px-3">
|
||||
{myData.node.template[templateParam].name
|
||||
? myData.node.template[templateParam].name
|
||||
: myData.node.template[templateParam].display_name}
|
||||
: myData.node.template[templateParam]
|
||||
.display_name}
|
||||
</TableCell>
|
||||
<TableCell className="w-[300px] p-0 text-center text-xs text-foreground ">
|
||||
{myData.node.template[templateParam].type === "str" &&
|
||||
{myData.node.template[templateParam].type ===
|
||||
"str" &&
|
||||
!myData.node.template[templateParam].options ? (
|
||||
<div className="mx-auto">
|
||||
{myData.node.template[templateParam].list ? (
|
||||
|
|
@ -139,21 +150,26 @@ const EditNodeModal = forwardRef(
|
|||
editNode={true}
|
||||
disabled={disabled}
|
||||
value={
|
||||
!myData.node.template[templateParam].value ||
|
||||
myData.node.template[templateParam].value === ""
|
||||
!myData.node.template[templateParam]
|
||||
.value ||
|
||||
myData.node.template[templateParam]
|
||||
.value === ""
|
||||
? [""]
|
||||
: myData.node.template[templateParam].value
|
||||
: myData.node.template[templateParam]
|
||||
.value
|
||||
}
|
||||
onChange={(value: string[]) => {
|
||||
handleOnNewValue(value, templateParam);
|
||||
}}
|
||||
/>
|
||||
) : myData.node.template[templateParam].multiline ? (
|
||||
) : myData.node.template[templateParam]
|
||||
.multiline ? (
|
||||
<TextAreaComponent
|
||||
disabled={disabled}
|
||||
editNode={true}
|
||||
value={
|
||||
myData.node.template[templateParam].value ?? ""
|
||||
myData.node.template[templateParam]
|
||||
.value ?? ""
|
||||
}
|
||||
onChange={(value: string) => {
|
||||
handleOnNewValue(value, templateParam);
|
||||
|
|
@ -164,11 +180,12 @@ const EditNodeModal = forwardRef(
|
|||
editNode={true}
|
||||
disabled={disabled}
|
||||
password={
|
||||
myData.node.template[templateParam].password ??
|
||||
false
|
||||
myData.node.template[templateParam]
|
||||
.password ?? false
|
||||
}
|
||||
value={
|
||||
myData.node.template[templateParam].value ?? ""
|
||||
myData.node.template[templateParam]
|
||||
.value ?? ""
|
||||
}
|
||||
onChange={(value) => {
|
||||
handleOnNewValue(value, templateParam);
|
||||
|
|
@ -176,73 +193,104 @@ const EditNodeModal = forwardRef(
|
|||
/>
|
||||
)}
|
||||
</div>
|
||||
) : myData.node.template[templateParam].type === "bool" ? (
|
||||
) : myData.node.template[templateParam].type ===
|
||||
"bool" ? (
|
||||
<div className="ml-auto">
|
||||
{" "}
|
||||
<ToggleShadComponent
|
||||
disabled={disabled}
|
||||
enabled={myData.node.template[templateParam].value}
|
||||
enabled={
|
||||
myData.node.template[templateParam].value
|
||||
}
|
||||
setEnabled={(isEnabled) => {
|
||||
handleOnNewValue(isEnabled, templateParam);
|
||||
handleOnNewValue(
|
||||
isEnabled,
|
||||
templateParam
|
||||
);
|
||||
}}
|
||||
size="small"
|
||||
/>
|
||||
</div>
|
||||
) : myData.node.template[templateParam].type === "float" ? (
|
||||
) : myData.node.template[templateParam].type ===
|
||||
"float" ? (
|
||||
<div className="mx-auto">
|
||||
<FloatComponent
|
||||
disabled={disabled}
|
||||
editNode={true}
|
||||
value={myData.node.template[templateParam].value ?? ""}
|
||||
value={
|
||||
myData.node.template[templateParam]
|
||||
.value ?? ""
|
||||
}
|
||||
onChange={(value) => {
|
||||
handleOnNewValue(value, templateParam);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
) : myData.node.template[templateParam].type === "str" &&
|
||||
) : myData.node.template[templateParam].type ===
|
||||
"str" &&
|
||||
myData.node.template[templateParam].options ? (
|
||||
<div className="mx-auto">
|
||||
<Dropdown
|
||||
numberOfOptions={nodeLength}
|
||||
editNode={true}
|
||||
options={myData.node.template[templateParam].options}
|
||||
onSelect={(value) => handleOnNewValue(value, templateParam)}
|
||||
options={
|
||||
myData.node.template[templateParam]
|
||||
.options
|
||||
}
|
||||
onSelect={(value) =>
|
||||
handleOnNewValue(value, templateParam)
|
||||
}
|
||||
value={
|
||||
myData.node.template[templateParam].value ??
|
||||
"Choose an option"
|
||||
myData.node.template[templateParam]
|
||||
.value ?? "Choose an option"
|
||||
}
|
||||
></Dropdown>
|
||||
</div>
|
||||
) : myData.node.template[templateParam].type === "int" ? (
|
||||
) : myData.node.template[templateParam].type ===
|
||||
"int" ? (
|
||||
<div className="mx-auto">
|
||||
<IntComponent
|
||||
disabled={disabled}
|
||||
editNode={true}
|
||||
value={myData.node.template[templateParam].value ?? ""}
|
||||
value={
|
||||
myData.node.template[templateParam]
|
||||
.value ?? ""
|
||||
}
|
||||
onChange={(value) => {
|
||||
handleOnNewValue(value, templateParam);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
) : myData.node.template[templateParam].type === "file" ? (
|
||||
) : myData.node.template[templateParam].type ===
|
||||
"file" ? (
|
||||
<div className="mx-auto">
|
||||
<InputFileComponent
|
||||
editNode={true}
|
||||
disabled={disabled}
|
||||
value={myData.node.template[templateParam].value ?? ""}
|
||||
value={
|
||||
myData.node.template[templateParam]
|
||||
.value ?? ""
|
||||
}
|
||||
onChange={(value: string) => {
|
||||
handleOnNewValue(value, templateParam);
|
||||
}}
|
||||
fileTypes={
|
||||
myData.node.template[templateParam].fileTypes
|
||||
myData.node.template[templateParam]
|
||||
.fileTypes
|
||||
}
|
||||
suffixes={
|
||||
myData.node.template[templateParam]
|
||||
.suffixes
|
||||
}
|
||||
suffixes={myData.node.template[templateParam].suffixes}
|
||||
onFileChange={(filePath: string) => {
|
||||
data.node.template[templateParam].file_path = filePath;
|
||||
data.node.template[
|
||||
templateParam
|
||||
].file_path = filePath;
|
||||
}}
|
||||
></InputFileComponent>
|
||||
</div>
|
||||
) : myData.node.template[templateParam].type === "prompt" ? (
|
||||
) : myData.node.template[templateParam].type ===
|
||||
"prompt" ? (
|
||||
<div className="mx-auto">
|
||||
<PromptAreaComponent
|
||||
field_name={templateParam}
|
||||
|
|
@ -252,17 +300,22 @@ const EditNodeModal = forwardRef(
|
|||
setNodeClass={(nodeClass) => {
|
||||
myData.node = nodeClass;
|
||||
}}
|
||||
value={myData.node.template[templateParam].value ?? ""}
|
||||
value={
|
||||
myData.node.template[templateParam]
|
||||
.value ?? ""
|
||||
}
|
||||
onChange={(value: string) => {
|
||||
handleOnNewValue(value, templateParam);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
) : myData.node.template[templateParam].type === "code" ? (
|
||||
) : myData.node.template[templateParam].type ===
|
||||
"code" ? (
|
||||
<div className="mx-auto">
|
||||
<CodeAreaComponent
|
||||
dynamic={
|
||||
data.node.template[templateParam].dynamic ?? false
|
||||
data.node.template[templateParam]
|
||||
.dynamic ?? false
|
||||
}
|
||||
setNodeClass={(nodeClass) => {
|
||||
data.node = nodeClass;
|
||||
|
|
@ -270,13 +323,17 @@ const EditNodeModal = forwardRef(
|
|||
nodeClass={data.node}
|
||||
disabled={disabled}
|
||||
editNode={true}
|
||||
value={myData.node.template[templateParam].value ?? ""}
|
||||
value={
|
||||
myData.node.template[templateParam]
|
||||
.value ?? ""
|
||||
}
|
||||
onChange={(value: string) => {
|
||||
handleOnNewValue(value, templateParam);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
) : myData.node.template[templateParam].type === "Any" ? (
|
||||
) : myData.node.template[templateParam].type ===
|
||||
"Any" ? (
|
||||
"-"
|
||||
) : (
|
||||
<div className="hidden"></div>
|
||||
|
|
@ -285,8 +342,13 @@ const EditNodeModal = forwardRef(
|
|||
<TableCell className="p-0 text-right">
|
||||
<div className="items-center text-center">
|
||||
<ToggleShadComponent
|
||||
enabled={!myData.node.template[templateParam].advanced}
|
||||
setEnabled={(e) => changeAdvanced(templateParam)}
|
||||
enabled={
|
||||
!myData.node.template[templateParam]
|
||||
.advanced
|
||||
}
|
||||
setEnabled={(e) =>
|
||||
changeAdvanced(templateParam)
|
||||
}
|
||||
disabled={disabled}
|
||||
size="small"
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -12,7 +12,9 @@ const ExportModal = forwardRef((props: { children: ReactNode }, ref) => {
|
|||
const { flows, tabId, updateFlow, downloadFlow, saveFlow } =
|
||||
useContext(TabsContext);
|
||||
const [checked, setChecked] = useState(false);
|
||||
const [name, setName] = useState(flows.find((flow) => flow.id === tabId).name);
|
||||
const [name, setName] = useState(
|
||||
flows.find((flow) => flow.id === tabId).name
|
||||
);
|
||||
const [invalidName, setInvalidName] = useState(false);
|
||||
const [description, setDescription] = useState(
|
||||
flows.find((flow) => flow.id === tabId).description
|
||||
|
|
|
|||
|
|
@ -19,7 +19,9 @@ export default function FlowSettingsModal({
|
|||
const { flows, tabId, updateFlow, setTabsState, saveFlow } =
|
||||
useContext(TabsContext);
|
||||
const maxLength = 50;
|
||||
const [name, setName] = useState(flows.find((flow) => flow.id === tabId).name);
|
||||
const [name, setName] = useState(
|
||||
flows.find((flow) => flow.id === tabId).name
|
||||
);
|
||||
const [description, setDescription] = useState(
|
||||
flows.find((flow) => flow.id === tabId).description
|
||||
);
|
||||
|
|
|
|||
|
|
@ -70,9 +70,9 @@ export default function FormModal({
|
|||
const [chatKey, setChatKey] = useState(() => {
|
||||
if (tabsState[flow.id]?.formKeysData?.input_keys) {
|
||||
return Object.keys(tabsState[flow.id].formKeysData.input_keys).find(
|
||||
(k) =>
|
||||
!tabsState[flow.id].formKeysData.handle_keys.some((j) => j === k) &&
|
||||
tabsState[flow.id].formKeysData.input_keys[k] === ""
|
||||
(key) =>
|
||||
!tabsState[flow.id].formKeysData.handle_keys.some((j) => j === key) &&
|
||||
tabsState[flow.id].formKeysData.input_keys[key] === ""
|
||||
);
|
||||
}
|
||||
// TODO: return a sensible default
|
||||
|
|
@ -425,13 +425,13 @@ export default function FormModal({
|
|||
{tabsState[id.current]?.formKeysData?.input_keys
|
||||
? Object.keys(
|
||||
tabsState[id.current].formKeysData.input_keys
|
||||
).map((i, k) => (
|
||||
<div className="file-component-accordion-div" key={k}>
|
||||
).map((key, index) => (
|
||||
<div className="file-component-accordion-div" key={index}>
|
||||
<AccordionComponent
|
||||
trigger={
|
||||
<div className="file-component-badge-div">
|
||||
<Badge variant="gray" size="md">
|
||||
{i}
|
||||
{key}
|
||||
</Badge>
|
||||
|
||||
<div
|
||||
|
|
@ -441,24 +441,26 @@ export default function FormModal({
|
|||
}}
|
||||
>
|
||||
<ToggleShadComponent
|
||||
enabled={chatKey === i}
|
||||
enabled={chatKey === key}
|
||||
setEnabled={(value) =>
|
||||
handleOnCheckedChange(value, i)
|
||||
handleOnCheckedChange(value, key)
|
||||
}
|
||||
size="small"
|
||||
disabled={tabsState[
|
||||
id.current
|
||||
].formKeysData.handle_keys.some((t) => t === i)}
|
||||
].formKeysData.handle_keys.some(
|
||||
(t) => t === key
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
key={k}
|
||||
keyValue={i}
|
||||
key={index}
|
||||
keyValue={key}
|
||||
>
|
||||
<div className="file-component-tab-column">
|
||||
{tabsState[id.current].formKeysData.handle_keys.some(
|
||||
(t) => t === i
|
||||
(t) => t === key
|
||||
) && (
|
||||
<div className="font-normal text-muted-foreground ">
|
||||
Source: Component
|
||||
|
|
@ -467,18 +469,18 @@ export default function FormModal({
|
|||
<Textarea
|
||||
className="custom-scroll"
|
||||
value={
|
||||
tabsState[id.current].formKeysData.input_keys[i]
|
||||
tabsState[id.current].formKeysData.input_keys[key]
|
||||
}
|
||||
onChange={(e) => {
|
||||
setTabsState((old) => {
|
||||
let newTabsState = _.cloneDeep(old);
|
||||
newTabsState[
|
||||
id.current
|
||||
].formKeysData.input_keys[i] = e.target.value;
|
||||
].formKeysData.input_keys[key] = e.target.value;
|
||||
return newTabsState;
|
||||
});
|
||||
}}
|
||||
disabled={chatKey === i}
|
||||
disabled={chatKey === key}
|
||||
placeholder="Enter text..."
|
||||
></Textarea>
|
||||
</div>
|
||||
|
|
@ -486,35 +488,37 @@ export default function FormModal({
|
|||
</div>
|
||||
))
|
||||
: null}
|
||||
{tabsState[id.current].formKeysData.memory_keys.map((i, k) => (
|
||||
<div className="file-component-accordion-div" key={k}>
|
||||
<AccordionComponent
|
||||
trigger={
|
||||
<div className="file-component-badge-div">
|
||||
<Badge variant="gray" size="md">
|
||||
{key}
|
||||
</Badge>
|
||||
<div className="-mb-1">
|
||||
<ToggleShadComponent
|
||||
enabled={chatKey === key}
|
||||
setEnabled={() => {}}
|
||||
size="small"
|
||||
disabled={true}
|
||||
/>
|
||||
{tabsState[id.current].formKeysData.memory_keys.map(
|
||||
(key, index) => (
|
||||
<div className="file-component-accordion-div" key={index}>
|
||||
<AccordionComponent
|
||||
trigger={
|
||||
<div className="file-component-badge-div">
|
||||
<Badge variant="gray" size="md">
|
||||
{key}
|
||||
</Badge>
|
||||
<div className="-mb-1">
|
||||
<ToggleShadComponent
|
||||
enabled={chatKey === key}
|
||||
setEnabled={() => {}}
|
||||
size="small"
|
||||
disabled={true}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
key={index}
|
||||
keyValue={key}
|
||||
>
|
||||
<div className="file-component-tab-column">
|
||||
<div className="font-normal text-muted-foreground ">
|
||||
Source: Memory
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
key={index}
|
||||
keyValue={key}
|
||||
>
|
||||
<div className="file-component-tab-column">
|
||||
<div className="font-normal text-muted-foreground ">
|
||||
Source: Memory
|
||||
</div>
|
||||
</div>
|
||||
</AccordionComponent>
|
||||
</div>
|
||||
))}
|
||||
</AccordionComponent>
|
||||
</div>
|
||||
)
|
||||
)}
|
||||
</div>
|
||||
<div className="eraser-column-arrangement">
|
||||
<div className="eraser-size">
|
||||
|
|
|
|||
|
|
@ -303,7 +303,10 @@ export default function Page({ flow }: { flow: FlowType }) {
|
|||
takeSnapshot();
|
||||
setEdges(
|
||||
edges.filter(
|
||||
(edge) => !mynodes.some((node) => edge.source === node.id || edge.target === node.id)
|
||||
(edge) =>
|
||||
!mynodes.some(
|
||||
(node) => edge.source === node.id || edge.target === node.id
|
||||
)
|
||||
)
|
||||
);
|
||||
},
|
||||
|
|
|
|||
|
|
@ -168,7 +168,8 @@ export default function ExtraSidebar() {
|
|||
key={index}
|
||||
button={{
|
||||
title: nodeNames[SBSectionName] ?? nodeNames.unknown,
|
||||
Icon: nodeIconsLucide[SBSectionName] ?? nodeIconsLucide.unknown,
|
||||
Icon:
|
||||
nodeIconsLucide[SBSectionName] ?? nodeIconsLucide.unknown,
|
||||
}}
|
||||
>
|
||||
<div className="side-bar-components-gap">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue