From fc26e1b4dd2018ee1c03585ca695ff5ee5db2dee Mon Sep 17 00:00:00 2001
From: Erez Shermer <erezshermer@gmail.com>
Date: Sun, 23 Apr 2023 16:30:23 +0300
Subject: [PATCH] Fixes query-related fields not having a "hidden" class:
 https://github.com/obsidian-tasks-group/obsidian-tasks/issues/1866

---
 .../tasks-plugin-smoke-test-query-styling.css      |  2 +-
 .../Manual Testing/Styling of Queries.md           |  3 +++
 src/TaskLayout.ts                                  | 14 ++++++++++++++
 3 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/resources/sample_vaults/Tasks-Demo/.obsidian/snippets/tasks-plugin-smoke-test-query-styling.css b/resources/sample_vaults/Tasks-Demo/.obsidian/snippets/tasks-plugin-smoke-test-query-styling.css
index 79da183235..b13ae6d576 100644
--- a/resources/sample_vaults/Tasks-Demo/.obsidian/snippets/tasks-plugin-smoke-test-query-styling.css
+++ b/resources/sample_vaults/Tasks-Demo/.obsidian/snippets/tasks-plugin-smoke-test-query-styling.css
@@ -8,6 +8,6 @@
     background-color: aqua;
 }
 
-ul.contains-task-list.tasks-layout-hide-priority {
+ul.contains-task-list.tasks-layout-hide-priority.tasks-layout-hide-backlinks.tasks-layout-hide-urgency.tasks-layout-hide-edit-button {
     color: red;
 }
diff --git a/resources/sample_vaults/Tasks-Demo/Manual Testing/Styling of Queries.md b/resources/sample_vaults/Tasks-Demo/Manual Testing/Styling of Queries.md
index 028a5450b1..f76ece8466 100644
--- a/resources/sample_vaults/Tasks-Demo/Manual Testing/Styling of Queries.md	
+++ b/resources/sample_vaults/Tasks-Demo/Manual Testing/Styling of Queries.md	
@@ -36,6 +36,9 @@ short mode
 ```tasks
 path includes Styling of Queries
 hide priority
+hide backlinks
+hide urgency
+hide edit button
 ```
 
 - [ ] 6. Open the Obsidian settings of the Demo vault and under Appearance | CSS Snippets, turn **off** `tasks-plugin-smoke-test-query-styling`.
diff --git a/src/TaskLayout.ts b/src/TaskLayout.ts
index 078261c98d..2597e7ec7f 100644
--- a/src/TaskLayout.ts
+++ b/src/TaskLayout.ts
@@ -1,5 +1,6 @@
 /**
  * Various rendering options for a query.
+ * See applyOptions below when adding options here.
  */
 export class LayoutOptions {
     hideTaskCount: boolean = false;
@@ -84,6 +85,11 @@ export class TaskLayout {
                 return taskComponents;
             }
         };
+        const markHiddenQueryComponent = (hidden: boolean, hiddenComponentName: string) => {
+            if (hidden) {
+                this.specificClasses.push(`tasks-layout-hide-${hiddenComponentName}`);
+            }
+        };
         // Remove components from the layout according to the task options. These represent the existing task options,
         // so some components (e.g. the description) are not here because there are no layout options to remove them.
         let newComponents = this.layoutComponents;
@@ -94,6 +100,14 @@ export class TaskLayout {
         newComponents = removeIf(newComponents, layoutOptions.hideScheduledDate, 'scheduledDate');
         newComponents = removeIf(newComponents, layoutOptions.hideDueDate, 'dueDate');
         newComponents = removeIf(newComponents, layoutOptions.hideDoneDate, 'doneDate');
+        // The following components are handled in QueryRenderer.ts and thus are not part of the same flow that
+        // hides TaskLayoutComponent items. However, we still want to have 'tasks-layout-hide' items for them
+        // (see https://github.com/obsidian-tasks-group/obsidian-tasks/issues/1866).
+        // This can benefit from some refactoring, i.e. render these components in a similar flow rather than
+        // separately.
+        markHiddenQueryComponent(layoutOptions.hideUrgency, 'urgency');
+        markHiddenQueryComponent(layoutOptions.hideBacklinks, 'backlinks');
+        markHiddenQueryComponent(layoutOptions.hideEditButton, 'edit-button');
         if (layoutOptions.shortMode) this.specificClasses.push('tasks-layout-short-mode');
         return newComponents;
     }