feat: shortcut ESC link menu

AppFlowy-IO · May 22, 2023 · 18339b8 · 18339b8
1 parent badd394
commit 18339b8
Show file tree

Hide file tree

Showing 7 changed files with 82 additions and 21 deletions.
diff --git a/lib/l10n/intl_en.arb b/lib/l10n/intl_en.arb
@@ -97,6 +97,7 @@
   "openLink": "open link",
   "copyLink": "copy link",
   "removeLink": "remove link",
+  "urlHint": "url",
   "highlightColor": "highlight color",
   "clearHighlightColor": "clear highlight color",
   "customColor": "custom color",

diff --git a/lib/src/editor/toolbar/items/link/link_menu.dart b/lib/src/editor/toolbar/items/link/link_menu.dart
@@ -3,6 +3,7 @@ import 'package:appflowy_editor/src/infra/flowy_svg.dart';
 import 'package:appflowy_editor/src/l10n/l10n.dart';
 import 'package:flutter/material.dart';
 import 'package:appflowy_editor/src/editor/toolbar/items/utils/overlay_util.dart';
+import 'package:flutter/services.dart';
 
 class LinkMenu extends StatefulWidget {
   const LinkMenu({
@@ -13,6 +14,7 @@ class LinkMenu extends StatefulWidget {
     required this.onOpenLink,
     required this.onCopyLink,
     required this.onRemoveLink,
+    required this.onDismiss,
   }) : super(key: key);
 
   final String? linkText;
@@ -21,6 +23,7 @@ class LinkMenu extends StatefulWidget {
   final VoidCallback onOpenLink;
   final VoidCallback onCopyLink;
   final VoidCallback onRemoveLink;
+  final VoidCallback onDismiss;
 
   @override
   State<LinkMenu> createState() => _LinkMenuState();
@@ -81,27 +84,38 @@ class _LinkMenuState extends State<LinkMenu> {
   }
 
   Widget _buildInput() {
-    return TextField(
-      focusNode: _focusNode,
-      textAlign: TextAlign.left,
-      controller: _textEditingController,
-      onSubmitted: widget.onSubmitted,
-      decoration: InputDecoration(
-        hintText: 'URL',
-        contentPadding: const EdgeInsets.all(16.0),
-        isDense: true,
-        suffixIcon: IconButton(
-          padding: const EdgeInsets.all(4.0),
-          icon: const FlowySvg(
-            name: 'clear',
-            width: 24,
-            height: 24,
+    return RawKeyboardListener(
+      focusNode: FocusNode(),
+      onKey: (key) {
+        if (key is! RawKeyDownEvent) {
+          return;
+        }
+        if (key.logicalKey == LogicalKeyboardKey.escape) {
+          widget.onDismiss();
+        }
+      },
+      child: TextField(
+        focusNode: _focusNode,
+        textAlign: TextAlign.left,
+        controller: _textEditingController,
+        onSubmitted: widget.onSubmitted,
+        decoration: InputDecoration(
+          hintText: AppFlowyEditorLocalizations.current.urlHint.toUpperCase(),
+          contentPadding: const EdgeInsets.all(16.0),
+          isDense: true,
+          suffixIcon: IconButton(
+            padding: const EdgeInsets.all(4.0),
+            icon: const FlowySvg(
+              name: 'clear',
+              width: 24,
+              height: 24,
+            ),
+            onPressed: _textEditingController.clear,
+            splashRadius: 5,
+          ),
+          border: const OutlineInputBorder(
+            borderRadius: BorderRadius.all(Radius.circular(12.0)),
           ),
-          onPressed: _textEditingController.clear,
-          splashRadius: 5,
-        ),
-        border: const OutlineInputBorder(
-          borderRadius: BorderRadius.all(Radius.circular(12.0)),
         ),
       ),
     );

diff --git a/lib/src/editor/toolbar/items/link/link_toolbar_item.dart b/lib/src/editor/toolbar/items/link/link_toolbar_item.dart
@@ -89,6 +89,7 @@ void showLinkMenu(
           editorState.apply(transaction);
           dismissOverlay();
         },
+        onDismiss: dismissOverlay,
       );
     },
   ).build();

diff --git a/lib/src/l10n/intl/messages_en.dart b/lib/src/l10n/intl/messages_en.dart
@@ -100,6 +100,7 @@ class MessageLookup extends MessageLookupByLibrary {
         "tint7": MessageLookupByLibrary.simpleMessage("Tint 7"),
         "tint8": MessageLookupByLibrary.simpleMessage("Tint 8"),
         "tint9": MessageLookupByLibrary.simpleMessage("Tint 9"),
-        "underline": MessageLookupByLibrary.simpleMessage("Underline")
+        "underline": MessageLookupByLibrary.simpleMessage("Underline"),
+        "urlHint": MessageLookupByLibrary.simpleMessage("url")
       };
 }
diff --git a/lib/src/l10n/l10n.dart b/lib/src/l10n/l10n.dart
diff --git a/lib/src/service/selection_service.dart b/lib/src/service/selection_service.dart
@@ -252,6 +252,7 @@ class _AppFlowySelectionState extends State<AppFlowySelection>
     currentSelectedNodes = [];
     currentSelection.value = null;
 
+    _clearToolbar();
     clearCursor();
     // clear selection areas
     _selectionAreas

diff --git a/test/new/toolbar/items/link/link_menu_test.dart b/test/new/toolbar/items/link/link_menu_test.dart
@@ -1,6 +1,7 @@
 import 'package:appflowy_editor/src/core/document/text_delta.dart';
 import 'package:appflowy_editor/src/editor/toolbar/items/link/link_menu.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
 import 'package:flutter_test/flutter_test.dart';
 
 import '../../../infra/testable_editor.dart';
@@ -21,6 +22,7 @@ void main() async {
         onSubmitted: (text) {
           submittedText = text;
         },
+        onDismiss: () {},
       );
       await tester.pumpWidget(
         MaterialApp(
@@ -87,5 +89,36 @@ void main() async {
 
       expect(find.text(link, findRichText: true), findsOneWidget);
     });
+
+    testWidgets('test dismiss link menu by pressing ESC', (tester) async {
+      var dismissed = false;
+
+      final linkMenu = LinkMenu(
+        onOpenLink: () {},
+        onCopyLink: () {},
+        onRemoveLink: () {},
+        onSubmitted: (text) {},
+        onDismiss: () {
+          dismissed = true;
+        },
+      );
+
+      await tester.pumpWidget(
+        MaterialApp(
+          home: Material(
+            child: linkMenu,
+          ),
+        ),
+      );
+
+      expect(find.byType(TextButton), findsNothing);
+      expect(find.byType(TextField), findsOneWidget);
+
+      // Simulate keyboard press event for the Escape key
+      await tester.sendKeyEvent(LogicalKeyboardKey.escape);
+      await tester.pumpAndSettle();
+
+      expect(dismissed, true);
+    });
   });
 }