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 { @@ -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); }