🎨 fix https://github.com/siyuan-note/siyuan/issues/3623

app/src/layout/dock/Files.ts

@@ -5,7 +5,7 @@ import {getDockByType, getInstanceById, setPanelFocus} from "../util";
 import {Constants} from "../../constants";
 import {getDisplayName, pathPosix, setNoteBook} from "../../util/pathName";
 import {newFile} from "../../util/newFile";
-import {initFileMenu, initNavigationMenu} from "../../menus/navigation";
+import {initFileMenu, initNavigationMenu, sortMenu} from "../../menus/navigation";
 import {MenuItem} from "../../menus/Menu";
 import {Editor} from "../../editor";
 import {showMessage} from "../../dialog/message";
@@ -568,7 +568,7 @@ export class Files extends Model {
     </span>
 </li>`;
         } else {
-            return `<ul class="b3-list b3-list--background" data-url="${item.id}" data-sort="${item.sort}">
+            return `<ul class="b3-list b3-list--background" data-url="${item.id}" data-sort="${item.sort}" data-sortmode="${item.sortMode}">
 <li class="b3-list-item b3-list-item--hide-action" draggable="true" data-type="navigation-root" data-path="/">
     <span class="b3-list-item__toggle b3-list-item__toggle--hl">
         <svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
@@ -944,21 +944,6 @@ class="b3-list-item b3-list-item--hide-action" data-path="${item.path}">
 
     private initMoreMenu() {
         window.siyuan.menus.menu.remove();
-        const clickEvent = (sort: number) => {
-            window.siyuan.config.fileTree.sort = sort;
-            fetchPost("/api/setting/setFiletree", {
-                sort: window.siyuan.config.fileTree.sort,
-                alwaysSelectOpenedFile: window.siyuan.config.fileTree.alwaysSelectOpenedFile,
-                refCreateSavePath: window.siyuan.config.fileTree.refCreateSavePath,
-                docCreateSavePath: window.siyuan.config.fileTree.docCreateSavePath,
-                openFilesUseCurrentTab: window.siyuan.config.fileTree.openFilesUseCurrentTab,
-                maxListCount: window.siyuan.config.fileTree.maxListCount,
-            }, () => {
-                setNoteBook(() => {
-                    this.init(false);
-                });
-            });
-        };
         if (!window.siyuan.config.readonly) {
             window.siyuan.menus.menu.append(new MenuItem({
                 icon: "iconFilesRoot",
@@ -982,102 +967,21 @@ class="b3-list-item b3-list-item--hide-action" data-path="${item.path}">
             }
         }).element);
         if (!window.siyuan.config.readonly) {
-            window.siyuan.menus.menu.append(new MenuItem({
+            sortMenu("notebooks", window.siyuan.config.fileTree.sort, (sort: number) => {
-                icon: "iconSort",
+                window.siyuan.config.fileTree.sort = sort;
-                label: window.siyuan.languages.sort,
+                fetchPost("/api/setting/setFiletree", {
-                type: "submenu",
+                    sort: window.siyuan.config.fileTree.sort,
-                submenu: [{
+                    alwaysSelectOpenedFile: window.siyuan.config.fileTree.alwaysSelectOpenedFile,
-                    icon: window.siyuan.config.fileTree.sort === 0 ? "iconSelect" : undefined,
+                    refCreateSavePath: window.siyuan.config.fileTree.refCreateSavePath,
-                    label: window.siyuan.languages.fileNameASC,
+                    docCreateSavePath: window.siyuan.config.fileTree.docCreateSavePath,
-                    click: () => {
+                    openFilesUseCurrentTab: window.siyuan.config.fileTree.openFilesUseCurrentTab,
-                        clickEvent(0);
+                    maxListCount: window.siyuan.config.fileTree.maxListCount,
-                    }
+                }, () => {
-                }, {
+                    setNoteBook(() => {
-                    icon: window.siyuan.config.fileTree.sort === 1 ? "iconSelect" : undefined,
+                        this.init(false);
-                    label: window.siyuan.languages.fileNameDESC,
+                    });
-                    click: () => {
+                });
-                        clickEvent(1);
+            })
-                    }
-                }, {
-                    icon: window.siyuan.config.fileTree.sort === 4 ? "iconSelect" : undefined,
-                    label: window.siyuan.languages.fileNameNatASC,
-                    click: () => {
-                        clickEvent(4);
-                    }
-                }, {
-                    icon: window.siyuan.config.fileTree.sort === 5 ? "iconSelect" : undefined,
-                    label: window.siyuan.languages.fileNameNatDESC,
-                    click: () => {
-                        clickEvent(5);
-                    }
-                }, {type: "separator"}, {
-                    icon: window.siyuan.config.fileTree.sort === 9 ? "iconSelect" : undefined,
-                    label: window.siyuan.languages.createdASC,
-                    click: () => {
-                        clickEvent(9);
-                    }
-                }, {
-                    icon: window.siyuan.config.fileTree.sort === 10 ? "iconSelect" : undefined,
-                    label: window.siyuan.languages.createdDESC,
-                    click: () => {
-                        clickEvent(10);
-                    }
-                }, {
-                    icon: window.siyuan.config.fileTree.sort === 2 ? "iconSelect" : undefined,
-                    label: window.siyuan.languages.modifiedASC,
-                    click: () => {
-                        clickEvent(2);
-                    }
-                }, {
-                    icon: window.siyuan.config.fileTree.sort === 3 ? "iconSelect" : undefined,
-                    label: window.siyuan.languages.modifiedDESC,
-                    click: () => {
-                        clickEvent(3);
-                    }
-                }, {type: "separator"}, {
-                    icon: window.siyuan.config.fileTree.sort === 7 ? "iconSelect" : undefined,
-                    label: window.siyuan.languages.refCountASC,
-                    click: () => {
-                        clickEvent(7);
-                    }
-                }, {
-                    icon: window.siyuan.config.fileTree.sort === 8 ? "iconSelect" : undefined,
-                    label: window.siyuan.languages.refCountDESC,
-                    click: () => {
-                        clickEvent(8);
-                    }
-                }, {type: "separator"}, {
-                    icon: window.siyuan.config.fileTree.sort === 11 ? "iconSelect" : undefined,
-                    label: window.siyuan.languages.docSizeASC,
-                    click: () => {
-                        clickEvent(11);
-                    }
-                }, {
-                    icon: window.siyuan.config.fileTree.sort === 12 ? "iconSelect" : undefined,
-                    label: window.siyuan.languages.docSizeDESC,
-                    click: () => {
-                        clickEvent(12);
-                    }
-                }, {type: "separator"}, {
-                    icon: window.siyuan.config.fileTree.sort === 13 ? "iconSelect" : undefined,
-                    label: window.siyuan.languages.subDocCountASC,
-                    click: () => {
-                        clickEvent(13);
-                    }
-                }, {
-                    icon: window.siyuan.config.fileTree.sort === 14 ? "iconSelect" : undefined,
-                    label: window.siyuan.languages.subDocCountDESC,
-                    click: () => {
-                        clickEvent(14);
-                    }
-                }, {type: "separator"}, {
-                    icon: window.siyuan.config.fileTree.sort === 6 ? "iconSelect" : undefined,
-                    label: window.siyuan.languages.customSort,
-                    click: () => {
-                        clickEvent(6);
-                    }
-                }]
-            }).element);
         }
         return window.siyuan.menus.menu;
     }

app/src/menus/navigation.ts

@@ -11,7 +11,7 @@ import {dialog as remoteDialog} from "@electron/remote";
 import * as path from "path";
 /// #endif
 import {MenuItem} from "./Menu";
-import {getDisplayName, getNotebookName, getTopPaths, pathPosix} from "../util/pathName";
+import {getDisplayName, getNotebookName, getTopPaths, pathPosix, setNoteBook} from "../util/pathName";
 import {hideMessage, showMessage} from "../dialog/message";
 import {fetchPost} from "../util/fetch";
 import {onGetnotebookconf} from "./onGetnotebookconf";
@@ -88,6 +88,31 @@ export const initNavigationMenu = (liElement: HTMLElement) => {
             });
         }
     }).element);
+    if (!window.siyuan.config.readonly) {
+        sortMenu("notebook", parseInt(liElement.parentElement.getAttribute("data-sortmode")), (sort) => {
+            fetchPost("/api/notebook/setNotebookConf", {
+                notebook: notebookId,
+                conf: {
+                    sortMode: sort
+                }
+            }, () => {
+                liElement.parentElement.setAttribute("data-sortmode", sort.toString());
+                let files;
+                /// #if MOBILE
+                files = window.siyuan.mobile.files;
+                /// #else
+                files = (getDockByType("file").data["file"] as Files);
+                /// #endif
+                const toggleElement = liElement.querySelector(".b3-list-item__arrow--open");
+                if (toggleElement) {
+                    toggleElement.classList.remove("b3-list-item__arrow--open");
+                    liElement.nextElementSibling?.remove();
+                    files.getLeaf(liElement, notebookId);
+                }
+            });
+            return true;
+        })
+    }
     /// #if !MOBILE
     window.siyuan.menus.menu.append(new MenuItem({
         label: window.siyuan.languages.search,
@@ -382,7 +407,9 @@ const genImportMenu = (notebookId: string, pathString: string) => {
                 icon: "iconSiYuan",
                 label: 'SiYuan .sy.zip<input class="b3-form__upload" type="file" accept="application/zip">',
                 bind: (element) => {
-                    element.querySelector(".b3-form__upload").addEventListener("change", (event: InputEvent & { target: HTMLInputElement }) => {
+                    element.querySelector(".b3-form__upload").addEventListener("change", (event: InputEvent & {
+                        target: HTMLInputElement
+                    }) => {
                         const formData = new FormData();
                         formData.append("file", event.target.files[0]);
                         formData.append("notebook", notebookId);
@@ -414,3 +441,112 @@ const genImportMenu = (notebookId: string, pathString: string) => {
         }).element);
     }
 };
+
+export const sortMenu = (type: "notebooks" | "notebook", sortMode: number, clickEvent: (sort: number) => void) => {
+    const submenu: IMenu[] = [{
+        icon: sortMode === 0 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.fileNameASC,
+        click: () => {
+            clickEvent(0);
+        }
+    }, {
+        icon: sortMode === 1 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.fileNameDESC,
+        click: () => {
+            clickEvent(1);
+        }
+    }, {
+        icon: sortMode === 4 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.fileNameNatASC,
+        click: () => {
+            clickEvent(4);
+        }
+    }, {
+        icon: sortMode === 5 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.fileNameNatDESC,
+        click: () => {
+            clickEvent(5);
+        }
+    }, {type: "separator"}, {
+        icon: sortMode === 9 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.createdASC,
+        click: () => {
+            clickEvent(9);
+        }
+    }, {
+        icon: sortMode === 10 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.createdDESC,
+        click: () => {
+            clickEvent(10);
+        }
+    }, {
+        icon: sortMode === 2 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.modifiedASC,
+        click: () => {
+            clickEvent(2);
+        }
+    }, {
+        icon: sortMode === 3 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.modifiedDESC,
+        click: () => {
+            clickEvent(3);
+        }
+    }, {type: "separator"}, {
+        icon: sortMode === 7 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.refCountASC,
+        click: () => {
+            clickEvent(7);
+        }
+    }, {
+        icon: sortMode === 8 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.refCountDESC,
+        click: () => {
+            clickEvent(8);
+        }
+    }, {type: "separator"}, {
+        icon: sortMode === 11 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.docSizeASC,
+        click: () => {
+            clickEvent(11);
+        }
+    }, {
+        icon: sortMode === 12 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.docSizeDESC,
+        click: () => {
+            clickEvent(12);
+        }
+    }, {type: "separator"}, {
+        icon: sortMode === 13 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.subDocCountASC,
+        click: () => {
+            clickEvent(13);
+        }
+    }, {
+        icon: sortMode === 14 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.subDocCountDESC,
+        click: () => {
+            clickEvent(14);
+        }
+    }, {type: "separator"}, {
+        icon: sortMode === 6 ? "iconSelect" : undefined,
+        label: window.siyuan.languages.customSort,
+        click: () => {
+            clickEvent(6);
+        }
+    }];
+    if (type === "notebook") {
+        submenu.push({
+            icon: sortMode === 15 ? "iconSelect" : undefined,
+            label: window.siyuan.languages.sortByFiletree,
+            click: () => {
+                clickEvent(15);
+            }
+        })
+    }
+    window.siyuan.menus.menu.append(new MenuItem({
+        icon: "iconSort",
+        label: window.siyuan.languages.sort,
+        type: "submenu",
+        submenu,
+    }).element);
+}

app/src/mobile/util/MobileFiles.ts

@@ -3,7 +3,7 @@ import {escapeHtml} from "../../util/escape";
 import {Model} from "../../layout/Model";
 import {Constants} from "../../constants";
 import {getDisplayName, pathPosix, setNoteBook} from "../../util/pathName";
-import {initFileMenu, initNavigationMenu} from "../../menus/navigation";
+import {initFileMenu, initNavigationMenu, sortMenu} from "../../menus/navigation";
 import {showMessage} from "../../dialog/message";
 import {fetchPost} from "../../util/fetch";
 import {genUUID} from "../../util/genID";
@@ -11,7 +11,6 @@ import {openMobileFileById} from "../editor";
 import {unicode2Emoji} from "../../emoji";
 import {newNotebook} from "../../util/mount";
 import {confirmDialog} from "../../dialog/confirmDialog";
-import {MenuItem} from "../../menus/Menu";
 import {newFile} from "../../util/newFile";
 
 export class MobileFiles extends Model {
@@ -213,7 +212,7 @@ export class MobileFiles extends Model {
 
     private genSort(event: MouseEvent) {
         window.siyuan.menus.menu.remove();
-        const clickEvent = (sort: number) => {
+        sortMenu("notebooks", window.siyuan.config.fileTree.sort, (sort: number) => {
             window.siyuan.config.fileTree.sort = sort;
             fetchPost("/api/setting/setFiletree", {
                 sort: window.siyuan.config.fileTree.sort,
@@ -227,115 +226,7 @@ export class MobileFiles extends Model {
                     this.init(false);
                 });
             });
-        };
+        })
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 0 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.fileNameASC,
-            click: () => {
-                clickEvent(0);
-            }
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 1 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.fileNameDESC,
-            click: () => {
-                clickEvent(1);
-            }
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 4 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.fileNameNatASC,
-            click: () => {
-                clickEvent(4);
-            }
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 5 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.fileNameNatDESC,
-            click: () => {
-                clickEvent(5);
-            }
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            type: "separator"
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 9 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.createdASC,
-            click: () => {
-                clickEvent(9);
-            }
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 10 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.createdDESC,
-            click: () => {
-                clickEvent(10);
-            }
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 2 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.modifiedASC,
-            click: () => {
-                clickEvent(2);
-            }
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 3 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.modifiedDESC,
-            click: () => {
-                clickEvent(3);
-            }
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 7 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.refCountASC,
-            click: () => {
-                clickEvent(7);
-            }
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 8 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.refCountDESC,
-            click: () => {
-                clickEvent(8);
-            }
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 11 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.docSizeASC,
-            click: () => {
-                clickEvent(11);
-            }
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 12 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.docSizeDESC,
-            click: () => {
-                clickEvent(12);
-            }
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 13 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.subDocCountASC,
-            click: () => {
-                clickEvent(13);
-            }
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 14 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.subDocCountDESC,
-            click: () => {
-                clickEvent(14);
-            }
-        }).element);
-        window.siyuan.menus.menu.append(new MenuItem({
-            icon: window.siyuan.config.fileTree.sort === 6 ? "iconSelect" : undefined,
-            label: window.siyuan.languages.customSort,
-            click: () => {
-                clickEvent(6);
-            }
-        }).element);
         window.siyuan.menus.menu.element.style.zIndex = "310";
         window.siyuan.menus.menu.popup({x: event.clientX, y: event.clientY});
     }
@@ -354,7 +245,7 @@ export class MobileFiles extends Model {
     </span>
 </li>`;
         } else {
-            return `<ul class="b3-list b3-list--background" data-url="${item.id}">
+            return `<ul class="b3-list b3-list--background" data-url="${item.id}" data-sortmode="${item.sortMode}">
 <li class="b3-list-item" data-type="navigation-root" data-path="/">
     <span class="b3-list-item__toggle${item.closed ? " fn__hidden" : ""}">
         <svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>

app/src/types/index.d.ts

@@ -157,6 +157,7 @@ interface INotebook {
     closed: boolean
     icon: string
     sort: number
+    sortMode: number
 }
 
 interface ISiyuan {