chore: add warning ui for agentic stragey

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

@@ -0,0 +1,47 @@
+import type { FC } from 'react'
+import type { NodeProps } from '../../types'
+import type { AgentNodeType } from './types'
+import { SettingItem } from '../_base/components/setting-item'
+import ModelSelector from '@/app/components/header/account-setting/model-provider-page/model-selector'
+import { Group, GroupLabel } from '../_base/components/group'
+import { ToolIcon } from './components/tool-icon'
+
+const AgentNode: FC<NodeProps<AgentNodeType>> = (props) => {
+  const strategySelected = true
+  return <div className='mb-1 px-3 py-1 space-y-1'>
+    {strategySelected
+      // TODO: add tooltip for this
+      ? <SettingItem label='Strategy' indicator='red'>
+        ReAct
+      </SettingItem>
+      : <SettingItem label='Agentic strategy Not Set' />}
+    <Group label={
+      <GroupLabel className='mt-1'>
+        Model
+      </GroupLabel>}>
+      <ModelSelector
+        modelList={[]}
+        readonly
+      />
+      <ModelSelector
+        modelList={[]}
+        readonly
+      />
+      <ModelSelector
+        modelList={[]}
+        readonly
+      />
+    </Group>
+    <Group label={<GroupLabel className='mt-1'>
+      Toolbox
+    </GroupLabel>}>
+      <div className='grid grid-cols-10 gap-0.5'>
+        <ToolIcon src='/logo/logo.png' />
+        <ToolIcon src='/logo/logo.png' status='error' tooltip='Gmail Sender is not installed' />
+        <ToolIcon src='/logo/logo.png' status='warning' tooltip='DuckDuckGo AI Search Not Authorized' />
+      </div>
+    </Group>
+  </div>
+}
+
+export default AgentNode