Refactor sub-graph components structure

web/app/components/sub-graph/components/config-panel.tsx

@@ -1,11 +1,18 @@
 'use client'
 import type { FC } from 'react'
-import type { ConfigPanelProps, WhenOutputNoneOption } from './types'
+import type { WhenOutputNoneOption } from '../types'
 import { memo, useCallback, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import Field from '@/app/components/workflow/nodes/_base/components/field'
 import { cn } from '@/utils/classnames'
 
+type ConfigPanelProps = {
+  toolNodeId: string
+  paramKey: string
+  activeTab: 'settings' | 'lastRun'
+  onTabChange: (tab: 'settings' | 'lastRun') => void
+}
+
 const outputVariables = [
   { name: 'text', type: 'string' },
   { name: 'structured_output', type: 'object' },

web/app/components/workflow/nodes/tool/components/sub-graph-modal/store.ts

@@ -1,49 +0,0 @@
-import type { CreateSubGraphSlice, SubGraphSliceShape } from './types'
-
-const initialState: Omit<SubGraphSliceShape, 'setSubGraphContext' | 'setSubGraphNodes' | 'setSubGraphEdges' | 'setSelectedOutputVar' | 'setWhenOutputNone' | 'setDefaultValue' | 'setShowDebugPanel' | 'setIsRunning' | 'setParentAvailableVars' | 'resetSubGraph'> = {
-  parentToolNodeId: '',
-  parameterKey: '',
-  sourceAgentNodeId: '',
-  sourceVariable: [],
-
-  subGraphNodes: [],
-  subGraphEdges: [],
-
-  selectedOutputVar: [],
-  whenOutputNone: 'skip',
-  defaultValue: '',
-
-  showDebugPanel: false,
-  isRunning: false,
-
-  parentAvailableVars: [],
-}
-
-export const createSubGraphSlice: CreateSubGraphSlice = set => ({
-  ...initialState,
-
-  setSubGraphContext: context => set(() => ({
-    parentToolNodeId: context.parentToolNodeId,
-    parameterKey: context.parameterKey,
-    sourceAgentNodeId: context.sourceAgentNodeId,
-    sourceVariable: context.sourceVariable,
-  })),
-
-  setSubGraphNodes: nodes => set(() => ({ subGraphNodes: nodes })),
-
-  setSubGraphEdges: edges => set(() => ({ subGraphEdges: edges })),
-
-  setSelectedOutputVar: selector => set(() => ({ selectedOutputVar: selector })),
-
-  setWhenOutputNone: option => set(() => ({ whenOutputNone: option })),
-
-  setDefaultValue: value => set(() => ({ defaultValue: value })),
-
-  setShowDebugPanel: show => set(() => ({ showDebugPanel: show })),
-
-  setIsRunning: running => set(() => ({ isRunning: running })),
-
-  setParentAvailableVars: vars => set(() => ({ parentAvailableVars: vars })),
-
-  resetSubGraph: () => set(() => ({ ...initialState })),
-})

web/app/components/workflow/nodes/tool/components/sub-graph-modal/types.ts

@@ -1,44 +1,4 @@
-import type { StateCreator } from 'zustand'
-import type { Edge, Node, NodeOutPutVar, ValueSelector, VarType } from '@/app/components/workflow/types'
-
-export type SubGraphNodeData = {
-  isInSubGraph: boolean
-  subGraph_id: string
-  subGraphParamKey: string
-}
-
-export type SubGraphNode = Node & {
-  data: Node['data'] & SubGraphNodeData
-}
-
-export type SubGraphSourceNodeData = {
-  title: string
-  sourceAgentNodeId: string
-  sourceVariable: ValueSelector
-  sourceVarType: VarType
-  isReadOnly: true
-  isInSubGraph: true
-  subGraph_id: string
-  subGraphParamKey: string
-}
-
-export type WhenOutputNoneOption = 'skip' | 'error' | 'default'
-
-export type SubGraphConfig = {
-  enabled: boolean
-  startNodeId: string
-  selectedOutputVar: ValueSelector
-  whenOutputNone: WhenOutputNoneOption
-  defaultValue?: string
-}
-
-export type SubGraphOutputVariable = {
-  nodeId: string
-  nodeName: string
-  variable: string
-  type: VarType
-  description?: string
-}
+import type { ValueSelector } from '@/app/components/workflow/types'
 
 export type SubGraphModalProps = {
   isOpen: boolean
@@ -50,13 +10,6 @@ export type SubGraphModalProps = {
   agentNodeId: string
 }
 
-export type ConfigPanelProps = {
-  toolNodeId: string
-  paramKey: string
-  activeTab: 'settings' | 'lastRun'
-  onTabChange: (tab: 'settings' | 'lastRun') => void
-}
-
 export type SubGraphCanvasProps = {
   toolNodeId: string
   paramKey: string
@@ -64,40 +17,3 @@ export type SubGraphCanvasProps = {
   agentNodeId: string
   agentName: string
 }
-
-export type SubGraphSliceShape = {
-  parentToolNodeId: string
-  parameterKey: string
-  sourceAgentNodeId: string
-  sourceVariable: ValueSelector
-
-  subGraphNodes: SubGraphNode[]
-  subGraphEdges: Edge[]
-
-  selectedOutputVar: ValueSelector
-  whenOutputNone: WhenOutputNoneOption
-  defaultValue: string
-
-  showDebugPanel: boolean
-  isRunning: boolean
-
-  parentAvailableVars: NodeOutPutVar[]
-
-  setSubGraphContext: (context: {
-    parentToolNodeId: string
-    parameterKey: string
-    sourceAgentNodeId: string
-    sourceVariable: ValueSelector
-  }) => void
-  setSubGraphNodes: (nodes: SubGraphNode[]) => void
-  setSubGraphEdges: (edges: Edge[]) => void
-  setSelectedOutputVar: (selector: ValueSelector) => void
-  setWhenOutputNone: (option: WhenOutputNoneOption) => void
-  setDefaultValue: (value: string) => void
-  setShowDebugPanel: (show: boolean) => void
-  setIsRunning: (running: boolean) => void
-  setParentAvailableVars: (vars: NodeOutPutVar[]) => void
-  resetSubGraph: () => void
-}
-
-export type CreateSubGraphSlice = StateCreator<SubGraphSliceShape>