From 3f07c50cc5201c9b7fb034ecae662e5734cf0dca Mon Sep 17 00:00:00 2001
From: Bogdan <mynameisbogdan@users.noreply.github.com>
Date: Fri, 27 Sep 2024 10:26:47 +0300
Subject: [PATCH] Fixed: Copy to clipboard in non-secure contexts

(cherry picked from commit 3828e475cc8860e74cdfd8a70b4f886de7f9c5c3)
---
 frontend/src/Components/Link/ClipboardButton.tsx | 11 +++++++++--
 package.json                                     |  1 +
 yarn.lock                                        | 12 ++++++++++++
 3 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/frontend/src/Components/Link/ClipboardButton.tsx b/frontend/src/Components/Link/ClipboardButton.tsx
index 09095ae74..dfce115ac 100644
--- a/frontend/src/Components/Link/ClipboardButton.tsx
+++ b/frontend/src/Components/Link/ClipboardButton.tsx
@@ -1,3 +1,4 @@
+import copy from 'copy-to-clipboard';
 import React, { useCallback, useEffect, useState } from 'react';
 import FormInputButton from 'Components/Form/FormInputButton';
 import Icon from 'Components/Icon';
@@ -37,10 +38,16 @@ export default function ClipboardButton({
 
   const handleClick = useCallback(async () => {
     try {
-      await navigator.clipboard.writeText(value);
+      if ('clipboard' in navigator) {
+        await navigator.clipboard.writeText(value);
+      } else {
+        copy(value);
+      }
+
       setState('success');
-    } catch (_) {
+    } catch (e) {
       setState('error');
+      console.error(`Failed to copy to clipboard`, e);
     }
   }, [value]);
 
diff --git a/package.json b/package.json
index fb5d66936..e469eb69d 100644
--- a/package.json
+++ b/package.json
@@ -38,6 +38,7 @@
     "chart.js": "4.4.4",
     "classnames": "2.5.1",
     "connected-react-router": "6.9.3",
+    "copy-to-clipboard": "3.3.3",
     "element-class": "0.2.2",
     "filesize": "10.1.6",
     "history": "4.10.1",
diff --git a/yarn.lock b/yarn.lock
index 9cfd8b21c..0863fa821 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2484,6 +2484,13 @@ copy-anything@^2.0.1:
   dependencies:
     is-what "^3.14.1"
 
+copy-to-clipboard@3.3.3:
+  version "3.3.3"
+  resolved "https://registry.yarnpkg.com/copy-to-clipboard/-/copy-to-clipboard-3.3.3.tgz#55ac43a1db8ae639a4bd99511c148cdd1b83a1b0"
+  integrity sha512-2KV8NhB5JqC3ky0r9PMCAZKbUHSwtEo4CwCs0KXgruG43gX5PMqDEBbVU4OUzw2MuAWUfsuFmWvEKG5QRfSnJA==
+  dependencies:
+    toggle-selection "^1.0.6"
+
 core-js-compat@^3.38.0, core-js-compat@^3.38.1:
   version "3.38.1"
   resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.38.1.tgz#2bc7a298746ca5a7bcb9c164bcb120f2ebc09a09"
@@ -6694,6 +6701,11 @@ to-space-case@^1.0.0:
   dependencies:
     to-no-case "^1.0.0"
 
+toggle-selection@^1.0.6:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/toggle-selection/-/toggle-selection-1.0.6.tgz#6e45b1263f2017fa0acc7d89d78b15b8bf77da32"
+  integrity sha512-BiZS+C1OS8g/q2RRbJmy59xpyghNBqrr6k5L/uKBGRsTfxmu3ffiRnd8mlGPUVayg8pvfi5urfnu8TU7DVOkLQ==
+
 "tough-cookie@^2.3.3 || ^3.0.1 || ^4.0.0":
   version "4.1.4"
   resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-4.1.4.tgz#945f1461b45b5a8c76821c33ea49c3ac192c1b36"