feat(ui): copied to clipboard message

ui/src/components/certificate/CertificateDetail.tsx

@@ -1,5 +1,5 @@
 import { useTranslation } from "react-i18next";
-import { Button, Form, Input, Tooltip } from "antd";
+import { Button, Form, Input, message, Tooltip } from "antd";
 import { CopyToClipboard } from "react-copy-to-clipboard";
 import { Clipboard as ClipboardIcon } from "lucide-react";
 
@@ -13,6 +13,8 @@ type CertificateDetailProps = {
 const CertificateDetail = ({ data }: CertificateDetailProps) => {
   const { t } = useTranslation();
 
+  const [messageApi, MessageContextHolder] = message.useMessage();
+
   const handleDownloadClick = async () => {
     // TODO: 支持下载多种格式
     const zipName = `${data.id}-${data.san}.zip`;
@@ -32,12 +34,19 @@ const CertificateDetail = ({ data }: CertificateDetailProps) => {
 
   return (
     <div>
+      {MessageContextHolder}
+
       <Form layout="vertical">
         <Form.Item>
           <div className="flex items-center justify-between w-full mb-2">
             <label className="font-medium">{t("certificate.props.certificate_chain")}</label>
             <Tooltip title={t("common.copy")}>
-              <CopyToClipboard text={data.certificate}>
+              <CopyToClipboard
+                text={data.certificate}
+                onCopy={() => {
+                  messageApi.success(t("common.copy.done"));
+                }}
+              >
                 <Button type="text" icon={<ClipboardIcon size={14} />}></Button>
               </CopyToClipboard>
             </Tooltip>
@@ -49,7 +58,12 @@ const CertificateDetail = ({ data }: CertificateDetailProps) => {
           <div className="flex items-center justify-between w-full mb-2">
             <label className="font-medium">{t("certificate.props.private_key")}</label>
             <Tooltip title={t("common.copy")}>
-              <CopyToClipboard text={data.privateKey}>
+              <CopyToClipboard
+                text={data.privateKey}
+                onCopy={() => {
+                  messageApi.success(t("common.copy.done"));
+                }}
+              >
                 <Button type="text" icon={<ClipboardIcon size={14} />}></Button>
               </CopyToClipboard>
             </Tooltip>