From 8dc86209df06dfd5cedc5f430e8727ea52930cb8 Mon Sep 17 00:00:00 2001
From: Fu Diwei <fudiwei@sina.com>
Date: Tue, 21 Jan 2025 23:11:48 +0800
Subject: [PATCH] feat: support removing workflow runs

---
 internal/pkg/utils/certs/transformer.go       | 23 ++------
 ui/src/components/workflow/WorkflowRuns.tsx   | 54 +++++++++++++++++--
 ui/src/i18n/locales/en/nls.workflow.runs.json |  4 ++
 ui/src/i18n/locales/zh/nls.workflow.runs.json |  4 ++
 ui/src/pages/workflows/WorkflowList.tsx       | 41 ++++++--------
 ui/src/repository/workflowRun.ts              |  4 ++
 6 files changed, 82 insertions(+), 48 deletions(-)

diff --git a/internal/pkg/utils/certs/transformer.go b/internal/pkg/utils/certs/transformer.go
index c3575b3e..cd1a2039 100644
--- a/internal/pkg/utils/certs/transformer.go
+++ b/internal/pkg/utils/certs/transformer.go
@@ -2,12 +2,11 @@
 
 import (
 	"bytes"
-	"crypto/ecdsa"
-	"crypto/rsa"
 	"encoding/pem"
 	"errors"
 	"time"
 
+	"github.com/go-acme/lego/v4/certcrypto"
 	"github.com/pavlo-v-chernykh/keystore-go/v4"
 	"software.sslmate.com/src/go-pkcs12"
 )
@@ -28,23 +27,9 @@ func TransformCertificateFromPEMToPFX(certPem string, privkeyPem string, pfxPass
 		return nil, err
 	}
 
-	var privkey interface{}
-	switch cert.PublicKey.(type) {
-	case *rsa.PublicKey:
-		{
-			privkey, err = ParsePKCS1PrivateKeyFromPEM(privkeyPem)
-			if err != nil {
-				return nil, err
-			}
-		}
-
-	case *ecdsa.PublicKey:
-		{
-			privkey, err = ParseECPrivateKeyFromPEM(privkeyPem)
-			if err != nil {
-				return nil, err
-			}
-		}
+	privkey, err := certcrypto.ParsePEMPrivateKey([]byte(privkeyPem))
+	if err != nil {
+		return nil, err
 	}
 
 	pfxData, err := pkcs12.LegacyRC2.Encode(privkey, cert, nil, pfxPassword)
diff --git a/ui/src/components/workflow/WorkflowRuns.tsx b/ui/src/components/workflow/WorkflowRuns.tsx
index ef9fd5ea..493f6396 100644
--- a/ui/src/components/workflow/WorkflowRuns.tsx
+++ b/ui/src/components/workflow/WorkflowRuns.tsx
@@ -4,17 +4,18 @@ import {
   CheckCircleOutlined as CheckCircleOutlinedIcon,
   ClockCircleOutlined as ClockCircleOutlinedIcon,
   CloseCircleOutlined as CloseCircleOutlinedIcon,
+  DeleteOutlined as DeleteOutlinedIcon,
   SelectOutlined as SelectOutlinedIcon,
   SyncOutlined as SyncOutlinedIcon,
 } from "@ant-design/icons";
 import { useRequest } from "ahooks";
-import { Button, Empty, Table, type TableProps, Tag, notification } from "antd";
+import { Button, Empty, Modal, Table, type TableProps, Tag, Tooltip, notification } from "antd";
 import dayjs from "dayjs";
 import { ClientResponseError } from "pocketbase";
 
 import { WORKFLOW_TRIGGERS } from "@/domain/workflow";
 import { WORKFLOW_RUN_STATUSES, type WorkflowRunModel } from "@/domain/workflowRun";
-import { list as listWorkflowRuns } from "@/repository/workflowRun";
+import { list as listWorkflowRuns, remove as removeWorkflowRun } from "@/repository/workflowRun";
 import { getErrMsg } from "@/utils/error";
 import WorkflowRunDetailDrawer from "./WorkflowRunDetailDrawer";
 
@@ -27,6 +28,7 @@ export type WorkflowRunsProps = {
 const WorkflowRuns = ({ className, style, workflowId }: WorkflowRunsProps) => {
   const { t } = useTranslation();
 
+  const [modalApi, ModelContextHolder] = Modal.useModal();
   const [notificationApi, NotificationContextHolder] = notification.useNotification();
 
   const tableColumns: TableProps<WorkflowRunModel>["columns"] = [
@@ -118,7 +120,27 @@ const WorkflowRuns = ({ className, style, workflowId }: WorkflowRunsProps) => {
       width: 120,
       render: (_, record) => (
         <Button.Group>
-          <WorkflowRunDetailDrawer data={record} trigger={<Button color="primary" icon={<SelectOutlinedIcon />} variant="text" />} />
+          <WorkflowRunDetailDrawer
+            data={record}
+            trigger={
+              <Tooltip title={t("workflow_run.action.view")}>
+                <Button color="primary" icon={<SelectOutlinedIcon />} variant="text" />
+              </Tooltip>
+            }
+          />
+
+          <Tooltip title={t("workflow_run.action.delete")}>
+            <Button
+              color="danger"
+              danger
+              disabled={record.status !== WORKFLOW_RUN_STATUSES.SUCCEEDED && record.status !== WORKFLOW_RUN_STATUSES.FAILED}
+              icon={<DeleteOutlinedIcon />}
+              variant="text"
+              onClick={() => {
+                handleDeleteClick(record);
+              }}
+            />
+          </Tooltip>
         </Button.Group>
       ),
     },
@@ -129,7 +151,11 @@ const WorkflowRuns = ({ className, style, workflowId }: WorkflowRunsProps) => {
   const [page, setPage] = useState<number>(1);
   const [pageSize, setPageSize] = useState<number>(10);
 
-  const { loading, error: loadedError } = useRequest(
+  const {
+    loading,
+    error: loadedError,
+    run: refreshData,
+  } = useRequest(
     () => {
       return listWorkflowRuns({
         workflowId: workflowId,
@@ -156,8 +182,28 @@ const WorkflowRuns = ({ className, style, workflowId }: WorkflowRunsProps) => {
     }
   );
 
+  const handleDeleteClick = (workflowRun: WorkflowRunModel) => {
+    modalApi.confirm({
+      title: t("workflow_run.action.delete"),
+      content: t("workflow_run.action.delete.confirm"),
+      onOk: async () => {
+        try {
+          const resp = await removeWorkflowRun(workflowRun);
+          if (resp) {
+            setTableData((prev) => prev.filter((item) => item.id !== workflowRun.id));
+            refreshData();
+          }
+        } catch (err) {
+          console.error(err);
+          notificationApi.error({ message: t("common.text.request_error"), description: getErrMsg(err) });
+        }
+      },
+    });
+  };
+
   return (
     <>
+      {ModelContextHolder}
       {NotificationContextHolder}
 
       <div className={className} style={style}>
diff --git a/ui/src/i18n/locales/en/nls.workflow.runs.json b/ui/src/i18n/locales/en/nls.workflow.runs.json
index 660cdecb..1848cf66 100644
--- a/ui/src/i18n/locales/en/nls.workflow.runs.json
+++ b/ui/src/i18n/locales/en/nls.workflow.runs.json
@@ -1,4 +1,8 @@
 {
+  "workflow_run.action.view": "View detail",
+  "workflow_run.action.delete": "Delete history run",
+  "workflow_run.action.delete.confirm": "Are you sure to delete this history run?",
+
   "workflow_run.props.id": "ID",
   "workflow_run.props.status": "Status",
   "workflow_run.props.status.pending": "Pending",
diff --git a/ui/src/i18n/locales/zh/nls.workflow.runs.json b/ui/src/i18n/locales/zh/nls.workflow.runs.json
index caa4bde2..30f6f368 100644
--- a/ui/src/i18n/locales/zh/nls.workflow.runs.json
+++ b/ui/src/i18n/locales/zh/nls.workflow.runs.json
@@ -1,4 +1,8 @@
 {
+  "workflow_run.action.edit": "查看详情",
+  "workflow_run.action.delete": "删除执行历史",
+  "workflow_run.action.delete.confirm": "确定要删除此执行历史吗？",
+
   "workflow_run.props.id": "ID",
   "workflow_run.props.status": "状态",
   "workflow_run.props.status.pending": "等待执行",
diff --git a/ui/src/pages/workflows/WorkflowList.tsx b/ui/src/pages/workflows/WorkflowList.tsx
index a1fce6c1..99eebbbd 100644
--- a/ui/src/pages/workflows/WorkflowList.tsx
+++ b/ui/src/pages/workflows/WorkflowList.tsx
@@ -3,6 +3,7 @@ import { useTranslation } from "react-i18next";
 import { useNavigate, useSearchParams } from "react-router-dom";
 import {
   CheckCircleOutlined as CheckCircleOutlinedIcon,
+  ClockCircleOutlined as ClockCircleOutlinedIcon,
   CloseCircleOutlined as CloseCircleOutlinedIcon,
   DeleteOutlined as DeleteOutlinedIcon,
   EditOutlined as EditOutlinedIcon,
@@ -13,7 +14,6 @@ import {
 import { PageHeader } from "@ant-design/pro-components";
 import { useRequest } from "ahooks";
 import {
-  Badge,
   Button,
   Divider,
   Empty,
@@ -159,32 +159,23 @@ const WorkflowList = () => {
       key: "lastRun",
       title: t("workflow.props.last_run_at"),
       render: (_, record) => {
-        if (record.lastRunId) {
-          if (record.lastRunStatus === WORKFLOW_RUN_STATUSES.RUNNING) {
-            return (
-              <Space>
-                <Badge status="processing" count={<SyncOutlinedIcon style={{ color: themeToken.colorInfo }} />} />
-                <Typography.Text>{dayjs(record.lastRunTime!).format("YYYY-MM-DD HH:mm:ss")}</Typography.Text>
-              </Space>
-            );
-          } else if (record.lastRunStatus === WORKFLOW_RUN_STATUSES.SUCCEEDED) {
-            return (
-              <Space>
-                <Badge status="success" count={<CheckCircleOutlinedIcon style={{ color: themeToken.colorSuccess }} />} />
-                <Typography.Text>{dayjs(record.lastRunTime!).format("YYYY-MM-DD HH:mm:ss")}</Typography.Text>
-              </Space>
-            );
-          } else if (record.lastRunStatus === WORKFLOW_RUN_STATUSES.FAILED) {
-            return (
-              <Space>
-                <Badge status="error" count={<CloseCircleOutlinedIcon style={{ color: themeToken.colorError }} />} />
-                <Typography.Text>{dayjs(record.lastRunTime!).format("YYYY-MM-DD HH:mm:ss")}</Typography.Text>
-              </Space>
-            );
-          }
+        let icon = <></>;
+        if (record.lastRunStatus === WORKFLOW_RUN_STATUSES.PENDING) {
+          icon = <ClockCircleOutlinedIcon style={{ color: themeToken.colorTextSecondary }} />;
+        } else if (record.lastRunStatus === WORKFLOW_RUN_STATUSES.RUNNING) {
+          icon = <SyncOutlinedIcon style={{ color: themeToken.colorInfo }} spin />;
+        } else if (record.lastRunStatus === WORKFLOW_RUN_STATUSES.SUCCEEDED) {
+          icon = <CheckCircleOutlinedIcon style={{ color: themeToken.colorSuccess }} />;
+        } else if (record.lastRunStatus === WORKFLOW_RUN_STATUSES.FAILED) {
+          icon = <CloseCircleOutlinedIcon style={{ color: themeToken.colorError }} />;
         }
 
-        return <></>;
+        return (
+          <Space>
+            {icon}
+            <Typography.Text>{record.lastRunTime ? dayjs(record.lastRunTime!).format("YYYY-MM-DD HH:mm:ss") : ""}</Typography.Text>
+          </Space>
+        );
       },
     },
     {
diff --git a/ui/src/repository/workflowRun.ts b/ui/src/repository/workflowRun.ts
index 25571eaf..2d70c3e2 100644
--- a/ui/src/repository/workflowRun.ts
+++ b/ui/src/repository/workflowRun.ts
@@ -31,3 +31,7 @@ export const list = async (request: ListWorkflowRunsRequest) => {
       expand: request.expand ? "workflowId" : undefined,
     });
 };
+
+export const remove = async (record: MaybeModelRecordWithId<WorkflowRunModel>) => {
+  return await getPocketBase().collection(COLLECTION_NAME).delete(record.id);
+};