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

Add branching to GenericNode

Browse source
This commit is contained in:
Gabriel Luiz Freitas Almeida 2024-02-29 23:07:10 -03:00
commit ca514e579f
5 changed files with 90 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -15,6 +15,7 @@ import KeypairListComponent from "../../../../components/keypairListComponent";
import PromptAreaComponent from "../../../../components/promptComponent"; 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 { Badge } from "../../../../components/ui/badge";
import { Button } from "../../../../components/ui/button"; import { Button } from "../../../../components/ui/button";
import { import {
LANGFLOW_SUPPORTED_TYPES, LANGFLOW_SUPPORTED_TYPES,
@ -50,6 +51,7 @@ export default function ParameterComponent({
data, data,
tooltipTitle, tooltipTitle,
title, title,
conditionPath,
color, color,
type, type,
name = "", name = "",
@ -315,6 +317,12 @@ export default function ParameterComponent({
(info !== "" ? " flex items-center" : "") (info !== "" ? " flex items-center" : "")
} }
> >
{" "}
{conditionPath && (
<Badge variant="gray" size="md" className="mr-2">
{conditionPath}
</Badge>
)}
{proxy ? ( {proxy ? (
<ShadTooltip content={<span>{proxy.id}</span>}> <ShadTooltip content={<span>{proxy.id}</span>}>
<span>{title}</span> <span>{title}</span>

110
src/frontend/src/CustomNodes/GenericNode/index.tsx
View file

@ -664,37 +664,85 @@ export default function GenericNode({
> >
{" "} {" "}
</div> </div>
{data.node!.base_classes.length > 0 && ( <div>
<ParameterComponent {data.node!.base_classes.length > 0 && (
key={scapedJSONStringfy({ <ParameterComponent
baseClasses: data.node!.base_classes, key={scapedJSONStringfy({
id: data.id, baseClasses: data.node!.base_classes,
dataType: data.type, id: data.id,
})} dataType: data.type,
data={data} conditionalPath: data.node!.is_conditional ? true : null,
color={ })}
(data.node?.output_types && data={data}
data.node.output_types.length > 0 color={
? nodeColors[data.node.output_types[0]] ?? (data.node?.output_types &&
nodeColors[types[data.node.output_types[0]]] data.node.output_types.length > 0
: nodeColors[types[data.type]]) ?? nodeColors.unknown ? nodeColors[data.node.output_types[0]] ??
} nodeColors[types[data.node.output_types[0]]]
title={ : nodeColors[types[data.type]]) ?? nodeColors.unknown
data.node?.output_types && data.node.output_types.length > 0 }
? data.node.output_types.join(" | ") title={
: data.type data.node?.output_types &&
} data.node.output_types.length > 0
tooltipTitle={data.node?.base_classes.join("\n")} ? data.node.output_types.join(" | ")
id={{ : data.type
baseClasses: data.node!.base_classes, }
id: data.id, conditionPath={data.node?.is_conditional ? "True" : null}
dataType: data.type, tooltipTitle={data.node?.base_classes.join("\n")}
}} id={{
type={data.node?.base_classes.join("|")} baseClasses: data.node!.base_classes,
left={false} id: data.id,
showNode={showNode} dataType: data.type,
/> // First parameter component should be true
)} // Second should be false
conditionalPath: data.node!.is_conditional ? true : null,
}}
// Type should be base_classes if it's not a conditional node
// else it should be true in the first parameter component
type={data.node?.base_classes.join("|")}
left={false}
showNode={showNode}
/>
)}
{data.node!.is_conditional && (
<ParameterComponent
key={scapedJSONStringfy({
baseClasses: data.node!.base_classes,
id: data.id,
dataType: data.type,
conditionalPath: data.node!.is_conditional ? true : null,
})}
data={data}
color={
(data.node?.output_types &&
data.node.output_types.length > 0
? nodeColors[data.node.output_types[0]] ??
nodeColors[types[data.node.output_types[0]]]
: nodeColors[types[data.type]]) ?? nodeColors.unknown
}
title={
data.node?.output_types &&
data.node.output_types.length > 0
? data.node.output_types.join(" | ")
: data.type
}
conditionPath={data.node?.is_conditional ? "False" : null}
tooltipTitle={data.node?.base_classes.join("\n")}
id={{
baseClasses: data.node!.base_classes,
id: data.id,
dataType: data.type,
// condition should be null if it's not a conditional node
// false if it's a conditional node and the condition is false
// so we should check if it's a conditional node.
conditionalPath: data.node!.is_conditional ? false : null,
}}
type={data.node?.base_classes.join("|")}
left={false}
showNode={showNode}
/>
)}
</div>
</> </>
</div> </div>
)} )}

1
src/frontend/src/types/api/index.ts
View file

@ -20,6 +20,7 @@ export type APIClassType = {
icon?: string; icon?: string;
is_input?: boolean; is_input?: boolean;
is_output?: boolean; is_output?: boolean;
is_conditional?: boolean;
input_types?: Array<string>; input_types?: Array<string>;
output_types?: Array<string>; output_types?: Array<string>;
custom_fields?: CustomFieldsType; custom_fields?: CustomFieldsType;

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

@ -40,6 +40,7 @@ export type DropDownComponentType = {
export type ParameterComponentType = { export type ParameterComponentType = {
data: NodeDataType; data: NodeDataType;
title: string; title: string;
conditionPath?: string | null;
id: sourceHandleType | targetHandleType; id: sourceHandleType | targetHandleType;
color: string; color: string;
left: boolean; left: boolean;

1
src/frontend/src/types/flow/index.ts
View file

@ -52,6 +52,7 @@ export type sourceHandleType = {
dataType: string; dataType: string;
id: string; id: string;
baseClasses: string[]; baseClasses: string[];
conditionalPath?: boolean | null;
}; };
//left side //left side
export type targetHandleType = { export type targetHandleType = {