From c308a383355b635ede5c0fcebe43392b5198a123 Mon Sep 17 00:00:00 2001 From: manuel-delvillar <68391066+manuel-delvillar@users.noreply.github.com> Date: Mon, 27 Mar 2023 16:50:50 -0600 Subject: [PATCH 01/18] Add size pagination --- ui/src/app/app.module.ts | 7 +++-- .../richskill/list/skills-list.component.html | 3 ++ .../richskill/list/skills-list.component.ts | 9 +++++- .../size-pagination.component.html | 8 +++++ .../size-pagination.component.scss | 3 ++ .../size-pagination.component.spec.ts | 25 ++++++++++++++++ .../size-pagination.component.ts | 30 +++++++++++++++++++ 7 files changed, 82 insertions(+), 3 deletions(-) create mode 100644 ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html create mode 100644 ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.scss create mode 100644 ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.spec.ts create mode 100644 ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts diff --git a/ui/src/app/app.module.ts b/ui/src/app/app.module.ts index 2ca69f979..42561663f 100644 --- a/ui/src/app/app.module.ts +++ b/ui/src/app/app.module.ts @@ -9,7 +9,7 @@ import {RichSkillsLibraryComponent} from "./richskill/library/rich-skills-librar import {RichSkillPublicComponent} from "./richskill/detail/rich-skill-public/rich-skill-public.component" import {AppConfig} from "./app.config" import {RichSkillFormComponent} from "./richskill/form/rich-skill-form.component" -import {ReactiveFormsModule} from "@angular/forms" +import {FormsModule, ReactiveFormsModule} from "@angular/forms" import {LoadingObservablesDirective} from "./loading/loading-observables.directive" import {LoadingComponent} from "./loading/loading.component" import {HeaderComponent} from "./navigation/header.component" @@ -95,6 +95,7 @@ import {CollectionPipe} from "./pipes" import { ConvertToCollectionComponent } from "./my-workspace/convert-to-collection/convert-to-collection.component" import {SharedModule} from "@shared/shared.module" import {FormModule} from "./form/form.module" +import { SizePaginationComponent } from "./table/skills-library-table/size-pagination/size-pagination.component" export function initializeApp( appConfig: AppConfig, @@ -201,6 +202,7 @@ export function initializeApp( MyWorkspaceComponent, CollectionPipe, ConvertToCollectionComponent, + SizePaginationComponent, ], imports: [ NgIdleKeepaliveModule.forRoot(), @@ -210,7 +212,8 @@ export function initializeApp( ReactiveFormsModule, CommonModule, SharedModule, - FormModule + FormModule, + FormsModule ], providers: [ EnvironmentService, diff --git a/ui/src/app/richskill/list/skills-list.component.html b/ui/src/app/richskill/list/skills-list.component.html index 6a98fd0c9..6a3c623db 100644 --- a/ui/src/app/richskill/list/skills-list.component.html +++ b/ui/src/app/richskill/list/skills-list.component.html @@ -65,6 +65,9 @@

+ + + 0 ? this.pageSizeOptions[0] : 50 collection?: ApiCollection showAdvancedFilteredSearch = false @@ -442,6 +443,12 @@ export class SkillsListComponent extends QuickLinksHelper { this.loadNextPage() } + sizeChange(size: number): void { + this.size = size + this.from = 0 + this.handlePageClicked(1) + } + get selectedKeywords(): any { const a: any = {} const b: any = this.keywords diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html new file mode 100644 index 000000000..f7e394087 --- /dev/null +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html @@ -0,0 +1,8 @@ + + diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.scss b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.scss new file mode 100644 index 000000000..cfec707d0 --- /dev/null +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.scss @@ -0,0 +1,3 @@ +select { + width: 40px; +} diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.spec.ts b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.spec.ts new file mode 100644 index 000000000..e8507e46d --- /dev/null +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from "@angular/core/testing" + +import { SizePaginationComponent } from "./size-pagination.component" + +describe("SizePaginationComponent", () => { + let component: SizePaginationComponent + let fixture: ComponentFixture + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ SizePaginationComponent ] + }) + .compileComponents() + }) + + beforeEach(() => { + fixture = TestBed.createComponent(SizePaginationComponent) + component = fixture.componentInstance + fixture.detectChanges() + }) + + it("should create", () => { + expect(component).toBeTruthy() + }) +}) diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts new file mode 100644 index 000000000..2f2a11693 --- /dev/null +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts @@ -0,0 +1,30 @@ +import {Component, EventEmitter, Input, OnInit, Output} from "@angular/core" +import {FormControl} from "@angular/forms" + +@Component({ + selector: "app-size-pagination", + templateUrl: "./size-pagination.component.html", + styleUrls: ["./size-pagination.component.scss"] +}) +export class SizePaginationComponent implements OnInit { + + @Input() + values: number[] = [] + @Output() + changeValue: EventEmitter = new EventEmitter() + control: FormControl = new FormControl(undefined) + @Input() + currentSize?: number + + constructor() { + } + + ngOnInit(): void { + } + + onValueChange(value: number): void { + this.control.patchValue(value) + this.changeValue.emit(value) + } + +} From 0ea3bd5ac967233fe0ea322cfb6938031ca8ad1f Mon Sep 17 00:00:00 2001 From: manuel-delvillar <68391066+manuel-delvillar@users.noreply.github.com> Date: Tue, 28 Mar 2023 09:19:39 -0600 Subject: [PATCH 02/18] Update CSS - Update select border. --- .../size-pagination.component.html | 18 ++++++++++-------- .../size-pagination.component.scss | 18 +++++++++++++++++- 2 files changed, 27 insertions(+), 9 deletions(-) diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html index f7e394087..c72cf4dbf 100644 --- a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html @@ -1,8 +1,10 @@ - - +
+ + +
diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.scss b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.scss index cfec707d0..5a1fc1e34 100644 --- a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.scss +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.scss @@ -1,3 +1,19 @@ select { - width: 40px; + width: fit-content; + margin-left: 20px; + border-radius: 8px; + -webkit-box-sizing: border-box; + background-color: var(--color-background300); + border: 1px solid var(--color-background500); + outline: 2px solid transparent; + outline-offset: 4px; + box-sizing: border-box; + padding: 1px 8px; + -webkit-appearance: menulist; + transition: outline var(--t-transition),outline-offset var(--t-transition),border-radius var(--t-transition),border-color var(--t-transition),background-color var(--t-transition),box-shadow var(--t-transition); +} + +.size-pagination-container { + display: flex; + margin-bottom: 20px; } From 4619dc2ad0c3018e1f20647e4986725ee97eb41b Mon Sep 17 00:00:00 2001 From: manuel-delvillar <68391066+manuel-delvillar@users.noreply.github.com> Date: Tue, 28 Mar 2023 10:59:03 -0600 Subject: [PATCH 03/18] Update page size options --- ui/src/app/richskill/list/skills-list.component.html | 5 ++++- ui/src/app/richskill/list/skills-list.component.ts | 2 +- 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/ui/src/app/richskill/list/skills-list.component.html b/ui/src/app/richskill/list/skills-list.component.html index 6a3c623db..4e56a16b1 100644 --- a/ui/src/app/richskill/list/skills-list.component.html +++ b/ui/src/app/richskill/list/skills-list.component.html @@ -65,7 +65,10 @@

- + 0 ? this.pageSizeOptions[0] : 50 collection?: ApiCollection From 93bdc8f665538f6ce9fc9c42059bcc24bc853647 Mon Sep 17 00:00:00 2001 From: manuel-delvillar <68391066+manuel-delvillar@users.noreply.github.com> Date: Tue, 28 Mar 2023 13:34:56 -0600 Subject: [PATCH 04/18] Add size pagination - Add size pagination in all component with a rsd table. --- .../collection/collection-skill-search.component.html | 7 +++++++ .../collection-public/collection-public.component.html | 7 +++++++ .../collection-public/collection-public.component.ts | 10 +++++++++- .../collection/detail/manage-collection.component.html | 7 +++++++ ui/src/app/richskill/list/skills-list.component.html | 1 + 5 files changed, 31 insertions(+), 1 deletion(-) diff --git a/ui/src/app/collection/collection-skill-search.component.html b/ui/src/app/collection/collection-skill-search.component.html index 3da166d55..319ca96ea 100644 --- a/ui/src/app/collection/collection-skill-search.component.html +++ b/ui/src/app/collection/collection-skill-search.component.html @@ -60,6 +60,13 @@

Add RSDs to {{collect + + + 0 RSDs associated with this collection

+ + + 0 ? this.pageSizeOptions[0] : 50 columnSort: ApiSortOrder = ApiSortOrder.NameAsc showLibraryEmptyMessage = false @@ -117,4 +118,11 @@ export class CollectionPublicComponent extends Whitelabelled implements OnInit { this.from = (newPageNo - 1) * this.size this.loadNextPage() } + + sizeChange(size: number): void { + this.size = size + this.from = 0 + this.handlePageClicked(1) + } + } diff --git a/ui/src/app/collection/detail/manage-collection.component.html b/ui/src/app/collection/detail/manage-collection.component.html index cb051a084..967199b5f 100644 --- a/ui/src/app/collection/detail/manage-collection.component.html +++ b/ui/src/app/collection/detail/manage-collection.component.html @@ -76,6 +76,13 @@ > + + + From b06fb4cd7e7b92e75836986f1740fe0b4339ec28 Mon Sep 17 00:00:00 2001 From: Edwin Santizo Date: Wed, 29 Mar 2023 12:52:38 -0600 Subject: [PATCH 05/18] added test for new size-pagination component It now tests component onValueChange method to make sure it's called with correct params type --- .../size-pagination/size-pagination.component.spec.ts | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.spec.ts b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.spec.ts index e8507e46d..3eee6aed7 100644 --- a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.spec.ts +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.spec.ts @@ -22,4 +22,14 @@ describe("SizePaginationComponent", () => { it("should create", () => { expect(component).toBeTruthy() }) + + it("Should call onValueChange with a param of type number", () => { + const param = 100 + const onValueChangeSpy = spyOn(component, "onValueChange").withArgs(param).and.callThrough() + + component.onValueChange(100); + + expect(onValueChangeSpy).toHaveBeenCalled() + expect(typeof param).toEqual('number') + }) }) From 6ec368d88ddab3ed45578f891b7ae8a45622e568 Mon Sep 17 00:00:00 2001 From: Edwin Santizo Date: Wed, 29 Mar 2023 17:32:37 -0600 Subject: [PATCH 06/18] added test for page size in skills-list componenet --- .../richskill/list/skills-list.component.spec.ts | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/ui/src/app/richskill/list/skills-list.component.spec.ts b/ui/src/app/richskill/list/skills-list.component.spec.ts index 7ec993da1..9fc2b7aaf 100644 --- a/ui/src/app/richskill/list/skills-list.component.spec.ts +++ b/ui/src/app/richskill/list/skills-list.component.spec.ts @@ -495,4 +495,17 @@ describe("SkillsListComponent", () => { ] expect(component["addToWorkspaceVisible"]()).toBeTrue() }) + + describe( "sizeChange", () => { + it("Should set size of page, from and call handlePageClicked", () => { + const size = 100 + spyOn(component, "handlePageClicked").withArgs(1).and.callThrough() + + component.sizeChange(size) + + expect(component.from).toEqual(0) + expect(component.size).toEqual(size) + expect(component.handlePageClicked).toHaveBeenCalledTimes(1) + }) + }) }) From 68935fe64274709cbfeddab12417e0ed17c5b100 Mon Sep 17 00:00:00 2001 From: Edwin Santizo Date: Wed, 29 Mar 2023 17:45:27 -0600 Subject: [PATCH 07/18] added sizeChange test to collection-public component --- .../collection-public.component.spec.ts | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/ui/src/app/collection/detail/collection-public/collection-public.component.spec.ts b/ui/src/app/collection/detail/collection-public/collection-public.component.spec.ts index b0288f121..8a6e68a4a 100644 --- a/ui/src/app/collection/detail/collection-public/collection-public.component.spec.ts +++ b/ui/src/app/collection/detail/collection-public/collection-public.component.spec.ts @@ -164,4 +164,17 @@ describe("CollectionPublicComponent", () => { expect(component.from).toEqual((13 - 1) * 50) expect(component.results).toEqual(expected) }) + + describe( "sizeChange", () => { + it("Should set size of page, from and call handlePageClicked", () => { + const size = 100 + spyOn(component, "handlePageClicked").withArgs(1).and.callThrough() + + component.sizeChange(size) + + expect(component.from).toEqual(0) + expect(component.size).toEqual(size) + expect(component.handlePageClicked).toHaveBeenCalledTimes(1) + }) + }) }) From 0bc654b9aa3cfbbcf8382d07bcadce79abc0b309 Mon Sep 17 00:00:00 2001 From: manuel-delvillar <68391066+manuel-delvillar@users.noreply.github.com> Date: Fri, 31 Mar 2023 12:50:47 -0600 Subject: [PATCH 08/18] Paginated size options is a constant - Now paginated size options is a constant in size-pagination.component.ts --- .../collection-public/collection-public.component.html | 1 - .../detail/collection-public/collection-public.component.ts | 3 +-- ui/src/app/richskill/list/skills-list.component.html | 1 - ui/src/app/richskill/list/skills-list.component.ts | 3 +-- .../size-pagination/size-pagination.component.ts | 5 ++--- 5 files changed, 4 insertions(+), 9 deletions(-) diff --git a/ui/src/app/collection/detail/collection-public/collection-public.component.html b/ui/src/app/collection/detail/collection-public/collection-public.component.html index 3792d96d3..4828a17ec 100644 --- a/ui/src/app/collection/detail/collection-public/collection-public.component.html +++ b/ui/src/app/collection/detail/collection-public/collection-public.component.html @@ -49,7 +49,6 @@ diff --git a/ui/src/app/collection/detail/collection-public/collection-public.component.ts b/ui/src/app/collection/detail/collection-public/collection-public.component.ts index 073dc0123..e99bb5cc4 100644 --- a/ui/src/app/collection/detail/collection-public/collection-public.component.ts +++ b/ui/src/app/collection/detail/collection-public/collection-public.component.ts @@ -17,7 +17,6 @@ import {Whitelabelled} from "../../../../whitelabel"; }) export class CollectionPublicComponent extends Whitelabelled implements OnInit { - pageSizeOptions = [50, 100, 150] title = "Collection" uuidParam: string | null collection: ApiCollection | undefined @@ -27,7 +26,7 @@ export class CollectionPublicComponent extends Whitelabelled implements OnInit { results: PaginatedSkills | undefined from = 0 - size = this.pageSizeOptions?.length > 0 ? this.pageSizeOptions[0] : 50 + size = 50 columnSort: ApiSortOrder = ApiSortOrder.NameAsc showLibraryEmptyMessage = false diff --git a/ui/src/app/richskill/list/skills-list.component.html b/ui/src/app/richskill/list/skills-list.component.html index 2cc501fbf..ac796ef93 100644 --- a/ui/src/app/richskill/list/skills-list.component.html +++ b/ui/src/app/richskill/list/skills-list.component.html @@ -67,7 +67,6 @@

diff --git a/ui/src/app/richskill/list/skills-list.component.ts b/ui/src/app/richskill/list/skills-list.component.ts index bf5277eb5..314fd1fcd 100644 --- a/ui/src/app/richskill/list/skills-list.component.ts +++ b/ui/src/app/richskill/list/skills-list.component.ts @@ -25,9 +25,8 @@ import {FilterDropdown} from "../../models/filter-dropdown.model" }) export class SkillsListComponent extends QuickLinksHelper { - pageSizeOptions = [50, 100, 150] from = 0 - size = this.pageSizeOptions?.length > 0 ? this.pageSizeOptions[0] : 50 + size = 50 collection?: ApiCollection showAdvancedFilteredSearch = false diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts index 2f2a11693..b94b078a0 100644 --- a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts @@ -8,13 +8,12 @@ import {FormControl} from "@angular/forms" }) export class SizePaginationComponent implements OnInit { - @Input() - values: number[] = [] + values: number[] = [50, 100, 150] @Output() changeValue: EventEmitter = new EventEmitter() control: FormControl = new FormControl(undefined) @Input() - currentSize?: number + currentSize = 50 constructor() { } From bb0b48a95431c8c2a914d8cc4a963eac23040add Mon Sep 17 00:00:00 2001 From: manuel-delvillar <68391066+manuel-delvillar@users.noreply.github.com> Date: Mon, 3 Apr 2023 10:09:28 -0600 Subject: [PATCH 09/18] Remove not provided property --- ui/src/app/collection/collection-skill-search.component.html | 1 - ui/src/app/collection/detail/manage-collection.component.html | 1 - 2 files changed, 2 deletions(-) diff --git a/ui/src/app/collection/collection-skill-search.component.html b/ui/src/app/collection/collection-skill-search.component.html index 319ca96ea..67a16f5ed 100644 --- a/ui/src/app/collection/collection-skill-search.component.html +++ b/ui/src/app/collection/collection-skill-search.component.html @@ -62,7 +62,6 @@

Add RSDs to {{collect diff --git a/ui/src/app/collection/detail/manage-collection.component.html b/ui/src/app/collection/detail/manage-collection.component.html index 967199b5f..2020b4eec 100644 --- a/ui/src/app/collection/detail/manage-collection.component.html +++ b/ui/src/app/collection/detail/manage-collection.component.html @@ -78,7 +78,6 @@ From d743c2e58f6f935cb0729cfc43885bd47c5b87b6 Mon Sep 17 00:00:00 2001 From: manuel-delvillar <68391066+manuel-delvillar@users.noreply.github.com> Date: Mon, 3 Apr 2023 12:41:45 -0600 Subject: [PATCH 10/18] Moving size pagination to filter controls. --- .../detail/manage-collection.component.html | 9 +++------ .../richskill/list/skills-list.component.html | 9 +++------ .../filter-controls.component.html | 2 ++ .../filter-controls.component.ts | 11 +++++++++- .../size-pagination.component.html | 2 +- .../size-pagination.component.ts | 20 +++++-------------- 6 files changed, 24 insertions(+), 29 deletions(-) diff --git a/ui/src/app/collection/detail/manage-collection.component.html b/ui/src/app/collection/detail/manage-collection.component.html index 2020b4eec..33666a27a 100644 --- a/ui/src/app/collection/detail/manage-collection.component.html +++ b/ui/src/app/collection/detail/manage-collection.component.html @@ -47,6 +47,9 @@ - - - - - - Filters

(filterChanged)="onFilterChangeArchived($event)" > + +
diff --git a/ui/src/app/table/filter-controls/filter-controls.component.ts b/ui/src/app/table/filter-controls/filter-controls.component.ts index 4e6dab6f2..e41760bea 100644 --- a/ui/src/app/table/filter-controls/filter-controls.component.ts +++ b/ui/src/app/table/filter-controls/filter-controls.component.ts @@ -1,7 +1,7 @@ import {Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges} from "@angular/core" import {PublishStatus} from "../../PublishStatus"; import {FilterDropdown} from "../../models/filter-dropdown.model" -import {FormBuilder, FormGroup} from "@angular/forms" +import {FormBuilder, FormControl, FormGroup} from "@angular/forms" @Component({ selector: "app-filter-controls", @@ -17,11 +17,20 @@ export class FilterControlsComponent implements OnInit, OnChanges { filterFg: FormGroup @Input() showAdvancedFilteredSearch?: boolean + @Input() + showSizePagination?: boolean + @Output() + changeValue: EventEmitter = new EventEmitter() + sizeControl?: FormControl + @Input() + currentSize = 50 constructor( protected formBuilder: FormBuilder ) { this.filterFg = this.configureFilterFg() + this.sizeControl = new FormControl(this.currentSize) + this.sizeControl.valueChanges.subscribe(value => this.changeValue.emit(value)) } ngOnInit(): void { diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html index c72cf4dbf..3bd89d0b8 100644 --- a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html @@ -2,7 +2,7 @@ - diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts index b94b078a0..177d7fdaa 100644 --- a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts @@ -1,4 +1,4 @@ -import {Component, EventEmitter, Input, OnInit, Output} from "@angular/core" +import {Component, Input} from "@angular/core" import {FormControl} from "@angular/forms" @Component({ @@ -6,24 +6,14 @@ import {FormControl} from "@angular/forms" templateUrl: "./size-pagination.component.html", styleUrls: ["./size-pagination.component.scss"] }) -export class SizePaginationComponent implements OnInit { +export class SizePaginationComponent { - values: number[] = [50, 100, 150] - @Output() - changeValue: EventEmitter = new EventEmitter() - control: FormControl = new FormControl(undefined) + readonly values: number[] = [50, 100, 150] @Input() - currentSize = 50 - - constructor() { - } - - ngOnInit(): void { - } + control?: FormControl onValueChange(value: number): void { - this.control.patchValue(value) - this.changeValue.emit(value) + this.control?.patchValue(value) } } From dbf1cd98d8de50e4b42ac1a890aee3b12612afe8 Mon Sep 17 00:00:00 2001 From: manuel-delvillar <68391066+manuel-delvillar@users.noreply.github.com> Date: Mon, 3 Apr 2023 12:49:51 -0600 Subject: [PATCH 11/18] No select size pagination when less than 50 RSDs --- ui/src/app/collection/detail/manage-collection.component.html | 2 +- ui/src/app/richskill/list/skills-list.component.html | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/ui/src/app/collection/detail/manage-collection.component.html b/ui/src/app/collection/detail/manage-collection.component.html index 33666a27a..38c459c81 100644 --- a/ui/src/app/collection/detail/manage-collection.component.html +++ b/ui/src/app/collection/detail/manage-collection.component.html @@ -48,7 +48,7 @@ Date: Mon, 3 Apr 2023 13:52:29 -0600 Subject: [PATCH 12/18] Add again current size property --- .../app/collection/collection-skill-search.component.html | 8 ++------ .../collection-public/collection-public.component.html | 2 +- .../collection-public/collection-public.component.ts | 3 +++ .../table/filter-controls/filter-controls.component.html | 2 +- .../size-pagination/size-pagination.component.html | 2 +- .../size-pagination/size-pagination.component.ts | 2 ++ 6 files changed, 10 insertions(+), 9 deletions(-) diff --git a/ui/src/app/collection/collection-skill-search.component.html b/ui/src/app/collection/collection-skill-search.component.html index 67a16f5ed..c2ae1b4db 100644 --- a/ui/src/app/collection/collection-skill-search.component.html +++ b/ui/src/app/collection/collection-skill-search.component.html @@ -33,6 +33,8 @@

Add RSDs to {{collect @@ -60,12 +62,6 @@

Add RSDs to {{collect

- - - + [control]="sizeControl"> this.sizeChange(value)) this.uuidParam = this.route.snapshot.paramMap.get("uuid") } diff --git a/ui/src/app/table/filter-controls/filter-controls.component.html b/ui/src/app/table/filter-controls/filter-controls.component.html index 4db1d16d0..dc61a9526 100644 --- a/ui/src/app/table/filter-controls/filter-controls.component.html +++ b/ui/src/app/table/filter-controls/filter-controls.component.html @@ -19,7 +19,7 @@

Filters

(filterChanged)="onFilterChangeArchived($event)" > - +
diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html index 3bd89d0b8..c72cf4dbf 100644 --- a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html @@ -2,7 +2,7 @@ - diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts index 177d7fdaa..096b5ff1e 100644 --- a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts @@ -11,6 +11,8 @@ export class SizePaginationComponent { readonly values: number[] = [50, 100, 150] @Input() control?: FormControl + @Input() + currentSize = 50 onValueChange(value: number): void { this.control?.patchValue(value) From e2eadeff27d0b53f6286fd470327d6a8f72577f9 Mon Sep 17 00:00:00 2001 From: Edwin Santizo Date: Mon, 3 Apr 2023 14:33:50 -0600 Subject: [PATCH 13/18] Added test that verifies that value inputed in the change value call is contained in the array for value selection --- .../size-pagination/size-pagination.component.spec.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.spec.ts b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.spec.ts index 3eee6aed7..17d9c34b8 100644 --- a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.spec.ts +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.spec.ts @@ -29,6 +29,7 @@ describe("SizePaginationComponent", () => { component.onValueChange(100); + expect(component.values).toContain(param) expect(onValueChangeSpy).toHaveBeenCalled() expect(typeof param).toEqual('number') }) From d537f5bbb503bfa8375d8aa9f838076c95c339f5 Mon Sep 17 00:00:00 2001 From: manuel-delvillar <68391066+manuel-delvillar@users.noreply.github.com> Date: Mon, 3 Apr 2023 14:45:05 -0600 Subject: [PATCH 14/18] Size pagination above in collection-public --- .../collection-public.component.html | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/ui/src/app/collection/detail/collection-public/collection-public.component.html b/ui/src/app/collection/detail/collection-public/collection-public.component.html index 53c829887..83055847f 100644 --- a/ui/src/app/collection/detail/collection-public/collection-public.component.html +++ b/ui/src/app/collection/detail/collection-public/collection-public.component.html @@ -27,6 +27,13 @@
+ + + +

Select one or more RSDs in the table, or select all in the table heading, then use the action menu to publish, archive, unarchive, or add the selected RSDs to a collection.

@@ -47,12 +54,6 @@

0 RSDs associated with this collection

- - - Date: Tue, 4 Apr 2023 09:36:37 -0600 Subject: [PATCH 15/18] Rename FormModule to OsmtFormModule --- ui/src/app/app.module.ts | 4 ++-- ui/src/app/form/{form.module.ts => osmt-form.module.ts} | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) rename ui/src/app/form/{form.module.ts => osmt-form.module.ts} (97%) diff --git a/ui/src/app/app.module.ts b/ui/src/app/app.module.ts index 42561663f..745219af9 100644 --- a/ui/src/app/app.module.ts +++ b/ui/src/app/app.module.ts @@ -94,7 +94,7 @@ import {MyWorkspaceComponent} from "./my-workspace/my-workspace.component" import {CollectionPipe} from "./pipes" import { ConvertToCollectionComponent } from "./my-workspace/convert-to-collection/convert-to-collection.component" import {SharedModule} from "@shared/shared.module" -import {FormModule} from "./form/form.module" +import {OsmtFormModule} from "./form/osmt-form.module" import { SizePaginationComponent } from "./table/skills-library-table/size-pagination/size-pagination.component" export function initializeApp( @@ -212,7 +212,7 @@ export function initializeApp( ReactiveFormsModule, CommonModule, SharedModule, - FormModule, + OsmtFormModule, FormsModule ], providers: [ diff --git a/ui/src/app/form/form.module.ts b/ui/src/app/form/osmt-form.module.ts similarity index 97% rename from ui/src/app/form/form.module.ts rename to ui/src/app/form/osmt-form.module.ts index bac33dcbf..573b70b33 100644 --- a/ui/src/app/form/form.module.ts +++ b/ui/src/app/form/osmt-form.module.ts @@ -37,5 +37,5 @@ import {FormFieldTextArea} from "./form-field-textarea.component" FormFieldKeywordSearchMultiSelect ] }) -export class FormModule { +export class OsmtFormModule { } From 64ce73d8aa5fd86ac542f10efa429b5f01e731e7 Mon Sep 17 00:00:00 2001 From: manuel-delvillar <68391066+manuel-delvillar@users.noreply.github.com> Date: Tue, 4 Apr 2023 13:57:36 -0600 Subject: [PATCH 16/18] Using function in size pagination --- ui/src/app/collection/collection-skill-search.component.html | 2 +- .../detail/collection-public/collection-public.component.html | 2 +- .../detail/collection-public/collection-public.component.ts | 4 ++++ ui/src/app/collection/detail/manage-collection.component.html | 2 +- ui/src/app/richskill/list/skills-list.component.html | 2 +- ui/src/app/richskill/list/skills-list.component.ts | 4 ++++ .../app/table/filter-controls/filter-controls.component.html | 2 +- ui/src/app/table/filter-controls/filter-controls.component.ts | 4 ++-- .../size-pagination/size-pagination.component.html | 2 +- .../size-pagination/size-pagination.component.ts | 2 ++ 10 files changed, 18 insertions(+), 8 deletions(-) diff --git a/ui/src/app/collection/collection-skill-search.component.html b/ui/src/app/collection/collection-skill-search.component.html index c2ae1b4db..dd51f7bb5 100644 --- a/ui/src/app/collection/collection-skill-search.component.html +++ b/ui/src/app/collection/collection-skill-search.component.html @@ -33,7 +33,7 @@

Add RSDs to {{collect diff --git a/ui/src/app/collection/detail/collection-public/collection-public.component.html b/ui/src/app/collection/detail/collection-public/collection-public.component.html index 83055847f..cfe7d2ba9 100644 --- a/ui/src/app/collection/detail/collection-public/collection-public.component.html +++ b/ui/src/app/collection/detail/collection-public/collection-public.component.html @@ -29,7 +29,7 @@
diff --git a/ui/src/app/collection/detail/collection-public/collection-public.component.ts b/ui/src/app/collection/detail/collection-public/collection-public.component.ts index 1e1740f8c..eeb0ed69c 100644 --- a/ui/src/app/collection/detail/collection-public/collection-public.component.ts +++ b/ui/src/app/collection/detail/collection-public/collection-public.component.ts @@ -127,4 +127,8 @@ export class CollectionPublicComponent extends Whitelabelled implements OnInit { this.handlePageClicked(1) } + get isSizePaginationVisible(): () => boolean { + return () => this.totalCount > 50 + } + } diff --git a/ui/src/app/collection/detail/manage-collection.component.html b/ui/src/app/collection/detail/manage-collection.component.html index 38c459c81..24149889a 100644 --- a/ui/src/app/collection/detail/manage-collection.component.html +++ b/ui/src/app/collection/detail/manage-collection.component.html @@ -48,7 +48,7 @@ boolean { + return () => this.totalCount > 50 + } + } diff --git a/ui/src/app/table/filter-controls/filter-controls.component.html b/ui/src/app/table/filter-controls/filter-controls.component.html index dc61a9526..f926c889b 100644 --- a/ui/src/app/table/filter-controls/filter-controls.component.html +++ b/ui/src/app/table/filter-controls/filter-controls.component.html @@ -19,7 +19,7 @@

Filters

(filterChanged)="onFilterChangeArchived($event)" >
- +
diff --git a/ui/src/app/table/filter-controls/filter-controls.component.ts b/ui/src/app/table/filter-controls/filter-controls.component.ts index e41760bea..d73f09ca9 100644 --- a/ui/src/app/table/filter-controls/filter-controls.component.ts +++ b/ui/src/app/table/filter-controls/filter-controls.component.ts @@ -17,13 +17,13 @@ export class FilterControlsComponent implements OnInit, OnChanges { filterFg: FormGroup @Input() showAdvancedFilteredSearch?: boolean - @Input() - showSizePagination?: boolean @Output() changeValue: EventEmitter = new EventEmitter() sizeControl?: FormControl @Input() currentSize = 50 + @Input() + isSizePaginationVisible: () => boolean = () => false constructor( protected formBuilder: FormBuilder diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html index c72cf4dbf..c157a3619 100644 --- a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.html @@ -1,4 +1,4 @@ -
+
diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts index 096b5ff1e..3fd8a953f 100644 --- a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts @@ -13,6 +13,8 @@ export class SizePaginationComponent { control?: FormControl @Input() currentSize = 50 + @Input() + isVisible: () => boolean = () => false onValueChange(value: number): void { this.control?.patchValue(value) From 8131ea61a6aee91ed87edb598253e96437b82b3d Mon Sep 17 00:00:00 2001 From: manuel-delvillar <68391066+manuel-delvillar@users.noreply.github.com> Date: Tue, 4 Apr 2023 14:13:06 -0600 Subject: [PATCH 17/18] Add minimum threshold constant --- ui/src/app/richskill/list/skills-list.component.ts | 3 ++- .../size-pagination/size-pagination.component.ts | 2 ++ 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/ui/src/app/richskill/list/skills-list.component.ts b/ui/src/app/richskill/list/skills-list.component.ts index 8769691d6..4d5b1d661 100644 --- a/ui/src/app/richskill/list/skills-list.component.ts +++ b/ui/src/app/richskill/list/skills-list.component.ts @@ -18,6 +18,7 @@ import {CollectionService} from "../../collection/service/collection.service" import {ApiCollection} from "../../collection/ApiCollection" import {CollectionPipe} from "../../pipes" import {FilterDropdown} from "../../models/filter-dropdown.model" +import {minimumThreshold} from "../../table/skills-library-table/size-pagination/size-pagination.component" @Component({ selector: "app-skills-list", @@ -460,7 +461,7 @@ export class SkillsListComponent extends QuickLinksHelper { } get isSizePaginationVisible(): () => boolean { - return () => this.totalCount > 50 + return () => this.totalCount > minimumThreshold } } diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts index 3fd8a953f..481e9cc0e 100644 --- a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts @@ -1,6 +1,8 @@ import {Component, Input} from "@angular/core" import {FormControl} from "@angular/forms" +export const minimumThreshold = 50 + @Component({ selector: "app-size-pagination", templateUrl: "./size-pagination.component.html", From ccecb249f3a6d81cc8c5c8000f603a151c62e402 Mon Sep 17 00:00:00 2001 From: manuel-delvillar <68391066+manuel-delvillar@users.noreply.github.com> Date: Tue, 4 Apr 2023 15:17:25 -0600 Subject: [PATCH 18/18] Use minimum from size pagination values --- .../detail/collection-public/collection-public.component.ts | 6 ++++-- ui/src/app/richskill/list/skills-list.component.ts | 5 +++-- .../app/table/filter-controls/filter-controls.component.ts | 5 ++++- .../size-pagination/size-pagination.component.ts | 2 -- 4 files changed, 11 insertions(+), 7 deletions(-) diff --git a/ui/src/app/collection/detail/collection-public/collection-public.component.ts b/ui/src/app/collection/detail/collection-public/collection-public.component.ts index eeb0ed69c..61c674dd1 100644 --- a/ui/src/app/collection/detail/collection-public/collection-public.component.ts +++ b/ui/src/app/collection/detail/collection-public/collection-public.component.ts @@ -1,4 +1,4 @@ -import {Component, OnInit} from "@angular/core" +import {Component, OnInit, ViewChild} from "@angular/core" import {ApiSearch, PaginatedSkills} from "../../../richskill/service/rich-skill-search.service" import {RichSkillService} from "../../../richskill/service/rich-skill.service" import {ActivatedRoute, Router} from "@angular/router" @@ -11,6 +11,7 @@ import {ApiCollection} from "../../ApiCollection" import {Title} from "@angular/platform-browser"; import {Whitelabelled} from "../../../../whitelabel"; import {FormControl} from "@angular/forms" +import {SizePaginationComponent} from "../../../table/skills-library-table/size-pagination/size-pagination.component" @Component({ selector: "app-collection-public", @@ -18,6 +19,7 @@ import {FormControl} from "@angular/forms" }) export class CollectionPublicComponent extends Whitelabelled implements OnInit { + @ViewChild(SizePaginationComponent) sizePagination!: SizePaginationComponent title = "Collection" uuidParam: string | null collection: ApiCollection | undefined @@ -128,7 +130,7 @@ export class CollectionPublicComponent extends Whitelabelled implements OnInit { } get isSizePaginationVisible(): () => boolean { - return () => this.totalCount > 50 + return () => this.totalCount > this.sizePagination?.values[0] } } diff --git a/ui/src/app/richskill/list/skills-list.component.ts b/ui/src/app/richskill/list/skills-list.component.ts index 4d5b1d661..1b36cf731 100644 --- a/ui/src/app/richskill/list/skills-list.component.ts +++ b/ui/src/app/richskill/list/skills-list.component.ts @@ -18,7 +18,7 @@ import {CollectionService} from "../../collection/service/collection.service" import {ApiCollection} from "../../collection/ApiCollection" import {CollectionPipe} from "../../pipes" import {FilterDropdown} from "../../models/filter-dropdown.model" -import {minimumThreshold} from "../../table/skills-library-table/size-pagination/size-pagination.component" +import {FilterControlsComponent} from "../../table/filter-controls/filter-controls.component" @Component({ selector: "app-skills-list", @@ -33,6 +33,7 @@ export class SkillsListComponent extends QuickLinksHelper { @ViewChild("titleHeading") titleElement!: ElementRef @ViewChild(TableActionBarComponent) tableActionBar!: TableActionBarComponent + @ViewChild(FilterControlsComponent) filterControlsComponent!: FilterControlsComponent resultsLoaded: Observable | undefined @@ -461,7 +462,7 @@ export class SkillsListComponent extends QuickLinksHelper { } get isSizePaginationVisible(): () => boolean { - return () => this.totalCount > minimumThreshold + return () => this.totalCount > this.filterControlsComponent?.sizePagination?.values[0] } } diff --git a/ui/src/app/table/filter-controls/filter-controls.component.ts b/ui/src/app/table/filter-controls/filter-controls.component.ts index d73f09ca9..a6f615425 100644 --- a/ui/src/app/table/filter-controls/filter-controls.component.ts +++ b/ui/src/app/table/filter-controls/filter-controls.component.ts @@ -1,7 +1,8 @@ -import {Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges} from "@angular/core" +import {Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, ViewChild} from "@angular/core" import {PublishStatus} from "../../PublishStatus"; import {FilterDropdown} from "../../models/filter-dropdown.model" import {FormBuilder, FormControl, FormGroup} from "@angular/forms" +import {SizePaginationComponent} from "../skills-library-table/size-pagination/size-pagination.component" @Component({ selector: "app-filter-controls", @@ -9,6 +10,8 @@ import {FormBuilder, FormControl, FormGroup} from "@angular/forms" styleUrls: ["./filter-controls.component.scss"] }) export class FilterControlsComponent implements OnInit, OnChanges { + + @ViewChild(SizePaginationComponent) sizePagination!: SizePaginationComponent @Input() selectedFilters: Set = new Set() @Output() keywordsChanged: EventEmitter = new EventEmitter() @Output() filtersChanged: EventEmitter> = new EventEmitter>() diff --git a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts index 481e9cc0e..3fd8a953f 100644 --- a/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts +++ b/ui/src/app/table/skills-library-table/size-pagination/size-pagination.component.ts @@ -1,8 +1,6 @@ import {Component, Input} from "@angular/core" import {FormControl} from "@angular/forms" -export const minimumThreshold = 50 - @Component({ selector: "app-size-pagination", templateUrl: "./size-pagination.component.html",