refactor: Add the 'group by' field name to GroupDisplayHeading

claremacrae · claremacrae · commit cef0dfdb701c · 2023-05-15T17:36:24.000+01:00
See #1867. This should enable styling to be done, depending on the type of group in each group heading. I called it 'property' for consistency with the same information elsewhere in the grouping code, even though this is a hangover from an earlier implementation, and 'fieldName' is probably a more accurate name.
diff --git a/src/Query/GroupDisplayHeading.ts b/src/Query/GroupDisplayHeading.ts
@@ -21,13 +21,22 @@ export class GroupDisplayHeading {
      */
     public readonly displayName: string;
 
+    /**
+     * The property, or field name, in the 'group by' line that generated this heading.
+     * For example, 'starts', 'status.type', or 'priority'.
+     */
+    public readonly property: string;
+
     /**
      * Construct a {@link GroupDisplayHeading} object
      * @param {number} nestingLevel - See {@link nestingLevel} for details
      * @param {string} displayName - The text to be displayed for the group
+     * @param {string} property - The name, usually field name, in the 'group by' instruction,
+     *                            for example 'due' or 'priority'. This may be useful in styling the group headings.
      */
-    constructor(nestingLevel: number, displayName: string) {
+    constructor(nestingLevel: number, displayName: string, property: string) {
         this.nestingLevel = nestingLevel;
         this.displayName = displayName;
+        this.property = property;
     }
 }
diff --git a/src/Query/GroupDisplayHeadingSelector.ts b/src/Query/GroupDisplayHeadingSelector.ts
@@ -1,5 +1,6 @@
 import { GroupDisplayHeading } from './GroupDisplayHeading';
 import type { TaskGroupingTreeStorage } from './TaskGroupingTree';
+import type { Grouper } from './Grouper';
 
 /*
  * This file contains implementation details of Group.ts
@@ -84,8 +85,10 @@ import type { TaskGroupingTreeStorage } from './TaskGroupingTree';
  */
 export class GroupDisplayHeadingSelector {
     private lastHeadingAtLevel = new Array<string>();
+    private groupers: Grouper[];
 
-    constructor(taskGroupingTreeStorage: TaskGroupingTreeStorage) {
+    constructor(taskGroupingTreeStorage: TaskGroupingTreeStorage, groupers: Grouper[]) {
+        this.groupers = groupers;
         const firstGroup = taskGroupingTreeStorage.keys().next().value;
         const groupCount = firstGroup.length;
         for (let i = 0; i < groupCount; i++) {
@@ -106,7 +109,7 @@ export class GroupDisplayHeadingSelector {
         for (let level = 0; level < groupNames.length; level++) {
             const group = groupNames[level];
             if (group != this.lastHeadingAtLevel[level]) {
-                headingsForGroup.push(new GroupDisplayHeading(level, group));
+                headingsForGroup.push(new GroupDisplayHeading(level, group, this.groupers[level].property));
                 // Reset all the lower heading levels to un-seen
                 for (let j = level; j < groupNames.length; j++) {
                     this.lastHeadingAtLevel[j] = '';
diff --git a/src/Query/TaskGroup.ts b/src/Query/TaskGroup.ts
@@ -96,7 +96,7 @@ export class TaskGroup {
             // These headings mimic the behaviour of QueryRenderer,
             // which uses 'h4', 'h5' and 'h6' for nested groups.
             const headingPrefix = '#'.repeat(4 + heading.nestingLevel);
-            output += `${headingPrefix} ${heading.displayName}\n`;
+            output += `${headingPrefix} [${heading.property}] ${heading.displayName}\n`;
         }
 
         output += this.tasksAsStringOfLines();
diff --git a/src/Query/TaskGroups.ts b/src/Query/TaskGroups.ts
@@ -95,7 +95,7 @@ export class TaskGroups {
         this.sortTaskGroups();
 
         // Get the headings, now that the groups have been sorted.
-        const displayHeadingSelector = new GroupDisplayHeadingSelector(taskGroupingTree.groups);
+        const displayHeadingSelector = new GroupDisplayHeadingSelector(taskGroupingTree.groups, this._groupers);
         for (const group of this._groups) {
             group.setGroupHeadings(displayHeadingSelector.getHeadingsForTaskGroup(group.groups));
         }
diff --git a/tests/Query/Filter/TagsField.test.ts b/tests/Query/Filter/TagsField.test.ts
@@ -663,13 +663,13 @@ describe('grouping by tag', () => {
             - tags reverse
 
             Group names: [#tag2]
-            #### #tag2
+            #### [tags] #tag2
             - [ ] b #tag2
 
             ---
 
             Group names: [#tag1]
-            #### #tag1
+            #### [tags] #tag1
             - [ ] a #tag1
 
             ---
diff --git a/tests/TaskGroups.test.ts b/tests/TaskGroups.test.ts
@@ -35,14 +35,14 @@ describe('Grouping tasks', () => {
             - path
 
             Group names: [file1]
-            #### file1
+            #### [path] file1
             - [ ] b
             - [ ] c
 
             ---
 
             Group names: [file2]
-            #### file2
+            #### [path] file2
             - [ ] a
 
             ---
@@ -116,19 +116,19 @@ describe('Grouping tasks', () => {
             - path
 
             Group names: [a/b/c]
-            #### a/b/c
+            #### [path] a/b/c
             - [ ] first file path, alphabetically
 
             ---
 
             Group names: [b/c/d]
-            #### b/c/d
+            #### [path] b/c/d
             - [ ] second file path
 
             ---
 
             Group names: [d/e/f]
-            #### d/e/f
+            #### [path] d/e/f
             - [ ] third file path
 
             ---
@@ -156,13 +156,13 @@ describe('Grouping tasks', () => {
             - filename
 
             Group names: [[[9 something]]]
-            #### [[9 something]]
+            #### [filename] [[9 something]]
             - [ ] first, as 9 is less then 10
 
             ---
 
             Group names: [[[10 something]]]
-            #### [[10 something]]
+            #### [filename] [[10 something]]
             - [ ] second, as 10 is more than 9
 
             ---
@@ -189,13 +189,13 @@ describe('Grouping tasks', () => {
             - due reverse
 
             Group names: [2023-07-08 Saturday]
-            #### 2023-07-08 Saturday
+            #### [due] 2023-07-08 Saturday
             - [ ] b 📅 2023-07-08
 
             ---
 
             Group names: [2023-04-05 Wednesday]
-            #### 2023-04-05 Wednesday
+            #### [due] 2023-04-05 Wednesday
             - [ ] a 📅 2023-04-05
 
             ---
@@ -224,14 +224,14 @@ describe('Grouping tasks', () => {
             - tags
 
             Group names: [#group1]
-            #### #group1
+            #### [tags] #group1
             - [ ] Task 1 #group1
             - [ ] Task 2 #group2 #group1
 
             ---
 
             Group names: [#group2]
-            #### #group2
+            #### [tags] #group2
             - [ ] Task 2 #group2 #group1
             - [ ] Task 3 #group2
 
@@ -273,21 +273,21 @@ describe('Grouping tasks', () => {
             - filename
 
             Group names: [folder\\_b/folder\\_c/,[[file_c]]]
-            #### folder\\_b/folder\\_c/
-            ##### [[file_c]]
+            #### [folder] folder\\_b/folder\\_c/
+            ##### [filename] [[file_c]]
             - [ ] Task 1 - but path is 2nd, alphabetically
 
             ---
 
             Group names: [folder\\_b/folder\\_c/,[[file_d]]]
-            ##### [[file_d]]
+            ##### [filename] [[file_d]]
             - [ ] Task 2 - but path is 2nd, alphabetically
 
             ---
 
             Group names: [folder\\_a/folder\\_b/,[[file_c]]]
-            #### folder\\_a/folder\\_b/
-            ##### [[file_c]]
+            #### [folder] folder\\_a/folder\\_b/
+            ##### [filename] [[file_c]]
             - [ ] Task 3 - but path is 1st, alphabetically
 
             ---
@@ -322,20 +322,20 @@ describe('Grouping tasks', () => {
             - happens
 
             Group names: [2 TODO,2022-09-19 Monday]
-            #### 2 TODO
-            ##### 2022-09-19 Monday
+            #### [status.type] 2 TODO
+            ##### [happens] 2022-09-19 Monday
             - [ ] Task a - early date 📅 2022-09-19
 
             ---
 
             Group names: [2 TODO,2022-10-06 Thursday]
-            ##### 2022-10-06 Thursday
+            ##### [happens] 2022-10-06 Thursday
             - [ ] Task c - intermediate date ⏳ 2022-10-06
 
             ---
 
             Group names: [2 TODO,2022-12-06 Tuesday]
-            ##### 2022-12-06 Tuesday
+            ##### [happens] 2022-12-06 Tuesday
             - [ ] Task b - later date ⏳ 2022-12-06
 
             ---

Original file line number	Diff line number	Diff line change
`@@ -96,7 +96,7 @@ export class TaskGroup {`
`96`	`96`	`// These headings mimic the behaviour of QueryRenderer,`
`97`	`97`	`// which uses 'h4', 'h5' and 'h6' for nested groups.`
`98`	`98`	`const headingPrefix = '#'.repeat(4 + heading.nestingLevel);`
`99`		- output += `${headingPrefix} ${heading.displayName}\n`;
	`99`	+ output += `${headingPrefix} [${heading.property}] ${heading.displayName}\n`;
`100`	`100`	`}`
`101`	`101`
`102`	`102`	`output += this.tasksAsStringOfLines();`
Original file line number	Diff line number	Diff line change
`@@ -95,7 +95,7 @@ export class TaskGroups {`
`95`	`95`	`this.sortTaskGroups();`
`96`	`96`
`97`	`97`	`// Get the headings, now that the groups have been sorted.`
`98`		`- const displayHeadingSelector = new GroupDisplayHeadingSelector(taskGroupingTree.groups);`
	`98`	`+ const displayHeadingSelector = new GroupDisplayHeadingSelector(taskGroupingTree.groups, this._groupers);`
`99`	`99`	`for (const group of this._groups) {`
`100`	`100`	`group.setGroupHeadings(displayHeadingSelector.getHeadingsForTaskGroup(group.groups));`
`101`	`101`	`}`