feat(ui): WorkflowNew page

ui/src/components/core/Version.tsx

@@ -1,5 +1,5 @@
 import { useTranslation } from "react-i18next";
-import { BookOutlined as BookOutlinedIcon } from "@ant-design/icons";
+import { ReadOutlined as ReadOutlinedIcon } from "@ant-design/icons";
 import { Divider, Space, Typography } from "antd";
 
 import { version } from "@/domain/version";
@@ -16,7 +16,7 @@ const Version = ({ className, style }: VersionProps) => {
     <Space className={className} style={style} size={4}>
       <Typography.Link type="secondary" href="https://docs.certimate.me" target="_blank">
         <div className="flex items-center justify-center space-x-1">
-          <BookOutlinedIcon />
+          <ReadOutlinedIcon />
           <span>{t("common.menu.document")}</span>
         </div>
       </Typography.Link>

ui/src/components/workflow/AddNode.tsx

@@ -1,7 +1,7 @@
 import { PlusOutlined as PlusOutlinedIcon } from "@ant-design/icons";
 import { Dropdown } from "antd";
 
-import { newWorkflowNode, workflowNodeDropdownList, type WorkflowNodeType } from "@/domain/workflow";
+import { type WorkflowNodeType, newNode, workflowNodeDropdownList } from "@/domain/workflow";
 import { useZustandShallowSelector } from "@/hooks";
 import { useWorkflowStore } from "@/stores/workflow";
 
@@ -12,7 +12,7 @@ const AddNode = ({ data }: NodeProps | BrandNodeProps) => {
   const { addNode } = useWorkflowStore(useZustandShallowSelector(["addNode"]));
 
   const handleTypeSelected = (type: WorkflowNodeType, provider?: string) => {
-    const node = newWorkflowNode(type, {
+    const node = newNode(type, {
       providerType: provider,
     });
 

ui/src/components/workflow/DropdownMenuItemIcon.tsx

@@ -1,11 +1,18 @@
-import { CloudUpload, GitFork, Megaphone, NotebookPen } from "lucide-react";
+import {
+  CloudUploadOutlined as CloudUploadOutlinedIcon,
+  SendOutlined as SendOutlinedIcon,
+  SisternodeOutlined as SisternodeOutlinedIcon,
+  SolutionOutlined as SolutionOutlinedIcon,
+} from "@ant-design/icons";
+import { Avatar } from "antd";
+
 import { type WorkflowNodeDropdwonItemIcon, WorkflowNodeDropdwonItemIconType } from "@/domain/workflow";
 
 const icons = new Map([
-  ["NotebookPen", <NotebookPen size={16} />],
-  ["CloudUpload", <CloudUpload size={16} />],
-  ["GitFork", <GitFork size={16} />],
-  ["Megaphone", <Megaphone size={16} />],
+  ["ApplyNodeIcon", <SolutionOutlinedIcon />],
+  ["DeployNodeIcon", <CloudUploadOutlinedIcon />],
+  ["BranchNodeIcon", <SisternodeOutlinedIcon />],
+  ["NotifyNodeIcon", <SendOutlinedIcon />],
 ]);
 
 const DropdownMenuItemIcon = ({ type, name }: WorkflowNodeDropdwonItemIcon) => {
@@ -13,7 +20,7 @@ const DropdownMenuItemIcon = ({ type, name }: WorkflowNodeDropdwonItemIcon) => {
     if (type === WorkflowNodeDropdwonItemIconType.Icon) {
       return icons.get(name);
     } else {
-      return <img src={name} className="inline-block size-4" />;
+      return <Avatar src={name} size="small" />;
     }
   };