feat: add two keyboard shortcuts

- mod+shift+w: to close current tab - mod+p: to toggle pin status
pengx17 · Mar 11, 2022 · 5bffa80 · 5bffa80
1 parent 0947f31
commit 5bffa80
Show file tree

Hide file tree

Showing 2 changed files with 59 additions and 14 deletions.
diff --git a/src/PageTabs.tsx b/src/PageTabs.tsx
@@ -1,4 +1,7 @@
-import type { BlockEntity } from "@logseq/libs/dist/LSPlugin";
+import type {
+  BlockEntity,
+  SimpleCommandKeybinding,
+} from "@logseq/libs/dist/LSPlugin";
 import produce from "immer";
 import React from "react";
 import { useDeepCompareEffect, useLatest } from "react-use";
@@ -82,7 +85,9 @@ const Tabs = React.forwardRef<HTMLElement, TabsProps>(
         className={`flex items-center h-full px-1`}
         style={{ width: "fit-content" }}
         // By default middle button click will enter the horizontal scroll mode
-        onMouseDown={e => { if (e.button === 1) e.preventDefault(); }}
+        onMouseDown={(e) => {
+          if (e.button === 1) e.preventDefault();
+        }}
       >
         {tabs.map((tab) => {
           const isActive = isTabEqual(tab, activePage);
@@ -287,6 +292,18 @@ const sortTabs = (tabs: ITabInfo[]) => {
   });
 };
 
+const useRegisterKeybindings = (
+  opts: { key: string; keybinding: SimpleCommandKeybinding; label: string },
+  cb: () => void
+) => {
+  const cbRef = useEventCallback(cb);
+
+  React.useEffect(() => {
+    logseq.App.registerCommandPalette(opts, cbRef);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+};
+
 export function PageTabs(): JSX.Element {
   const [tabs, setTabs] = useStoreTabs();
   const [activePage, setActivePage] = useActivePage(tabs);
@@ -425,6 +442,38 @@ export function PageTabs(): JSX.Element {
     }
   }, [activePage, ref]);
 
+  useRegisterKeybindings(
+    {
+      key: "logseq-tab-toggle-pin",
+      label: "Tabs: Toggle Tab Pin Status",
+      keybinding: {
+        mode: "global",
+        binding: "mod+p",
+      },
+    },
+    () => {
+      if (currActivePageRef.current) {
+        onPinTab(currActivePageRef.current);
+      }
+    }
+  );
+
+  useRegisterKeybindings(
+    {
+      key: "logseq-tab-close",
+      label: "Tabs: Close Current Tab",
+      keybinding: {
+        mode: "global",
+        binding: "mod+shift+w",
+      },
+    },
+    () => {
+      if (currActivePageRef.current) {
+        onCloseTab(currActivePageRef.current);
+      }
+    }
+  );
+
   return (
     <Tabs
       ref={ref}

diff --git a/src/main.tsx b/src/main.tsx
@@ -6,29 +6,25 @@ import "./reset.css";
 import React from "react";
 import ReactDOM from "react-dom";
 import App from "./App";
-
-import { logseq as PL } from "../package.json";
-
-const magicKey = `__${PL.id}__loaded__`;
+import { isMac } from "./utils";
 
 function main() {
   const pluginId = logseq.baseInfo.id;
   console.info(`#${pluginId}: MAIN`);
+  const mac = isMac();
+  logseq.provideStyle(`
+  [data-active-keystroke=${mac ? "Meta" : "Control"} i]
+    :is(.block-ref,.page-ref,a.tag) {
+    cursor: n-resize
+  }`);
   ReactDOM.render(
     <React.StrictMode>
       <App />
     </React.StrictMode>,
     document.getElementById("app")
   );
 
-  // @ts-expect-error
-  top[magicKey] = true;
   console.info(`#${pluginId}: MAIN DONE`);
 }
 
-// @ts-expect-error
-if (top[magicKey]) {
-  logseq.App.relaunch().then(main).catch(console.error);
-} else {
-  logseq.ready(main).catch(console.error);
-}
+logseq.ready(main).catch(console.error);