Refactor dropdown button component

src-ui/src/app/app.module.ts

@@ -28,7 +28,7 @@ import { AppFrameComponent } from './components/app-frame/app-frame.component';
 import { ToastsComponent } from './components/common/toasts/toasts.component';
 import { FilterEditorComponent } from './components/document-list/filter-editor/filter-editor.component';
 import { FilterableDropdownComponent } from './components/common/filterable-dropdown/filterable-dropdown.component';
-import { FilterableDropdownButtonComponent } from './components/common/filterable-dropdown/filterable-dropdown-button/filterable-dropdown-button.component';
+import { ToggleableDropdownButtonComponent } from './components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component';
 import { DateDropdownComponent } from './components/common/date-dropdown/date-dropdown.component';
 import { DocumentCardLargeComponent } from './components/document-list/document-card-large/document-card-large.component';
 import { DocumentCardSmallComponent } from './components/document-list/document-card-small/document-card-small.component';
@@ -82,7 +82,7 @@ import { NgSelectModule } from '@ng-select/ng-select';
     ToastsComponent,
     FilterEditorComponent,
     FilterableDropdownComponent,
-    FilterableDropdownButtonComponent,
+    ToggleableDropdownButtonComponent,
     DateDropdownComponent,
     DocumentCardLargeComponent,
     DocumentCardSmallComponent,

src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown-button/filterable-dropdown-button.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { FilterableDropodownButtonComponent } from './filterable-dropdown-button.component';
-
-describe('FilterableDropodownButtonComponent', () => {
-  let component: FilterableDropodownButtonComponent;
-  let fixture: ComponentFixture<FilterableDropodownButtonComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ FilterableDropodownButtonComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(FilterableDropodownButtonComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.html

@@ -21,7 +21,7 @@
       </div>
       <div *ngIf="toggleableItems" class="items">
         <ng-container *ngFor="let toggleableItem of toggleableItems | filter: filterText">
-          <app-filterable-dropdown-button [toggleableItem]="toggleableItem" (toggle)="toggleItem($event)"></app-filterable-dropdown-button>
+          <app-toggleable-dropdown-button [toggleableItem]="toggleableItem" (toggle)="toggleItem($event)"></app-toggleable-dropdown-button>
         </ng-container>
       </div>
     </div>

src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.ts

@@ -5,17 +5,7 @@ import { PaperlessCorrespondent } from 'src/app/data/paperless-correspondent';
 import { PaperlessDocumentType } from 'src/app/data/paperless-document-type';
 import { FilterPipe } from  'src/app/pipes/filter.pipe';
 import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap'
-
+import { ToggleableItem, ToggleableItemState } from './toggleable-dropdown-button/toggleable-dropdown-button.component';
-export interface ToggleableItem {
-  item: PaperlessTag | PaperlessDocumentType | PaperlessCorrespondent,
-  state: ToggleableItemState
-}
-
-export enum ToggleableItemState {
-  NotSelected = 0,
-  Selected = 1,
-  PartiallySelected = 2
-}
 
 export enum FilterableDropdownType {
   Filtering = 'filtering',

src-ui/src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ToggleableDropdownButtonComponent } from './toggleable-dropdown-button.component';
+
+describe('ToggleableDropdownButtonComponent', () => {
+  let component: ToggleableDropdownButtonComponent;
+  let fixture: ComponentFixture<ToggleableDropdownButtonComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ ToggleableDropdownButtonComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ToggleableDropdownButtonComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src-ui/src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component.ts

@@ -2,14 +2,24 @@ import { Component, EventEmitter, Input, Output, OnInit } from '@angular/core';
 import { PaperlessTag } from 'src/app/data/paperless-tag';
 import { PaperlessCorrespondent } from 'src/app/data/paperless-correspondent';
 import { PaperlessDocumentType } from 'src/app/data/paperless-document-type';
-import { ToggleableItem, ToggleableItemState } from '../filterable-dropdown.component';
+
+export interface ToggleableItem {
+  item: PaperlessTag | PaperlessDocumentType | PaperlessCorrespondent,
+  state: ToggleableItemState
+}
+
+export enum ToggleableItemState {
+  NotSelected = 0,
+  Selected = 1,
+  PartiallySelected = 2
+}
 
 @Component({
-  selector: 'app-filterable-dropdown-button',
+  selector: 'app-toggleable-dropdown-button',
-  templateUrl: './filterable-dropdown-button.component.html',
+  templateUrl: './toggleable-dropdown-button.component.html',
-  styleUrls: ['./filterable-dropdown-button.component.scss']
+  styleUrls: ['./toggleable-dropdown-button.component.scss']
 })
-export class FilterableDropdownButtonComponent {
+export class ToggleableDropdownButtonComponent {
 
   @Input()
   toggleableItem: ToggleableItem

src-ui/src/app/components/document-list/bulk-editor/bulk-editor.component.ts

@@ -8,7 +8,8 @@ import { TagService } from 'src/app/services/rest/tag.service';
 import { CorrespondentService } from 'src/app/services/rest/correspondent.service';
 import { DocumentTypeService } from 'src/app/services/rest/document-type.service';
 import { DocumentService } from 'src/app/services/rest/document.service';
-import { ToggleableItem, ToggleableItemState, FilterableDropdownType } from 'src/app/components/common/filterable-dropdown/filterable-dropdown.component';
+import { FilterableDropdownType } from 'src/app/components/common/filterable-dropdown/filterable-dropdown.component';
+import { ToggleableItem, ToggleableItemState } from 'src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component';
 
 @Component({
   selector: 'app-bulk-editor',

src-ui/src/app/pipes/filter.pipe.ts

@@ -1,5 +1,5 @@
 import { Pipe, PipeTransform } from '@angular/core';
-import { ToggleableItem } from 'src/app/components/common/filterable-dropdown/filterable-dropdown.component';
+import { ToggleableItem } from 'src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component';
 
 @Pipe({
   name: 'filter'