From b195782a1c1ecefbab2418734e0eb7b0084cc6c8 Mon Sep 17 00:00:00 2001
From: Vanessa <lly219@gmail.com>
Date: Mon, 6 May 2024 00:17:42 +0800
Subject: [PATCH] :sparkles: https://github.com/siyuan-note/siyuan/issues/10342

---
 app/src/boot/globalEvent/commandPanel.ts | 19 ++++---------------
 app/src/boot/globalEvent/keydown.ts      |  1 +
 app/src/mobile/dock/util.ts              |  4 ++++
 app/src/mobile/util/initFramework.ts     | 12 ++++++++----
 4 files changed, 17 insertions(+), 19 deletions(-)
 create mode 100644 app/src/mobile/dock/util.ts

diff --git a/app/src/boot/globalEvent/commandPanel.ts b/app/src/boot/globalEvent/commandPanel.ts
index 90a31c467..0b6a92d6b 100644
--- a/app/src/boot/globalEvent/commandPanel.ts
+++ b/app/src/boot/globalEvent/commandPanel.ts
@@ -16,6 +16,7 @@ import {addEditorToDatabase, addFilesToDatabase} from "../../protyle/render/av/a
 import {hasClosestByClassName} from "../../protyle/util/hasClosest";
 import {newDailyNote} from "../../util/mount";
 import {getCurrentEditor} from "../../mobile/editor";
+import {openDock} from "../../mobile/dock/util";
 
 export const commandPanel = (app: App) => {
     const range = getSelection().getRangeAt(0);
@@ -153,28 +154,16 @@ export const execByCommand = (options: {
     /// #if MOBILE
     switch (options.command) {
         case "fileTree":
-            getDockByType("file").toggleModel("file");
+            openDock("file");
             return;
         case "outline":
-            getDockByType("outline").toggleModel("outline");
-            return;
         case "bookmark":
-            getDockByType("bookmark").toggleModel("bookmark");
-            return;
         case "tag":
-            getDockByType("tag").toggleModel("tag");
-            return;
         case "inbox":
-            getDockByType("inbox").toggleModel("inbox");
+            openDock(options.command);
             return;
         case "backlinks":
-            getDockByType("backlink").toggleModel("backlink");
-            return;
-        case "graphView":
-            getDockByType("graph").toggleModel("graph");
-            return;
-        case "globalGraph":
-            getDockByType("globalGraph").toggleModel("globalGraph");
+            openDock("backlink");
             return;
     }
     /// #else
diff --git a/app/src/boot/globalEvent/keydown.ts b/app/src/boot/globalEvent/keydown.ts
index 825652623..2cd845652 100644
--- a/app/src/boot/globalEvent/keydown.ts
+++ b/app/src/boot/globalEvent/keydown.ts
@@ -1236,6 +1236,7 @@ export const windowKeyDown = (app: App, event: KeyboardEvent) => {
         }
     }
 
+    const target = event.target as HTMLElement;
     /// #if !BROWSER
     if (matchHotKey("⌘=", event) && !hasClosestByClassName(target, "pdf__outer")) {
         setZoom("zoomIn");
diff --git a/app/src/mobile/dock/util.ts b/app/src/mobile/dock/util.ts
new file mode 100644
index 000000000..e3f9650e7
--- /dev/null
+++ b/app/src/mobile/dock/util.ts
@@ -0,0 +1,4 @@
+export const openDock = (type: string) => {
+    document.getElementById("toolbarFile").dispatchEvent(new CustomEvent("click"));
+    document.querySelector("#sidebar .toolbar--border").dispatchEvent(new CustomEvent("click", {detail:type}));
+}
diff --git a/app/src/mobile/util/initFramework.ts b/app/src/mobile/util/initFramework.ts
index d977c1054..2541502a5 100644
--- a/app/src/mobile/util/initFramework.ts
+++ b/app/src/mobile/util/initFramework.ts
@@ -69,10 +69,14 @@ export const initFramework = (app: App, isStart: boolean) => {
     let tag: MobileTags;
     // 不能使用 getEventName，否则点击返回会展开右侧栏
     const firstToolbarElement = sidebarElement.querySelector(".toolbar--border");
-    firstToolbarElement.addEventListener("click", (event: Event & {
-        target: Element
-    }) => {
-        const svgElement = hasTopClosestByTag(event.target, "svg");
+    firstToolbarElement.addEventListener("click", (event: MouseEvent) => {
+        const target = event.target as HTMLElement;
+        let svgElement: HTMLElement;
+        if (typeof event.detail === "string") {
+            svgElement = firstToolbarElement.querySelector(`svg[data-type="sidebar-${event.detail}-tab"]`) as HTMLElement;
+        } else {
+            svgElement = hasTopClosestByTag(target, "svg") as HTMLElement;
+        }
         if (!svgElement) {
             return;
         }