From bbd8c5a2712d4398421b231e6b3de5f501746d3c Mon Sep 17 00:00:00 2001 From: anandtiwary <52081890+anandtiwary@users.noreply.github.com> Date: Fri, 18 Mar 2022 16:02:22 -0700 Subject: [PATCH 1/5] refactor: filter and sheet modifications --- .../filtering/filter/filter-url.service.ts | 21 +++++++++++++++++++ .../components/src/overlay/overlay.service.ts | 6 ++++-- .../src/overlay/sheet/default-sheet-ref.ts | 8 +++++++ .../components/src/overlay/sheet/sheet.ts | 3 +++ .../components/src/select/select.component.ts | 14 ++++++++++--- 5 files changed, 47 insertions(+), 5 deletions(-) diff --git a/projects/components/src/filtering/filter/filter-url.service.ts b/projects/components/src/filtering/filter/filter-url.service.ts index aa6309aff..3e67f2499 100644 --- a/projects/components/src/filtering/filter/filter-url.service.ts +++ b/projects/components/src/filtering/filter/filter-url.service.ts @@ -23,6 +23,22 @@ export class FilterUrlService { private readonly filterParserLookupService: FilterParserLookupService ) {} + public getUrlFilteringStateChanges$(attributes: FilterAttribute[]): Observable { + return this.navigationService.navigation$.pipe( + map(() => ({ + filters: this.getUrlFilters(attributes), + groupBy: this.getUrlGroupBy() + })) + ); + } + + public setUrlFiltersAndGroupBy(filters: Filter[], groupBy: string[]): void { + this.navigationService.addQueryParametersToUrl({ + [FilterUrlService.FILTER_QUERY_PARAM]: filters.length === 0 ? undefined : filters.map(f => f.urlString), + [FilterUrlService.GROUP_BY_QUERY_PARAM]: isEmpty(groupBy) ? undefined : [groupBy!.toString()] + }); + } + public getUrlFiltersChanges$(attributes: FilterAttribute[]): Observable { return this.navigationService.navigation$.pipe(map(() => this.getUrlFilters(attributes))); } @@ -119,3 +135,8 @@ export class FilterUrlService { .find(splitFilter => splitFilter !== undefined); } } + +export interface UrlFilteringState { + filters: Filter[]; + groupBy: string[]; +} diff --git a/projects/components/src/overlay/overlay.service.ts b/projects/components/src/overlay/overlay.service.ts index d540e10fb..d0672590c 100644 --- a/projects/components/src/overlay/overlay.service.ts +++ b/projects/components/src/overlay/overlay.service.ts @@ -35,7 +35,10 @@ export class OverlayService { data: metadata }); - popover.closeOnNavigation(); + if (config.closeOnNavigation !== false) { + popover.closeOnNavigation(); + } + sheetRef.initialize(popover); this.setActiveSheetPopover(popover); @@ -71,7 +74,6 @@ export class OverlayService { this.activeSheetPopover?.close(); this.activeSheetPopover = popover; - this.activeSheetPopover.closeOnNavigation(); this.sheetCloseSubscription = this.activeSheetPopover.closed$.subscribe( () => (this.activeSheetPopover = undefined) ); diff --git a/projects/components/src/overlay/sheet/default-sheet-ref.ts b/projects/components/src/overlay/sheet/default-sheet-ref.ts index 3d7b4d64b..296dd3631 100644 --- a/projects/components/src/overlay/sheet/default-sheet-ref.ts +++ b/projects/components/src/overlay/sheet/default-sheet-ref.ts @@ -29,4 +29,12 @@ export class DefaultSheetRef extends SheetRef { } this.popoverRef?.close(); } + + public show(): void { + this.popoverRef?.show(); + } + + public hide(): void { + this.popoverRef?.hide(); + } } diff --git a/projects/components/src/overlay/sheet/sheet.ts b/projects/components/src/overlay/sheet/sheet.ts index b6cf343ba..ec5d1f94d 100644 --- a/projects/components/src/overlay/sheet/sheet.ts +++ b/projects/components/src/overlay/sheet/sheet.ts @@ -8,6 +8,7 @@ export interface SheetOverlayConfig extends OverlayConfig { data?: TData; position?: PopoverFixedPositionLocation.Right | PopoverFixedPositionLocation.RightUnderHeader; closeOnEscapeKey?: boolean; + closeOnNavigation?: boolean; attachedTriggerTemplate?: TemplateRef; } @@ -24,4 +25,6 @@ export const SHEET_DATA = new InjectionToken('SHEET_DATA'); export abstract class SheetRef { public abstract readonly closed$: Observable; public abstract close(result?: TResult): void; + public abstract show(): void; + public abstract hide(): void; } diff --git a/projects/components/src/select/select.component.ts b/projects/components/src/select/select.component.ts index dd41d9256..bdef4612b 100644 --- a/projects/components/src/select/select.component.ts +++ b/projects/components/src/select/select.component.ts @@ -137,7 +137,7 @@ import { SelectSize } from './select-size'; implements ControlValueAccessor, AfterContentIni @Input() public highlightSelected: boolean = true; + @Input() + public showClearSelected: boolean = false; + @Input() public searchMode: SelectSearchMode = SelectSearchMode.Disabled; @@ -318,12 +321,12 @@ export class SelectComponent implements ControlValueAccessor, AfterContentIni } this.setSelection(item.value); - this.selectedChange.emit(this.selected); - this.propagateValueChangeToFormControl(this.selected); + this.propagateValue(); } public onClearSelected(): void { this.setSelection(); + this.propagateValue(); } private setSelection(value?: V): void { @@ -368,6 +371,11 @@ export class SelectComponent implements ControlValueAccessor, AfterContentIni this.disabled = isDisabled ?? false; } + private propagateValue(): void { + this.selectedChange.emit(this.selected); + this.propagateValueChangeToFormControl(this.selected); + } + private propagateValueChangeToFormControl(value: V | undefined): void { this.propagateControlValueChange?.(value); this.propagateControlValueChangeOnTouch?.(value); From 7d954bff44b99fe837f835527fc11c3c5b46070d Mon Sep 17 00:00:00 2001 From: anandtiwary <52081890+anandtiwary@users.noreply.github.com> Date: Mon, 21 Mar 2022 12:20:20 -0700 Subject: [PATCH 2/5] refactor: fix lint and test errors --- projects/components/src/filtering/filter/filter-url.service.ts | 2 +- projects/components/src/select/select.component.test.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/projects/components/src/filtering/filter/filter-url.service.ts b/projects/components/src/filtering/filter/filter-url.service.ts index 3e67f2499..c949bbdab 100644 --- a/projects/components/src/filtering/filter/filter-url.service.ts +++ b/projects/components/src/filtering/filter/filter-url.service.ts @@ -35,7 +35,7 @@ export class FilterUrlService { public setUrlFiltersAndGroupBy(filters: Filter[], groupBy: string[]): void { this.navigationService.addQueryParametersToUrl({ [FilterUrlService.FILTER_QUERY_PARAM]: filters.length === 0 ? undefined : filters.map(f => f.urlString), - [FilterUrlService.GROUP_BY_QUERY_PARAM]: isEmpty(groupBy) ? undefined : [groupBy!.toString()] + [FilterUrlService.GROUP_BY_QUERY_PARAM]: isEmpty(groupBy) ? undefined : [groupBy.toString()] }); } diff --git a/projects/components/src/select/select.component.test.ts b/projects/components/src/select/select.component.test.ts index 3213d7986..e962a3f5b 100644 --- a/projects/components/src/select/select.component.test.ts +++ b/projects/components/src/select/select.component.test.ts @@ -346,7 +346,7 @@ describe('Select Component', () => { test('should show clear selected button', fakeAsync(() => { spectator = hostFactory( ` - + `, From 4156f6b342fd6e7d24389517ccf50d5e6ed28fde Mon Sep 17 00:00:00 2001 From: anandtiwary <52081890+anandtiwary@users.noreply.github.com> Date: Mon, 21 Mar 2022 12:22:56 -0700 Subject: [PATCH 3/5] refactor: remove duplicate input --- projects/components/src/select/select.component.ts | 3 --- 1 file changed, 3 deletions(-) diff --git a/projects/components/src/select/select.component.ts b/projects/components/src/select/select.component.ts index cbbdd6dcf..3fff380d6 100644 --- a/projects/components/src/select/select.component.ts +++ b/projects/components/src/select/select.component.ts @@ -233,9 +233,6 @@ export class SelectComponent implements ControlValueAccessor, AfterContentIni @Input() public highlightSelected: boolean = true; - @Input() - public showClearSelected: boolean = false; - @Input() public searchMode: SelectSearchMode = SelectSearchMode.Disabled; From 10030a3fdb95836e8013222d27ad8c9507aa3b6e Mon Sep 17 00:00:00 2001 From: anandtiwary <52081890+anandtiwary@users.noreply.github.com> Date: Mon, 21 Mar 2022 16:55:34 -0700 Subject: [PATCH 4/5] refactor: updating method --- .../filtering/filter/filter-url.service.ts | 24 ++++++++++++------- 1 file changed, 15 insertions(+), 9 deletions(-) diff --git a/projects/components/src/filtering/filter/filter-url.service.ts b/projects/components/src/filtering/filter/filter-url.service.ts index c949bbdab..7e1d2209d 100644 --- a/projects/components/src/filtering/filter/filter-url.service.ts +++ b/projects/components/src/filtering/filter/filter-url.service.ts @@ -24,18 +24,24 @@ export class FilterUrlService { ) {} public getUrlFilteringStateChanges$(attributes: FilterAttribute[]): Observable { - return this.navigationService.navigation$.pipe( - map(() => ({ - filters: this.getUrlFilters(attributes), - groupBy: this.getUrlGroupBy() - })) - ); + return this.navigationService.navigation$.pipe(map(() => this.getUrlFilteringState(attributes))); } - public setUrlFiltersAndGroupBy(filters: Filter[], groupBy: string[]): void { + public getUrlFilteringState(attributes: FilterAttribute[]): UrlFilteringState { + const attributeMap = new Map(attributes.map(attribute => [attribute.name, attribute])); + + return { + filters: this.getUrlFilters(attributes), + groupBy: this.getUrlGroupBy() + .map(attributeName => attributeMap.get(attributeName)) + .filter((attribute): attribute is FilterAttribute => attribute !== undefined) + }; + } + + public setUrlFiltersAndGroupBy(filters: Filter[], groupBy: FilterAttribute[]): void { this.navigationService.addQueryParametersToUrl({ [FilterUrlService.FILTER_QUERY_PARAM]: filters.length === 0 ? undefined : filters.map(f => f.urlString), - [FilterUrlService.GROUP_BY_QUERY_PARAM]: isEmpty(groupBy) ? undefined : [groupBy.toString()] + [FilterUrlService.GROUP_BY_QUERY_PARAM]: isEmpty(groupBy) ? undefined : [groupBy!.map(g => g.name).toString()] }); } @@ -138,5 +144,5 @@ export class FilterUrlService { export interface UrlFilteringState { filters: Filter[]; - groupBy: string[]; + groupBy: FilterAttribute[]; } From 23fdae5559aeb275e7bb486dde0fe9cd7a477377 Mon Sep 17 00:00:00 2001 From: anandtiwary <52081890+anandtiwary@users.noreply.github.com> Date: Tue, 22 Mar 2022 13:31:18 -0700 Subject: [PATCH 5/5] refactor: fix lint error --- projects/components/src/filtering/filter/filter-url.service.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/components/src/filtering/filter/filter-url.service.ts b/projects/components/src/filtering/filter/filter-url.service.ts index 7e1d2209d..465480e89 100644 --- a/projects/components/src/filtering/filter/filter-url.service.ts +++ b/projects/components/src/filtering/filter/filter-url.service.ts @@ -41,7 +41,7 @@ export class FilterUrlService { public setUrlFiltersAndGroupBy(filters: Filter[], groupBy: FilterAttribute[]): void { this.navigationService.addQueryParametersToUrl({ [FilterUrlService.FILTER_QUERY_PARAM]: filters.length === 0 ? undefined : filters.map(f => f.urlString), - [FilterUrlService.GROUP_BY_QUERY_PARAM]: isEmpty(groupBy) ? undefined : [groupBy!.map(g => g.name).toString()] + [FilterUrlService.GROUP_BY_QUERY_PARAM]: isEmpty(groupBy) ? undefined : [groupBy.map(g => g.name).toString()] }); }