feat(ui): add @ant-design/icons

ui/src/components/workflow/DropdownMenuItemIcon.tsx

@@ -1,4 +1,4 @@
-import { WorkflowNodeDropdwonItemIcon, WorkflowNodeDropdwonItemIconType } from "@/domain/workflow";
+import { type WorkflowNodeDropdwonItemIcon, WorkflowNodeDropdwonItemIconType } from "@/domain/workflow";
 import { CloudUpload, GitFork, Megaphone, NotebookPen } from "lucide-react";
 
 const icons = new Map([

ui/src/components/workflow/node/ApplyNodeForm.tsx

@@ -3,8 +3,8 @@ import { useTranslation } from "react-i18next";
 import { useControllableValue } from "ahooks";
 import { AutoComplete, Button, Divider, Form, Input, InputNumber, Select, Switch, Typography, type AutoCompleteProps } from "antd";
 import { createSchemaFieldRule } from "antd-zod";
+import { PlusOutlined as PlusOutlinedIcon } from "@ant-design/icons";
 import z from "zod";
-import { Plus as PlusIcon } from "lucide-react";
 
 import AccessEditModal from "@/components/access/AccessEditModal";
 import AccessSelect from "@/components/access/AccessSelect";
@@ -77,11 +77,21 @@ const ApplyNodeForm = ({ data }: ApplyNodeFormProps) => {
 
   return (
     <Form {...formProps} form={formInst} disabled={formPending} layout="vertical">
-      <Form.Item name="domain" label={t("workflow.nodes.apply.form.domain.label")} rules={[formRule]}>
+      <Form.Item
+        name="domain"
+        label={t("workflow.nodes.apply.form.domain.label")}
+        rules={[formRule]}
+        tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow.nodes.apply.form.domain.tooltip") }}></span>}
+      >
         <Input placeholder={t("workflow.nodes.apply.form.domain.placeholder")} />
       </Form.Item>
 
-      <Form.Item name="email" label={t("workflow.nodes.apply.form.email.label")} rules={[formRule]}>
+      <Form.Item
+        name="email"
+        label={t("workflow.nodes.apply.form.email.label")}
+        rules={[formRule]}
+        tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow.nodes.apply.form.email.tooltip") }}></span>}
+      >
         <ContactEmailSelect placeholder={t("workflow.nodes.apply.form.email.placeholder")} />
       </Form.Item>
 
@@ -94,7 +104,7 @@ const ApplyNodeForm = ({ data }: ApplyNodeFormProps) => {
                 preset="add"
                 trigger={
                   <Button className="p-0" type="link">
-                    <PlusIcon size={14} />
+                    <PlusOutlinedIcon />
                     {t("workflow.nodes.apply.form.access.button")}
                   </Button>
                 }

ui/src/components/workflow/node/NotifyNodeForm.tsx

@@ -3,8 +3,8 @@ import { Link } from "react-router";
 import { useTranslation } from "react-i18next";
 import { Button, Form, Input, Select } from "antd";
 import { createSchemaFieldRule } from "antd-zod";
+import { RightOutlined as RightOutlinedIcon } from "@ant-design/icons";
 import { z } from "zod";
-import { ChevronRight as ChevronRightIcon } from "lucide-react";
 
 import { usePanel } from "../PanelProvider";
 import { useAntdForm, useZustandShallowSelector } from "@/hooks";
@@ -75,9 +75,9 @@ const NotifyNodeForm = ({ data }: NotifyNodeFormProps) => {
             <div className="flex-grow max-w-full truncate">{t("workflow.nodes.notify.form.channel.label")}</div>
             <div className="text-right">
               <Link className="ant-typography" to="/settings/notification" target="_blank">
-                <Button className="p-0" type="link">
+                <Button size="small" type="link">
                   {t("workflow.nodes.notify.form.channel.button")}
-                  <ChevronRightIcon size={14} />
+                  <RightOutlinedIcon className="text-xs" />
                 </Button>
               </Link>
             </div>

ui/src/components/workflow/run/WorkflowRunDetailDrawer.tsx

@@ -2,7 +2,6 @@ import { cloneElement, useMemo } from "react";
 import { useTranslation } from "react-i18next";
 import { useControllableValue } from "ahooks";
 import { Alert, Drawer } from "antd";
-import { CircleCheck as CircleCheckIcon, CircleX as CircleXIcon } from "lucide-react";
 
 import Show from "@/components/Show";
 import { type WorkflowRunModel } from "@/domain/workflowRun";
@@ -45,11 +44,11 @@ const WorkflowRunDetailDrawer = ({ data, loading, trigger, ...props }: WorkflowR
       <Drawer closable destroyOnClose open={open} loading={loading} placement="right" title={data?.id} width={640} onClose={() => setOpen(false)}>
         <Show when={!!data}>
           <Show when={data!.succeed}>
-            <Alert showIcon type="success" message={t("workflow_run.props.status.succeeded")} icon={<CircleCheckIcon size={16} />} />
+            <Alert showIcon type="success" message={t("workflow_run.props.status.succeeded")} />
           </Show>
 
           <Show when={!!data!.error}>
-            <Alert showIcon type="error" message={t("workflow_run.props.status.failed")} description={data!.error} icon={<CircleXIcon size={16} />} />
+            <Alert showIcon type="error" message={t("workflow_run.props.status.failed")} description={data!.error} />
           </Show>
 
           <div className="mt-4 p-4 bg-black text-stone-200 rounded-md">

ui/src/components/workflow/run/WorkflowRuns.tsx

@@ -3,7 +3,11 @@ import { useParams } from "react-router-dom";
 import { useTranslation } from "react-i18next";
 import { useRequest } from "ahooks";
 import { Button, Empty, notification, Space, Table, theme, Tooltip, Typography, type TableProps } from "antd";
-import { CircleCheck as CircleCheckIcon, CircleX as CircleXIcon, Eye as EyeIcon } from "lucide-react";
+import {
+  CheckCircleTwoTone as CheckCircleTwoToneIcon,
+  CloseCircleTwoTone as CloseCircleTwoToneIcon,
+  SelectOutlined as SelectOutlinedIcon,
+} from "@ant-design/icons";
 import { ClientResponseError } from "pocketbase";
 
 import WorkflowRunDetailDrawer from "./WorkflowRunDetailDrawer";
@@ -45,14 +49,14 @@ const WorkflowRuns = ({ className, style }: WorkflowRunsProps) => {
         if (record.succeed) {
           return (
             <Space>
-              <CircleCheckIcon color={themeToken.colorSuccess} size={16} />
+              <CheckCircleTwoToneIcon twoToneColor={themeToken.colorSuccess} />
               <Typography.Text type="success">{t("workflow_run.props.status.succeeded")}</Typography.Text>
             </Space>
           );
         } else {
           <Tooltip title={record.error}>
             <Space>
-              <CircleXIcon color={themeToken.colorError} size={16} />
+              <CloseCircleTwoToneIcon twoToneColor={themeToken.colorError} />
               <Typography.Text type="danger">{t("workflow_run.props.status.failed")}</Typography.Text>
             </Space>
           </Tooltip>;
@@ -82,7 +86,7 @@ const WorkflowRuns = ({ className, style }: WorkflowRunsProps) => {
       width: 120,
       render: (_, record) => (
         <Button.Group>
-          <WorkflowRunDetailDrawer data={record} trigger={<Button color="primary" icon={<EyeIcon size={16} />} variant="text" />} />
+          <WorkflowRunDetailDrawer data={record} trigger={<Button color="primary" icon={<SelectOutlinedIcon />} variant="text" />} />
         </Button.Group>
       ),
     },