add certificate mornitoring node

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

@@ -7,6 +7,7 @@ import {
   SendOutlined as SendOutlinedIcon,
   SisternodeOutlined as SisternodeOutlinedIcon,
   SolutionOutlined as SolutionOutlinedIcon,
+  MonitorOutlined as MonitorOutlinedIcon,
 } from "@ant-design/icons";
 import { Dropdown } from "antd";
 
@@ -27,6 +28,7 @@ const AddNode = ({ node, disabled }: AddNodeProps) => {
     return [
       [WorkflowNodeType.Apply, "workflow_node.apply.label", <SolutionOutlinedIcon />],
       [WorkflowNodeType.Upload, "workflow_node.upload.label", <CloudUploadOutlinedIcon />],
+      [WorkflowNodeType.Inspect, "workflow_node.inspect.label", <MonitorOutlinedIcon />],
       [WorkflowNodeType.Deploy, "workflow_node.deploy.label", <DeploymentUnitOutlinedIcon />],
       [WorkflowNodeType.Notify, "workflow_node.notify.label", <SendOutlinedIcon />],
       [WorkflowNodeType.Branch, "workflow_node.branch.label", <SisternodeOutlinedIcon />],

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

@@ -156,4 +156,3 @@ const ConditionNode = ({ node, disabled, branchId, branchIndex }: ConditionNodeP
 };
 
 export default memo(ConditionNode);
-

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

@@ -350,4 +350,3 @@ const formToExpression = (values: ConditionNodeConfigFormFieldValues): Expr => {
 };
 
 export default memo(ConditionNodeConfigForm);
-

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

@@ -0,0 +1,90 @@
+import { memo, useMemo, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Flex, Typography } from "antd";
+import { produce } from "immer";
+
+import { type WorkflowNodeConfigForInspect, WorkflowNodeType } from "@/domain/workflow";
+import { useZustandShallowSelector } from "@/hooks";
+import { useWorkflowStore } from "@/stores/workflow";
+
+import SharedNode, { type SharedNodeProps } from "./_SharedNode";
+import InspectNodeConfigForm, { type InspectNodeConfigFormInstance } from "./InspectNodeConfigForm";
+
+export type InspectNodeProps = SharedNodeProps;
+
+const InspectNode = ({ node, disabled }: InspectNodeProps) => {
+  if (node.type !== WorkflowNodeType.Inspect) {
+    console.warn(`[certimate] current workflow node type is not: ${WorkflowNodeType.Inspect}`);
+  }
+
+  const { t } = useTranslation();
+
+  const { updateNode } = useWorkflowStore(useZustandShallowSelector(["updateNode"]));
+
+  const formRef = useRef<InspectNodeConfigFormInstance>(null);
+  const [formPending, setFormPending] = useState(false);
+
+  const [drawerOpen, setDrawerOpen] = useState(false);
+  const getFormValues = () => formRef.current!.getFieldsValue() as WorkflowNodeConfigForInspect;
+
+  const wrappedEl = useMemo(() => {
+    if (node.type !== WorkflowNodeType.Inspect) {
+      console.warn(`[certimate] current workflow node type is not: ${WorkflowNodeType.Inspect}`);
+    }
+
+    if (!node.validated) {
+      return <Typography.Link>{t("workflow_node.action.configure_node")}</Typography.Link>;
+    }
+
+    const config = (node.config as WorkflowNodeConfigForInspect) ?? {};
+    return (
+      <Flex className="size-full overflow-hidden" align="center" gap={8}>
+        <Typography.Text className="truncate">{config.domain ?? ""}</Typography.Text>
+      </Flex>
+    );
+  }, [node]);
+
+  const handleDrawerConfirm = async () => {
+    setFormPending(true);
+    try {
+      await formRef.current!.validateFields();
+    } catch (err) {
+      setFormPending(false);
+      throw err;
+    }
+
+    try {
+      const newValues = getFormValues();
+      const newNode = produce(node, (draft) => {
+        draft.config = {
+          ...newValues,
+        };
+        draft.validated = true;
+      });
+      await updateNode(newNode);
+    } finally {
+      setFormPending(false);
+    }
+  };
+
+  return (
+    <>
+      <SharedNode.Block node={node} disabled={disabled} onClick={() => setDrawerOpen(true)}>
+        {wrappedEl}
+      </SharedNode.Block>
+
+      <SharedNode.ConfigDrawer
+        node={node}
+        open={drawerOpen}
+        pending={formPending}
+        onConfirm={handleDrawerConfirm}
+        onOpenChange={(open) => setDrawerOpen(open)}
+        getFormValues={() => formRef.current!.getFieldsValue()}
+      >
+        <InspectNodeConfigForm ref={formRef} disabled={disabled} initialValues={node.config} />
+      </SharedNode.ConfigDrawer>
+    </>
+  );
+};
+
+export default memo(InspectNode);

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

@@ -0,0 +1,85 @@
+import { forwardRef, memo, useImperativeHandle } from "react";
+import { useTranslation } from "react-i18next";
+import { Form, type FormInstance, Input } from "antd";
+import { createSchemaFieldRule } from "antd-zod";
+import { z } from "zod";
+
+import { type WorkflowNodeConfigForInspect } from "@/domain/workflow";
+import { useAntdForm } from "@/hooks";
+
+import { validDomainName, validPortNumber } from "@/utils/validators";
+
+type InspectNodeConfigFormFieldValues = Partial<WorkflowNodeConfigForInspect>;
+
+export type InspectNodeConfigFormProps = {
+  className?: string;
+  style?: React.CSSProperties;
+  disabled?: boolean;
+  initialValues?: InspectNodeConfigFormFieldValues;
+  onValuesChange?: (values: InspectNodeConfigFormFieldValues) => void;
+};
+
+export type InspectNodeConfigFormInstance = {
+  getFieldsValue: () => ReturnType<FormInstance<InspectNodeConfigFormFieldValues>["getFieldsValue"]>;
+  resetFields: FormInstance<InspectNodeConfigFormFieldValues>["resetFields"];
+  validateFields: FormInstance<InspectNodeConfigFormFieldValues>["validateFields"];
+};
+
+const initFormModel = (): InspectNodeConfigFormFieldValues => {
+  return {
+    domain: "",
+    port: "443",
+  };
+};
+
+const InspectNodeConfigForm = forwardRef<InspectNodeConfigFormInstance, InspectNodeConfigFormProps>(
+  ({ className, style, disabled, initialValues, onValuesChange }, ref) => {
+    const { t } = useTranslation();
+
+    const formSchema = z.object({
+      domain: z.string().refine((val) => validDomainName(val), {
+        message: t("workflow_node.inspect.form.domain.placeholder"),
+      }),
+      port: z.string().refine((val) => validPortNumber(val), {
+        message: t("workflow_node.inspect.form.port.placeholder"),
+      }),
+    });
+    const formRule = createSchemaFieldRule(formSchema);
+    const { form: formInst, formProps } = useAntdForm({
+      name: "workflowNodeInspectConfigForm",
+      initialValues: initialValues ?? initFormModel(),
+    });
+
+    const handleFormChange = (_: unknown, values: z.infer<typeof formSchema>) => {
+      onValuesChange?.(values as InspectNodeConfigFormFieldValues);
+    };
+
+    useImperativeHandle(ref, () => {
+      return {
+        getFieldsValue: () => {
+          return formInst.getFieldsValue(true);
+        },
+        resetFields: (fields) => {
+          return formInst.resetFields(fields as (keyof InspectNodeConfigFormFieldValues)[]);
+        },
+        validateFields: (nameList, config) => {
+          return formInst.validateFields(nameList, config);
+        },
+      } as InspectNodeConfigFormInstance;
+    });
+
+    return (
+      <Form className={className} style={style} {...formProps} disabled={disabled} layout="vertical" scrollToFirstError onValuesChange={handleFormChange}>
+        <Form.Item name="domain" label={t("workflow_node.inspect.form.domain.label")} rules={[formRule]}>
+          <Input variant="filled" placeholder={t("workflow_node.inspect.form.domain.placeholder")} />
+        </Form.Item>
+
+        <Form.Item name="port" label={t("workflow_node.inspect.form.port.label")} rules={[formRule]}>
+          <Input variant="filled" placeholder={t("workflow_node.inspect.form.port.placeholder")} />
+        </Form.Item>
+      </Form>
+    );
+  }
+);
+
+export default memo(InspectNodeConfigForm);