chore: replace popover with appflowy popover

Author: appflowy

frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/url_cell/cell_editor.dart

@@ -1,6 +1,5 @@
 import 'package:app_flowy/plugins/grid/application/cell/cell_service/cell_service.dart';
 import 'package:app_flowy/plugins/grid/application/cell/url_cell_editor_bloc.dart';
-import 'package:flowy_infra_ui/flowy_infra_ui.dart';
 import 'package:flutter/material.dart';
 import 'dart:async';
 
@@ -79,15 +78,12 @@ class URLEditorPopover extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return OverlayContainer(
-      constraints: BoxConstraints.loose(const Size(300, 160)),
-      child: SizedBox(
-        width: 200,
-        child: Padding(
-          padding: const EdgeInsets.all(6),
-          child: URLCellEditor(
-            cellController: cellController,
-          ),
+    return SizedBox(
+      width: 200,
+      child: Padding(
+        padding: const EdgeInsets.all(6),
+        child: URLCellEditor(
+          cellController: cellController,
         ),
       ),
     );

frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/url_cell/url_cell.dart

@@ -6,6 +6,7 @@ import 'package:appflowy_popover/popover.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flowy_infra/image.dart';
 import 'package:flowy_infra/theme.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
@@ -129,8 +130,9 @@ class _GridURLCellState extends GridCellState<GridURLCell> {
             ),
           );
 
-          return Popover(
+          return AppFlowyStylePopover(
             controller: _popoverController,
+            constraints: BoxConstraints.loose(const Size(300, 160)),
             direction: PopoverDirection.bottomWithLeftAligned,
             offset: const Offset(0, 20),
             child: SizedBox.expand(
@@ -214,7 +216,8 @@ class _EditURLAccessoryState extends State<_EditURLAccessory>
   @override
   Widget build(BuildContext context) {
     final theme = context.watch<AppTheme>();
-    return Popover(
+    return AppFlowyStylePopover(
+      constraints: BoxConstraints.loose(const Size(300, 160)),
       controller: _popoverController,
       direction: PopoverDirection.bottomWithLeftAligned,
       triggerActions: PopoverTriggerActionFlags.click,

frontend/app_flowy/lib/plugins/grid/presentation/widgets/row/row_detail.dart

@@ -146,18 +146,15 @@ class _PropertyList extends StatelessWidget {
                 });
               },
               onOpened: (controller) {
-                return OverlayContainer(
-                  constraints: BoxConstraints.loose(const Size(240, 200)),
-                  child: FieldEditor(
-                    gridId: viewId,
-                    typeOptionLoader: NewFieldTypeOptionLoader(gridId: viewId),
-                    onDeleted: (fieldId) {
-                      controller.close();
-                      context
-                          .read<RowDetailBloc>()
-                          .add(RowDetailEvent.deleteField(fieldId));
-                    },
-                  ),
+                return FieldEditor(
+                  gridId: viewId,
+                  typeOptionLoader: NewFieldTypeOptionLoader(gridId: viewId),
+                  onDeleted: (fieldId) {
+                    controller.close();
+                    context
+                        .read<RowDetailBloc>()
+                        .add(RowDetailEvent.deleteField(fieldId));
+                  },
                 );
               },
             ),
@@ -168,28 +165,41 @@ class _PropertyList extends StatelessWidget {
   }
 }
 
-class _CreateFieldButton extends StatelessWidget {
+class _CreateFieldButton extends StatefulWidget {
   final String viewId;
   final Widget Function(PopoverController) onOpened;
   final VoidCallback onClosed;
-  final PopoverController popoverController = PopoverController();
 
-  _CreateFieldButton({
+  const _CreateFieldButton({
     required this.viewId,
     required this.onOpened,
     required this.onClosed,
     Key? key,
   }) : super(key: key);
 
+  @override
+  State<_CreateFieldButton> createState() => _CreateFieldButtonState();
+}
+
+class _CreateFieldButtonState extends State<_CreateFieldButton> {
+  late PopoverController popoverController;
+
+  @override
+  void initState() {
+    popoverController = PopoverController();
+    super.initState();
+  }
+
   @override
   Widget build(BuildContext context) {
     final theme = context.read<AppTheme>();
 
-    return Popover(
+    return AppFlowyStylePopover(
+      constraints: BoxConstraints.loose(const Size(240, 200)),
       controller: popoverController,
       triggerActions: PopoverTriggerActionFlags.click,
       direction: PopoverDirection.topWithLeftAligned,
-      onClose: onClosed,
+      onClose: widget.onClosed,
       child: Container(
         height: 40,
         decoration: _makeBoxDecoration(context),
@@ -203,7 +213,8 @@ class _CreateFieldButton extends StatelessWidget {
           leftIcon: svgWidget("home/add"),
         ),
       ),
-      popupBuilder: (BuildContext context) => onOpened(popoverController),
+      popupBuilder: (BuildContext context) =>
+          widget.onOpened(popoverController),
     );
   }