From 1ddefa51f48348b49d630cb60ff0a013c189fed3 Mon Sep 17 00:00:00 2001
From: James Tan <32316305+jamesbtan@users.noreply.github.com>
Date: Fri, 9 Aug 2024 11:26:15 -0500
Subject: [PATCH] feat: Implement collapsing nested subentries (#50)

* feat: Implement collapsing nested subentries

* fix: Change tooltip based on collapse state

* fix: Avoid hardcoded CSS constants

* fix: Retain old formatting when editing row

* fix: Change collapsed field from number to boolean

* fix: Remove unneeded wrapper code
---
 src/tracker.ts | 21 ++++++++++++++++++++-
 1 file changed, 20 insertions(+), 1 deletion(-)

diff --git a/src/tracker.ts b/src/tracker.ts
index dbc2584..d066bc1 100644
--- a/src/tracker.ts
+++ b/src/tracker.ts
@@ -11,6 +11,7 @@ export interface Entry {
     startTime: string;
     endTime: string;
     subEntries: Entry[];
+    collapsed?: boolean;
 }
 
 export async function saveTracker(tracker: Tracker, fileName: string, section: MarkdownSectionInformation): Promise<void> {
@@ -345,6 +346,22 @@ function addEditableTableRow(tracker: Tracker, entry: Entry, table: HTMLTableEle
 
     renderNameAsMarkdown(nameField.label, getFile, component);
 
+    let expandButton = new ButtonComponent(nameField.label)
+        .setClass("clickable-icon")
+        .setClass("simple-time-tracker-expand-button")
+        .setIcon(`chevron-${entry.collapsed ? 'right' : 'down'}`)
+        .setTooltip(entry.collapsed ? "Expand" : "Collapse")
+        .onClick(async () => {
+            if (entry.collapsed) {
+                delete entry.collapsed;
+            } else {
+                entry.collapsed = true;
+            }
+            await saveTracker(tracker, this.app, getFile(), getSectionInfo());
+        });
+    if (!entry.subEntries?.length) expandButton.buttonEl.style.visibility = 'hidden';
+    nameField.cell.insertBefore(expandButton.buttonEl, nameField.label);
+
     let entryButtons = row.createEl("td");
     entryButtons.addClass("simple-time-tracker-table-buttons");
     new ButtonComponent(entryButtons)
@@ -363,6 +380,7 @@ function addEditableTableRow(tracker: Tracker, entry: Entry, table: HTMLTableEle
         .onClick(async () => {
             if (nameField.editing()) {
                 entry.name = nameField.endEdit();
+                expandButton.buttonEl.style.display = null;
                 startField.endEdit();
                 entry.startTime = startField.getTimestamp();
                 if (!entryRunning) {
@@ -375,6 +393,7 @@ function addEditableTableRow(tracker: Tracker, entry: Entry, table: HTMLTableEle
                 renderNameAsMarkdown(nameField.label, getFile, component);
             } else {
                 nameField.beginEdit(entry.name);
+                expandButton.buttonEl.style.display = 'none';
                 // only allow editing start and end times if we don't have sub entries
                 if (!entry.subEntries) {
                     startField.beginEdit(entry.startTime);
@@ -401,7 +420,7 @@ function addEditableTableRow(tracker: Tracker, entry: Entry, table: HTMLTableEle
             await saveTracker(tracker, 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);
     }