From 981e23a192a0bfc9842bca61e545fe7d5682455e Mon Sep 17 00:00:00 2001 From: trivernis Date: Sat, 15 Jan 2022 18:28:54 +0100 Subject: [PATCH] Fix scrollbar behaviour in filesearch Signed-off-by: trivernis --- mediarepo-ui/src/api/api-types/files.ts | 10 -- .../selectable/selectable.component.spec.ts | 38 +++---- .../filter-input.component.spec.ts | 38 +++---- .../file-search/file-search.component.ts | 2 + ...ter-expression-list-item.component.spec.ts | 38 +++---- .../shared/sidebar/sidebar.module.ts | 4 +- mediarepo-ui/src/app/models/GenericFilter.ts | 105 ------------------ 7 files changed, 62 insertions(+), 173 deletions(-) delete mode 100644 mediarepo-ui/src/app/models/GenericFilter.ts diff --git a/mediarepo-ui/src/api/api-types/files.ts b/mediarepo-ui/src/api/api-types/files.ts index 830e08f..004917e 100644 --- a/mediarepo-ui/src/api/api-types/files.ts +++ b/mediarepo-ui/src/api/api-types/files.ts @@ -17,16 +17,6 @@ export type TagQuery = { tag: string, }; -export type PropertyKeys = - "Status" - | "FileSize" - | "ImportedTime" - | "ChangedTime" - | "CreatedTime" - | "TagCount" - | "Cd" - | "Id"; - export type PropertyQuery = PropertyQueryStatus | PropertyQueryFileSize | PropertyQueryImportedTime diff --git a/mediarepo-ui/src/app/components/shared/app-common/selectable/selectable.component.spec.ts b/mediarepo-ui/src/app/components/shared/app-common/selectable/selectable.component.spec.ts index 024302c..e08a740 100644 --- a/mediarepo-ui/src/app/components/shared/app-common/selectable/selectable.component.spec.ts +++ b/mediarepo-ui/src/app/components/shared/app-common/selectable/selectable.component.spec.ts @@ -1,25 +1,25 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import {ComponentFixture, TestBed} from "@angular/core/testing"; -import { SelectableComponent } from './selectable.component'; +import {SelectableComponent} from "./selectable.component"; -describe('SelectableComponent', () => { - let component: SelectableComponent; - let fixture: ComponentFixture; +describe("SelectableComponent", () => { + let component: SelectableComponent; + let fixture: ComponentFixture; - beforeEach(async () => { - await TestBed.configureTestingModule({ - declarations: [ SelectableComponent ] - }) - .compileComponents(); - }); + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [SelectableComponent] + }) + .compileComponents(); + }); - beforeEach(() => { - fixture = TestBed.createComponent(SelectableComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); + beforeEach(() => { + fixture = TestBed.createComponent(SelectableComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); - it('should create', () => { - expect(component).toBeTruthy(); - }); + it("should create", () => { + expect(component).toBeTruthy(); + }); }); diff --git a/mediarepo-ui/src/app/components/shared/input/filter-input/filter-input.component.spec.ts b/mediarepo-ui/src/app/components/shared/input/filter-input/filter-input.component.spec.ts index 8df597e..1bf85b8 100644 --- a/mediarepo-ui/src/app/components/shared/input/filter-input/filter-input.component.spec.ts +++ b/mediarepo-ui/src/app/components/shared/input/filter-input/filter-input.component.spec.ts @@ -1,25 +1,25 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import {ComponentFixture, TestBed} from "@angular/core/testing"; -import { FilterInputComponent } from './filter-input.component'; +import {FilterInputComponent} from "./filter-input.component"; -describe('FilterInputComponent', () => { - let component: FilterInputComponent; - let fixture: ComponentFixture; +describe("FilterInputComponent", () => { + let component: FilterInputComponent; + let fixture: ComponentFixture; - beforeEach(async () => { - await TestBed.configureTestingModule({ - declarations: [ FilterInputComponent ] - }) - .compileComponents(); - }); + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [FilterInputComponent] + }) + .compileComponents(); + }); - beforeEach(() => { - fixture = TestBed.createComponent(FilterInputComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); + beforeEach(() => { + fixture = TestBed.createComponent(FilterInputComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); - it('should create', () => { - expect(component).toBeTruthy(); - }); + it("should create", () => { + expect(component).toBeTruthy(); + }); }); diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.ts b/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.ts index 2eb3422..a1275fa 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.ts +++ b/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.ts @@ -54,11 +54,13 @@ export class FileSearchComponent implements AfterViewChecked, OnInit { this.state.sortKeys.subscribe(s => this.sortExpression = s); this.applyStatusFromFilters(); await this.searchForFiles(); + this.needsScroll = true; } public ngAfterViewChecked(): void { if (this.needsScroll) { this.inputList.nativeElement.scrollLeft = this.inputList.nativeElement.scrollWidth; + this.needsScroll = false; } } diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-search/filter-dialog/filter-expression-list-item/filter-expression-list-item.component.spec.ts b/mediarepo-ui/src/app/components/shared/sidebar/file-search/filter-dialog/filter-expression-list-item/filter-expression-list-item.component.spec.ts index f50a419..382995d 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/file-search/filter-dialog/filter-expression-list-item/filter-expression-list-item.component.spec.ts +++ b/mediarepo-ui/src/app/components/shared/sidebar/file-search/filter-dialog/filter-expression-list-item/filter-expression-list-item.component.spec.ts @@ -1,25 +1,25 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import {ComponentFixture, TestBed} from "@angular/core/testing"; -import { FilterExpressionListItemComponent } from './filter-expression-list-item.component'; +import {FilterExpressionListItemComponent} from "./filter-expression-list-item.component"; -describe('FilterExpressionListItemComponent', () => { - let component: FilterExpressionListItemComponent; - let fixture: ComponentFixture; +describe("FilterExpressionListItemComponent", () => { + let component: FilterExpressionListItemComponent; + let fixture: ComponentFixture; - beforeEach(async () => { - await TestBed.configureTestingModule({ - declarations: [ FilterExpressionListItemComponent ] - }) - .compileComponents(); - }); + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [FilterExpressionListItemComponent] + }) + .compileComponents(); + }); - beforeEach(() => { - fixture = TestBed.createComponent(FilterExpressionListItemComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); + beforeEach(() => { + fixture = TestBed.createComponent(FilterExpressionListItemComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); - it('should create', () => { - expect(component).toBeTruthy(); - }); + it("should create", () => { + expect(component).toBeTruthy(); + }); }); diff --git a/mediarepo-ui/src/app/components/shared/sidebar/sidebar.module.ts b/mediarepo-ui/src/app/components/shared/sidebar/sidebar.module.ts index b711d80..7e8b843 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/sidebar.module.ts +++ b/mediarepo-ui/src/app/components/shared/sidebar/sidebar.module.ts @@ -43,7 +43,9 @@ import {TagQueryItemComponent} from "./file-search/filter-expression-item/tag-qu import { PropertyQueryItemComponent } from "./file-search/filter-expression-item/property-query-item/property-query-item.component"; -import { FilterExpressionListItemComponent } from './file-search/filter-dialog/filter-expression-list-item/filter-expression-list-item.component'; +import { + FilterExpressionListItemComponent +} from "./file-search/filter-dialog/filter-expression-list-item/filter-expression-list-item.component"; @NgModule({ diff --git a/mediarepo-ui/src/app/models/GenericFilter.ts b/mediarepo-ui/src/app/models/GenericFilter.ts deleted file mode 100644 index a04eb86..0000000 --- a/mediarepo-ui/src/app/models/GenericFilter.ts +++ /dev/null @@ -1,105 +0,0 @@ -import {TagQuery} from "./TagQuery"; -import {createRustEnum} from "./rust-types"; -import {FilterExpression} from "../../api/api-types/files"; - -export interface GenericFilter { - filter_type: "OrExpression" | "Query"; - filter: TagQuery[] | TagQuery; - - eq(value: any): boolean; - - partiallyEq(value: any): boolean; - - getDisplayName(): string; - - clone(): GenericFilter; - - queryList(): TagQuery[]; - - toBackendType(): FilterExpression; -} - -export class OrFilterExpression implements GenericFilter { - public filter_type: "OrExpression" = "OrExpression"; - public filter: TagQuery[] = []; - - constructor(tags: TagQuery[]) { - this.filter = tags; - } - - public eq(value: any): boolean { - return this == value; - } - - public partiallyEq(value: any): boolean { - return this == value; - } - - public getDisplayName(): string { - return this.filter.map(t => t.getNormalizedTag()).join(" OR "); - } - - public clone(): OrFilterExpression { - let tags = this.filter.map( - (t: TagQuery) => new TagQuery(t.tag, t.negate)); - return new OrFilterExpression(tags); - } - - public queryList(): TagQuery[] { - return this.filter; - } - - public removeQueryEntry(index: number) { - this.filter.splice(index, 1); - } - - public removeDuplicates() { - const filters = this.filter.reverse(); - let newEntries: TagQuery[] = []; - - for (const entry of filters) { - if (newEntries.findIndex(f => f.tag === entry.tag) < 0) { - newEntries.push(entry); - } - } - this.filter = newEntries.reverse(); - } - - public toBackendType(): FilterExpression { - return createRustEnum(this.filter_type, createRustEnum("Tag", this.filter)) as unknown as FilterExpression; - } -} - -export class SingleFilterExpression implements GenericFilter { - public filter_type: "Query" = "Query"; - public filter: TagQuery; - - constructor(tag: TagQuery) { - this.filter = tag; - } - - public eq(value: any): boolean { - return (this.filter.tag === value?.name && this.filter.negate === value?.negate) || this.filter.getNormalizedTag() === value; - } - - public partiallyEq(value: any): boolean { - return this.filter.tag === value || this.filter.tag === value?.name; - } - - public getDisplayName(): string { - return this.filter.getNormalizedTag(); - } - - public clone(): GenericFilter { - return new SingleFilterExpression( - new TagQuery(this.filter.tag, this.filter.negate)); - } - - public queryList(): TagQuery[] { - return [this.filter]; - } - - public toBackendType(): FilterExpression { - return createRustEnum(this.filter_type, createRustEnum("Tag", this.filter)) as unknown as FilterExpression; - } -}