chore: adjust show mobile bottom sheet (#4689)

frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/show_mobile_bottom_sheet.dart

@@ -1,6 +1,5 @@
 import 'package:appflowy/mobile/presentation/base/app_bar_actions.dart';
 import 'package:appflowy/plugins/base/drag_handler.dart';
-import 'package:flowy_infra/size.dart';
 import 'package:flowy_infra_ui/flowy_infra_ui.dart' hide WidgetBuilder;
 import 'package:flutter/material.dart';
 
@@ -16,7 +15,6 @@ Future<T?> showMobileBottomSheet<T>(
   bool showCloseButton = false,
   // this field is only used if showHeader is true
   String title = '',
-  bool resizeToAvoidBottomInset = true,
   bool isScrollControlled = true,
   bool showDivider = true,
   bool useRootNavigator = false,
@@ -42,7 +40,7 @@ Future<T?> showMobileBottomSheet<T>(
 
   shape ??= const RoundedRectangleBorder(
     borderRadius: BorderRadius.vertical(
-      top: Corners.s12Radius,
+      top: Radius.circular(16),
     ),
   );
 
@@ -68,17 +66,14 @@ Future<T?> showMobileBottomSheet<T>(
       final Widget child = builder(context);
 
       // if the children is only one, we don't need to wrap it with a column
-      if (!showDragHandle &&
+      if (!showDragHandle && !showHeader && !showDivider) {
-          !showHeader &&
-          !showDivider &&
-          !resizeToAvoidBottomInset) {
         return child;
       }
 
       // ----- header area -----
       if (showDragHandle) {
         children.add(
-          const DragHandler(),
+          const DragHandle(),
         );
       }
 
@@ -125,21 +120,12 @@ Future<T?> showMobileBottomSheet<T>(
       }
 
       // ----- content area -----
-      if (resizeToAvoidBottomInset) {
+      children.add(
-        children.add(
+        Padding(
-          Padding(
+          padding: padding,
-            padding: EdgeInsets.only(
+          child: child,
-              top: padding.top,
+        ),
-              left: padding.left,
+      );
-              right: padding.right,
-              bottom: padding.bottom + MediaQuery.of(context).viewInsets.bottom,
-            ),
-            child: child,
-          ),
-        );
-      } else {
-        children.add(child);
-      }
       // ----- content area -----
 
       if (children.length == 1) {

frontend/appflowy_flutter/lib/mobile/presentation/database/date_picker/mobile_date_picker_screen.dart

@@ -61,7 +61,7 @@ class _MobileDateCellEditScreenState extends State<MobileDateCellEditScreen> {
           children: [
             ColoredBox(
               color: Theme.of(context).colorScheme.surface,
-              child: const Center(child: DragHandler()),
+              child: const Center(child: DragHandle()),
             ),
             const MobileDateHeader(),
             _buildDatePicker(),

frontend/appflowy_flutter/lib/mobile/presentation/database/field/mobile_field_bottom_sheets.dart

@@ -38,7 +38,6 @@ void showCreateFieldBottomSheet(
 }) {
   showMobileBottomSheet(
     context,
-    padding: EdgeInsets.zero,
     showHeader: true,
     showDragHandle: true,
     showCloseButton: true,
@@ -110,9 +109,7 @@ void showQuickEditField(
 ) {
   showMobileBottomSheet(
     context,
-    padding: EdgeInsets.zero,
     backgroundColor: Theme.of(context).colorScheme.secondaryContainer,
-    resizeToAvoidBottomInset: true,
     showDragHandle: true,
     builder: (context) {
       return SingleChildScrollView(

frontend/appflowy_flutter/lib/mobile/presentation/database/field/mobile_field_picker_list.dart

@@ -47,7 +47,7 @@ class _MobileFieldPickerListState extends State<MobileFieldPickerList> {
         return Column(
           mainAxisSize: MainAxisSize.min,
           children: [
-            const DragHandler(),
+            const DragHandle(),
             _Header(
               title: widget.title,
               onDone: (context) => context.pop(newFieldId),

frontend/appflowy_flutter/lib/mobile/presentation/database/field/mobile_full_field_editor.dart

@@ -711,7 +711,7 @@ class _NumberFormatListState extends State<_NumberFormatList> {
       controller: widget.scrollController,
       children: [
         const Center(
-          child: DragHandler(),
+          child: DragHandle(),
         ),
         Container(
           margin: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),

frontend/appflowy_flutter/lib/mobile/presentation/database/view/database_view_list.dart

@@ -40,7 +40,7 @@ class MobileDatabaseViewList extends StatelessWidget {
 
             return Column(
               children: [
-                const DragHandler(),
+                const DragHandle(),
                 _Header(
                   title: LocaleKeys.grid_settings_viewList.plural(
                     context.watch<DatabaseTabBarBloc>().state.tabBars.length,

frontend/appflowy_flutter/lib/mobile/presentation/database/view/edit_database_view_screen.dart

@@ -231,7 +231,6 @@ class DatabaseViewSettingTile extends StatelessWidget {
       await showMobileBottomSheet(
         context,
         useSafeArea: false,
-        resizeToAvoidBottomInset: false,
         showDragHandle: true,
         showHeader: true,
         showBackButton: true,
@@ -257,7 +256,6 @@ class DatabaseViewSettingTile extends StatelessWidget {
     if (setting == DatabaseViewSettings.board) {
       await showMobileBottomSheet<DatabaseLayoutPB>(
         context,
-        resizeToAvoidBottomInset: false,
         builder: (context) {
           return Padding(
             padding: const EdgeInsets.only(top: 24, bottom: 46),

frontend/appflowy_flutter/lib/plugins/base/drag_handler.dart

@@ -1,7 +1,7 @@
 import 'package:flutter/material.dart';
 
-class DragHandler extends StatelessWidget {
+class DragHandle extends StatelessWidget {
-  const DragHandler({
+  const DragHandle({
     super.key,
   });
 

frontend/appflowy_flutter/lib/plugins/database/widgets/cell/mobile_grid/mobile_grid_checklist_cell.dart

@@ -39,7 +39,6 @@ class MobileGridChecklistCellSkin extends IEditableChecklistCellSkin {
       ),
       onTap: () => showMobileBottomSheet(
         context,
-        padding: EdgeInsets.zero,
         backgroundColor: Theme.of(context).colorScheme.background,
         builder: (context) {
           return BlocProvider.value(

frontend/appflowy_flutter/lib/plugins/database/widgets/cell/mobile_grid/mobile_grid_date_cell.dart

@@ -44,7 +44,6 @@ class MobileGridDateCellSkin extends IEditableDateCellSkin {
       onTap: () {
         showMobileBottomSheet(
           context,
-          padding: EdgeInsets.zero,
           backgroundColor: Theme.of(context).colorScheme.secondaryContainer,
           builder: (context) {
             return MobileDateCellEditScreen(

frontend/appflowy_flutter/lib/plugins/database/widgets/cell/mobile_grid/mobile_grid_select_option_cell.dart

@@ -33,7 +33,6 @@ class MobileGridSelectOptionCellSkin extends IEditableSelectOptionCellSkin {
       onTap: () {
         showMobileBottomSheet(
           context,
-          padding: EdgeInsets.zero,
           builder: (context) {
             return MobileSelectOptionEditor(
               cellController: bloc.cellController,

frontend/appflowy_flutter/lib/plugins/database/widgets/cell/mobile_row_detail/mobile_row_detail_checklist_cell.dart

@@ -25,7 +25,6 @@ class MobileRowDetailChecklistCellSkin extends IEditableChecklistCellSkin {
       borderRadius: const BorderRadius.all(Radius.circular(14)),
       onTap: () => showMobileBottomSheet(
         context,
-        padding: EdgeInsets.zero,
         backgroundColor: Theme.of(context).colorScheme.background,
         builder: (context) {
           return BlocProvider.value(

frontend/appflowy_flutter/lib/plugins/database/widgets/cell/mobile_row_detail/mobile_row_detail_date_cell.dart

@@ -27,7 +27,6 @@ class MobileRowDetailDateCellSkin extends IEditableDateCellSkin {
       borderRadius: const BorderRadius.all(Radius.circular(14)),
       onTap: () => showMobileBottomSheet(
         context,
-        padding: EdgeInsets.zero,
         builder: (context) {
           return MobileDateCellEditScreen(
             controller: bloc.cellController,

frontend/appflowy_flutter/lib/plugins/database/widgets/cell/mobile_row_detail/mobile_row_detail_select_cell_option.dart

@@ -27,7 +27,6 @@ class MobileRowDetailSelectOptionCellSkin
       borderRadius: const BorderRadius.all(Radius.circular(14)),
       onTap: () => showMobileBottomSheet(
         context,
-        padding: EdgeInsets.zero,
         builder: (context) {
           return MobileSelectOptionEditor(
             cellController: bloc.cellController,

frontend/appflowy_flutter/lib/plugins/database/widgets/cell_editor/mobile_checklist_cell_editor.dart

@@ -33,7 +33,7 @@ class _MobileChecklistCellEditScreenState
           return Column(
             mainAxisSize: MainAxisSize.min,
             children: [
-              const DragHandler(),
+              const DragHandle(),
               Padding(
                 padding: const EdgeInsets.symmetric(horizontal: 8.0),
                 child: _buildHeader(context),

frontend/appflowy_flutter/lib/plugins/database/widgets/cell_editor/mobile_select_option_editor.dart

@@ -61,7 +61,7 @@ class _MobileSelectOptionEditorState extends State<MobileSelectOptionEditor> {
             return Column(
               mainAxisSize: MainAxisSize.min,
               children: [
-                const DragHandler(),
+                const DragHandle(),
                 _buildHeader(context),
                 const Divider(height: 0.5),
                 Expanded(

frontend/appflowy_flutter/lib/plugins/database/widgets/setting/mobile_database_controls.dart

@@ -60,7 +60,6 @@ class MobileDatabaseControls extends StatelessWidget {
               icon: FlowySvgs.m_field_hide_s,
               onTap: () => showMobileBottomSheet(
                 context,
-                resizeToAvoidBottomInset: false,
                 showDragHandle: true,
                 showHeader: true,
                 showBackButton: true,

frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/mention/mention_date_block.dart

@@ -163,7 +163,6 @@ class _MentionDateBlockState extends State<MentionDateBlock> {
                   if (PlatformExtension.isMobile) {
                     showMobileBottomSheet(
                       context,
-                      resizeToAvoidBottomInset: false,
                       builder: (_) => DraggableScrollableSheet(
                         expand: false,
                         snap: true,
@@ -178,7 +177,7 @@ class _MentionDateBlockState extends State<MentionDateBlock> {
                             children: [
                               ColoredBox(
                                 color: Theme.of(context).colorScheme.surface,
-                                child: const Center(child: DragHandler()),
+                                child: const Center(child: DragHandle()),
                               ),
                               const MobileDateHeader(),
                               MobileAppFlowyDatePicker(

frontend/appflowy_flutter/lib/workspace/presentation/widgets/date_picker/mobile_appflowy_date_picker.dart

@@ -214,7 +214,6 @@ class _ReminderSelector extends StatelessWidget {
       ),
       onTap: () => showMobileBottomSheet(
         context,
-        padding: EdgeInsets.zero,
         builder: (_) => DraggableScrollableSheet(
           expand: false,
           snap: true,
@@ -224,7 +223,7 @@ class _ReminderSelector extends StatelessWidget {
             children: [
               ColoredBox(
                 color: Theme.of(context).colorScheme.surface,
-                child: const Center(child: DragHandler()),
+                child: const Center(child: DragHandle()),
               ),
               const _ReminderSelectHeader(),
               Flexible(