Merge branch '111-task-filter-hide-done-tasks'

Author: RafaelGB

docs/docs/changelog.md

@@ -3,7 +3,8 @@
 - New source option: query. Use your own dataview query as source of the database. Start the query with the `FROM` term, since the plugin will autocomplete the beginning with `TABLE` and the column fields[ISSUE#156](https://github.com/RafaelGB/obsidian-db-folder/issues/156)
 - Templates for new rows added! now you can choose a template folder on settings menu, then you can choose your template file easily near of the add row button[ISSUE#48](https://github.com/RafaelGB/obsidian-db-folder/issues/48)
 ### Improved
-- Inline fields now supports render embed images with ![[note]] syntax. [ISSUE#136](https://github.com/RafaelGB/obsidian-db-folder/issues/136)
+- Inline fields now supports render embed images with `![[note]]` syntax. [ISSUE#136](https://github.com/RafaelGB/obsidian-db-folder/issues/136)
+- Now you can hide completed task on task column type [ISSUE#111](https://github.com/RafaelGB/obsidian-db-folder/issues/111)
 ### No longer broken
 - If you modify the label of a column, now exist an onMouseLeave event to blur the input and be more frieldly to the user interact with the next action without a double click (once for onBlur label edition and another for your next interaction) [ISSUE#114](https://github.com/RafaelGB/obsidian-db-folder/issues/114)
 ## 1.7.2

src/cdm/FolderModel.ts

@@ -38,6 +38,7 @@ export interface ConfigColumn {
     media_width: number;
     media_height: number;
     isInline: boolean;
+    task_hide_completed?: boolean;
     [key: string]: Literal;
 }
 

src/components/Cell.tsx

@@ -54,6 +54,12 @@ export default function DefaultCell(cellProperties: Cell) {
       case DataTypes.TASK:
         // Check if there are tasks in the cell
         if (contextValue.value === "") break;
+        taskRef.current.innerHTML = "";
+        if (column.config.task_hide_completed) {
+          contextValue.value = contextValue.value.where(
+            (t: any) => !t.completed
+          );
+        }
         DataviewService.getDataviewAPI().taskList(
           contextValue.value,
           false,
@@ -244,6 +250,8 @@ export default function DefaultCell(cellProperties: Cell) {
         );
 
       case DataTypes.TASK:
+        if (column.config.task_hide_completed) {
+        }
         return <div ref={taskRef} className="data-input"></div>;
 
       case DataTypes.CHECKBOX:

src/components/Columns.tsx

@@ -51,7 +51,7 @@ export async function obtainMetadataColumns(
   }
 
   if (localSetting.show_metadata_tasks) {
-    // If Modified is not already in the table, add it
+    // If TASKS is not already in the table, add it
     yamlColumns[MetadataColumns.TASKS] = {
       ...MetadataDatabaseColumns.TASKS,
       ...(yamlColumns[MetadataColumns.TASKS] ?? {}),

src/components/HeaderMenu.tsx

@@ -1,4 +1,4 @@
-import { ActionTypes, StyleVariables } from "helpers/Constants";
+import { ActionTypes, DataTypes, StyleVariables } from "helpers/Constants";
 import { dbTrim, c, getLabelHeader } from "helpers/StylesHelper";
 import AdjustmentsIcon from "components/img/AdjustmentsIcon";
 import React, { useContext, useEffect, useState } from "react";
@@ -278,7 +278,7 @@ const HeaderMenu = (headerMenuProps: HeaderMenuProps) => {
                 </div>
               ))}
             </div>
-            {!column.isMetadata && (
+            {(!column.isMetadata || column.dataType === DataTypes.TASK) && (
               <div
                 style={{
                   borderTop: `1px solid ${StyleVariables.BACKGROUND_DIVIDER}`,

src/components/modals/ColumnModal.ts

@@ -63,9 +63,9 @@ export class ColumnSettingsManager {
 
     constructBody(settingHandlerResponse: ColumnHandlerResponse) {
         /** behavior section */
-        behavior_settings_section(settingHandlerResponse);
+        behavior_settings_section.run(settingHandlerResponse);
         /** Particular settings section */
-        particular_settings_section(settingHandlerResponse);
+        particular_settings_section.run(settingHandlerResponse);
     }
 
     reset(response: ColumnHandlerResponse) {
@@ -76,11 +76,3 @@ export class ColumnSettingsManager {
         this.constructBody(response);
     }
 }
-
-function handleColumnChanges(dispatch: Dispatch<any>, column: TableColumn) {
-    dispatch({
-        type: ActionTypes.MODIFY_COLUMN_CONFIG,
-        columnId: column.id,
-        columnConfig: column.config,
-    });
-}

src/components/modals/ColumnSections.ts

@@ -3,70 +3,72 @@ import { add_setting_header } from "settings/SettingsComponents";
 import { MediaDimensionsHandler } from "components/modals/handlers/MediaDimensionsHandler";
 import { MediaToggleHandler } from "components/modals/handlers/MediaToggleHandler";
 import { InlineToggleHandler } from "components/modals/handlers/InlineToggleHandler";
-import { ColumnHandler } from "./handlers/AbstractColumnHandler";
+import { ColumnHandler } from "components/modals/handlers/AbstractColumnHandler";
+import { SelectedColumnOptionsHandler } from "components/modals/handlers/SelectedColumnOptionsHandler";
+import { HideCompletedTaskToggleHandler } from "components/modals/handlers/tasks/HideCompletedTaskToggleHandler";
 import { DataTypes } from "helpers/Constants";
-import { SelectedColumnOptionsHandler } from "./handlers/SelectedColumnOptionsHandler";
+import { AbstractChain, AbstractHandler } from "patterns/AbstractFactoryChain";
 
-export function behavior_settings_section(settingHandlerResponse: ColumnHandlerResponse) {
-    const behavior_section = settingHandlerResponse.containerEl.createDiv("column-section-container-behavior");
-    add_setting_header(behavior_section, "Behavior", "h3");
-    /**
-     * Obtain all classes than extends from AbstractHandler
-     */
-    const handlers = [
-        new InlineToggleHandler()
-    ]
-    let i = 1;
-    while (i < handlers.length) {
-        handlers[i - 1].setNext(handlers[i]);
-        i++;
+class BehaviorSetttingsSection extends AbstractChain<ColumnHandlerResponse> {
+    private dataType: string = DataTypes.TEXT;
+    protected runBefore(columnHandlerResponse: ColumnHandlerResponse): ColumnHandlerResponse {
+        this.dataType = columnHandlerResponse.column.dataType;
+        return columnHandlerResponse;
+    }
+    protected customHandle(columnHandlerResponse: ColumnHandlerResponse): ColumnHandlerResponse {
+        const behavior_section = columnHandlerResponse.containerEl.createDiv("column-section-container-behavior");
+        add_setting_header(behavior_section, "Behavior", "h3");
+        columnHandlerResponse.containerEl = behavior_section;
+        return columnHandlerResponse;
+    }
+    protected getHandlers(): AbstractHandler<ColumnHandlerResponse>[] {
+        const particularHandlers: ColumnHandler[] = [];
+        switch (this.dataType) {
+            case DataTypes.TASK:
+                // do nothing
+                break;
+            default:
+                particularHandlers.push(new InlineToggleHandler());
+        }
+        return particularHandlers;
     }
-
-    settingHandlerResponse.containerEl = behavior_section;
-    return handlers[0]?.handle(settingHandlerResponse);
 }
+export const behavior_settings_section = new BehaviorSetttingsSection();
 
 /**
  * Every column type has a different behavior section
- * @param settingHandlerResponse 
- * @returns 
  */
-export function particular_settings_section(settingHandlerResponse: ColumnHandlerResponse): ColumnHandlerResponse {
-    const handlers = [
-        ...addParticularInputSettings(settingHandlerResponse.column.dataType)
-    ]
-    if (handlers.length > 0) {
-        const particular_section = settingHandlerResponse.containerEl.createDiv("column-section-container-particular");
-        // title of the section
-        add_setting_header(particular_section, `Particular properties of "${settingHandlerResponse.column.dataType
-            }" column type`, 'h3');
+class ParticularSetttingsSection extends AbstractChain<ColumnHandlerResponse> {
+    private dataType: string = DataTypes.TEXT;
+    protected runBefore(columnHandlerResponse: ColumnHandlerResponse): ColumnHandlerResponse {
+        this.dataType = columnHandlerResponse.column.dataType;
+        return columnHandlerResponse;
+    }
 
-        let i = 1;
-        while (i < handlers.length) {
-            handlers[i - 1].setNext(handlers[i]);
-            i++;
+    protected customHandle(columnHandlerResponse: ColumnHandlerResponse): ColumnHandlerResponse {
+        const particular_section = columnHandlerResponse.containerEl.createDiv("column-section-container-particular");
+        // title of the section
+        add_setting_header(particular_section, `Particular properties of "${columnHandlerResponse.column.dataType}" column type`, 'h3');
+        columnHandlerResponse.containerEl = particular_section;
+        return columnHandlerResponse;
+    }
+    protected getHandlers(): AbstractHandler<ColumnHandlerResponse>[] {
+        const particularHandlers: ColumnHandler[] = [];
+        switch (this.dataType) {
+            case DataTypes.TEXT:
+                particularHandlers.push(new MediaToggleHandler());
+                particularHandlers.push(new MediaDimensionsHandler());
+                break;
+            case DataTypes.SELECT:
+            case DataTypes.TAGS:
+                particularHandlers.push(new SelectedColumnOptionsHandler());
+                break;
+            case DataTypes.TASK:
+                particularHandlers.push(new HideCompletedTaskToggleHandler());
+            default:
+                break;
         }
-
-        settingHandlerResponse.containerEl = particular_section;
-        return handlers[0]?.handle(settingHandlerResponse);
-    } else {
-        return settingHandlerResponse;
+        return particularHandlers;
     }
 }
-
-function addParticularInputSettings(dataType: string): ColumnHandler[] {
-    const particularHandlers: ColumnHandler[] = [];
-    switch (dataType) {
-        case DataTypes.TEXT:
-            particularHandlers.push(new MediaToggleHandler());
-            particularHandlers.push(new MediaDimensionsHandler());
-            break;
-        case DataTypes.SELECT:
-        case DataTypes.TAGS:
-            particularHandlers.push(new SelectedColumnOptionsHandler());
-            break;
-        default:
-            break;
-    }
-    return particularHandlers;
-}
+export const particular_settings_section = new ParticularSetttingsSection();

src/components/modals/handlers/tasks/HideCompletedTaskToggleHandler.ts

@@ -0,0 +1,24 @@
+import { add_toggle } from "settings/SettingsComponents";
+import { AbstractColumnHandler } from "components/modals/handlers/AbstractColumnHandler";
+import { ColumnHandlerResponse } from "cdm/ModalSettingsModel";
+export class HideCompletedTaskToggleHandler extends AbstractColumnHandler {
+    settingTitle: string = 'Hide completed tasks';
+    handle(columnHandlerResponse: ColumnHandlerResponse): ColumnHandlerResponse {
+        const { column, containerEl, view } = columnHandlerResponse;
+        const inline_togle_promise = async (value: boolean): Promise<void> => {
+            column.config.isInline = value;
+            // Persist value
+            await view.diskConfig.updateColumnConfig(column.key, {
+                task_hide_completed: value
+            });
+        }
+        add_toggle(
+            containerEl,
+            this.settingTitle,
+            "Hide the completed tasks shown in the task column",
+            column.config.task_hide_completed,
+            inline_togle_promise
+        );
+        return this.goNext(columnHandlerResponse);
+    }
+}

src/helpers/Constants.ts

@@ -1,5 +1,5 @@
 import { MetadataColumnsModel } from "cdm/DatabaseModel";
-import { TableColumn } from "cdm/FolderModel";
+import { ConfigColumn, TableColumn } from "cdm/FolderModel";
 import { DatabaseSettings } from "cdm/SettingsModel";
 
 /** Table Actions */
@@ -58,12 +58,13 @@ export const MetadataLabels = Object.freeze({
   TASK: 'Task',
 });
 
-export const DEFAULT_COLUMN_CONFIG = Object.freeze({
+export const DEFAULT_COLUMN_CONFIG: ConfigColumn = Object.freeze({
   enable_media_view: true,
   media_width: 100,
   media_height: 100,
   isInline: false,
   source_data: 'current_folder',
+  task_hide_completed: true,
 });
 
 export const MetadataDatabaseColumns: MetadataColumnsModel = Object.freeze({
@@ -122,7 +123,7 @@ export const MetadataDatabaseColumns: MetadataColumnsModel = Object.freeze({
     accessor: MetadataColumns.TASKS,
     isMetadata: true,
     isDragDisabled: false,
-    skipPersist: true,
+    skipPersist: false,
     csvCandidate: false,
     config: DEFAULT_COLUMN_CONFIG
   },

src/parsers/handlers/marshall/MarshallColumnsHandler.ts

@@ -19,61 +19,50 @@ export class MarshallColumnsHandler extends AbstractYamlHandler {
                     key: 'Column1',
                     label: 'Column 1',
                     position: 1,
-                    config: {
-                        enable_media_view: true,
-                        media_width: 100,
-                        media_height: 100,
-                        isInline: false
-                    }
+                    config: DEFAULT_COLUMN_CONFIG
                 }
             };
         }
         // Check every column
         Object.keys(yaml.columns)
             .forEach((key) => {
-                const column = yaml.columns[key];
+                let column = yaml.columns[key];
                 /** BASE COLUMN INFO */
                 if (!column.input) {
                     this.addError(`There was not input in column ${key}`);
-                    yaml.columns[key].input = DataTypes.TEXT;
+                    column.input = DataTypes.TEXT;
                 } else {
-                    yaml.columns[key] = marshallParticularInputInfo(column);
+                    column = marshallParticularInputInfo(column);
                     // PARTICULAR INPUT INFO
                 }
                 if (!column.accessor) {
                     this.addError(`There was not accessor in column ${key}`);
-                    yaml.columns[key].accessor = key;
+                    column.accessor = key;
                 }
                 if (!column.key) {
                     this.addError(`There was not key in column ${key}`);
-                    yaml.columns[key].key = key;
+                    column.key = key;
                 }
                 if (!column.label) {
                     this.addError(`There was not label in column ${key}`);
-                    yaml.columns[key].label = key;
+                    column.label = key;
+                }
+                if (column.skipPersist === undefined) {
+                    column.skipPersist = false;
                 }
+
                 /** CONFIG COLUMN INFO */
                 if (!column.config && !(column.config instanceof Object)) {
                     column.config = DEFAULT_COLUMN_CONFIG;
-                    yaml.columns[key] = column;
                 } else {
-                    if (column.config.enable_media_view === undefined) {
-                        column.config.enable_media_view = DEFAULT_COLUMN_CONFIG.enable_media_view;
-                        yaml.columns[key] = column;
-                    }
-                    if (column.config.media_width === undefined) {
-                        column.config.media_width = DEFAULT_COLUMN_CONFIG.media_width;
-                        yaml.columns[key] = column;
-                    }
-                    if (column.config.media_height === undefined) {
-                        column.config.media_height = DEFAULT_COLUMN_CONFIG.media_height;
-                        yaml.columns[key] = column;
-                    }
+                    // General config
                     if (column.config.isInline === undefined) {
                         column.config.isInline = DEFAULT_COLUMN_CONFIG.isInline;
-                        yaml.columns[key] = column;
                     }
+                    column = marshallParticularConfigInfo(column);
                 }
+                // Update mashaller response
+                yaml.columns[key] = column;
             });
         handlerResponse.yaml = yaml;
         return this.goNext(handlerResponse);
@@ -104,4 +93,25 @@ function marshallParticularInputInfo(column: DatabaseColumn): DatabaseColumn {
             break;
     }
     return column;
+}
+
+function marshallParticularConfigInfo(column: DatabaseColumn): DatabaseColumn {
+    switch (column.input) {
+        case DataTypes.TEXT:
+            if (column.config.enable_media_view === undefined) {
+                column.config.enable_media_view = DEFAULT_COLUMN_CONFIG.enable_media_view;
+            }
+            if (column.config.media_width === undefined) {
+                column.config.media_width = DEFAULT_COLUMN_CONFIG.media_width;
+            }
+            if (column.config.media_height === undefined) {
+                column.config.media_height = DEFAULT_COLUMN_CONFIG.media_height;
+            }
+        case DataTypes.TASK:
+            if (column.config.task_hide_completed === undefined) {
+                column.config.task_hide_completed = DEFAULT_COLUMN_CONFIG.task_hide_completed;
+                break;
+            }
+    }
+    return column;
 }