From 46bad4e7e8926000ac118ad014de18403c0f0d49 Mon Sep 17 00:00:00 2001
From: "Lucas.Xu" <lucas.xu@appflowy.io>
Date: Fri, 2 Aug 2024 16:10:49 +0800
Subject: [PATCH] chore: optimize the workspace menu hover status (#5865)

---
 .../sidebar/space/sidebar_space_header.dart   | 31 ++++++-----
 .../sidebar/workspace/sidebar_workspace.dart  | 53 ++++++++++++++-----
 .../lib/style_widget/button.dart              |  7 ++-
 3 files changed, 63 insertions(+), 28 deletions(-)

diff --git a/frontend/appflowy_flutter/lib/workspace/presentation/home/menu/sidebar/space/sidebar_space_header.dart b/frontend/appflowy_flutter/lib/workspace/presentation/home/menu/sidebar/space/sidebar_space_header.dart
index 0654c11e7b..fc87902dd9 100644
--- a/frontend/appflowy_flutter/lib/workspace/presentation/home/menu/sidebar/space/sidebar_space_header.dart
+++ b/frontend/appflowy_flutter/lib/workspace/presentation/home/menu/sidebar/space/sidebar_space_header.dart
@@ -141,20 +141,23 @@ class _SidebarSpaceHeaderState extends State<SidebarSpaceHeader> {
               onAction: _onAction,
             ),
             const HSpace(8.0),
-            ViewAddButton(
-              parentViewId: widget.space.id,
-              onEditing: (_) {},
-              onSelected: (
-                pluginBuilder,
-                name,
-                initialDataBytes,
-                openAfterCreated,
-                createNewView,
-              ) {
-                if (createNewView) {
-                  widget.onAdded(pluginBuilder.layoutType!);
-                }
-              },
+            FlowyTooltip(
+              message: LocaleKeys.sideBar_addAPage.tr(),
+              child: ViewAddButton(
+                parentViewId: widget.space.id,
+                onEditing: (_) {},
+                onSelected: (
+                  pluginBuilder,
+                  name,
+                  initialDataBytes,
+                  openAfterCreated,
+                  createNewView,
+                ) {
+                  if (createNewView) {
+                    widget.onAdded(pluginBuilder.layoutType!);
+                  }
+                },
+              ),
             ),
           ],
         ),
diff --git a/frontend/appflowy_flutter/lib/workspace/presentation/home/menu/sidebar/workspace/sidebar_workspace.dart b/frontend/appflowy_flutter/lib/workspace/presentation/home/menu/sidebar/workspace/sidebar_workspace.dart
index 0926fc54a1..c27514f1ee 100644
--- a/frontend/appflowy_flutter/lib/workspace/presentation/home/menu/sidebar/workspace/sidebar_workspace.dart
+++ b/frontend/appflowy_flutter/lib/workspace/presentation/home/menu/sidebar/workspace/sidebar_workspace.dart
@@ -29,6 +29,15 @@ class SidebarWorkspace extends StatefulWidget {
 class _SidebarWorkspaceState extends State<SidebarWorkspace> {
   Loading? loadingIndicator;
 
+  final ValueNotifier<bool> onHover = ValueNotifier(false);
+
+  @override
+  void dispose() {
+    onHover.dispose();
+
+    super.dispose();
+  }
+
   @override
   Widget build(BuildContext context) {
     return BlocConsumer<UserWorkspaceBloc, UserWorkspaceState>(
@@ -40,19 +49,38 @@ class _SidebarWorkspaceState extends State<SidebarWorkspace> {
         if (currentWorkspace == null) {
           return const SizedBox.shrink();
         }
-        return Row(
-          children: [
-            Expanded(
-              child: SidebarSwitchWorkspaceButton(
-                userProfile: widget.userProfile,
-                currentWorkspace: currentWorkspace,
-              ),
+        return MouseRegion(
+          onEnter: (_) => onHover.value = true,
+          onExit: (_) => onHover.value = false,
+          child: ValueListenableBuilder(
+            valueListenable: onHover,
+            builder: (_, onHover, child) {
+              return Container(
+                margin: const EdgeInsets.only(right: 8.0),
+                decoration: BoxDecoration(
+                  borderRadius: BorderRadius.circular(8.0),
+                  color: onHover
+                      ? Theme.of(context).colorScheme.secondary
+                      : Colors.transparent,
+                ),
+                child: child,
+              );
+            },
+            child: Row(
+              children: [
+                Expanded(
+                  child: SidebarSwitchWorkspaceButton(
+                    userProfile: widget.userProfile,
+                    currentWorkspace: currentWorkspace,
+                  ),
+                ),
+                UserSettingButton(userProfile: widget.userProfile),
+                const HSpace(8.0),
+                const NotificationButton(),
+                const HSpace(4.0),
+              ],
             ),
-            UserSettingButton(userProfile: widget.userProfile),
-            const HSpace(8.0),
-            const NotificationButton(),
-            const HSpace(12.0),
-          ],
+          ),
         );
       },
     );
@@ -201,6 +229,7 @@ class _SidebarSwitchWorkspaceButtonState
       },
       child: FlowyIconTextButton(
         margin: EdgeInsets.zero,
+        hoverColor: Colors.transparent,
         textBuilder: (onHover) => SizedBox(
           height: 30,
           child: Row(
diff --git a/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/button.dart b/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/button.dart
index cb830e4099..f5b8ce505a 100644
--- a/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/button.dart
+++ b/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/button.dart
@@ -268,8 +268,11 @@ class FlowyButton extends StatelessWidget {
     return Container(
       decoration: decoration,
       child: Padding(
-        padding:
-            margin ?? const EdgeInsets.symmetric(horizontal: 6, vertical: 4),
+        padding: margin ??
+            const EdgeInsets.symmetric(
+              horizontal: 6,
+              vertical: 4,
+            ),
         child: child,
       ),
     );