keep keyboard events only listenable for desktop version

acterglobal · Nov 10, 2024 · cd28e67 · cd28e67
1 parent 4e172c0
commit cd28e67
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 25 deletions.
diff --git a/app/lib/common/widgets/html_editor/components/mention_item.dart b/app/lib/common/widgets/html_editor/components/mention_item.dart
@@ -1,3 +1,4 @@
+import 'package:acter/common/utils/constants.dart';
 import 'package:acter/common/widgets/html_editor/models/mention_type.dart';
 import 'package:acter_avatar/acter_avatar.dart';
 import 'package:flutter/material.dart';
@@ -23,10 +24,16 @@ class MentionItem extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final isDesktop = desktopPlatforms.contains(Theme.of(context).platform);
+
     return Container(
       height: 60,
-      color: isSelected ? Theme.of(context).colorScheme.primary : null,
+      // selection color is only for desktop with keyboard navigation
+      color: (isSelected && isDesktop)
+          ? Theme.of(context).colorScheme.primary
+          : null,
       child: ListTile(
+        dense: true,
         onTap: onTap,
         contentPadding: const EdgeInsets.symmetric(horizontal: 12),
         leading: ActerAvatar(options: avatarOptions),

diff --git a/app/lib/common/widgets/html_editor/components/mention_list.dart b/app/lib/common/widgets/html_editor/components/mention_list.dart
@@ -1,4 +1,5 @@
 import 'package:acter/common/providers/room_providers.dart';
+import 'package:acter/common/utils/constants.dart';
 import 'package:acter/common/widgets/html_editor/components/mention_item.dart';
 import 'package:acter_avatar/acter_avatar.dart';
 import 'package:flutter_gen/gen_l10n/l10n.dart';
@@ -17,14 +18,12 @@ class MentionList extends ConsumerStatefulWidget {
     required this.roomId,
     required this.mentionType,
     required this.onDismiss,
-    required this.onSelectionUpdate,
   });
 
   final EditorState editorState;
   final String roomId;
   final MentionType mentionType;
   final VoidCallback onDismiss;
-  final VoidCallback onSelectionUpdate;
 
   @override
   ConsumerState<MentionList> createState() => _MentionHandlerState();
@@ -46,33 +45,39 @@ class _MentionHandlerState extends ConsumerState<MentionList> {
 
   @override
   void dispose() {
+    widget.onDismiss();
     _scrollController.dispose();
     _focusNode.dispose();
     super.dispose();
   }
 
   @override
   Widget build(BuildContext context) {
+    final isDesktop = desktopPlatforms.contains(Theme.of(context).platform);
     // All suggestions list
     final suggestions = ref
         .watch(mentionSuggestionsProvider((widget.roomId, widget.mentionType)));
     if (suggestions == null) {
       return ErrorWidget(L10n.of(context).loadingFailed);
     }
-
-    return Focus(
-      focusNode: _focusNode,
-      onKeyEvent: (node, event) => _handleKeyEvent(node, event, suggestions),
-      child: Column(
-        mainAxisSize: MainAxisSize.min,
-        children: [
-          _buildMenuHeader(),
-          const Divider(height: 1, endIndent: 5, indent: 5),
-          const SizedBox(height: 8),
-          _buildMenuList(suggestions),
-        ],
-      ),
+    final menuWidget = Column(
+      mainAxisSize: MainAxisSize.min,
+      children: [
+        _buildMenuHeader(),
+        const Divider(height: 1, endIndent: 5, indent: 5),
+        const SizedBox(height: 8),
+        _buildMenuList(suggestions),
+      ],
     );
+    if (isDesktop) {
+      // we only want to listen keyboard events on desktop
+      return Focus(
+        focusNode: _focusNode,
+        onKeyEvent: (node, event) => _handleKeyEvent(node, event, suggestions),
+        child: menuWidget,
+      );
+    }
+    return menuWidget;
   }
 
   Widget _buildMenuHeader() => Padding(
@@ -194,7 +199,6 @@ class _MentionHandlerState extends ConsumerState<MentionList> {
                 !HardwareKeyboard.instance.isAltPressed &&
                 !HardwareKeyboard.instance.isMetaPressed ||
             !HardwareKeyboard.instance.isShiftPressed) {
-          widget.onSelectionUpdate();
           widget.editorState.insertTextAtCurrentSelection(event.character!);
           return KeyEventResult.handled;
         }

diff --git a/app/lib/common/widgets/html_editor/components/mention_menu.dart b/app/lib/common/widgets/html_editor/components/mention_menu.dart
@@ -20,18 +20,14 @@ class MentionMenu {
   bool selectionChangedByMenu = false;
 
   void dismiss() {
-    if (_menuEntry != null) {
-      editorState.service.keyboardService?.enable();
-      editorState.service.scrollService?.enable();
-      keepEditorFocusNotifier.decrease();
-    }
+    editorState.service.keyboardService?.enable();
+    editorState.service.scrollService?.enable();
+    keepEditorFocusNotifier.decrease();
 
     _menuEntry?.remove();
     _menuEntry = null;
   }
 
-  void _onSelectionUpdate() => selectionChangedByMenu = true;
-
   void show() {
     WidgetsBinding.instance.addPostFrameCallback((_) => _show());
   }
@@ -68,7 +64,6 @@ class MentionMenu {
                 editorState: editorState,
                 roomId: roomId,
                 onDismiss: dismiss,
-                onSelectionUpdate: _onSelectionUpdate,
                 mentionType: mentionType,
               ),
             ),