feat: revamp link preivew (#7692)

* feat: revamp link preivew

* feat: add convert to menu for link hover menu

* feat: add mention link

* feat: support convert preview to mention

* feat: add embed link preview

* fix: some test erros

* fix: test errors

* fix: some UI issues

* chore: add test for url

* chore: add test for mention

* chore: add test for bookmark

* chore: add test for embed

* chore: remove unuse import

* fix: some UI issues

* fix: remove text span overlay on mobile

* fix: code lint error

---------

Co-authored-by: Lucas <[email protected]>

Author: asjqkkkk

frontend/appflowy_flutter/integration_test/desktop/document/document_copy_and_paste_test.dart

@@ -1,10 +1,12 @@
+import 'dart:async';
 import 'dart:io';
 
 import 'package:appflowy/generated/locale_keys.g.dart';
-import 'package:appflowy/plugins/document/presentation/editor_plugins/block_menu/block_menu_button.dart';
 import 'package:appflowy/plugins/document/presentation/editor_plugins/copy_and_paste/clipboard_service.dart';
 import 'package:appflowy/plugins/document/presentation/editor_plugins/image/custom_image_block_component/custom_image_block_component.dart';
 import 'package:appflowy/plugins/document/presentation/editor_plugins/link_preview/custom_link_preview.dart';
+import 'package:appflowy/plugins/document/presentation/editor_plugins/link_preview/link_preview_menu.dart';
+import 'package:appflowy/plugins/document/presentation/editor_plugins/link_preview/paste_as/paste_as_menu.dart';
 import 'package:appflowy/startup/startup.dart';
 import 'package:appflowy_editor/appflowy_editor.dart';
 import 'package:appflowy_editor_plugins/appflowy_editor_plugins.dart';
@@ -320,8 +322,14 @@ void main() {
       (tester) async {
         const url = 'https://appflowy.io';
         await tester.pasteContent(plainText: url, (editorState) async {
+          final pasteAsMenu = find.byType(PasteAsMenu);
+          expect(pasteAsMenu, findsOneWidget);
+          final bookmarkButton = find.text(
+            LocaleKeys.document_plugins_linkPreview_typeSelection_bookmark.tr(),
+          );
+          await tester.tapButton(bookmarkButton);
           // the second one is the paragraph node
-          expect(editorState.document.root.children.length, 2);
+          expect(editorState.document.root.children.length, 1);
           final node = editorState.getNodeAtPath([0])!;
           expect(node.type, LinkPreviewBlockKeys.type);
           expect(node.attributes[LinkPreviewBlockKeys.url], url);
@@ -333,19 +341,19 @@ void main() {
         await tester.hoverOnWidget(
           find.byType(CustomLinkPreviewWidget),
           onHover: () async {
-            final convertToLinkButton = find.byWidgetPredicate((widget) {
-              return widget is MenuBlockButton &&
-                  widget.tooltip ==
-                      LocaleKeys.document_plugins_urlPreview_convertToLink.tr();
-            });
+            /// show menu
+            final menu = find.byType(CustomLinkPreviewMenu);
+            expect(menu, findsOneWidget);
+            await tester.tapButton(menu);
+
+            final convertToLinkButton = find.text(
+                LocaleKeys.document_plugins_linkPreview_linkPreviewMenu_toUrl.tr(),
+              );
             expect(convertToLinkButton, findsOneWidget);
-            await tester.tap(convertToLinkButton);
-            await tester.pumpAndSettle();
+            await tester.tapButton(convertToLinkButton);
           },
         );
 
-        await tester.pumpAndSettle();
-
         final editorState = tester.editor.getCurrentEditorState();
         final textNode = editorState.getNodeAtPath([0])!;
         expect(textNode.type, ParagraphBlockKeys.type);
@@ -363,14 +371,20 @@ void main() {
       (tester) async {
         const url = 'https://appflowy.io';
         await tester.pasteContent(plainText: url, (editorState) async {
+          final pasteAsMenu = find.byType(PasteAsMenu);
+          expect(pasteAsMenu, findsOneWidget);
+          final bookmarkButton = find.text(
+            LocaleKeys.document_plugins_linkPreview_typeSelection_bookmark.tr(),
+          );
+          await tester.tapButton(bookmarkButton);
           // the second one is the paragraph node
-          expect(editorState.document.root.children.length, 2);
+          expect(editorState.document.root.children.length, 1);
           final node = editorState.getNodeAtPath([0])!;
           expect(node.type, LinkPreviewBlockKeys.type);
           expect(node.attributes[LinkPreviewBlockKeys.url], url);
         });
 
-        await tester.editor.tapLineOfEditorAt(0);
+      
         await tester.simulateKeyEvent(
           LogicalKeyboardKey.keyZ,
           isControlPressed:
@@ -521,7 +535,7 @@ void main() {
 
 extension on WidgetTester {
   Future<void> pasteContent(
-    void Function(EditorState editorState) test, {
+    FutureOr<void> Function(EditorState editorState) test, {
     Future<void> Function(EditorState editorState)? beforeTest,
     String? plainText,
     String? html,
@@ -558,6 +572,6 @@ extension on WidgetTester {
     );
     await pumpAndSettle(const Duration(milliseconds: 1000));
 
-    test(editor.getCurrentEditorState());
+    await test(editor.getCurrentEditorState());
   }
 }