Fix copy to clipboard on HTTP-only hosted sites

web/src/components/Account.jsx

@@ -45,7 +45,7 @@ import CloseIcon from "@mui/icons-material/Close";
 import { ContentCopy, Public } from "@mui/icons-material";
 import AddIcon from "@mui/icons-material/Add";
 import routes from "./routes";
-import { formatBytes, formatShortDate, formatShortDateTime, openUrl } from "../app/utils";
+import { copyToClipboard, formatBytes, formatShortDate, formatShortDateTime, openUrl } from "../app/utils";
 import accountApi, { LimitBasis, Role, SubscriptionInterval, SubscriptionStatus } from "../app/AccountApi";
 import { Pref, PrefGroup } from "./Pref";
 import db from "../app/db";
@@ -370,7 +370,7 @@ const PhoneNumbers = () => {
   };
 
   const handleCopy = (phoneNumber) => {
-    navigator.clipboard.writeText(phoneNumber);
+    copyToClipboard(phoneNumber);
     setSnackOpen(true);
   };
 
@@ -841,7 +841,7 @@ const TokensTable = (props) => {
   };
 
   const handleCopy = async (token) => {
-    await navigator.clipboard.writeText(token);
+    copyToClipboard(token);
     setSnackOpen(true);
   };
 

web/src/components/ErrorBoundary.jsx

@@ -2,6 +2,7 @@ import * as React from "react";
 import StackTrace from "stacktrace-js";
 import { CircularProgress, Link, Button } from "@mui/material";
 import { Trans, withTranslation } from "react-i18next";
+import { copyToClipboard } from "../app/utils";
 
 class ErrorBoundaryImpl extends React.Component {
   constructor(props) {
@@ -64,7 +65,7 @@ class ErrorBoundaryImpl extends React.Component {
       stack += `${this.state.niceStack}\n\n`;
     }
     stack += `${this.state.originalStack}\n`;
-    navigator.clipboard.writeText(stack);
+    copyToClipboard(stack);
   }
 
   renderUnsupportedIndexedDB() {

web/src/components/Notifications.jsx

@@ -26,7 +26,10 @@ import { Trans, useTranslation } from "react-i18next";
 import { useOutletContext } from "react-router-dom";
 import { useRemark } from "react-remark";
 import styled from "@emotion/styled";
-import { formatBytes, formatShortDateTime, maybeActionErrors, openUrl, shortUrl, topicShortUrl, unmatchedTags } from "../app/utils";
+import {
+  copyToClipboard,
+  formatBytes, formatShortDateTime, maybeActionErrors, openUrl, shortUrl, topicShortUrl, unmatchedTags
+} from "../app/utils";
 import { formatMessage, formatTitle, isImage } from "../app/notificationUtils";
 import { LightboxBackdrop, Paragraph, VerticallyCenteredContainer } from "./styles";
 import subscriptionManager from "../app/SubscriptionManager";
@@ -239,7 +242,7 @@ const NotificationItem = (props) => {
     await subscriptionManager.markNotificationRead(notification.id);
   };
   const handleCopy = (s) => {
-    navigator.clipboard.writeText(s);
+    copyToClipboard(s);
     props.onShowSnack();
   };
   const expired = attachment && attachment.expires && attachment.expires < Date.now() / 1000;