From 3b7ca01e52ad696a35acb02adeb744d68b17b547 Mon Sep 17 00:00:00 2001
From: kkmch <kkmch@yandex-team.ru>
Date: Wed, 26 Jul 2023 14:20:24 +0300
Subject: [PATCH] fix: using ClipboardButton instead

---
 .../components/CopyButton/CopyButton.tsx      | 42 -------------------
 .../components/YamlEditor/YamlEditor.tsx      |  4 +-
 2 files changed, 2 insertions(+), 44 deletions(-)
 delete mode 100644 src/editor/components/CopyButton/CopyButton.tsx

diff --git a/src/editor/components/CopyButton/CopyButton.tsx b/src/editor/components/CopyButton/CopyButton.tsx
deleted file mode 100644
index 896e06a91..000000000
--- a/src/editor/components/CopyButton/CopyButton.tsx
+++ /dev/null
@@ -1,42 +0,0 @@
-import React, {useState} from 'react';
-
-import {Copy, CopyCheck} from '@gravity-ui/icons';
-import {Button, Icon, Tooltip} from '@gravity-ui/uikit';
-
-let uncheckTimer: NodeJS.Timer | null = null;
-const UNCHECK_TIMEOUT = 2000; // ms
-
-interface CopyButtonProps {
-    className?: string;
-    value: string;
-}
-
-export const CopyButton = ({value, className}: CopyButtonProps) => {
-    const [isChecked, setIsChecked] = useState(false);
-
-    const onCopyClick = () => {
-        if (isChecked) {
-            return;
-        }
-        navigator.clipboard.writeText(value);
-
-        setIsChecked(true);
-
-        if (uncheckTimer) {
-            clearTimeout(uncheckTimer);
-        }
-
-        uncheckTimer = setTimeout(() => {
-            setIsChecked(false);
-            uncheckTimer = null;
-        }, UNCHECK_TIMEOUT);
-    };
-
-    return (
-        <Tooltip content={'Copy'} disabled={isChecked}>
-            <Button size="m" view="raised" onClick={onCopyClick} className={className}>
-                <Icon data={isChecked ? CopyCheck : Copy} />
-            </Button>
-        </Tooltip>
-    );
-};
diff --git a/src/editor/components/YamlEditor/YamlEditor.tsx b/src/editor/components/YamlEditor/YamlEditor.tsx
index cfb8958a9..4aff94317 100644
--- a/src/editor/components/YamlEditor/YamlEditor.tsx
+++ b/src/editor/components/YamlEditor/YamlEditor.tsx
@@ -1,11 +1,11 @@
 import React, {useMemo} from 'react';
 
+import {ClipboardButton} from '@gravity-ui/uikit';
 import yaml from 'js-yaml';
 import MonacoEditor, {monaco} from 'react-monaco-editor';
 
 import {PageContent} from '../../../models';
 import {block} from '../../../utils';
-import {CopyButton} from '../CopyButton/CopyButton';
 
 import './YamlEditor.scss';
 
@@ -39,7 +39,7 @@ export const YamlEditor = ({content}: YamlEditorProps) => {
     return (
         <div className={b()}>
             <MonacoEditor value={value} language="yaml" options={options} />
-            <CopyButton className={b('copy-button')} value={value} />
+            <ClipboardButton className={b('copy-button')} text={value} />
         </div>
     );
 };