From 1287fd331192d809c79e8b6066215e238502c8da Mon Sep 17 00:00:00 2001 From: Emir Karabeg Date: Thu, 16 Jan 2025 18:06:43 -0800 Subject: [PATCH] Simplified block types and changed conditional to function --- app/w/[id]/workflow.tsx | 3 +-- blocks/configs/conditional.ts | 37 ------------------------------- blocks/configs/function.ts | 24 ++++++++++++++++++++ blocks/configs/index.ts | 18 ++++++++------- blocks/types/block.ts | 3 +-- components/icons.tsx | 2 +- stores/workflow/types.ts | 6 ++--- stores/workflow/workflow-store.ts | 3 +-- 8 files changed, 41 insertions(+), 55 deletions(-) delete mode 100644 blocks/configs/conditional.ts create mode 100644 blocks/configs/function.ts diff --git a/app/w/[id]/workflow.tsx b/app/w/[id]/workflow.tsx index c162bf2138..f390841141 100644 --- a/app/w/[id]/workflow.tsx +++ b/app/w/[id]/workflow.tsx @@ -21,7 +21,6 @@ import 'reactflow/dist/style.css' import { getBlock } from '../../../blocks/configs' import { WorkflowBlock } from '../components/workflow-block/workflow-block' import { BlockConfig } from '../../../blocks/types/block' -import { BlockType } from '../../../blocks/types/block' import { useWorkflowStore } from '@/stores/workflow/workflow-store' import { initializeStateLogger } from '@/stores/workflow/state-logger' @@ -29,7 +28,7 @@ import { initializeStateLogger } from '@/stores/workflow/state-logger' * Represents the data structure for a workflow node */ interface WorkflowNodeData { - type: BlockType + type: string config: BlockConfig name: string } diff --git a/blocks/configs/conditional.ts b/blocks/configs/conditional.ts deleted file mode 100644 index 5a6c4e612e..0000000000 --- a/blocks/configs/conditional.ts +++ /dev/null @@ -1,37 +0,0 @@ -import { ConditionalIcon } from '@/components/icons' -import { BlockConfig } from '../types/block' - -export const ConditionalBlock: BlockConfig = { - type: 'conditional', - toolbar: { - title: 'Conditional', - description: 'Add branching logic', - bgColor: '#FF972F', - icon: ConditionalIcon, - category: 'basic', - }, - workflow: { - outputType: 'boolean', - subBlocks: [ - { - id: 'conditionType', - title: 'Condition Type', - type: 'dropdown', - layout: 'full', - options: [ - 'Equals', - 'Contains', - 'Greater Than', - 'Less Than', - 'Regular Expression', - ], - }, - { - id: 'value', - title: 'Value', - type: 'short-input', - layout: 'full', - }, - ], - }, -} \ No newline at end of file diff --git a/blocks/configs/function.ts b/blocks/configs/function.ts new file mode 100644 index 0000000000..7456e9cf39 --- /dev/null +++ b/blocks/configs/function.ts @@ -0,0 +1,24 @@ +import { CodeIcon } from '@/components/icons' +import { BlockConfig } from '../types/block' + +export const FunctionBlock: BlockConfig = { + type: 'function', + toolbar: { + title: 'Function', + description: 'Add custom logic', + bgColor: '#FF8D2F', + icon: CodeIcon, + category: 'basic', + }, + workflow: { + outputType: 'json', + subBlocks: [ + { + id: 'code', + title: 'Code', + type: 'code', + layout: 'full', + }, + ], + }, +} \ No newline at end of file diff --git a/blocks/configs/index.ts b/blocks/configs/index.ts index 5f8223b7c2..b70c82ae04 100644 --- a/blocks/configs/index.ts +++ b/blocks/configs/index.ts @@ -1,27 +1,29 @@ -import { BlockConfig, BlockType } from '../types/block' +import { BlockConfig } from '../types/block' + +// Import blocks import { AgentBlock } from './agent' import { ApiBlock } from './api' -import { ConditionalBlock } from './conditional' +import { FunctionBlock } from './function' -// Export individual blocks -export { AgentBlock, ApiBlock, ConditionalBlock } +// Export blocks for ease of use +export { AgentBlock, ApiBlock, FunctionBlock } // Combined blocks registry export const BLOCKS: BlockConfig[] = [ AgentBlock, ApiBlock, - ConditionalBlock, + FunctionBlock, ] // Helper functions -export const getBlock = (type: BlockType): BlockConfig | undefined => +export const getBlock = (type: string): BlockConfig | undefined => BLOCKS.find(block => block.type === type) export const getBlocksByCategory = (category: 'basic' | 'advanced'): BlockConfig[] => BLOCKS.filter(block => block.toolbar.category === category) -export const getAllBlockTypes = (): BlockType[] => +export const getAllBlockTypes = (): string[] => BLOCKS.map(block => block.type) -export const isValidBlockType = (type: string): type is BlockType => +export const isValidBlockType = (type: string): type is string => BLOCKS.some(block => block.type === type) \ No newline at end of file diff --git a/blocks/types/block.ts b/blocks/types/block.ts index e85f8baa17..824ac46a3c 100644 --- a/blocks/types/block.ts +++ b/blocks/types/block.ts @@ -1,7 +1,6 @@ import type { SVGProps } from 'react' import type { JSX } from 'react' -export type BlockType = 'agent' | 'api' | 'conditional' export type BlockIcon = (props: SVGProps) => JSX.Element export type BlockCategory = 'basic' | 'advanced' export type OutputType = 'string' | 'number' | 'json' | 'boolean' @@ -34,7 +33,7 @@ export type OutputTypeConfig = OutputType | { } export interface BlockConfig { - type: BlockType + type: string toolbar: { title: string description: string diff --git a/components/icons.tsx b/components/icons.tsx index 5b807d6de0..65086886fa 100644 --- a/components/icons.tsx +++ b/components/icons.tsx @@ -598,7 +598,7 @@ export function CodeIcon(props: SVGProps) { diff --git a/stores/workflow/types.ts b/stores/workflow/types.ts index d12a0b56fd..ae15a66e99 100644 --- a/stores/workflow/types.ts +++ b/stores/workflow/types.ts @@ -1,5 +1,5 @@ import { Node, Edge } from 'reactflow' -import { BlockType, OutputType, SubBlockType } from '@/blocks/types/block' +import { OutputType, SubBlockType } from '@/blocks/types/block' export interface Position { x: number @@ -8,7 +8,7 @@ export interface Position { export interface BlockState { id: string - type: BlockType + type: string name: string position: Position subBlocks: Record @@ -30,7 +30,7 @@ export interface WorkflowState { export interface WorkflowActions { addBlock: ( id: string, - type: BlockType, + type: string, name: string, position: Position ) => void diff --git a/stores/workflow/workflow-store.ts b/stores/workflow/workflow-store.ts index 64c0e716c7..45a3f68648 100644 --- a/stores/workflow/workflow-store.ts +++ b/stores/workflow/workflow-store.ts @@ -1,7 +1,6 @@ import { create } from 'zustand' import { devtools } from 'zustand/middleware' import { Edge } from 'reactflow' -import { BlockType } from '@/blocks/types/block' import { Position, WorkflowStore } from './types' import { getBlock } from '@/blocks/configs' @@ -16,7 +15,7 @@ export const useWorkflowStore = create()( (set, get) => ({ ...initialState, - addBlock: (id: string, type: BlockType, name: string, position: Position) => { + addBlock: (id: string, type: string, name: string, position: Position) => { const blockConfig = getBlock(type) if (!blockConfig) return