Add label filter to tasks

gramps-project · Aug 21, 2023 · cda4c1a · cda4c1a
1 parent be2632f
commit cda4c1a
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 0 deletions.
diff --git a/src/components/GrampsjsTasks.js b/src/components/GrampsjsTasks.js
@@ -58,6 +58,10 @@ class GrampsjsTasks extends GrampsjsTranslateMixin(LitElement) {
           margin-right: 8px;
         }
 
+        .filters {
+          margin-bottom: 32px;
+        }
+
         .taskbar {
           padding-left: 10px;
           display: flex;
@@ -135,6 +139,14 @@ class GrampsjsTasks extends GrampsjsTranslateMixin(LitElement) {
 
   _renderTaskBar() {
     return html`
+      <div class="filters">
+        <grampsjs-filters .strings="${this.strings}" objectType="source">
+          <grampsjs-filter-tags
+            .strings="${this.strings}"
+          ></grampsjs-filter-tags>
+        </grampsjs-filters>
+      </div>
+
       <div class="taskbar">
         <mwc-checkbox
           id="select-all"

diff --git a/src/views/GrampsjsViewTasks.js b/src/views/GrampsjsViewTasks.js
@@ -24,6 +24,7 @@ export class GrampsjsViewTasks extends GrampsjsView {
       _data: {type: Array},
       canAdd: {type: Boolean},
       canEdit: {type: Boolean},
+      _filters: {type: Array},
       _todoTagHandle: {type: String},
     }
   }
@@ -34,6 +35,7 @@ export class GrampsjsViewTasks extends GrampsjsView {
     this.canEdit = false
     this._data = []
     this._todoTagHandle = ''
+    this._filters = []
     this._boundFetchData = this._fetchData.bind(this)
   }
 
@@ -45,6 +47,7 @@ export class GrampsjsViewTasks extends GrampsjsView {
         .strings="${this.strings}"
         .data="${this._data}"
         @tasks:update-attribute="${this._handleUpdateAttribute}"
+        @filters:changed="${this._handleFiltersChanged}"
         ?canEdit="${this.canEdit}"
       ></grampsjs-tasks>
 
@@ -72,6 +75,7 @@ export class GrampsjsViewTasks extends GrampsjsView {
           name: 'HasTag',
           values: ['ToDo'],
         },
+        ...this._filters,
       ],
     }
     const uri = `/api/sources/?rules=${encodeURIComponent(
@@ -111,6 +115,13 @@ export class GrampsjsViewTasks extends GrampsjsView {
     fireEvent(this, 'db:changed')
   }
 
+  _handleFiltersChanged(e) {
+    this._filters = e.detail.filters
+    e.preventDefault()
+    e.stopPropagation()
+    this._fetchData()
+  }
+
   firstUpdated() {
     if ('__lang__' in this.strings) {
       // don't load before we have strings