Feat: conversation variable & variable assigner node (#7222)

Signed-off-by: -LAN- <laipz8200@outlook.com>
Co-authored-by: Joel <iamjoel007@gmail.com>
Co-authored-by: -LAN- <laipz8200@outlook.com>

web/app/components/workflow/header/chat-variable-button.tsx

@@ -0,0 +1,24 @@
+import { memo } from 'react'
+import Button from '@/app/components/base/button'
+import { BubbleX } from '@/app/components/base/icons/src/vender/line/others'
+import { useStore } from '@/app/components/workflow/store'
+
+const ChatVariableButton = ({ disabled }: { disabled: boolean }) => {
+  const setShowChatVariablePanel = useStore(s => s.setShowChatVariablePanel)
+  const setShowEnvPanel = useStore(s => s.setShowEnvPanel)
+  const setShowDebugAndPreviewPanel = useStore(s => s.setShowDebugAndPreviewPanel)
+
+  const handleClick = () => {
+    setShowChatVariablePanel(true)
+    setShowEnvPanel(false)
+    setShowDebugAndPreviewPanel(false)
+  }
+
+  return (
+    <Button className='p-2' disabled={disabled} onClick={handleClick}>
+      <BubbleX className='w-4 h-4 text-components-button-secondary-text' />
+    </Button>
+  )
+}
+
+export default memo(ChatVariableButton)