Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor: TaskLayout& QueryLayout renames #2613

4 changes: 2 additions & 2 deletions src/Layout/LayoutHelpers.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
export function generateHiddenClassForTaskList(taskListHiddenClasses: string[], hide: boolean, component: string) {
export function generateHiddenClassForTaskList(hiddenClasses: string[], hide: boolean, component: string) {
if (hide) {
taskListHiddenClasses.push(hiddenComponentClassName(component));
hiddenClasses.push(hiddenComponentClassName(component));
}
}

Expand Down
14 changes: 9 additions & 5 deletions src/Layout/QueryLayout.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,10 @@
import { generateHiddenClassForTaskList } from './LayoutHelpers';
import { QueryLayoutOptions } from './QueryLayoutOptions';

/**
* This class generates a list of hidden query components' classes.
* The output depends on {@link QueryLayoutOptions} objects.
*/
export class QueryLayout {
protected queryLayoutOptions: QueryLayoutOptions;

Expand All @@ -12,8 +16,8 @@ export class QueryLayout {
}
}

public applyQueryLayoutOptions() {
const taskListHiddenClasses: string[] = [];
public getHiddenClasses() {
const hiddenClasses: string[] = [];
const componentsToGenerateClassesOnly: [boolean, string][] = [
// 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
Expand All @@ -26,11 +30,11 @@ export class QueryLayout {
[this.queryLayoutOptions.hidePostponeButton, 'postpone-button'],
];
for (const [hide, component] of componentsToGenerateClassesOnly) {
generateHiddenClassForTaskList(taskListHiddenClasses, hide, component);
generateHiddenClassForTaskList(hiddenClasses, hide, component);
}

if (this.queryLayoutOptions.shortMode) taskListHiddenClasses.push('tasks-layout-short-mode');
if (this.queryLayoutOptions.shortMode) hiddenClasses.push('tasks-layout-short-mode');

return taskListHiddenClasses;
return hiddenClasses;
}
}
19 changes: 7 additions & 12 deletions src/Layout/TaskLayout.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,8 @@ import { generateHiddenClassForTaskList } from './LayoutHelpers';
import { TaskLayoutOptions } from './TaskLayoutOptions';

/**
* This represents the desired layout of tasks when they are rendered in a given configuration.
* The layout is used when flattening the task to a string and when rendering queries, and can be
* modified by applying {@link TaskLayoutOptions} objects.
* This class generates a list of hidden task components' classes.
* The output depends on {@link TaskLayoutOptions} objects.
*/
export class TaskLayout {
private taskLayoutOptions: TaskLayoutOptions;
Expand All @@ -16,19 +15,15 @@ export class TaskLayout {
this.taskLayoutOptions = new TaskLayoutOptions();
}
}
public applyTaskLayoutOptions() {
const taskListHiddenClasses: string[] = [];
public generateHiddenClasses() {
const hiddenClasses: string[] = [];
this.taskLayoutOptions.toggleableComponents.forEach((component) => {
generateHiddenClassForTaskList(
taskListHiddenClasses,
!this.taskLayoutOptions.isShown(component),
component,
);
generateHiddenClassForTaskList(hiddenClasses, !this.taskLayoutOptions.isShown(component), component);
});

// Tags are hidden, rather than removed. See tasks-layout-hide-tags in styles.css.
generateHiddenClassForTaskList(taskListHiddenClasses, !this.taskLayoutOptions.areTagsShown(), 'tags');
generateHiddenClassForTaskList(hiddenClasses, !this.taskLayoutOptions.areTagsShown(), 'tags');

return taskListHiddenClasses;
return hiddenClasses;
}
}
9 changes: 6 additions & 3 deletions src/Renderer/QueryRenderer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -222,11 +222,14 @@ class QueryRenderChild extends MarkdownRenderChild {
}

private async createTaskList(tasks: Task[], content: HTMLDivElement): Promise<void> {
const layout = new TaskLayout(this.query.taskLayoutOptions);
const queryLayout = new QueryLayout(this.query.queryLayoutOptions);
const taskList = content.createEl('ul');

taskList.addClasses(['contains-task-list', 'plugin-tasks-query-result']);
taskList.addClasses([...layout.applyTaskLayoutOptions(), ...queryLayout.applyQueryLayoutOptions()]);
const taskLayout = new TaskLayout(this.query.taskLayoutOptions);
taskList.addClasses(taskLayout.generateHiddenClasses());
const queryLayout = new QueryLayout(this.query.queryLayoutOptions);
taskList.addClasses(queryLayout.getHiddenClasses());

const groupingAttribute = this.getGroupingAttribute();
if (groupingAttribute && groupingAttribute.length > 0) taskList.dataset.taskGroupBy = groupingAttribute;

Expand Down
4 changes: 2 additions & 2 deletions tests/Layout/TaskLayout.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ describe('TaskLayout tests', () => {
const taskLayout = new TaskLayout();
const queryLayout = new QueryLayout();

const hiddenClasses = [...taskLayout.applyTaskLayoutOptions(), ...queryLayout.applyQueryLayoutOptions()];
const hiddenClasses = [...taskLayout.generateHiddenClasses(), ...queryLayout.getHiddenClasses()];
expect(hiddenClasses.join('\n')).toMatchInlineSnapshot('"tasks-layout-hide-urgency"');
});

Expand All @@ -30,7 +30,7 @@ describe('TaskLayout tests', () => {
const taskLayout = new TaskLayout(taskLayoutOptions);
const queryLayout = new QueryLayout(queryLayoutOptions);

const hiddenClasses = [...taskLayout.applyTaskLayoutOptions(), ...queryLayout.applyQueryLayoutOptions()];
const hiddenClasses = [...taskLayout.generateHiddenClasses(), ...queryLayout.getHiddenClasses()];
expect(hiddenClasses.join('\n')).toMatchInlineSnapshot(`
"tasks-layout-hide-id
tasks-layout-hide-blockedBy
Expand Down