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

feat: Update API modal utils to use InputFieldType

Browse source 
The code changes in this commit update the API modal utils to use the `InputFieldType` type instead of the deprecated `TemplateVariableType`. This change ensures that the codebase is up to date with the latest API types and improves the accuracy and clarity of the code.
This commit is contained in:
ogabrielluiz 2024-05-30 16:42:01 -03:00
commit cc49757333
7 changed files with 82 additions and 83 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/frontend/src/modals/apiModal/utils/get-changes-types.ts
View file

@ -1,9 +1,9 @@
import { TemplateVariableType } from "../../../types/api"; import { InputFieldType } from "../../../types/api";
import { convertArrayToObj } from "../../../utils/reactflowUtils"; import { convertArrayToObj } from "../../../utils/reactflowUtils";
export const getChangesType = ( export const getChangesType = (
changes: string | string[] | boolean | number | Object[] | Object, changes: string | string[] | boolean | number | Object[] | Object,
template: TemplateVariableType, template: InputFieldType
) => { ) => {
if (typeof changes === "string" && template.type === "float") { if (typeof changes === "string" && template.type === "float") {
changes = parseFloat(changes); changes = parseFloat(changes);

6
src/frontend/src/modals/apiModal/utils/get-value.ts
View file

@ -1,11 +1,11 @@
import { TemplateVariableType } from "../../../types/api"; import { InputFieldType } from "../../../types/api";
import { NodeType } from "../../../types/flow"; import { NodeType } from "../../../types/flow";
export const getValue = ( export const getValue = (
value: string, value: string,
node: NodeType, node: NodeType,
template: TemplateVariableType, template: InputFieldType,
tweak: Object[], tweak: Object[]
) => { ) => {
let returnValue = value ?? ""; let returnValue = value ?? "";

4
src/frontend/src/modals/apiModal/views/index.tsx
View file

@ -10,7 +10,7 @@ import IconComponent from "../../../components/genericIconComponent";
import { EXPORT_CODE_DIALOG } from "../../../constants/constants"; import { EXPORT_CODE_DIALOG } from "../../../constants/constants";
import { AuthContext } from "../../../contexts/authContext"; import { AuthContext } from "../../../contexts/authContext";
import { useTweaksStore } from "../../../stores/tweaksStore"; import { useTweaksStore } from "../../../stores/tweaksStore";
import { TemplateVariableType } from "../../../types/api"; import { InputFieldType } from "../../../types/api";
import { uniqueTweakType } from "../../../types/components"; import { uniqueTweakType } from "../../../types/components";
import { FlowType } from "../../../types/flow/index"; import { FlowType } from "../../../types/flow/index";
import BaseModal from "../../baseModal"; import BaseModal from "../../baseModal";
@ -128,7 +128,7 @@ const ApiModal = forwardRef(
async function buildTweakObject( async function buildTweakObject(
tw: string, tw: string,
changes: string | string[] | boolean | number | Object[] | Object, changes: string | string[] | boolean | number | Object[] | Object,
template: TemplateVariableType template: InputFieldType
) { ) {
changes = getChangesType(changes, template); changes = getChangesType(changes, template);

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

@ -5,7 +5,7 @@ export type APIDataType = { [key: string]: APIKindType };
export type APIObjectType = { [key: string]: APIKindType }; export type APIObjectType = { [key: string]: APIKindType };
export type APIKindType = { [key: string]: APIClassType }; export type APIKindType = { [key: string]: APIClassType };
export type APITemplateType = { export type APITemplateType = {
[key: string]: TemplateVariableType; [key: string]: InputFieldType;
}; };
export type CustomFieldsType = { export type CustomFieldsType = {
@ -44,7 +44,7 @@ export type APIClassType = {
| Array<{ types: Array<string>; selected?: string }>; | Array<{ types: Array<string>; selected?: string }>;
}; };
export type TemplateVariableType = { export type InputFieldType = {
type: string; type: string;
required: boolean; required: boolean;
placeholder?: string; placeholder?: string;
@ -63,6 +63,7 @@ export type TemplateVariableType = {
refresh_button_text?: string; refresh_button_text?: string;
[key: string]: any; [key: string]: any;
}; };
export type sendAllProps = { export type sendAllProps = {
nodes: Node[]; nodes: Node[];
edges: Edge[]; edges: Edge[];

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

@ -1,7 +1,7 @@
import { ReactElement, ReactNode, SetStateAction } from "react"; import { ReactElement, ReactNode, SetStateAction } from "react";
import { ReactFlowJsonObject } from "reactflow"; import { ReactFlowJsonObject } from "reactflow";
import { InputOutput } from "../../constants/enums"; import { InputOutput } from "../../constants/enums";
import { APIClassType, APITemplateType, TemplateVariableType } from "../api"; import { APIClassType, APITemplateType, InputFieldType } from "../api";
import { ChatMessageType } from "../chat"; import { ChatMessageType } from "../chat";
import { FlowStyleType, FlowType, NodeDataType, NodeType } from "../flow/index"; import { FlowStyleType, FlowType, NodeDataType, NodeType } from "../flow/index";
import { sourceHandleType, targetHandleType } from "./../flow/index"; import { sourceHandleType, targetHandleType } from "./../flow/index";
@ -669,13 +669,13 @@ export type codeTabsPropsType = {
getValue?: ( getValue?: (
value: string, value: string,
node: NodeType, node: NodeType,
template: TemplateVariableType, template: InputFieldType,
tweak: tweakType tweak: tweakType
) => string; ) => string;
buildTweakObject?: ( buildTweakObject?: (
tw: string, tw: string,
changes: string | string[] | boolean | number | Object[] | Object, changes: string | string[] | boolean | number | Object[] | Object,
template: TemplateVariableType template: InputFieldType
) => Promise<string | void>; ) => Promise<string | void>;
}; };
activeTweaks?: boolean; activeTweaks?: boolean;
@ -742,7 +742,7 @@ export type chatViewProps = {
}; };
export type IOFileInputProps = { export type IOFileInputProps = {
field: TemplateVariableType; field: InputFieldType;
updateValue: (e: any, type: string) => void; updateValue: (e: any, type: string) => void;
}; };

112
src/frontend/src/utils/reactflowUtils.ts
View file

@ -23,7 +23,7 @@ import {
APIKindType, APIKindType,
APIObjectType, APIObjectType,
APITemplateType, APITemplateType,
TemplateVariableType, InputFieldType,
} from "../types/api"; } from "../types/api";
import { import {
FlowType, FlowType,
@ -102,18 +102,18 @@ export function unselectAllNodes({ updateNodes, data }: unselectAllNodesType) {
export function isValidConnection( export function isValidConnection(
{ source, target, sourceHandle, targetHandle }: Connection, { source, target, sourceHandle, targetHandle }: Connection,
nodes: Node[], nodes: Node[],
edges: Edge[], edges: Edge[]
) { ) {
const targetHandleObject: targetHandleType = scapeJSONParse(targetHandle!); const targetHandleObject: targetHandleType = scapeJSONParse(targetHandle!);
const sourceHandleObject: sourceHandleType = scapeJSONParse(sourceHandle!); const sourceHandleObject: sourceHandleType = scapeJSONParse(sourceHandle!);
if ( if (
targetHandleObject.inputTypes?.some( targetHandleObject.inputTypes?.some(
(n) => n === sourceHandleObject.dataType, (n) => n === sourceHandleObject.dataType
) || ) ||
sourceHandleObject.baseClasses.some( sourceHandleObject.baseClasses.some(
(t) => (t) =>
targetHandleObject.inputTypes?.some((n) => n === t) || targetHandleObject.inputTypes?.some((n) => n === t) ||
t === targetHandleObject.type, t === targetHandleObject.type
) )
) { ) {
let targetNode = nodes.find((node) => node.id === target!)?.data?.node; let targetNode = nodes.find((node) => node.id === target!)?.data?.node;
@ -146,7 +146,7 @@ export function removeApiKeys(flow: FlowType): FlowType {
export function updateTemplate( export function updateTemplate(
reference: APITemplateType, reference: APITemplateType,
objectToUpdate: APITemplateType, objectToUpdate: APITemplateType
): APITemplateType { ): APITemplateType {
let clonedObject: APITemplateType = cloneDeep(reference); let clonedObject: APITemplateType = cloneDeep(reference);
@ -206,7 +206,7 @@ export const processDataFromFlow = (flow: FlowType, refreshIds = true) => {
export function updateIds( export function updateIds(
{ edges, nodes }: { edges: Edge[]; nodes: Node[] }, { edges, nodes }: { edges: Edge[]; nodes: Node[] },
selection?: { edges: Edge[]; nodes: Node[] }, selection?: { edges: Edge[]; nodes: Node[] }
) { ) {
let idsMap = {}; let idsMap = {};
const selectionIds = selection?.nodes.map((n) => n.id); const selectionIds = selection?.nodes.map((n) => n.id);
@ -234,7 +234,7 @@ export function updateIds(
edge.source = idsMap[edge.source]; edge.source = idsMap[edge.source];
edge.target = idsMap[edge.target]; edge.target = idsMap[edge.target];
const sourceHandleObject: sourceHandleType = scapeJSONParse( const sourceHandleObject: sourceHandleType = scapeJSONParse(
edge.sourceHandle!, edge.sourceHandle!
); );
edge.sourceHandle = scapedJSONStringfy({ edge.sourceHandle = scapedJSONStringfy({
...sourceHandleObject, ...sourceHandleObject,
@ -244,7 +244,7 @@ export function updateIds(
edge.data.sourceHandle.id = edge.source; edge.data.sourceHandle.id = edge.source;
} }
const targetHandleObject: targetHandleType = scapeJSONParse( const targetHandleObject: targetHandleType = scapeJSONParse(
edge.targetHandle!, edge.targetHandle!
); );
edge.targetHandle = scapedJSONStringfy({ edge.targetHandle = scapedJSONStringfy({
...targetHandleObject, ...targetHandleObject,
@ -290,11 +290,11 @@ export function validateNode(node: NodeType, edges: Edge[]): Array<string> {
(scapeJSONParse(edge.targetHandle!) as targetHandleType).fieldName === (scapeJSONParse(edge.targetHandle!) as targetHandleType).fieldName ===
t && t &&
(scapeJSONParse(edge.targetHandle!) as targetHandleType).id === (scapeJSONParse(edge.targetHandle!) as targetHandleType).id ===
node.id, node.id
) )
) { ) {
errors.push( errors.push(
`${displayName || type} is missing ${getFieldTitle(template, t)}.`, `${displayName || type} is missing ${getFieldTitle(template, t)}.`
); );
} else if ( } else if (
template[t].type === "dict" && template[t].type === "dict" &&
@ -308,15 +308,15 @@ export function validateNode(node: NodeType, edges: Edge[]): Array<string> {
errors.push( errors.push(
`${displayName || type} (${getFieldTitle( `${displayName || type} (${getFieldTitle(
template, template,
t, t
)}) contains duplicate keys with the same values.`, )}) contains duplicate keys with the same values.`
); );
if (hasEmptyKey(template[t].value)) if (hasEmptyKey(template[t].value))
errors.push( errors.push(
`${displayName || type} (${getFieldTitle( `${displayName || type} (${getFieldTitle(
template, template,
t, t
)}) field must not be empty.`, )}) field must not be empty.`
); );
} }
return errors; return errors;
@ -325,7 +325,7 @@ export function validateNode(node: NodeType, edges: Edge[]): Array<string> {
export function validateNodes( export function validateNodes(
nodes: Node[], nodes: Node[],
edges: Edge[], edges: Edge[]
): // this returns an array of tuples with the node id and the errors ): // this returns an array of tuples with the node id and the errors
Array<{ id: string; errors: Array<string> }> { Array<{ id: string; errors: Array<string> }> {
if (nodes.length === 0) { if (nodes.length === 0) {
@ -346,7 +346,7 @@ export function updateEdges(edges: Edge[]) {
if (edges) if (edges)
edges.forEach((edge) => { edges.forEach((edge) => {
const targetHandleObject: targetHandleType = scapeJSONParse( const targetHandleObject: targetHandleType = scapeJSONParse(
edge.targetHandle!, edge.targetHandle!
); );
edge.className = "stroke-gray-900 stroke-connection"; edge.className = "stroke-gray-900 stroke-connection";
}); });
@ -426,11 +426,11 @@ export function updateNewOutput({ nodes, edges }: updateEdgesHandleIdsType) {
if (newTargetHandle.inputTypes && newTargetHandle.inputTypes.length > 0) { if (newTargetHandle.inputTypes && newTargetHandle.inputTypes.length > 0) {
//conjuction subtraction //conjuction subtraction
intersection = newSourceHandle.baseClasses.filter((type) => intersection = newSourceHandle.baseClasses.filter((type) =>
newTargetHandle.inputTypes!.includes(type), newTargetHandle.inputTypes!.includes(type)
); );
} else { } else {
intersection = newSourceHandle.baseClasses.filter( intersection = newSourceHandle.baseClasses.filter(
(type) => type === newTargetHandle.type, (type) => type === newTargetHandle.type
); );
} }
const selected = intersection[0]; const selected = intersection[0];
@ -462,7 +462,7 @@ export function handleKeyDown(
| React.KeyboardEvent<HTMLInputElement> | React.KeyboardEvent<HTMLInputElement>
| React.KeyboardEvent<HTMLTextAreaElement>, | React.KeyboardEvent<HTMLTextAreaElement>,
inputValue: string | string[] | null, inputValue: string | string[] | null,
block: string, block: string
) { ) {
//condition to fix bug control+backspace on Windows/Linux //condition to fix bug control+backspace on Windows/Linux
if ( if (
@ -487,7 +487,7 @@ export function handleKeyDown(
} }
export function handleOnlyIntegerInput( export function handleOnlyIntegerInput(
event: React.KeyboardEvent<HTMLInputElement>, event: React.KeyboardEvent<HTMLInputElement>
) { ) {
if ( if (
event.key === "." || event.key === "." ||
@ -503,7 +503,7 @@ export function handleOnlyIntegerInput(
export function getConnectedNodes( export function getConnectedNodes(
edge: Edge, edge: Edge,
nodes: Array<NodeType>, nodes: Array<NodeType>
): Array<NodeType> { ): Array<NodeType> {
const sourceId = edge.source; const sourceId = edge.source;
const targetId = edge.target; const targetId = edge.target;
@ -604,7 +604,7 @@ export function checkOldEdgesHandles(edges: Edge[]): boolean {
!edge.sourceHandle || !edge.sourceHandle ||
!edge.targetHandle || !edge.targetHandle ||
!edge.sourceHandle.includes("{") || !edge.sourceHandle.includes("{") ||
!edge.targetHandle.includes("{"), !edge.targetHandle.includes("{")
); );
} }
@ -631,7 +631,7 @@ export function customStringify(obj: any): string {
const keys = Object.keys(obj).sort(); const keys = Object.keys(obj).sort();
const keyValuePairs = keys.map( const keyValuePairs = keys.map(
(key) => `"${key}":${customStringify(obj[key])}`, (key) => `"${key}":${customStringify(obj[key])}`
); );
return `{${keyValuePairs.join(",")}}`; return `{${keyValuePairs.join(",")}}`;
} }
@ -660,7 +660,7 @@ export function getHandleId(
source: string, source: string,
sourceHandle: string, sourceHandle: string,
target: string, target: string,
targetHandle: string, targetHandle: string
) { ) {
return ( return (
"reactflow__edge-" + source + sourceHandle + "-" + target + targetHandle "reactflow__edge-" + source + sourceHandle + "-" + target + targetHandle
@ -671,7 +671,7 @@ export function generateFlow(
selection: OnSelectionChangeParams, selection: OnSelectionChangeParams,
nodes: Node[], nodes: Node[],
edges: Edge[], edges: Edge[],
name: string, name: string
): generateFlowType { ): generateFlowType {
const newFlowData = { nodes, edges, viewport: { zoom: 1, x: 0, y: 0 } }; const newFlowData = { nodes, edges, viewport: { zoom: 1, x: 0, y: 0 } };
const uid = new ShortUniqueId({ length: 5 }); const uid = new ShortUniqueId({ length: 5 });
@ -680,7 +680,7 @@ export function generateFlow(
newFlowData.edges = selection.edges.filter( newFlowData.edges = selection.edges.filter(
(edge) => (edge) =>
selection.nodes.some((node) => node.id === edge.target) && selection.nodes.some((node) => node.id === edge.target) &&
selection.nodes.some((node) => node.id === edge.source), selection.nodes.some((node) => node.id === edge.source)
); );
newFlowData.nodes = selection.nodes; newFlowData.nodes = selection.nodes;
@ -701,7 +701,7 @@ export function generateFlow(
(edge) => (edge) =>
(selection.nodes.some((node) => node.id === edge.target) || (selection.nodes.some((node) => node.id === edge.target) ||
selection.nodes.some((node) => node.id === edge.source)) && selection.nodes.some((node) => node.id === edge.source)) &&
newFlowData.edges.every((e) => e.id !== edge.id), newFlowData.edges.every((e) => e.id !== edge.id)
), ),
}; };
} }
@ -712,13 +712,13 @@ export function reconnectEdges(groupNode: NodeType, excludedEdges: Edge[]) {
const { nodes, edges } = groupNode.data.node!.flow!.data!; const { nodes, edges } = groupNode.data.node!.flow!.data!;
const lastNode = findLastNode(groupNode.data.node!.flow!.data!); const lastNode = findLastNode(groupNode.data.node!.flow!.data!);
newEdges = newEdges.filter( newEdges = newEdges.filter(
(e) => !(nodes.some((n) => n.id === e.source) && e.source !== lastNode?.id), (e) => !(nodes.some((n) => n.id === e.source) && e.source !== lastNode?.id)
); );
newEdges.forEach((edge) => { newEdges.forEach((edge) => {
if (lastNode && edge.source === lastNode.id) { if (lastNode && edge.source === lastNode.id) {
edge.source = groupNode.id; edge.source = groupNode.id;
let newSourceHandle: sourceHandleType = scapeJSONParse( let newSourceHandle: sourceHandleType = scapeJSONParse(
edge.sourceHandle!, edge.sourceHandle!
); );
newSourceHandle.id = groupNode.id; newSourceHandle.id = groupNode.id;
edge.sourceHandle = scapedJSONStringfy(newSourceHandle); edge.sourceHandle = scapedJSONStringfy(newSourceHandle);
@ -745,7 +745,7 @@ export function reconnectEdges(groupNode: NodeType, excludedEdges: Edge[]) {
export function filterFlow( export function filterFlow(
selection: OnSelectionChangeParams, selection: OnSelectionChangeParams,
setNodes: (update: Node[] | ((oldState: Node[]) => Node[])) => void, setNodes: (update: Node[] | ((oldState: Node[]) => Node[])) => void,
setEdges: (update: Edge[] | ((oldState: Edge[]) => Edge[])) => void, setEdges: (update: Edge[] | ((oldState: Edge[]) => Edge[])) => void
) { ) {
setNodes((nodes) => nodes.filter((node) => !selection.nodes.includes(node))); setNodes((nodes) => nodes.filter((node) => !selection.nodes.includes(node)));
setEdges((edges) => edges.filter((edge) => !selection.edges.includes(edge))); setEdges((edges) => edges.filter((edge) => !selection.edges.includes(edge)));
@ -783,7 +783,7 @@ export function updateFlowPosition(NewPosition: XYPosition, flow: FlowType) {
export function concatFlows( export function concatFlows(
flow: FlowType, flow: FlowType,
setNodes: (update: Node[] | ((oldState: Node[]) => Node[])) => void, setNodes: (update: Node[] | ((oldState: Node[]) => Node[])) => void,
setEdges: (update: Edge[] | ((oldState: Edge[]) => Edge[])) => void, setEdges: (update: Edge[] | ((oldState: Edge[]) => Edge[])) => void
) { ) {
const { nodes, edges } = flow.data!; const { nodes, edges } = flow.data!;
setNodes((old) => [...old, ...nodes]); setNodes((old) => [...old, ...nodes]);
@ -792,7 +792,7 @@ export function concatFlows(
export function validateSelection( export function validateSelection(
selection: OnSelectionChangeParams, selection: OnSelectionChangeParams,
edges: Edge[], edges: Edge[]
): Array<string> { ): Array<string> {
const clonedSelection = cloneDeep(selection); const clonedSelection = cloneDeep(selection);
const clonedEdges = cloneDeep(edges); const clonedEdges = cloneDeep(edges);
@ -806,7 +806,7 @@ export function validateSelection(
let nodesSet = new Set(clonedSelection.nodes.map((n) => n.id)); let nodesSet = new Set(clonedSelection.nodes.map((n) => n.id));
// then filter the edges that are connected to the nodes in the set // then filter the edges that are connected to the nodes in the set
let connectedEdges = clonedSelection.edges.filter( let connectedEdges = clonedSelection.edges.filter(
(e) => nodesSet.has(e.source) && nodesSet.has(e.target), (e) => nodesSet.has(e.source) && nodesSet.has(e.target)
); );
// add the edges to the selection // add the edges to the selection
clonedSelection.edges = connectedEdges; clonedSelection.edges = connectedEdges;
@ -820,17 +820,17 @@ export function validateSelection(
clonedSelection.nodes.some( clonedSelection.nodes.some(
(node) => (node) =>
isInputNode(node.data as NodeDataType) || isInputNode(node.data as NodeDataType) ||
isOutputNode(node.data as NodeDataType), isOutputNode(node.data as NodeDataType)
) )
) { ) {
errorsArray.push( errorsArray.push(
"Please select only nodes that are not input or output nodes", "Please select only nodes that are not input or output nodes"
); );
} }
//check if there are two or more nodes with free outputs //check if there are two or more nodes with free outputs
if ( if (
clonedSelection.nodes.filter( clonedSelection.nodes.filter(
(n) => !clonedSelection.edges.some((e) => e.source === n.id), (n) => !clonedSelection.edges.some((e) => e.source === n.id)
).length > 1 ).length > 1
) { ) {
errorsArray.push("Please select only one node with free outputs"); errorsArray.push("Please select only one node with free outputs");
@ -841,7 +841,7 @@ export function validateSelection(
clonedSelection.nodes.some( clonedSelection.nodes.some(
(node) => (node) =>
!clonedSelection.edges.some((edge) => edge.target === node.id) && !clonedSelection.edges.some((edge) => edge.target === node.id) &&
!clonedSelection.edges.some((edge) => edge.source === node.id), !clonedSelection.edges.some((edge) => edge.source === node.id)
) )
) { ) {
errorsArray.push("Please select only nodes that are connected"); errorsArray.push("Please select only nodes that are connected");
@ -898,8 +898,8 @@ export function mergeNodeTemplates({
nodeTemplate[key].display_name nodeTemplate[key].display_name
? nodeTemplate[key].display_name ? nodeTemplate[key].display_name
: nodeTemplate[key].name : nodeTemplate[key].name
? toTitleCase(nodeTemplate[key].name) ? toTitleCase(nodeTemplate[key].name)
: toTitleCase(key); : toTitleCase(key);
} }
} }
}); });
@ -909,8 +909,8 @@ export function mergeNodeTemplates({
function isHandleConnected( function isHandleConnected(
edges: Edge[], edges: Edge[],
key: string, key: string,
field: TemplateVariableType, field: InputFieldType,
nodeId: string, nodeId: string
) { ) {
/* /*
this function receives a flow and a handleId and check if there is a connection with this handle this function receives a flow and a handleId and check if there is a connection with this handle
@ -926,7 +926,7 @@ function isHandleConnected(
id: nodeId, id: nodeId,
proxy: { id: field.proxy!.id, field: field.proxy!.field }, proxy: { id: field.proxy!.id, field: field.proxy!.field },
inputTypes: field.input_types, inputTypes: field.input_types,
} as targetHandleType), } as targetHandleType)
) )
) { ) {
return true; return true;
@ -941,7 +941,7 @@ function isHandleConnected(
fieldName: key, fieldName: key,
id: nodeId, id: nodeId,
inputTypes: field.input_types, inputTypes: field.input_types,
} as targetHandleType), } as targetHandleType)
) )
) { ) {
return true; return true;
@ -964,7 +964,7 @@ export function generateNodeTemplate(Flow: FlowType) {
export function generateNodeFromFlow( export function generateNodeFromFlow(
flow: FlowType, flow: FlowType,
getNodeId: (type: string) => string, getNodeId: (type: string) => string
): NodeType { ): NodeType {
const { nodes } = flow.data!; const { nodes } = flow.data!;
const outputNode = cloneDeep(findLastNode(flow.data!)); const outputNode = cloneDeep(findLastNode(flow.data!));
@ -995,7 +995,7 @@ export function generateNodeFromFlow(
export function connectedInputNodesOnHandle( export function connectedInputNodesOnHandle(
nodeId: string, nodeId: string,
handleId: string, handleId: string,
{ nodes, edges }: { nodes: NodeType[]; edges: Edge[] }, { nodes, edges }: { nodes: NodeType[]; edges: Edge[] }
) { ) {
const connectedNodes: Array<{ name: string; id: string; isGroup: boolean }> = const connectedNodes: Array<{ name: string; id: string; isGroup: boolean }> =
[]; [];
@ -1032,7 +1032,7 @@ export function connectedInputNodesOnHandle(
export function updateProxyIdsOnTemplate( export function updateProxyIdsOnTemplate(
template: APITemplateType, template: APITemplateType,
idsMap: { [key: string]: string }, idsMap: { [key: string]: string }
) { ) {
Object.keys(template).forEach((key) => { Object.keys(template).forEach((key) => {
if (template[key].proxy && idsMap[template[key].proxy!.id]) { if (template[key].proxy && idsMap[template[key].proxy!.id]) {
@ -1043,7 +1043,7 @@ export function updateProxyIdsOnTemplate(
export function updateEdgesIds( export function updateEdgesIds(
edges: Edge[], edges: Edge[],
idsMap: { [key: string]: string }, idsMap: { [key: string]: string }
) { ) {
edges.forEach((edge) => { edges.forEach((edge) => {
let targetHandle: targetHandleType = edge.data.targetHandle; let targetHandle: targetHandleType = edge.data.targetHandle;
@ -1084,7 +1084,7 @@ export function expandGroupNode(
nodes: Node[], nodes: Node[],
edges: Edge[], edges: Edge[],
setNodes: (update: Node[] | ((oldState: Node[]) => Node[])) => void, setNodes: (update: Node[] | ((oldState: Node[]) => Node[])) => void,
setEdges: (update: Edge[] | ((oldState: Edge[]) => Edge[])) => void, setEdges: (update: Edge[] | ((oldState: Edge[]) => Edge[])) => void
) { ) {
const idsMap = updateIds(flow!.data!); const idsMap = updateIds(flow!.data!);
updateProxyIdsOnTemplate(template, idsMap); updateProxyIdsOnTemplate(template, idsMap);
@ -1127,7 +1127,7 @@ export function expandGroupNode(
const lastNode = cloneDeep(findLastNode(flow!.data!)); const lastNode = cloneDeep(findLastNode(flow!.data!));
newEdge.source = lastNode!.id; newEdge.source = lastNode!.id;
let newSourceHandle: sourceHandleType = scapeJSONParse( let newSourceHandle: sourceHandleType = scapeJSONParse(
newEdge.sourceHandle!, newEdge.sourceHandle!
); );
newSourceHandle.id = lastNode!.id; newSourceHandle.id = lastNode!.id;
newEdge.data.sourceHandle = newSourceHandle; newEdge.data.sourceHandle = newSourceHandle;
@ -1184,7 +1184,7 @@ export function expandGroupNode(
export function getGroupStatus( export function getGroupStatus(
flow: FlowType, flow: FlowType,
ssData: { [key: string]: { valid: boolean; params: string } }, ssData: { [key: string]: { valid: boolean; params: string } }
) { ) {
let status = { valid: true, params: SUCCESS_BUILD }; let status = { valid: true, params: SUCCESS_BUILD };
const { nodes } = flow.data!; const { nodes } = flow.data!;
@ -1203,7 +1203,7 @@ export function getGroupStatus(
export function createFlowComponent( export function createFlowComponent(
nodeData: NodeDataType, nodeData: NodeDataType,
version: string, version: string
): FlowType { ): FlowType {
const flowNode: FlowType = { const flowNode: FlowType = {
data: { data: {
@ -1239,7 +1239,7 @@ export function downloadNode(NodeFLow: FlowType) {
export function updateComponentNameAndType( export function updateComponentNameAndType(
data: any, data: any,
component: NodeDataType, component: NodeDataType
) {} ) {}
export function removeFileNameFromComponents(flow: FlowType) { export function removeFileNameFromComponents(flow: FlowType) {
@ -1313,7 +1313,7 @@ export function extractFieldsFromComponenents(data: APIObjectType) {
export function downloadFlow( export function downloadFlow(
flow: FlowType, flow: FlowType,
flowName: string, flowName: string,
flowDescription?: string, flowDescription?: string
) { ) {
let clonedFlow = cloneDeep(flow); let clonedFlow = cloneDeep(flow);
removeFileNameFromComponents(clonedFlow); removeFileNameFromComponents(clonedFlow);
@ -1323,7 +1323,7 @@ export function downloadFlow(
...clonedFlow, ...clonedFlow,
name: flowName, name: flowName,
description: flowDescription, description: flowDescription,
}), })
)}`; )}`;
// create a link element and set its properties // create a link element and set its properties
@ -1338,7 +1338,7 @@ export function downloadFlow(
export function downloadFlows() { export function downloadFlows() {
downloadFlowsFromDatabase().then((flows) => { downloadFlowsFromDatabase().then((flows) => {
const jsonString = `data:text/json;chatset=utf-8,${encodeURIComponent( const jsonString = `data:text/json;chatset=utf-8,${encodeURIComponent(
JSON.stringify(flows), JSON.stringify(flows)
)}`; )}`;
// create a link element and set its properties // create a link element and set its properties
@ -1362,7 +1362,7 @@ export function getRandomDescription(): string {
export const createNewFlow = ( export const createNewFlow = (
flowData: ReactFlowJsonObject, flowData: ReactFlowJsonObject,
flow: FlowType, flow: FlowType,
folderId: string, folderId: string
) => { ) => {
return { return {
description: flow?.description ?? getRandomDescription(), description: flow?.description ?? getRandomDescription(),

26
src/frontend/src/utils/utils.ts
View file

@ -2,9 +2,7 @@ import { ColDef, ColGroupDef } from "ag-grid-community";
import clsx, { ClassValue } from "clsx"; import clsx, { ClassValue } from "clsx";
import { twMerge } from "tailwind-merge"; import { twMerge } from "tailwind-merge";
import TableAutoCellRender from "../components/tableAutoCellRender"; import TableAutoCellRender from "../components/tableAutoCellRender";
import { priorityFields } from "../constants/constants"; import { APIDataType, InputFieldType } from "../types/api";
import { ADJECTIVES, DESCRIPTIONS, NOUNS } from "../flow_constants";
import { APIDataType, TemplateVariableType } from "../types/api";
import { import {
groupedObjType, groupedObjType,
nodeGroupedObjType, nodeGroupedObjType,
@ -57,7 +55,7 @@ export function normalCaseToSnakeCase(str: string): string {
export function toTitleCase( export function toTitleCase(
str: string | undefined, str: string | undefined,
isNodeField?: boolean, isNodeField?: boolean
): string { ): string {
if (!str) return ""; if (!str) return "";
let result = str let result = str
@ -66,7 +64,7 @@ export function toTitleCase(
if (isNodeField) return word; if (isNodeField) return word;
if (index === 0) { if (index === 0) {
return checkUpperWords( return checkUpperWords(
word[0].toUpperCase() + word.slice(1).toLowerCase(), word[0].toUpperCase() + word.slice(1).toLowerCase()
); );
} }
return checkUpperWords(word.toLowerCase()); return checkUpperWords(word.toLowerCase());
@ -79,7 +77,7 @@ export function toTitleCase(
if (isNodeField) return word; if (isNodeField) return word;
if (index === 0) { if (index === 0) {
return checkUpperWords( return checkUpperWords(
word[0].toUpperCase() + word.slice(1).toLowerCase(), word[0].toUpperCase() + word.slice(1).toLowerCase()
); );
} }
return checkUpperWords(word.toLowerCase()); return checkUpperWords(word.toLowerCase());
@ -183,7 +181,7 @@ export function checkLocalStorageKey(key: string): boolean {
export function IncrementObjectKey( export function IncrementObjectKey(
object: object, object: object,
key: string, key: string
): { newKey: string; increment: number } { ): { newKey: string; increment: number } {
let count = 1; let count = 1;
const type = removeCountFromString(key); const type = removeCountFromString(key);
@ -218,7 +216,7 @@ export function groupByFamily(
data: APIDataType, data: APIDataType,
baseClasses: string, baseClasses: string,
left: boolean, left: boolean,
flow?: NodeType[], flow?: NodeType[]
): groupedObjType[] { ): groupedObjType[] {
const baseClassesSet = new Set(baseClasses.split("\n")); const baseClassesSet = new Set(baseClasses.split("\n"));
let arrOfPossibleInputs: Array<{ let arrOfPossibleInputs: Array<{
@ -236,7 +234,7 @@ export function groupByFamily(
let checkedNodes = new Map(); let checkedNodes = new Map();
const excludeTypes = new Set(["bool", "float", "code", "file", "int"]); const excludeTypes = new Set(["bool", "float", "code", "file", "int"]);
const checkBaseClass = (template: TemplateVariableType) => { const checkBaseClass = (template: InputFieldType) => {
return ( return (
template.type && template.type &&
template.show && template.show &&
@ -244,7 +242,7 @@ export function groupByFamily(
baseClassesSet.has(template.type)) || baseClassesSet.has(template.type)) ||
(template.input_types && (template.input_types &&
template.input_types.some((inputType) => template.input_types.some((inputType) =>
baseClassesSet.has(inputType), baseClassesSet.has(inputType)
))) )))
); );
}; };
@ -264,7 +262,7 @@ export function groupByFamily(
hasBaseClassInBaseClasses: hasBaseClassInBaseClasses:
foundNode?.hasBaseClassInBaseClasses || foundNode?.hasBaseClassInBaseClasses ||
nodeData.node!.base_classes.some((baseClass) => nodeData.node!.base_classes.some((baseClass) =>
baseClassesSet.has(baseClass), baseClassesSet.has(baseClass)
), //seta como anterior ou verifica se o node tem base class ), //seta como anterior ou verifica se o node tem base class
displayName: nodeData.node?.display_name, displayName: nodeData.node?.display_name,
}); });
@ -281,10 +279,10 @@ export function groupByFamily(
if (!foundNode) { if (!foundNode) {
foundNode = { foundNode = {
hasBaseClassInTemplate: Object.values(node!.template).some( hasBaseClassInTemplate: Object.values(node!.template).some(
checkBaseClass, checkBaseClass
), ),
hasBaseClassInBaseClasses: node!.base_classes.some((baseClass) => hasBaseClassInBaseClasses: node!.base_classes.some((baseClass) =>
baseClassesSet.has(baseClass), baseClassesSet.has(baseClass)
), ),
displayName: node?.display_name, displayName: node?.display_name,
}; };
@ -353,7 +351,7 @@ export function isTimeStampString(str: string): boolean {
export function extractColumnsFromRows( export function extractColumnsFromRows(
rows: object[], rows: object[],
mode: "intersection" | "union", mode: "intersection" | "union"
): (ColDef<any> | ColGroupDef<any>)[] { ): (ColDef<any> | ColGroupDef<any>)[] {
const columnsKeys: { [key: string]: ColDef<any> | ColGroupDef<any> } = {}; const columnsKeys: { [key: string]: ColDef<any> | ColGroupDef<any> } = {};
if (rows.length === 0) { if (rows.length === 0) {