Fix copy certificate

PeculiarVentures · Jul 9, 2024 · 5532e02 · 5532e02
1 parent 0de48e3
commit 5532e02
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 4 deletions.
diff --git a/src/components/certificates-list/CertificatesList.tsx b/src/components/certificates-list/CertificatesList.tsx
@@ -209,7 +209,9 @@ export const CertificatesList: React.FunctionComponent<
                       </Button>
                       <CopyIconButton
                         value={
-                          raw.byteLength ? certificateRawToPem(raw, type) : ""
+                          raw.byteLength
+                            ? () => certificateRawToPem(raw, type)
+                            : ""
                         }
                         className={styles.action_icon_button}
                       />

diff --git a/src/components/copy-icon-button/CopyIconButton.stories.tsx b/src/components/copy-icon-button/CopyIconButton.stories.tsx
@@ -14,3 +14,9 @@ export const Default: Story = {
     value: "Copied text",
   },
 };
+
+export const CallableValue: Story = {
+  args: {
+    value: () => "Copied text",
+  },
+};
diff --git a/src/components/copy-icon-button/CopyIconButton.tsx b/src/components/copy-icon-button/CopyIconButton.tsx
@@ -8,8 +8,9 @@ import {
 import CopyIcon from "../../icons/copy-20.svg?react";
 import CheckIcon from "../../icons/check-20.svg?react";
 
-interface CopyIconButtonProps extends Omit<IconButtonProps, "children"> {
-  value: string;
+interface CopyIconButtonProps
+  extends Omit<IconButtonProps, "children" | "value"> {
+  value: string | (() => string);
 }
 
 export const CopyIconButton: React.FunctionComponent<CopyIconButtonProps> = (
@@ -18,8 +19,16 @@ export const CopyIconButton: React.FunctionComponent<CopyIconButtonProps> = (
   const { copy, isCopied } = useClipboard();
   const { value, size = "small", ...restProps } = props;
 
+  const handleClick = () => {
+    if (typeof value === "function") {
+      copy(value());
+    } else {
+      copy(value);
+    }
+  };
+
   return (
-    <IconButton size={size} {...restProps} onClick={() => copy(value)}>
+    <IconButton size={size} {...restProps} onClick={handleClick}>
       {isCopied ? <CheckIcon /> : <CopyIcon />}
     </IconButton>
   );