diff --git a/frontend/app_flowy/lib/workspace/presentation/home/home_layout.dart b/frontend/app_flowy/lib/workspace/presentation/home/home_layout.dart
index dde5091d44..5194b9edb7 100644
--- a/frontend/app_flowy/lib/workspace/presentation/home/home_layout.dart
+++ b/frontend/app_flowy/lib/workspace/presentation/home/home_layout.dart
@@ -1,3 +1,5 @@
+import 'dart:io' show Platform;
+
 import 'package:app_flowy/workspace/application/home/home_bloc.dart';
 import 'package:flowy_infra/size.dart';
 import 'package:flowy_infra/time/duration.dart';
@@ -15,6 +17,7 @@ class HomeLayout {
   late double editPanelWidth;
   late double homePageLOffset;
   late double homePageROffset;
+  late double menuSpacing;
   late Duration animDuration;
 
   HomeLayout(BuildContext context, BoxConstraints homeScreenConstraint,
@@ -37,6 +40,8 @@ class HomeLayout {
     }
 
     homePageLOffset = showMenu ? menuWidth : 0.0;
+
+    menuSpacing = !showMenu && Platform.isMacOS ? 80.0 : 0.0;
     animDuration = .35.seconds;
 
     editPanelWidth = HomeSizes.editPanelWidth;
diff --git a/frontend/app_flowy/lib/workspace/presentation/home/home_screen.dart b/frontend/app_flowy/lib/workspace/presentation/home/home_screen.dart
index e38a2f4614..3259e3d843 100644
--- a/frontend/app_flowy/lib/workspace/presentation/home/home_screen.dart
+++ b/frontend/app_flowy/lib/workspace/presentation/home/home_screen.dart
@@ -87,7 +87,9 @@ class _HomeScreenState extends State<HomeScreen> {
     return LayoutBuilder(
       builder: (BuildContext context, BoxConstraints constraints) {
         final layout = HomeLayout(context, constraints, state.forceCollapse);
-        const homeStack = HomeStack();
+        final homeStack = HomeStack(
+          layout: layout,
+        );
         final menu = _buildHomeMenu(
           layout: layout,
           context: context,
diff --git a/frontend/app_flowy/lib/workspace/presentation/home/home_stack.dart b/frontend/app_flowy/lib/workspace/presentation/home/home_stack.dart
index d58f849cd7..73ebde5141 100644
--- a/frontend/app_flowy/lib/workspace/presentation/home/home_stack.dart
+++ b/frontend/app_flowy/lib/workspace/presentation/home/home_stack.dart
@@ -1,13 +1,9 @@
-import 'dart:io' show Platform;
-
 import 'package:app_flowy/startup/startup.dart';
-import 'package:app_flowy/workspace/application/home/home_bloc.dart';
 import 'package:app_flowy/plugins/blank/blank.dart';
 import 'package:app_flowy/workspace/presentation/home/toast.dart';
 import 'package:flowy_infra/theme.dart';
 import 'package:flowy_sdk/log.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:provider/provider.dart';
 import 'package:time/time.dart';
 import 'package:app_flowy/startup/plugin/plugin.dart';
@@ -17,11 +13,14 @@ import 'package:app_flowy/core/frameless_window.dart';
 import 'package:flowy_infra_ui/widget/spacing.dart';
 import 'package:flowy_infra_ui/style_widget/extension.dart';
 import 'package:flowy_infra/notifier.dart';
+import 'home_layout.dart';
 
 typedef NavigationCallback = void Function(String id);
 
 class HomeStack extends StatelessWidget {
-  const HomeStack({Key? key}) : super(key: key);
+  const HomeStack({Key? key, required this.layout}) : super(key: key);
+
+  final HomeLayout layout;
 
   @override
   Widget build(BuildContext context) {
@@ -30,7 +29,7 @@ class HomeStack extends StatelessWidget {
     return Column(
       mainAxisAlignment: MainAxisAlignment.start,
       children: [
-        getIt<HomeStackManager>().stackTopBar(),
+        getIt<HomeStackManager>().stackTopBar(layout: layout),
         Expanded(
           child: Container(
             color: theme.surface,
@@ -143,7 +142,7 @@ class HomeStackManager {
 
   void setStackWithId(String id) {}
 
-  Widget stackTopBar() {
+  Widget stackTopBar({required HomeLayout layout}) {
     return MultiProvider(
       providers: [
         ChangeNotifierProvider.value(value: _notifier),
@@ -151,7 +150,7 @@ class HomeStackManager {
       child: Selector<HomeStackNotifier, Widget>(
         selector: (context, notifier) => notifier.titleWidget,
         builder: (context, widget, child) {
-          return const MoveWindowDetector(child: HomeTopBar());
+          return MoveWindowDetector(child: HomeTopBar(layout: layout));
         },
       ),
     );
@@ -181,7 +180,9 @@ class HomeStackManager {
 }
 
 class HomeTopBar extends StatelessWidget {
-  const HomeTopBar({Key? key}) : super(key: key);
+  const HomeTopBar({Key? key, required this.layout}) : super(key: key);
+
+  final HomeLayout layout;
 
   @override
   Widget build(BuildContext context) {
@@ -192,15 +193,7 @@ class HomeTopBar extends StatelessWidget {
       child: Row(
         crossAxisAlignment: CrossAxisAlignment.center,
         children: [
-          BlocBuilder<HomeBloc, HomeState>(
-              buildWhen: ((previous, current) =>
-                  previous.isMenuCollapsed != current.isMenuCollapsed),
-              builder: (context, state) {
-                if (state.isMenuCollapsed && Platform.isMacOS) {
-                  return const HSpace(80);
-                }
-                return const HSpace(0);
-              }),
+          HSpace(layout.menuSpacing),
           const FlowyNavigation(),
           const HSpace(16),
           ChangeNotifierProvider.value(