delete

web/app/components/workflow/block-selector/utils.ts

-import type { BlockEnum } from '../types'
-import { BLOCKS } from './constants'
-
-export const getBlockByType = (type: BlockEnum) => {
-  return BLOCKS.find(block => block.type === type)
-}

web/app/components/workflow/nodes/_base/node.tsx

@@ -12,7 +12,6 @@ import type { NodeProps } from 'reactflow'
 import { getOutgoers } from 'reactflow'
 import { useWorkflowContext } from '../../context'
 import BlockSelector from '../../block-selector'
-import { getBlockByType } from '../../block-selector/utils'
 import BlockIcon from '../../block-icon'
 import { Plus } from '@/app/components/base/icons/src/vender/line/general'
 
@@ -71,7 +70,7 @@ const BaseNode: FC<BaseNodeProps> = ({
           size='md'
         />
         <div className='text-[13px] font-semibold text-gray-700'>
-          {getBlockByType(currentNode!.data.type)?.title}
+          {data.title}
         </div>
       </div>
       {cloneElement(children, { id: nodeId, data })}

web/app/components/workflow/nodes/_base/panel.tsx

@@ -9,7 +9,6 @@ import {
 import type { NodeProps } from 'reactflow'
 import { useWorkflowContext } from '../../context'
 import BlockIcon from '../../block-icon'
-import { getBlockByType } from '../../block-selector/utils'
 import NextStep from './components/next-step'
 import { XClose } from '@/app/components/base/icons/src/vender/line/general'
 import { GitBranch01 } from '@/app/components/base/icons/src/vender/line/development'
@@ -37,7 +36,7 @@ const BasePanel: FC<BasePanelProps> = ({
             type={selectedNode!.data.type}
             size='md'
           />
-          <div className='grow py-1 text-base text-gray-900 font-semibold '>{getBlockByType(selectedNode!.data.type)?.title}</div>
+          <div className='grow py-1 text-base text-gray-900 font-semibold '>{data.title}</div>
           <div className='shrink-0 flex items-center'>
             <div
               className='flex items-center justify-center w-6 h-6 cursor-pointer'

web/app/components/workflow/nodes/constants.ts

@@ -23,7 +23,7 @@ import HttpPanel from './http/panel'
 import ToolNode from './tool/node'
 import ToolPanel from './tool/panel'
 
-export const NodeMap: Record<string, ComponentType> = {
+export const NodeComponentMap: Record<string, ComponentType> = {
   [BlockEnum.Start]: StartNode,
   [BlockEnum.End]: EndNode,
   [BlockEnum.DirectAnswer]: DirectAnswerNode,
@@ -37,7 +37,7 @@ export const NodeMap: Record<string, ComponentType> = {
   [BlockEnum.Tool]: ToolNode,
 }
 
-export const PanelMap: Record<string, ComponentType> = {
+export const PanelComponentMap: Record<string, ComponentType> = {
   [BlockEnum.Start]: StartPanel,
   [BlockEnum.End]: EndPanel,
   [BlockEnum.DirectAnswer]: DirectAnswerPanel,

web/app/components/workflow/nodes/index.tsx

@@ -6,8 +6,8 @@ import {
 } from 'reactflow'
 import { useWorkflowContext } from '../context'
 import {
-  NodeMap,
-  PanelMap,
+  NodeComponentMap,
+  PanelComponentMap,
 } from './constants'
 import BaseNode from './_base/node'
 import BasePanel from './_base/panel'
@@ -16,7 +16,7 @@ const CustomNode = ({
   id,
   data,
 }: NodeProps) => {
-  const NodeComponent = NodeMap[data.type]
+  const NodeComponent = NodeComponentMap[data.type]
 
   return (
     <>
@@ -40,13 +40,13 @@ const CustomNode = ({
   )
 }
 
-export const Panel = () => {
+export const Panel = memo(() => {
   const { selectedNode } = useWorkflowContext()
 
   if (!selectedNode)
     return null
 
-  const PanelComponent = PanelMap[selectedNode.data.type]
+  const PanelComponent = PanelComponentMap[selectedNode.data.type]
 
   return (
     <BasePanel
@@ -56,6 +56,8 @@ export const Panel = () => {
       <PanelComponent />
     </BasePanel>
   )
-}
+})
+
+Panel.displayName = 'Panel'
 
 export default memo(CustomNode)