From 7572321813b899fd9448fd1231ba93786e837a50 Mon Sep 17 00:00:00 2001
From: "Nathan.fooo" <86001920+appflowy@users.noreply.github.com>
Date: Sun, 8 Jan 2023 12:59:54 +0800
Subject: [PATCH] chore: auto width GridFieldCellActionSheet (#1673)

---
 .../widgets/header/field_cell.dart            |  3 +-
 .../header/field_cell_action_sheet.dart       | 67 +++++++++----------
 .../src/flowy_overlay/appflowy_popover.dart   |  9 +--
 3 files changed, 34 insertions(+), 45 deletions(-)

diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell.dart
index b65664a303..21ab461a48 100755
--- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell.dart
+++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell.dart
@@ -44,8 +44,7 @@ class _GridFieldCellState extends State<GridFieldCell> {
         builder: (context, state) {
           final button = AppFlowyPopover(
             triggerActions: PopoverTriggerFlags.none,
-            constraints: BoxConstraints.loose(const Size(240, 440)),
-            margin: EdgeInsets.zero,
+            constraints: BoxConstraints.loose(const Size(400, 240)),
             direction: PopoverDirection.bottomWithLeftAligned,
             controller: popoverController,
             popupBuilder: (BuildContext context) {
diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell_action_sheet.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell_action_sheet.dart
index 8e7d646a51..5fa729edd1 100644
--- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell_action_sheet.dart
+++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell_action_sheet.dart
@@ -43,21 +43,23 @@ class _GridFieldCellActionSheetState extends State<GridFieldCellActionSheet> {
     return BlocProvider(
       create: (context) =>
           getIt<FieldActionSheetBloc>(param1: widget.cellContext),
-      child: SingleChildScrollView(
-        padding: const EdgeInsets.all(12.0),
-        child: Column(
-          children: [
-            _EditFieldButton(
-              cellContext: widget.cellContext,
-              onTap: () {
-                setState(() {
-                  _showFieldEditor = true;
-                });
-              },
-            ),
-            VSpace(GridSize.typeOptionSeparatorHeight),
-            _FieldOperationList(widget.cellContext, () {}),
-          ],
+      child: IntrinsicWidth(
+        child: IntrinsicHeight(
+          child: Column(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              _EditFieldButton(
+                cellContext: widget.cellContext,
+                onTap: () {
+                  setState(() {
+                    _showFieldEditor = true;
+                  });
+                },
+              ),
+              VSpace(GridSize.typeOptionSeparatorHeight),
+              _FieldOperationList(widget.cellContext),
+            ],
+          ),
         ),
       ),
     );
@@ -90,22 +92,17 @@ class _EditFieldButton extends StatelessWidget {
 
 class _FieldOperationList extends StatelessWidget {
   final GridFieldCellContext fieldInfo;
-  final VoidCallback onDismissed;
-  const _FieldOperationList(this.fieldInfo, this.onDismissed, {Key? key})
-      : super(key: key);
+  final double cellWidth = 100;
+
+  const _FieldOperationList(this.fieldInfo, {Key? key}) : super(key: key);
 
   @override
   Widget build(BuildContext context) {
-    return GridView(
-      // https://api.flutter.dev/flutter/widgets/AnimatedList/shrinkWrap.html
-      shrinkWrap: true,
-      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
-        crossAxisCount: 2,
-        childAspectRatio: 4.0,
-        mainAxisSpacing: GridSize.typeOptionSeparatorHeight,
-        crossAxisSpacing: GridSize.typeOptionSeparatorHeight,
+    return SizedBox(
+      width: cellWidth * 2,
+      child: Wrap(
+        children: buildCells(),
       ),
-      children: buildCells(),
     );
   }
 
@@ -121,11 +118,14 @@ class _FieldOperationList extends StatelessWidget {
             break;
         }
 
-        return FieldActionCell(
-          fieldInfo: fieldInfo,
-          action: action,
-          onTap: onDismissed,
-          enable: enable,
+        return SizedBox(
+          height: GridSize.typeOptionItemHeight,
+          width: cellWidth,
+          child: FieldActionCell(
+            fieldInfo: fieldInfo,
+            action: action,
+            enable: enable,
+          ),
         );
       },
     ).toList();
@@ -134,14 +134,12 @@ class _FieldOperationList extends StatelessWidget {
 
 class FieldActionCell extends StatelessWidget {
   final GridFieldCellContext fieldInfo;
-  final VoidCallback onTap;
   final FieldAction action;
   final bool enable;
 
   const FieldActionCell({
     required this.fieldInfo,
     required this.action,
-    required this.onTap,
     required this.enable,
     Key? key,
   }) : super(key: key);
@@ -156,7 +154,6 @@ class FieldActionCell extends StatelessWidget {
       onTap: () {
         if (enable) {
           action.run(context, fieldInfo);
-          onTap();
         }
       },
       leftIcon: svgWidget(
diff --git a/frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/appflowy_popover.dart b/frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/appflowy_popover.dart
index 7ea220f608..9a978f8b2a 100644
--- a/frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/appflowy_popover.dart
+++ b/frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/appflowy_popover.dart
@@ -45,6 +45,7 @@ class AppFlowyPopover extends StatelessWidget {
       windowPadding: windowPadding,
       popupBuilder: (context) {
         final child = popupBuilder(context);
+        debugPrint("show popover: $child");
         return _PopoverContainer(
           constraints: constraints,
           margin: margin,
@@ -81,14 +82,6 @@ class _PopoverContainer extends StatelessWidget {
         decoration: decoration,
         constraints: constraints,
         child: child,
-
-        // SingleChildScrollView(
-        //   scrollDirection: Axis.horizontal,
-        //   child: ConstrainedBox(
-        //     constraints: constraints,
-        //     child: child,
-        //   ),
-        // ),
       ),
     );
   }