chore: enchance copy link action (#8797)

What's Changed

* enhance copy link action
* detect compatibility
* fall back to `document.execCommand`

packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/database-block.ts

@@ -5,6 +5,7 @@ import {
 } from '@affine/core/components/hooks/affine/use-share-url';
 import { getAffineCloudBaseUrl } from '@affine/core/modules/cloud/services/fetch';
 import { EditorService } from '@affine/core/modules/editor';
+import { copyLinkToBlockStdScopeClipboard } from '@affine/core/utils/clipboard';
 import { I18n } from '@affine/i18n';
 import { track } from '@affine/track';
 import type {
@@ -63,18 +64,15 @@ function createCopyLinkToBlockMenuItem(
       const type = model.flavour;
       const page = editor.editorContainer$.value;
 
-      page?.host?.std.clipboard
-        .writeToClipboard(items => {
-          items['text/plain'] = str;
-          // wrap a link
-          items['text/html'] = `<a href="${str}">${str}</a>`;
-          return items;
-        })
-        .then(() => {
-          track.doc.editor.toolbar.copyBlockToLink({ type });
+      copyLinkToBlockStdScopeClipboard(str, page?.host?.std.clipboard)
+        .then(success => {
+          if (!success) return;
+
           notify.success({ title: I18n['Copied link to clipboard']() });
         })
         .catch(console.error);
+
+      track.doc.editor.toolbar.copyBlockToLink({ type });
     },
   });
 }

packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/widgets/toolbar.ts

@@ -5,6 +5,7 @@ import {
 } from '@affine/core/components/hooks/affine/use-share-url';
 import { getAffineCloudBaseUrl } from '@affine/core/modules/cloud/services/fetch';
 import { EditorService } from '@affine/core/modules/editor';
+import { copyLinkToBlockStdScopeClipboard } from '@affine/core/utils/clipboard';
 import { I18n } from '@affine/i18n';
 import { track } from '@affine/track';
 import type {
@@ -77,7 +78,7 @@ function createCopyLinkToBlockMenuItem(
 ) {
   return {
     ...item,
-    action: (ctx: MenuContext) => {
+    action: async (ctx: MenuContext) => {
       const baseUrl = getAffineCloudBaseUrl();
       if (!baseUrl) {
         ctx.close();
@@ -114,18 +115,16 @@ function createCopyLinkToBlockMenuItem(
         return;
       }
 
-      ctx.std.clipboard
-        .writeToClipboard(items => {
-          items['text/plain'] = str;
-          // wrap a link
-          items['text/html'] = `<a href="${str}">${str}</a>`;
-          return items;
-        })
-        .then(() => {
-          track.doc.editor.toolbar.copyBlockToLink({ type });
-          notify.success({ title: I18n['Copied link to clipboard']() });
-        })
-        .catch(console.error);
+      const success = await copyLinkToBlockStdScopeClipboard(
+        str,
+        ctx.std.clipboard
+      );
+
+      if (success) {
+        notify.success({ title: I18n['Copied link to clipboard']() });
+      }
+
+      track.doc.editor.toolbar.copyBlockToLink({ type });
 
       ctx.close();
     },

packages/frontend/core/src/components/hooks/affine/use-share-url.ts

@@ -1,6 +1,7 @@
 import { notify } from '@affine/component';
 import { getAffineCloudBaseUrl } from '@affine/core/modules/cloud/services/fetch';
 import { toURLSearchParams } from '@affine/core/modules/navigation';
+import { copyTextToClipboard } from '@affine/core/utils/clipboard';
 import { useI18n } from '@affine/i18n';
 import { track } from '@affine/track';
 import { type EditorHost } from '@blocksuite/affine/block-std';
@@ -145,23 +146,18 @@ export const useSharingUrl = ({ workspaceId, pageId }: UseSharingUrl) => {
         elementIds,
       });
       if (sharingUrl) {
-        navigator.clipboard
-          .writeText(sharingUrl)
-          .then(() => {
-            notify.success({
-              title: t['Copied link to clipboard'](),
-            });
+        copyTextToClipboard(sharingUrl)
+          .then(success => {
+            if (success) {
+              notify.success({ title: t['Copied link to clipboard']() });
+            }
           })
           .catch(err => {
             console.error(err);
           });
-        track.$.sharePanel.$.copyShareLink({
-          type,
-        });
+        track.$.sharePanel.$.copyShareLink({ type });
       } else {
-        notify.error({
-          title: 'Network not available',
-        });
+        notify.error({ title: 'Network not available' });
       }
     },
     [pageId, t, workspaceId]