fix: disable unsupported buttons (#4242)

* fix: disable ... button and recover selection after changing text font

* fix: add image block will close keyboard on Android

* fix: the padding of align items are not equal

* fix: callout block issues

Author: LucasXu0

frontend/appflowy_flutter/lib/plugins/document/presentation/editor_page.dart

@@ -287,7 +287,6 @@ class _AppFlowyEditorPageState extends State<AppFlowyEditorPage> {
           italicToolbarItem,
           underlineToolbarItem,
           colorToolbarItem,
-          moreToolbarItem,
         ],
         child: Column(
           children: [

frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/base/emoji_picker_button.dart

@@ -17,6 +17,7 @@ class EmojiPickerButton extends StatelessWidget {
     this.defaultIcon,
     this.offset,
     this.direction,
+    this.title,
   });
 
   final String emoji;
@@ -27,6 +28,7 @@ class EmojiPickerButton extends StatelessWidget {
   final Widget? defaultIcon;
   final Offset? offset;
   final PopoverDirection? direction;
+  final String? title;
 
   @override
   Widget build(BuildContext context) {
@@ -79,7 +81,12 @@ class EmojiPickerButton extends StatelessWidget {
         mainAxisAlignment: MainAxisAlignment.center,
         onPressed: () async {
           final result = await context.push<EmojiPickerResult>(
-            MobileEmojiPickerScreen.routeName,
+            Uri(
+              path: MobileEmojiPickerScreen.routeName,
+              queryParameters: {
+                MobileEmojiPickerScreen.pageTitle: title,
+              },
+            ).toString(),
           );
           if (result != null) {
             onSubmitted(

frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/callout/callout_block_component.dart

@@ -147,7 +147,13 @@ class _CalloutBlockComponentWidgetState
   }
 
   // get the emoji of the note block from the node's attributes or default to '📌'
-  String get emoji => node.attributes[CalloutBlockKeys.icon] ?? '📌';
+  String get emoji {
+    final icon = node.attributes[CalloutBlockKeys.icon];
+    if (icon == null || icon.isEmpty) {
+      return '📌';
+    }
+    return icon;
+  }
 
   // get access to the editor state via provider
   @override
@@ -184,6 +190,7 @@ class _CalloutBlockComponentWidgetState
               key: ValueKey(
                 emoji.toString(),
               ), // force to refresh the popover state
+              title: '',
               emoji: emoji,
               onSubmitted: (emoji, controller) {
                 setEmoji(emoji);

frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/mobile_toolbar_v3/_align_items.dart

@@ -45,7 +45,7 @@ class AlignItems extends StatelessWidget {
                   isSelected: currentIndex == index,
                   icon: e.$2,
                 ),
-                if (index != 0 || index != alignMenuItems.length - 1)
+                if (index != 0 && index != alignMenuItems.length - 1)
                   const HSpace(12),
               ],
             )

frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/mobile_toolbar_v3/_color_list.dart

@@ -25,7 +25,7 @@ Future<void> showTextColorAndBackgroundColorPicker(
     backgroundColor: theme.toolbarMenuBackgroundColor,
     elevation: 20,
     title: LocaleKeys.grid_selectOption_colorPanelTitle.tr(),
-    padding: const EdgeInsets.fromLTRB(18, 4, 18, 0),
+    padding: const EdgeInsets.fromLTRB(18, 4, 18, 8),
     builder: (context) {
       return _TextColorAndBackgroundColor(
         editorState: editorState,

frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/mobile_toolbar_v3/_font_item.dart

@@ -27,6 +27,7 @@ class FontFamilyItem extends StatelessWidget {
     return MobileToolbarMenuItemWrapper(
       size: const Size(144, 52),
       onTap: () async {
+        keepEditorFocusNotifier.increase();
         final selection = editorState.selection;
         final newFont = await context
             .read<GoRouter>()
@@ -36,13 +37,17 @@ class FontFamilyItem extends StatelessWidget {
             AppFlowyRichTextKeys.fontFamily:
                 GoogleFonts.getFont(newFont).fontFamily,
           });
-          await editorState.updateSelectionWithReason(
+        }
+        // wait for the font picker screen to be dismissed.
+        Future.delayed(const Duration(milliseconds: 250), () {
+          // highlight the selected text again.
+          editorState.updateSelectionWithReason(
             selection,
             extraInfo: {
               selectionExtraInfoDisableFloatingToolbar: true,
             },
           );
-        }
+        });
       },
       text: fontFamily ?? systemFonFamily,
       fontFamily: fontFamily ?? systemFonFamily,

frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/mobile_toolbar_v3/add_block_toolbar_item.dart

@@ -210,10 +210,6 @@ class _AddBlockMenu extends StatelessWidget {
         Future.delayed(const Duration(milliseconds: 400), () async {
           final imagePlaceholderKey = GlobalKey<ImagePlaceholderState>();
           await editorState.insertEmptyImageBlock(imagePlaceholderKey);
-
-          WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
-            imagePlaceholderKey.currentState?.controller.show();
-          });
         });
       },
     ),