fix: check current text in promise

gravity-ui · Sep 12, 2024 · cc4705e · cc4705e
1 parent 8afb15d
commit cc4705e
Showing 1 changed file with 21 additions and 6 deletions.
diff --git a/src/components/CopyToClipboard/CopyToClipboard.tsx b/src/components/CopyToClipboard/CopyToClipboard.tsx
@@ -13,6 +13,7 @@ const INITIAL_STATUS: CopyToClipboardStatus = 'pending';
 export function CopyToClipboard(props: CopyToClipboardProps) {
     const {children, text, options, timeout, nativeCopy, onCopy} = props;
 
+    const textRef = React.useRef(text);
     const [status, setStatus] = React.useState<CopyToClipboardStatus>(INITIAL_STATUS);
 
     const timerIdRef = React.useRef<number>();
@@ -34,14 +35,28 @@ export function CopyToClipboard(props: CopyToClipboardProps) {
 
     const onClickWithCopy: React.MouseEventHandler<HTMLElement> = React.useCallback(
         (event) => {
+            textRef.current = text;
+
             copyText(text).then(
-                () => handleCopy(text, true),
-                () => handleCopy(text, false),
+                () => {
+                    if (text === textRef.current) {
+                        handleCopy(text, true);
+
+                        if (typeof content.props?.onClick === 'function') {
+                            content.props.onClick(event);
+                        }
+                    }
+                },
+                () => {
+                    if (text === textRef.current) {
+                        handleCopy(text, false);
+
+                        if (typeof content.props?.onClick === 'function') {
+                            content.props.onClick(event);
+                        }
+                    }
+                },
             );
-
-            if (typeof content.props?.onClick === 'function') {
-                content.props.onClick(event);
-            }
         },
         [content.props, handleCopy, text],
     );