flow.ts

Overview

The flow.ts file defines TypeScript types and interfaces primarily used to model a domain-specific language (DSL) for building and managing flow-based applications or workflows. It focuses on representing flow components, nodes, operators, and graph structures, which are essential for constructing, manipulating, and visualizing complex flows or pipelines, likely in a low-code/no-code or AI/ML orchestration environment.

This file does not contain executable logic (e.g., functions or classes with methods) but provides a comprehensive type system that ensures type safety and clear contracts across the flow-related modules of the system. The definitions here are foundational for flow creation, editing, execution, and visualization using React-based UI components (as indicated by imports from @xyflow/react).


Detailed Explanation of Types and Interfaces

1. Core DSL and Flow Structures

DSLComponents

export type DSLComponents = Record<string, IOperator>;

DSL

export interface DSL {
  components: DSLComponents;
  history: any[];
  path?: string[][];
  answer?: any[];
  graph?: IGraph;
  messages: Message[];
  reference: IReference[];
  globals: Record<string, any>;
  retrieval: IReference[];
}

IOperator

export interface IOperator {
  obj: IOperatorNode;
  downstream: string[];
  upstream: string[];
  parent_id?: string;
}

IOperatorNode

export interface IOperatorNode {
  component_name: string;
  params: Record<string, unknown>;
}

2. Flow Metadata Interfaces

IFlow

export declare interface IFlow {
  avatar?: string;
  canvas_type: null;
  create_date: string;
  create_time: number;
  description: string;
  dsl: DSL;
  id: string;
  title: string;
  update_date: string;
  update_time: number;
  user_id: string;
  permission: string;
  nickname: string;
}

IFlowTemplate

export interface IFlowTemplate {
  avatar: string;
  canvas_type: string;
  create_date: string;
  create_time: number;
  description: {
    en: string;
    zh: string;
  };
  dsl: DSL;
  id: string;
  title: {
    en: string;
    zh: string;
  };
  update_date: string;
  update_time: number;
}

3. Form Interfaces for Operator Configuration

These interfaces represent the expected shape of configuration forms for various operator types:

IGenerateForm

export interface IGenerateForm {
  max_tokens?: number;
  temperature?: number;
  top_p?: number;
  presence_penalty?: number;
  frequency_penalty?: number;
  cite?: boolean;
  prompt: number;
  llm_id: string;
  parameters: { key: string; component_id: string };
}

ICategorizeItem and ICategorizeItemResult

export interface ICategorizeItem {
  name: string;
  description?: string;
  examples?: string;
  to?: string;
  index: number;
}

export type ICategorizeItemResult = Record<
  string,
  Omit<ICategorizeItem, 'name'>
>;

ICategorizeForm

export interface ICategorizeForm extends IGenerateForm {
  category_description: ICategorizeItemResult;
}

IRelevantForm

export interface IRelevantForm extends IGenerateForm {
  yes: string;
  no: string;
}

ISwitchForm and Related Interfaces

export interface ISwitchCondition {
  items: ISwitchItem[];
  logical_operator: string;
  to: string[] | string;
}

export interface ISwitchItem {
  cpn_id: string;
  operator: string;
  value: string;
}

export interface ISwitchForm {
  conditions: ISwitchCondition[];
  end_cpn_id: string;
  no: string;
}

IBeginForm

export interface IBeginForm {
  prologue?: string;
}

IRetrievalForm

export interface IRetrievalForm {
  similarity_threshold?: number;
  keywords_similarity_weight?: number;
  top_n?: number;
  top_k?: number;
  rerank_id?: string;
  empty_response?: string;
  kb_ids: string[];
}

ICodeForm

export interface ICodeForm {
  inputs?: Array<{ name?: string; component_id?: string }>;
  lang: string;
  script?: string;
}

4. Node Types and Graph Structure

BaseNodeData<TForm>

export type BaseNodeData<TForm extends any> = {
  label: string; // operator type
  name: string; // operator name
  color?: string;
  form?: TForm;
};

BaseNode<T>

export type BaseNode<T = any> = Node<BaseNodeData<T>>;

Specialized Node Types

Examples include:

RAGFlowNodeType

export type RAGFlowNodeType =
  | IBeginNode
  | IRetrievalNode
  | IGenerateNode
  | ICategorizeNode
  | ISwitchNode
  | IRagNode
  | IRelevantNode
  | ILogicNode
  | INoteNode
  | IMessageNode
  | IRewriteNode
  | IInvokeNode
  | ITemplateNode
  | IEmailNode
  | IIterationNode
  | IIterationStartNode
  | IKeywordNode;

IGraph

export interface IGraph {
  nodes: RAGFlowNodeType[];
  edges: Edge[];
}

Important Implementation Details and Algorithms


Interaction with Other Parts of the System


Usage Examples

Example 1: Defining a simple generate node

const generateNode: IGenerateNode = {
  id: "node-1",
  data: {
    label: "Generate",
    name: "Text Generator",
    form: {
      max_tokens: 100,
      temperature: 0.7,
      prompt: 1,
      llm_id: "gpt-4",
      parameters: { key: "param1", component_id: "comp123" },
    },
    color: "#00FF00",
  },
  position: { x: 100, y: 200 },
};

Example 2: Creating a simple flow graph

const graph: IGraph = {
  nodes: [generateNode],
  edges: [],
};

Mermaid Class Diagram

classDiagram
    class DSL {
        +DSLComponents components
        +any[] history
        +string[][]? path
        +any[]? answer
        +IGraph? graph
        +Message[] messages
        +IReference[] reference
        +Record~string, any~ globals
        +IReference[] retrieval
    }
    
    class IOperator {
        +IOperatorNode obj
        +string[] downstream
        +string[] upstream
        +string? parent_id
    }
    
    class IOperatorNode {
        +string component_name
        +Record~string, unknown~ params
    }
    
    class IFlow {
        +string? avatar
        +null canvas_type
        +string create_date
        +number create_time
        +string description
        +DSL dsl
        +string id
        +string title
        +string update_date
        +number update_time
        +string user_id
        +string permission
        +string nickname
    }
    
    class IGraph {
        +RAGFlowNodeType[] nodes
        +Edge[] edges
    }
    
    class BaseNodeData~TForm~ {
        +string label
        +string name
        +string? color
        +TForm? form
    }
    
    class BaseNode~T~ {
        +BaseNodeData~T~ data
    }
    
    DSL "1" *-- "*" IOperator : components
    IOperator "1" *-- "1" IOperatorNode : obj
    IFlow "1" *-- "1" DSL : dsl
    IGraph "1" *-- "*" BaseNode : nodes
    IGraph "1" *-- "*" Edge : edges
    BaseNode "1" *-- "1" BaseNodeData : data

Summary

The flow.ts file is a critical type definition module that:

This file provides the foundation for flow construction, validation, visualization, and execution in the broader system.


If you require documentation for specific related files or higher-level architecture, please provide those files or context.