From de12a997a770b989aa34f5de5a31cc0de8f1d79a Mon Sep 17 00:00:00 2001
From: James Rupert Tan <jamesruperttan@gmail.com>
Date: Fri, 7 Jun 2024 05:35:53 -0500
Subject: [PATCH] feat: Implement collapsing nested subentries

---
 src/tracker.ts | 24 +++++++++++++++++++++++-
 styles.css     | 17 +++++++++++++++++
 2 files changed, 40 insertions(+), 1 deletion(-)

diff --git a/src/tracker.ts b/src/tracker.ts
index 54bbb2f..15ffbbe 100644
--- a/src/tracker.ts
+++ b/src/tracker.ts
@@ -10,6 +10,7 @@ export interface Entry {
     startTime: string;
     endTime: string;
     subEntries: Entry[];
+    collapsed?: number;
 }
 
 export async function saveTracker(tracker: Tracker, app: App, fileName: string, section: MarkdownSectionInformation): Promise<void> {
@@ -318,6 +319,27 @@ function addEditableTableRow(tracker: Tracker, entry: Entry, table: HTMLTableEle
 
     renderNameAsMarkdown(nameField.label, getFile, component);
 
+    if (entry.subEntries?.length) {
+        let expandButton = new ButtonComponent(nameField.label)
+            .setClass("clickable-icon")
+            .setClass("simple-time-tracker-expand-button")
+            .setIcon(`chevron-${entry.collapsed ? 'right' : 'down'}`)
+            .setTooltip("Collapse")
+            .onClick(async () => {
+                if (entry.collapsed) {
+                    delete entry.collapsed;
+                } else {
+                    entry.collapsed = 1;
+                }
+                await saveTracker(tracker, this.app, getFile(), getSectionInfo());
+            });
+        let nameWrapper = nameField.cell.createDiv({cls: "simple-time-tracker-table-expandwrapper"});
+        nameWrapper.style.marginLeft = nameField.label.style.marginLeft;
+        nameField.label.style.marginLeft = null;
+        nameWrapper.insertBefore(nameField.label, null);
+        nameWrapper.insertBefore(expandButton.buttonEl, null);
+    }
+
     let entryButtons = row.createEl("td");
     entryButtons.addClass("simple-time-tracker-table-buttons");
     new ButtonComponent(entryButtons)
@@ -370,7 +392,7 @@ function addEditableTableRow(tracker: Tracker, entry: Entry, table: HTMLTableEle
             await saveTracker(tracker, this.app, getFile(), getSectionInfo());
         });
 
-    if (entry.subEntries) {
+    if (entry.subEntries && !entry.collapsed) {
         for (let sub of orderedEntries(entry.subEntries, settings))
             addEditableTableRow(tracker, sub, table, newSegmentNameBox, trackerRunning, getFile, getSectionInfo, settings, indent + 1, component);
     }
diff --git a/styles.css b/styles.css
index 96d83fa..06b25cc 100644
--- a/styles.css
+++ b/styles.css
@@ -79,3 +79,20 @@
 .simple-time-tracker-table tr:hover {
     background-color: var(--background-modifier-hover);
 }
+
+.simple-time-tracker-table :is(td,th):first-child {
+    /* HACKY hardcoded 2em to make room for expand/collapse button */
+    padding-left: 2em;
+}
+
+.simple-time-tracker-table-expandwrapper {
+    position: relative;
+}
+
+.simple-time-tracker-expand-button {
+    position: absolute;
+    /* HACKY there should be a better way to position this */
+    left: 0;
+    top: 50%;
+    transform: translate(-100%, -50%);
+}