feat: combine multiple empty directory into one in git view

denolehov · Sep 30, 2022 · 4e45e6a · 4e45e6a
1 parent 61b3eb3
commit 4e45e6a
Show file tree

Hide file tree

Showing 6 changed files with 78 additions and 11 deletions.
diff --git a/src/gitManager.ts b/src/gitManager.ts
@@ -86,7 +86,7 @@ export abstract class GitManager {
         return (relativeToVault && this.plugin.settings.basePath.length > 0) ? path.substring(this.plugin.settings.basePath.length + 1) : path;
     }
 
-    getTreeStructure(children: FileStatusResult[], beginLength = 0): TreeItem[] {
+    private _getTreeStructure(children: FileStatusResult[], beginLength = 0): TreeItem[] {
         const list: TreeItem[] = [];
         children = [...children];
         while (children.length > 0) {
@@ -101,7 +101,7 @@ export abstract class GitManager {
                 list.push({
                     title: title,
                     path: first.path,
-                    children: this.getTreeStructure(childrenWithSameTitle, (beginLength > 0 ? (beginLength + title.length) : title.length) + 1)
+                    children: this._getTreeStructure(childrenWithSameTitle, (beginLength > 0 ? (beginLength + title.length) : title.length) + 1)
                 });
             } else {
                 list.push({ title: restPath, statusResult: first, path: first.path });
@@ -111,6 +111,47 @@ export abstract class GitManager {
         return list;
     }
 
+    /*
+    * Sorts the children and simplifies the title
+    * If a node only contains another subdirectory, that subdirectory is moved up one level and integrated into the parent node
+    */
+    private simplify(tree: TreeItem[]): TreeItem[] {
+        for (const node of tree) {
+            const singleChild = node.children?.length == 1;
+            const singleChildIsDir = node.children?.first()?.statusResult == undefined;
+            if (node.children != undefined && singleChild && singleChildIsDir) {
+                node.title += "/" + node.children.first()!.title;
+                node.path = node.children.first()!.path;
+                node.children = node.children.first()!.children;
+            } else if (node.children != undefined) {
+                this.simplify(node.children);
+            }
+            node.children?.sort((a, b) => {
+                const dirCompare = (b.statusResult == undefined ? 1 : 0) - (a.statusResult == undefined ? 1 : 0);
+                if (dirCompare != 0) {
+                    return dirCompare;
+                } else {
+                    return a.title.localeCompare(b.title);
+                }
+            });
+        }
+        return tree.sort((a, b) => {
+            const dirCompare = (b.statusResult == undefined ? 1 : 0) - (a.statusResult == undefined ? 1 : 0);
+            if (dirCompare != 0) {
+                return dirCompare;
+            } else {
+                return a.title.localeCompare(b.title);
+            }
+        });
+    }
+
+    getTreeStructure(children: FileStatusResult[]): TreeItem[] {
+        const tree = this._getTreeStructure(children);
+
+        const res = this.simplify(tree);
+        return res;
+    }
+
     async formatCommitMessage(template: string): Promise<string> {
         let status: Status | undefined;
         if (template.includes("{{numFiles}}")) {

diff --git a/src/ui/sidebar/components/fileComponent.svelte b/src/ui/sidebar/components/fileComponent.svelte
@@ -93,7 +93,11 @@
 		on:click|self={showDiff}
 		on:auxclick|self={showDiff}
 	>
-		<div class="nav-file-title-content">
+		<div
+			on:click={showDiff}
+			on:auxclick={showDiff}
+			class="nav-file-title-content"
+		>
 			{change.vault_path.split("/").last()?.replace(".md", "")}
 		</div>
 		<div class="tools">

diff --git a/src/ui/sidebar/components/pulledFileComponent.svelte b/src/ui/sidebar/components/pulledFileComponent.svelte
@@ -31,15 +31,14 @@
 	}
 </script>
 
-<main on:mouseover={hover} on:click|self={open} on:focus class="nav-file">
+<main on:mouseover={hover} on:click={open} on:focus class="nav-file">
 	<!-- svelte-ignore a11y-unknown-aria-attribute -->
 	<div
 		class="nav-file-title"
 		aria-label-position={side}
 		aria-label={change.vault_path.split("/").last() != change.vault_path
 			? change.vault_path
 			: ""}
-		on:click|self={open}
 	>
 		<div class="nav-file-title-content">
 			{change.vault_path.split("/").last()?.replace(".md", "")}

diff --git a/src/ui/sidebar/components/stagedFileComponent.svelte b/src/ui/sidebar/components/stagedFileComponent.svelte
@@ -68,7 +68,11 @@
 			: ""}
 		on:click|self={showDiff}
 	>
-		<div class="nav-file-title-content">
+		<div
+			on:click={showDiff}
+			on:auxclick={showDiff}
+			class="nav-file-title-content"
+		>
 			{formattedPath.split("/").last()?.replace(".md", "")}
 		</div>
 		<div class="tools">

diff --git a/src/ui/sidebar/components/treeComponent.svelte b/src/ui/sidebar/components/treeComponent.svelte
@@ -1,7 +1,7 @@
 <!-- tslint:disable ts(2345)  -->
 <script lang="ts">
 	import ObsidianGit from "src/main";
-	import { FileType, RootTreeItem } from "src/types";
+	import { FileType, RootTreeItem, TreeItem } from "src/types";
 	import { slide } from "svelte/transition";
 	import GitView from "../sidebarView";
 	import FileComponent from "./fileComponent.svelte";
@@ -24,6 +24,9 @@
 			dispatchEvent(new CustomEvent("git-refresh"));
 		});
 	}
+	function fold(item: TreeItem) {
+		closed[item.title] = !closed[item.title];
+	}
 </script>
 
 <main class:topLevel>
@@ -50,10 +53,12 @@
 			<div class="nav-folder" class:is-collapsed={closed[entity.title]}>
 				<div
 					class="nav-folder-title"
-					on:click|self={() =>
-						(closed[entity.title] = !closed[entity.title])}
+					on:click|self={() => fold(entity)}
 				>
-					<div class="nav-folder-collapse-indicator collapse-icon">
+					<div
+						class="nav-folder-collapse-indicator collapse-icon"
+						on:click={() => fold(entity)}
+					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
 							width="24"
@@ -68,7 +73,10 @@
 							><path d="M3 8L12 17L21 8" /></svg
 						>
 					</div>
-					<div class="nav-folder-title-content">
+					<div
+						on:click={() => fold(entity)}
+						class="nav-folder-title-content"
+					>
 						{entity.title}
 					</div>
 					<div class="tools">

diff --git a/src/ui/sidebar/gitView.svelte b/src/ui/sidebar/gitView.svelte
@@ -86,10 +86,19 @@
 
 			lastPulledFilesHierarchy = {
 				title: "",
+				path: "",
 				children: plugin.gitManager.getTreeStructure(lastPulledFiles),
 			};
 		}
 		if (status) {
+			const sort = (a: FileStatusResult, b: FileStatusResult) => {
+				return a.vault_path
+					.split("/")
+					.last()!
+					.localeCompare(b.vault_path.split("/").last()!);
+			};
+			status.changed.sort(sort);
+			status.staged.sort(sort);
 			if (status.changed.length + status.staged.length > 500) {
 				status = undefined;
 				if (!plugin.loading) {
@@ -98,12 +107,14 @@
 			} else {
 				changeHierarchy = {
 					title: "",
+					path: "",
 					children: plugin.gitManager.getTreeStructure(
 						status.changed
 					),
 				};
 				stagedHierarchy = {
 					title: "",
+					path: "",
 					children: plugin.gitManager.getTreeStructure(status.staged),
 				};
 			}