Merge pull request #789 from naughtz/#692

feature: Shortcut for collapse the left sidebar #692
2024-08-30 18:12:39 +00:00 · 2022-08-29 10:08:03 +08:00 · 2022-08-29 10:08:03 +08:00 · 7f165163c8
commit 7f165163c8
parent fce30af7a7 11d5c9d53a
26 changed files with 168 additions and 23 deletions
--- a/.github/workflows/ci.yaml
+++ b/.github/workflows/ci.yaml
@ -59,6 +59,7 @@ jobs:
            sudo wget -qO /etc/apt/sources.list.d/dart_stable.list https://storage.googleapis.com/download.dartlang.org/linux/debian/dart_stable.list
            sudo apt-get update
            sudo apt-get install -y dart curl build-essential libsqlite3-dev libssl-dev clang cmake ninja-build pkg-config libgtk-3-dev
+            sudo apt-get install keybinder-3.0
          elif [ "$RUNNER_OS" == "macOS" ]; then
            echo 'do nothing'
          fi
--- a/frontend/app_flowy/assets/translations/ca-ES.json
+++ b/frontend/app_flowy/assets/translations/ca-ES.json
@ -141,5 +141,9 @@
      "lightLabel": "Mode Clar",
      "darkLabel": "Mode Fosc"
    }
+  },
+  "sideBar": {
+    "openSidebar": "Open sidebar",
+    "closeSidebar": "Close sidebar"
  }
 }
--- a/frontend/app_flowy/assets/translations/de-DE.json
+++ b/frontend/app_flowy/assets/translations/de-DE.json
@ -141,6 +141,10 @@
        "lightLabel": "Heller Modus",
        "darkLabel": "Dunkler Modus"
      }
+    },
+    "sideBar": {
+      "openSidebar": "Open sidebar",
+      "closeSidebar": "Close sidebar"
    }
  }
  
--- a/frontend/app_flowy/assets/translations/en.json
+++ b/frontend/app_flowy/assets/translations/en.json
@ -215,5 +215,9 @@
      "timeHintTextInTwelveHour": "12:00 AM",
      "timeHintTextInTwentyFourHour": "12:00"
    }
+  },
+  "sideBar": {
+    "openSidebar": "Open sidebar",
+    "closeSidebar": "Close sidebar"
  }
 }
--- a/frontend/app_flowy/assets/translations/es-VE.json
+++ b/frontend/app_flowy/assets/translations/es-VE.json
@ -213,5 +213,9 @@
      "timeHintTextInTwelveHour": "12:00 AM",
      "timeHintTextInTwentyFourHour": "12:00"
    }
+  },
+  "sideBar": {
+    "openSidebar": "Open sidebar",
+    "closeSidebar": "Close sidebar"
  }
 }
--- a/frontend/app_flowy/assets/translations/fr-CA.json
+++ b/frontend/app_flowy/assets/translations/fr-CA.json
@ -141,5 +141,9 @@
      "lightLabel": "Mode clair",
      "darkLabel": "Mode sombre"
    }
+  },
+  "sideBar": {
+    "openSidebar": "Open sidebar",
+    "closeSidebar": "Close sidebar"
  }
 }
--- a/frontend/app_flowy/assets/translations/fr-FR.json
+++ b/frontend/app_flowy/assets/translations/fr-FR.json
@ -142,6 +142,10 @@
      "darkLabel": "Mode sombre"
    }
  },
+  "sideBar": {
+    "openSidebar": "Open sidebar",
+    "closeSidebar": "Close sidebar"
+  },
  "grid": {
    "settings": {
      "filter": "Filtrer",
--- a/frontend/app_flowy/assets/translations/hu-HU.json
+++ b/frontend/app_flowy/assets/translations/hu-HU.json
@ -141,5 +141,9 @@
      "lightLabel": "Világos mód",
      "darkLabel": "Éjjeli mód"
    }
+  },
+  "sideBar": {
+    "openSidebar": "Open sidebar",
+    "closeSidebar": "Close sidebar"
  }
 }
--- a/frontend/app_flowy/assets/translations/id-ID.json
+++ b/frontend/app_flowy/assets/translations/id-ID.json
@ -214,5 +214,9 @@
      "timeHintTextInTwelveHour": "12:00 AM",
      "timeHintTextInTwentyFourHour": "12:00"
    }
+  },
+  "sideBar": {
+    "openSidebar": "Open sidebar",
+    "closeSidebar": "Close sidebar"
  }
 }
--- a/frontend/app_flowy/assets/translations/it-IT.json
+++ b/frontend/app_flowy/assets/translations/it-IT.json
@ -147,5 +147,9 @@
  },
  "document":{
    "menuName":"Documento"
+  },
+  "sideBar": {
+    "openSidebar": "Open sidebar",
+    "closeSidebar": "Close sidebar"
  }
 }
--- a/frontend/app_flowy/assets/translations/ja-JP.json
+++ b/frontend/app_flowy/assets/translations/ja-JP.json
@ -195,5 +195,9 @@
      "pannelTitle": "選択候補を検索 または 作成する",
      "searchOption": "選択候補を検索"
    }
+  },
+  "sideBar": {
+    "openSidebar": "Open sidebar",
+    "closeSidebar": "Close sidebar"
  }
 }
--- a/frontend/app_flowy/assets/translations/pl-PL.json
+++ b/frontend/app_flowy/assets/translations/pl-PL.json
@ -141,5 +141,9 @@
      "lightLabel": "Tryb Jasny",
      "darkLabel": "Tryb Ciemny"
    }
+  },
+  "sideBar": {
+    "openSidebar": "Open sidebar",
+    "closeSidebar": "Close sidebar"
  }
 }
--- a/frontend/app_flowy/assets/translations/pt-BR.json
+++ b/frontend/app_flowy/assets/translations/pt-BR.json
@ -141,6 +141,10 @@
        "lightLabel": "Modo Claro",
        "darkLabel": "Modo Escuro"
      }
+    },
+    "sideBar": {
+      "openSidebar": "Open sidebar",
+      "closeSidebar": "Close sidebar"
    }
  }
 
--- a/frontend/app_flowy/assets/translations/pt-PT.json
+++ b/frontend/app_flowy/assets/translations/pt-PT.json
@ -141,6 +141,10 @@
        "lightLabel": "Modo Claro",
        "darkLabel": "Modo Escuro"
      }
+    },
+    "sideBar": {
+      "openSidebar": "Open sidebar",
+      "closeSidebar": "Close sidebar"
    }
  }

--- a/frontend/app_flowy/assets/translations/ru-RU.json
+++ b/frontend/app_flowy/assets/translations/ru-RU.json
@ -203,6 +203,10 @@
        "timeHintTextInTwelveHour": "12:00 AM",
        "timeHintTextInTwentyFourHour": "12:00"
      }
+    },
+    "sideBar": {
+      "openSidebar": "Open sidebar",
+      "closeSidebar": "Close sidebar"
    }
  }
  
--- a/frontend/app_flowy/assets/translations/tr-TR.json
+++ b/frontend/app_flowy/assets/translations/tr-TR.json
@ -141,5 +141,9 @@
      "lightLabel": "Aydınlık Mod",
      "darkLabel": "Karanlık Mod"
    }
+  },
+  "sideBar": {
+    "openSidebar": "Open sidebar",
+    "closeSidebar": "Close sidebar"
  }
 }
--- a/frontend/app_flowy/assets/translations/zh-CN.json
+++ b/frontend/app_flowy/assets/translations/zh-CN.json
@ -149,6 +149,10 @@
      "darkLabel": "夜间模式"
    }
  },
+  "sideBar": {
+    "openSidebar": "打开侧边栏",
+    "closeSidebar": "关闭侧边栏"
+  },
  "grid": {
    "settings": {
      "filter": "过滤器",
--- a/frontend/app_flowy/assets/translations/zh-TW.json
+++ b/frontend/app_flowy/assets/translations/zh-TW.json
@ -214,5 +214,9 @@
      "timeHintTextInTwelveHour": "12:00 AM",
      "timeHintTextInTwentyFourHour": "12:00"
    }
+  },
+  "sideBar": {
+    "openSidebar": "Open sidebar",
+    "closeSidebar": "Close sidebar"
  }
 }
--- a/frontend/app_flowy/lib/main.dart
+++ b/frontend/app_flowy/lib/main.dart
@ -1,6 +1,7 @@
 import 'package:app_flowy/startup/startup.dart';
 import 'package:app_flowy/user/presentation/splash_screen.dart';
 import 'package:easy_localization/easy_localization.dart';
+import 'package:hotkey_manager/hotkey_manager.dart';
 import 'package:flutter/material.dart';

 class FlowyApp implements EntryPoint {
@ -14,5 +15,8 @@ void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await EasyLocalization.ensureInitialized();

+  WidgetsFlutterBinding.ensureInitialized();
+  await hotKeyManager.unregisterAll();
+
  await FlowyRunner.run(FlowyApp());
 }
--- a/frontend/app_flowy/lib/workspace/presentation/home/home_screen.dart
+++ b/frontend/app_flowy/lib/workspace/presentation/home/home_screen.dart
@ -1,5 +1,7 @@
 import 'package:app_flowy/startup/plugin/plugin.dart';
 import 'package:app_flowy/workspace/application/home/home_bloc.dart';
+
+import 'package:app_flowy/workspace/presentation/home/hotkeys.dart';
 import 'package:app_flowy/workspace/application/view/view_ext.dart';
 import 'package:app_flowy/workspace/presentation/widgets/edit_panel/panel_animation.dart';
 import 'package:app_flowy/workspace/presentation/widgets/float_bubble/question_bubble.dart';
@ -54,7 +56,8 @@ class _HomeScreenState extends State<HomeScreen> {
          },
        ),
      ],
-      child: Scaffold(
+      child: HomeHotKeys(
+          child: Scaffold(
        body: BlocListener<HomeBloc, HomeState>(
          listenWhen: (p, c) => p.unauthorized != c.unauthorized,
          listener: (context, state) {
@ -80,7 +83,7 @@ class _HomeScreenState extends State<HomeScreen> {
            },
          ),
        ),
-      ),
+      )),
    );
  }

@ -145,6 +148,7 @@ class _HomeScreenState extends State<HomeScreen> {
    return FocusTraversalGroup(child: RepaintBoundary(child: homeMenu));
  }

+
  Widget _buildEditPanel(
      {required HomeState homeState,
      required BuildContext context,
--- a/frontend/app_flowy/lib/workspace/presentation/home/hotkeys.dart
+++ b/frontend/app_flowy/lib/workspace/presentation/home/hotkeys.dart
@ -0,0 +1,32 @@
+import 'dart:io';
+
+import 'package:app_flowy/startup/startup.dart';
+import 'package:app_flowy/workspace/application/home/home_bloc.dart';
+import 'package:app_flowy/workspace/presentation/home/home_stack.dart';
+import 'package:flutter/material.dart';
+import 'package:hotkey_manager/hotkey_manager.dart';
+import 'package:provider/provider.dart';
+
+class HomeHotKeys extends StatelessWidget {
+  final Widget child;
+  const HomeHotKeys({required this.child, Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    HotKey _hotKey = HotKey(
+      KeyCode.backslash,
+      modifiers: [Platform.isMacOS ? KeyModifier.meta : KeyModifier.control],
+      // Set hotkey scope (default is HotKeyScope.system)
+      scope: HotKeyScope.inapp, // Set as inapp-wide hotkey.
+    );
+    hotKeyManager.register(
+      _hotKey,
+      keyDownHandler: (hotKey) {
+        context.read<HomeBloc>().add(const HomeEvent.collapseMenu());
+        getIt<HomeStackManager>().collapsedNotifier.value =
+            !getIt<HomeStackManager>().collapsedNotifier.currentValue!;
+      },
+    );
+    return child;
+  }
+}
--- a/frontend/app_flowy/lib/workspace/presentation/home/menu/menu.dart
+++ b/frontend/app_flowy/lib/workspace/presentation/home/menu/menu.dart
@ -2,6 +2,7 @@ export './app/header/header.dart';
 export './app/menu_app.dart';

 import 'dart:io' show Platform;
+import 'package:app_flowy/generated/locale_keys.g.dart';
 import 'package:app_flowy/plugins/trash/menu.dart';
 import 'package:app_flowy/workspace/presentation/home/home_sizes.dart';
 import 'package:app_flowy/workspace/presentation/home/home_stack.dart';
@ -217,14 +218,23 @@ class MenuTopBar extends StatelessWidget {
            children: [
              renderIcon(context),
              const Spacer(),
-              FlowyIconButton(
-                width: 28,
-                onPressed: () => context
-                    .read<HomeBloc>()
-                    .add(const HomeEvent.collapseMenu()),
-                iconPadding: const EdgeInsets.fromLTRB(4, 4, 4, 4),
-                icon: svgWidget("home/hide_menu", color: theme.iconColor),
-              )
+              Tooltip(
+                  richMessage: TextSpan(children: [
+                    const TextSpan(
+                        text: LocaleKeys.sideBar_closeSidebar + "\n"),
+                    TextSpan(
+                      text: Platform.isMacOS ? "⌘+\\" : "Ctrl+\\",
+                      style: const TextStyle(color: Colors.white60),
+                    ),
+                  ]),
+                  child: FlowyIconButton(
+                    width: 28,
+                    onPressed: () => context
+                        .read<HomeBloc>()
+                        .add(const HomeEvent.collapseMenu()),
+                    iconPadding: const EdgeInsets.fromLTRB(4, 4, 4, 4),
+                    icon: svgWidget("home/hide_menu", color: theme.iconColor),
+                  ))
            ],
          )),
        );
--- a/frontend/app_flowy/lib/workspace/presentation/home/navigation.dart
+++ b/frontend/app_flowy/lib/workspace/presentation/home/navigation.dart
@ -1,3 +1,6 @@
+import 'dart:io';
+
+import 'package:app_flowy/generated/locale_keys.g.dart';
 import 'package:app_flowy/workspace/application/home/home_bloc.dart';
 import 'package:app_flowy/workspace/presentation/home/home_stack.dart';
 import 'package:flowy_infra/image.dart';
@ -14,7 +17,8 @@ typedef NaviAction = void Function();
 class NavigationNotifier with ChangeNotifier {
  List<NavigationItem> navigationItems;
  PublishNotifier<bool> collapasedNotifier;
-  NavigationNotifier({required this.navigationItems, required this.collapasedNotifier});
+  NavigationNotifier(
+      {required this.navigationItems, required this.collapasedNotifier});

  void update(HomeStackNotifier notifier) {
    bool shouldNotify = false;
@ -69,7 +73,8 @@ class FlowyNavigation extends StatelessWidget {
        child: Row(children: [
          Selector<NavigationNotifier, PublishNotifier<bool>>(
              selector: (context, notifier) => notifier.collapasedNotifier,
-              builder: (ctx, collapsedNotifier, child) => _renderCollapse(ctx, collapsedNotifier, theme)),
+              builder: (ctx, collapsedNotifier, child) =>
+                  _renderCollapse(ctx, collapsedNotifier, theme)),
          Selector<NavigationNotifier, List<NavigationItem>>(
            selector: (context, notifier) => notifier.navigationItems,
            builder: (ctx, items, child) => Expanded(
@ -84,7 +89,8 @@ class FlowyNavigation extends StatelessWidget {
    );
  }

-  Widget _renderCollapse(BuildContext context, PublishNotifier<bool> collapsedNotifier, AppTheme theme) {
+  Widget _renderCollapse(BuildContext context,
+      PublishNotifier<bool> collapsedNotifier, AppTheme theme) {
    return ChangeNotifierProvider.value(
      value: collapsedNotifier,
      child: Consumer(
@ -92,15 +98,23 @@ class FlowyNavigation extends StatelessWidget {
          if (notifier.currentValue ?? false) {
            return RotationTransition(
              turns: const AlwaysStoppedAnimation(180 / 360),
-              child: FlowyIconButton(
-                width: 24,
-                onPressed: () {
-                  notifier.value = false;
-                  ctx.read<HomeBloc>().add(const HomeEvent.collapseMenu());
-                },
-                iconPadding: const EdgeInsets.fromLTRB(2, 2, 2, 2),
-                icon: svgWidget("home/hide_menu", color: theme.iconColor),
-              ),
+              child: Tooltip(
+                  richMessage: TextSpan(children: [
+                    const TextSpan(text: LocaleKeys.sideBar_openSidebar + "\n"),
+                    TextSpan(
+                      text: Platform.isMacOS ? "⌘+\\" : "Ctrl+\\",
+                      style: const TextStyle(color: Colors.white60),
+                    ),
+                  ]),
+                  child: FlowyIconButton(
+                    width: 24,
+                    onPressed: () {
+                      notifier.value = false;
+                      ctx.read<HomeBloc>().add(const HomeEvent.collapseMenu());
+                    },
+                    iconPadding: const EdgeInsets.fromLTRB(2, 2, 2, 2),
+                    icon: svgWidget("home/hide_menu", color: theme.iconColor),
+                  )),
            );
          } else {
            return Container();
@ -154,7 +168,8 @@ class NaviItemWidget extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
-    return Expanded(child: item.leftBarItem.padding(horizontal: 2, vertical: 2));
+    return Expanded(
+        child: item.leftBarItem.padding(horizontal: 2, vertical: 2));
  }
 }

--- a/frontend/app_flowy/pubspec.lock
+++ b/frontend/app_flowy/pubspec.lock
@ -569,6 +569,13 @@ packages:
      url: "https://pub.dartlang.org"
    source: hosted
    version: "2.1.0"
+  hotkey_manager:
+    dependency: "direct main"
+    description:
+      name: hotkey_manager
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "0.1.7"
  html:
    dependency: transitive
    description:
--- a/frontend/app_flowy/pubspec.yaml
+++ b/frontend/app_flowy/pubspec.yaml
@ -79,6 +79,7 @@ dependencies:
  table_calendar: ^3.0.5
  reorderables: ^0.5.0
  linked_scroll_controller: ^0.2.0
+  hotkey_manager: ^0.1.7

 dev_dependencies:
  flutter_lints: ^1.0.0
--- a/frontend/scripts/install_dev_env/install_linux.sh
+++ b/frontend/scripts/install_dev_env/install_linux.sh
@ -46,6 +46,9 @@ flutter config --enable-linux-desktop
 # Fix any problems reported by flutter doctor
 flutter doctor

+# install keybinder-3.0
+apt-get install keybinder-3.0
+
 # Add the githooks directory to your git configuration
 printMessage "Setting up githooks."
 git config core.hooksPath .githooks