Adds quick filters from document detail

src-ui/src/app/components/common/input/date/date.component.html

@@ -9,6 +9,11 @@
         <path d="M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z"/>
       </svg>
     </button>
+    <button *ngIf="showFilter" class="btn btn-outline-secondary" type="button" (click)="onFilterDocuments()" [disabled]="this.value === null" i18n-title title="Filter documents with this {{title}}">
+      <svg class="buttonicon" fill="currentColor">
+        <use xlink:href="assets/bootstrap-icons.svg#filter" />
+      </svg>
+    </button>
   </div>
   <div class="invalid-feedback" i18n>Invalid date.</div>
   <small *ngIf="hint" class="form-text text-muted">{{hint}}</small>

src-ui/src/app/components/common/input/date/date.component.ts

@@ -1,8 +1,16 @@
-import { Component, forwardRef, Input, OnInit } from '@angular/core'
+import {
+  Component,
+  EventEmitter,
+  forwardRef,
+  Input,
+  OnInit,
+  Output,
+} from '@angular/core'
 import { NG_VALUE_ACCESSOR } from '@angular/forms'
 import {
   NgbDateAdapter,
   NgbDateParserFormatter,
+  NgbDateStruct,
 } from '@ng-bootstrap/ng-bootstrap'
 import { SettingsService } from 'src/app/services/settings.service'
 import { AbstractInputComponent } from '../abstract-input'
@@ -34,6 +42,12 @@ export class DateComponent
   @Input()
   suggestions: string[]
 
+  @Input()
+  showFilter: boolean = false
+
+  @Output()
+  filterDocuments = new EventEmitter<NgbDateStruct[]>()
+
   getSuggestions() {
     return this.suggestions == null
       ? []
@@ -80,4 +94,8 @@ export class DateComponent
       event.preventDefault()
     }
   }
+
+  onFilterDocuments() {
+    this.filterDocuments.emit([this.ngbDateParserFormatter.parse(this.value)])
+  }
 }