fix: create view panel icon color

frontend/app_flowy/lib/plugins/board/presentation/card/card.dart

@@ -133,7 +133,8 @@ class _BoardCardState extends State<BoardCard> {
         throw UnimplementedError();
       case AccessoryType.more:
         return GridRowActionSheet(
-            rowData: context.read<BoardCardBloc>().rowInfo());
+          rowData: context.read<BoardCardBloc>().rowInfo(),
+        );
     }
   }
 

frontend/app_flowy/lib/plugins/doc/document.dart

@@ -233,7 +233,7 @@ class ShareActionWrapper extends ActionItem {
   ShareActionWrapper(this.inner);
 
   @override
-  Widget? get icon => null;
+  Widget? icon(Color iconColor) => null;
 
   @override
   String get name => inner.name;

frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/date_cell/date_editor.dart

@@ -76,7 +76,7 @@ class _DateCellEditor extends State<DateCellEditor> {
   }
 }
 
-class _CellCalendarWidget extends StatelessWidget {
+class _CellCalendarWidget extends StatefulWidget {
   final GridDateCellController cellContext;
   final DateTypeOptionPB dateTypeOptionPB;
 
@@ -86,26 +86,43 @@ class _CellCalendarWidget extends StatelessWidget {
     Key? key,
   }) : super(key: key);
 
+  @override
+  State<_CellCalendarWidget> createState() => _CellCalendarWidgetState();
+}
+
+class _CellCalendarWidgetState extends State<_CellCalendarWidget> {
+  late PopoverMutex popoverMutex;
+  late DateCalBloc bloc;
+
+  @override
+  void initState() {
+    popoverMutex = PopoverMutex();
+
+    bloc = DateCalBloc(
+      dateTypeOptionPB: widget.dateTypeOptionPB,
+      cellData: widget.cellContext.getCellData(),
+      cellController: widget.cellContext,
+    )..add(const DateCalEvent.initial());
+    super.initState();
+  }
+
   @override
   Widget build(BuildContext context) {
     final theme = context.watch<AppTheme>();
-    return BlocProvider(
+    return BlocProvider.value(
-      create: (context) {
+      value: bloc,
-        return DateCalBloc(
-          dateTypeOptionPB: dateTypeOptionPB,
-          cellData: cellContext.getCellData(),
-          cellController: cellContext,
-        )..add(const DateCalEvent.initial());
-      },
       child: BlocBuilder<DateCalBloc, DateCalState>(
         buildWhen: (p, c) => false,
         builder: (context, state) {
           List<Widget> children = [
             _buildCalendar(theme, context),
-            _TimeTextField(bloc: context.read<DateCalBloc>()),
+            _TimeTextField(
+              bloc: context.read<DateCalBloc>(),
+              popoverMutex: popoverMutex,
+            ),
             Divider(height: 1, color: theme.shader5),
             const _IncludeTimeButton(),
-            const _DateTypeOptionButton()
+            _DateTypeOptionButton(popoverMutex: popoverMutex)
           ];
 
           return ListView.separated(
@@ -124,6 +141,13 @@ class _CellCalendarWidget extends StatelessWidget {
     );
   }
 
+  @override
+  void dispose() {
+    bloc.close();
+    popoverMutex.dispose();
+    super.dispose();
+  }
+
   Widget _buildCalendar(AppTheme theme, BuildContext context) {
     return BlocBuilder<DateCalBloc, DateCalState>(
       builder: (context, state) {
@@ -223,8 +247,10 @@ class _IncludeTimeButton extends StatelessWidget {
 
 class _TimeTextField extends StatefulWidget {
   final DateCalBloc bloc;
+  final PopoverMutex popoverMutex;
   const _TimeTextField({
     required this.bloc,
+    required this.popoverMutex,
     Key? key,
   }) : super(key: key);
 
@@ -245,9 +271,18 @@ class _TimeTextFieldState extends State<_TimeTextField> {
         if (mounted) {
           widget.bloc.add(DateCalEvent.setTime(_controller.text));
         }
+
+        if (_focusNode.hasFocus) {
+          widget.popoverMutex.close();
+        }
+      });
+
+      widget.popoverMutex.listenOnPopoverChanged(() {
+        if (_focusNode.hasFocus) {
+          _focusNode.unfocus();
+        }
       });
     }
-
     super.initState();
   }
 
@@ -295,7 +330,11 @@ class _TimeTextFieldState extends State<_TimeTextField> {
 }
 
 class _DateTypeOptionButton extends StatelessWidget {
-  const _DateTypeOptionButton({Key? key}) : super(key: key);
+  final PopoverMutex popoverMutex;
+  const _DateTypeOptionButton({
+    required this.popoverMutex,
+    Key? key,
+  }) : super(key: key);
 
   @override
   Widget build(BuildContext context) {
@@ -306,6 +345,7 @@ class _DateTypeOptionButton extends StatelessWidget {
       selector: (state) => state.dateTypeOptionPB,
       builder: (context, dateTypeOptionPB) {
         return AppFlowyPopover(
+          mutex: popoverMutex,
           triggerActions: PopoverTriggerFlags.hover | PopoverTriggerFlags.click,
           offset: const Offset(20, 0),
           constraints: BoxConstraints.loose(const Size(140, 100)),
@@ -318,6 +358,7 @@ class _DateTypeOptionButton extends StatelessWidget {
           popupBuilder: (BuildContext popContext) {
             return _CalDateTimeSetting(
               dateTypeOptionPB: dateTypeOptionPB,
+              popoverMutex: popoverMutex,
               onEvent: (event) => context.read<DateCalBloc>().add(event),
             );
           },
@@ -328,11 +369,15 @@ class _DateTypeOptionButton extends StatelessWidget {
 }
 
 class _CalDateTimeSetting extends StatefulWidget {
+  final PopoverMutex popoverMutex;
   final DateTypeOptionPB dateTypeOptionPB;
   final Function(DateCalEvent) onEvent;
-  const _CalDateTimeSetting(
+  const _CalDateTimeSetting({
-      {required this.dateTypeOptionPB, required this.onEvent, Key? key})
+    required this.dateTypeOptionPB,
-      : super(key: key);
+    required this.popoverMutex,
+    required this.onEvent,
+    Key? key,
+  }) : super(key: key);
 
   @override
   State<_CalDateTimeSetting> createState() => _CalDateTimeSettingState();
@@ -340,13 +385,12 @@ class _CalDateTimeSetting extends StatefulWidget {
 
 class _CalDateTimeSettingState extends State<_CalDateTimeSetting> {
   String? overlayIdentifier;
-  final _popoverMutex = PopoverMutex();
 
   @override
   Widget build(BuildContext context) {
     List<Widget> children = [
       AppFlowyPopover(
-        mutex: _popoverMutex,
+        mutex: widget.popoverMutex,
         asBarrier: true,
         triggerActions: PopoverTriggerFlags.hover | PopoverTriggerFlags.click,
         offset: const Offset(20, 0),
@@ -360,7 +404,7 @@ class _CalDateTimeSettingState extends State<_CalDateTimeSetting> {
         child: const DateFormatButton(),
       ),
       AppFlowyPopover(
-        mutex: _popoverMutex,
+        mutex: widget.popoverMutex,
         asBarrier: true,
         triggerActions: PopoverTriggerFlags.hover | PopoverTriggerFlags.click,
         offset: const Offset(20, 0),

frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_editor.dart

@@ -139,7 +139,6 @@ class _FieldNameTextField extends StatefulWidget {
 
 class _FieldNameTextFieldState extends State<_FieldNameTextField> {
   FocusNode focusNode = FocusNode();
-  VoidCallback? _popoverCallback;
   late TextEditingController controller;
 
   @override
@@ -151,6 +150,12 @@ class _FieldNameTextFieldState extends State<_FieldNameTextField> {
       }
     });
 
+    widget.popoverMutex.listenOnPopoverChanged(() {
+      if (focusNode.hasFocus) {
+        focusNode.unfocus();
+      }
+    });
+
     super.initState();
   }
 
@@ -176,8 +181,6 @@ class _FieldNameTextFieldState extends State<_FieldNameTextField> {
         buildWhen: (previous, current) =>
             previous.errorText != current.errorText,
         builder: (context, state) {
-          listenOnPopoverChanged(context);
-
           return RoundedInputField(
             height: 36,
             focusNode: focusNode,
@@ -198,18 +201,6 @@ class _FieldNameTextFieldState extends State<_FieldNameTextField> {
       ),
     );
   }
-
-  void listenOnPopoverChanged(BuildContext context) {
-    if (_popoverCallback != null) {
-      widget.popoverMutex.removePopoverListener(_popoverCallback!);
-    }
-    _popoverCallback = widget.popoverMutex.listenOnPopoverChanged(() {
-      if (focusNode.hasFocus) {
-        final node = FocusScope.of(context);
-        node.unfocus();
-      }
-    });
-  }
 }
 
 class _DeleteFieldButton extends StatelessWidget {

frontend/app_flowy/lib/workspace/presentation/home/menu/app/header/right_click_action.dart

@@ -5,9 +5,12 @@ import 'package:flutter/material.dart';
 
 import 'header.dart';
 
-class AppDisclosureActionSheet with ActionList<DisclosureActionWrapper>, FlowyOverlayDelegate {
+class AppDisclosureActionSheet
+    with ActionList<DisclosureActionWrapper>, FlowyOverlayDelegate {
   final Function(dartz.Option<AppDisclosureAction>) onSelected;
-  final _items = AppDisclosureAction.values.map((action) => DisclosureActionWrapper(action)).toList();
+  final _items = AppDisclosureAction.values
+      .map((action) => DisclosureActionWrapper(action))
+      .toList();
 
   AppDisclosureActionSheet({
     required this.onSelected,
@@ -17,7 +20,8 @@ class AppDisclosureActionSheet with ActionList<DisclosureActionWrapper>, FlowyOv
   List<DisclosureActionWrapper> get items => _items;
 
   @override
-  void Function(dartz.Option<DisclosureActionWrapper> p1) get selectCallback => (result) {
+  void Function(dartz.Option<DisclosureActionWrapper> p1) get selectCallback =>
+      (result) {
         result.fold(
           () => onSelected(dartz.none()),
           (wrapper) => onSelected(
@@ -40,7 +44,7 @@ class DisclosureActionWrapper extends ActionItem {
 
   DisclosureActionWrapper(this.inner);
   @override
-  Widget? get icon => inner.icon;
+  Widget? icon(Color iconColor) => inner.icon;
 
   @override
   String get name => inner.name;

frontend/app_flowy/lib/workspace/presentation/home/menu/app/section/disclosure_action.dart

@@ -80,7 +80,7 @@ class ViewDisclosureRegion extends StatelessWidget
   @override
   Widget build(BuildContext context) {
     return Listener(
-      onPointerDown: (event) => {_handleClick(event, context)},
+      onPointerDown: (event) => _handleClick(event, context),
       child: child,
     );
   }
@@ -123,7 +123,7 @@ class ViewDisclosureActionWrapper extends ActionItem {
 
   ViewDisclosureActionWrapper(this.inner);
   @override
-  Widget? get icon => inner.icon;
+  Widget? icon(Color iconColor) => inner.icon(iconColor);
 
   @override
   String get name => inner.name;

frontend/app_flowy/lib/workspace/presentation/home/menu/app/section/item.dart

@@ -147,14 +147,14 @@ extension ViewDisclosureExtension on ViewDisclosureAction {
     }
   }
 
-  Widget get icon {
+  Widget icon(Color iconColor) {
     switch (this) {
       case ViewDisclosureAction.rename:
-        return svgWidget('editor/edit', color: const Color(0xff999999));
+        return svgWidget('editor/edit', color: iconColor);
       case ViewDisclosureAction.delete:
-        return svgWidget('editor/delete', color: const Color(0xff999999));
+        return svgWidget('editor/delete', color: iconColor);
       case ViewDisclosureAction.duplicate:
-        return svgWidget('editor/copy', color: const Color(0xff999999));
+        return svgWidget('editor/copy', color: iconColor);
     }
   }
 }

frontend/app_flowy/lib/workspace/presentation/widgets/float_bubble/question_bubble.dart

@@ -101,9 +101,11 @@ class _DebugToast {
   }
 }
 
-class QuestionBubbleActionSheet with ActionList<BubbleActionWrapper>, FlowyOverlayDelegate {
+class QuestionBubbleActionSheet
+    with ActionList<BubbleActionWrapper>, FlowyOverlayDelegate {
   final Function(dartz.Option<BubbleAction>) onSelected;
-  final _items = BubbleAction.values.map((action) => BubbleActionWrapper(action)).toList();
+  final _items =
+      BubbleAction.values.map((action) => BubbleActionWrapper(action)).toList();
 
   QuestionBubbleActionSheet({
     required this.onSelected,
@@ -119,7 +121,8 @@ class QuestionBubbleActionSheet with ActionList<BubbleActionWrapper>, FlowyOverl
   List<BubbleActionWrapper> get items => _items;
 
   @override
-  void Function(dartz.Option<BubbleActionWrapper> p1) get selectCallback => (result) {
+  void Function(dartz.Option<BubbleActionWrapper> p1) get selectCallback =>
+      (result) {
         result.fold(
           () => onSelected(dartz.none()),
           (wrapper) => onSelected(
@@ -156,7 +159,8 @@ class FlowyVersionDescription extends StatelessWidget {
       builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
         if (snapshot.connectionState == ConnectionState.done) {
           if (snapshot.hasError) {
-            return FlowyText("Error: ${snapshot.error}", fontSize: 12, color: theme.shader4);
+            return FlowyText("Error: ${snapshot.error}",
+                fontSize: 12, color: theme.shader4);
           }
 
           PackageInfo packageInfo = snapshot.data;
@@ -170,7 +174,8 @@ class FlowyVersionDescription extends StatelessWidget {
             children: [
               Divider(height: 1, color: theme.shader6, thickness: 1.0),
               const VSpace(6),
-              FlowyText("$appName $version.$buildNumber", fontSize: 12, color: theme.shader4),
+              FlowyText("$appName $version.$buildNumber",
+                  fontSize: 12, color: theme.shader4),
             ],
           ).padding(
             horizontal: ActionListSizes.itemHPadding + ActionListSizes.padding,
@@ -190,7 +195,7 @@ class BubbleActionWrapper extends ActionItem {
 
   BubbleActionWrapper(this.inner);
   @override
-  Widget? get icon => inner.emoji;
+  Widget? icon(Color iconColor) => inner.emoji;
 
   @override
   String get name => inner.name;

frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_action.dart

@@ -59,7 +59,7 @@ abstract class ActionList<T extends ActionItem> {
 }
 
 abstract class ActionItem {
-  Widget? get icon;
+  Widget? icon(Color iconColor);
   String get name;
 }
 
@@ -83,6 +83,7 @@ class ActionCell<T extends ActionItem> extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final theme = context.watch<AppTheme>();
+    final icon = action.icon(theme.iconColor);
 
     return FlowyHover(
       style: HoverStyle(hoverColor: theme.hover),
@@ -94,12 +95,9 @@ class ActionCell<T extends ActionItem> extends StatelessWidget {
           child: Row(
             crossAxisAlignment: CrossAxisAlignment.center,
             children: [
-              if (action.icon != null) action.icon!,
+              if (icon != null) icon,
               HSpace(ActionListSizes.itemHPadding),
-              FlowyText.medium(
+              FlowyText.medium(action.name, fontSize: 12),
-                action.name,
-                fontSize: 12,
-              ),
             ],
           ),
         ).padding(

frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/appflowy_popover.dart

@@ -30,7 +30,7 @@ class AppFlowyPopover extends StatelessWidget {
     this.offset,
     this.controller,
     this.asBarrier = false,
-    this.margin = const EdgeInsets.all(12),
+    this.margin = const EdgeInsets.all(6),
   }) : super(key: key);
 
   @override

frontend/rust-lib/flowy-grid/src/services/group/controller_impls/default_controller.rs

@@ -55,7 +55,7 @@ impl GroupControllerSharedOperation for DefaultGroupController {
         _row_rev: &RowRevision,
         _field_rev: &FieldRevision,
     ) -> FlowyResult<Vec<GroupChangesetPB>> {
-        todo!()
+        Ok(vec![])
     }
 
     fn did_delete_row(
@@ -63,7 +63,7 @@ impl GroupControllerSharedOperation for DefaultGroupController {
         _row_rev: &RowRevision,
         _field_rev: &FieldRevision,
     ) -> FlowyResult<Vec<GroupChangesetPB>> {
-        todo!()
+        Ok(vec![])
     }
 
     fn move_group_row(&mut self, _context: MoveGroupRowContext) -> FlowyResult<Vec<GroupChangesetPB>> {