feat: workflow new nodes (#4683)

Co-authored-by: Joel <iamjoel007@gmail.com>
Co-authored-by: Patryk Garstecki <patryk20120@yahoo.pl>
Co-authored-by: Sebastian.W <thiner@gmail.com>
Co-authored-by: 呆萌闷油瓶 <253605712@qq.com>
Co-authored-by: takatost <takatost@users.noreply.github.com>
Co-authored-by: rechardwang <wh_goodjob@163.com>
Co-authored-by: Nite Knite <nkCoding@gmail.com>
Co-authored-by: Chenhe Gu <guchenhe@gmail.com>
Co-authored-by: Joshua <138381132+joshua20231026@users.noreply.github.com>
Co-authored-by: Weaxs <459312872@qq.com>
Co-authored-by: Ikko Eltociear Ashimine <eltociear@gmail.com>
Co-authored-by: leejoo0 <81673835+leejoo0@users.noreply.github.com>
Co-authored-by: JzoNg <jzongcode@gmail.com>
Co-authored-by: sino <sino2322@gmail.com>
Co-authored-by: Vikey Chen <vikeytk@gmail.com>
Co-authored-by: wanghl <Wang-HL@users.noreply.github.com>
Co-authored-by: Haolin Wang-汪皓临 <haolin.wang@atlaslovestravel.com>
Co-authored-by: Zixuan Cheng <61724187+Theysua@users.noreply.github.com>
Co-authored-by: crazywoola <100913391+crazywoola@users.noreply.github.com>
Co-authored-by: Bowen Liang <bowenliang@apache.org>
Co-authored-by: Bowen Liang <liangbowen@gf.com.cn>
Co-authored-by: fanghongtai <42790567+fanghongtai@users.noreply.github.com>
Co-authored-by: wxfanghongtai <wxfanghongtai@gf.com.cn>
Co-authored-by: Matri <qjp@bithuman.io>
Co-authored-by: Benjamin <benjaminx@gmail.com>

web/app/components/workflow/nodes/variable-assigner/components/node-variable-item.tsx

@@ -0,0 +1,36 @@
+import { memo } from 'react'
+import { VarBlockIcon } from '@/app/components/workflow/block-icon'
+import { Line3 } from '@/app/components/base/icons/src/public/common'
+import { Variable02 } from '@/app/components/base/icons/src/vender/solid/development'
+import type { Node } from '@/app/components/workflow/types'
+import { BlockEnum } from '@/app/components/workflow/types'
+
+type NodeVariableItemProps = {
+  node: Node
+  varName: string
+}
+const NodeVariableItem = ({
+  node,
+  varName,
+}: NodeVariableItemProps) => {
+  return (
+    <div className='relative flex items-center mt-0.5 h-6 bg-gray-100 rounded-md  px-1 text-xs font-normal text-gray-700' >
+      <div className='flex items-center'>
+        <div className='p-[1px]'>
+          <VarBlockIcon
+            className='!text-gray-900'
+            type={node?.data.type || BlockEnum.Start}
+          />
+        </div>
+        <div className='max-w-[85px] truncate mx-0.5 text-xs font-medium text-gray-700' title={node?.data.title}>{node?.data.title}</div>
+        <Line3 className='mr-0.5'></Line3>
+      </div>
+      <div className='flex items-center text-primary-600'>
+        <Variable02 className='w-3.5 h-3.5' />
+        <div className='max-w-[75px] truncate ml-0.5 text-xs font-medium' title={varName}>{varName}</div>
+      </div>
+    </div>
+  )
+}
+
+export default memo(NodeVariableItem)