Merge branch 'fix/watcher-copy-to-clipboard' into 'dev'

refactor(watcher-app): use react-copy-to-clipboard

Closes #72

See merge request ergo/rosen-bridge/ui!78

apps/watcher/app/(home)/@address/CopyButton.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import { CopyToClipboard } from 'react-copy-to-clipboard';
 
 import { Copy } from '@rosen-bridge/icons';
 import {
@@ -29,18 +30,15 @@ const CopyButton = ({ address }: CopyButtonProps) => {
     setOpen(false);
   };
 
-  const handleCopy = async () => {
-    await navigator.clipboard.writeText(address);
-    setOpen(true);
-  };
-
   return (
     <>
-      <IconButton onClick={handleCopy} sx={{ borderRadius: 0 }}>
-        <SvgIcon>
-          <Copy />
-        </SvgIcon>
-      </IconButton>
+      <CopyToClipboard text={address} onCopy={() => setOpen(true)}>
+        <IconButton sx={{ borderRadius: 0 }}>
+          <SvgIcon>
+            <Copy />
+          </SvgIcon>
+        </IconButton>
+      </CopyToClipboard>
       <SuccessfulCopySnackbar open={open} handleClose={handleClose} />
     </>
   );

apps/watcher/package.json

@@ -15,6 +15,7 @@
     "@emotion/react": "^11.11.1",
     "@emotion/styled": "^11.11.0",
     "@rosen-bridge/icons": "^0.1.0",
+    "@rosen-bridge/json-bigint": "^0.1.0",
     "@rosen-bridge/ui-kit": "^0.1.0",
     "@rosen-ui/constants": "^0.0.1",
     "@rosen-ui/swr-helpers": "^0.0.1",
@@ -24,9 +25,9 @@
     "next": "13.4.4",
     "react": "18.2.0",
     "react-apexcharts": "^1.4.0",
+    "react-copy-to-clipboard": "^5.1.0",
     "react-dom": "18.2.0",
     "react-hook-form": "^7.45.0",
-    "@rosen-bridge/json-bigint": "^0.1.0",
     "swr": "^2.1.5"
   },
   "devDependencies": {