From 42b32d0a933f5bfe633e17a1ae119b824a378b8b Mon Sep 17 00:00:00 2001 From: Denis Severin Date: Tue, 6 Sep 2022 09:07:29 +0300 Subject: [PATCH 1/2] fix(platform): update items on new event --- ...m-display-list-item-example.component.html | 2 +- .../platform-list-example.component.html | 2 +- ...t-with-group-header-example.component.html | 8 ++-- ...-standard-list-item-example.component.html | 4 +- ...m-with-group-header-example.component.html | 4 +- .../multi-input/multi-input.component.html | 2 +- .../platform/src/lib/list/list.component.html | 2 +- libs/platform/src/lib/list/list.component.ts | 46 +++++++++++-------- libs/platform/src/lib/list/list.module.ts | 26 ++++++++--- .../src/lib/shared/domain/data-source.ts | 6 +-- 10 files changed, 60 insertions(+), 42 deletions(-) diff --git a/apps/docs/src/app/platform/component-docs/platform-display-list-item/platform-display-list-item-examples/platform-display-list-item-example.component.html b/apps/docs/src/app/platform/component-docs/platform-display-list-item/platform-display-list-item-examples/platform-display-list-item-example.component.html index 96ca62dd250..0295ff3ba82 100644 --- a/apps/docs/src/app/platform/component-docs/platform-display-list-item/platform-display-list-item-examples/platform-display-list-item-example.component.html +++ b/apps/docs/src/app/platform/component-docs/platform-display-list-item/platform-display-list-item-examples/platform-display-list-item-example.component.html @@ -1,5 +1,5 @@ - + List footer diff --git a/apps/docs/src/app/platform/component-docs/platform-list/platform-list-examples/platform-list-example.component.html b/apps/docs/src/app/platform/component-docs/platform-list/platform-list-examples/platform-list-example.component.html index 94ae17300cc..c0c9bbbc945 100644 --- a/apps/docs/src/app/platform/component-docs/platform-list/platform-list-examples/platform-list-example.component.html +++ b/apps/docs/src/app/platform/component-docs/platform-list/platform-list-examples/platform-list-example.component.html @@ -1,5 +1,5 @@ - + List footer diff --git a/apps/docs/src/app/platform/component-docs/platform-list/platform-list-examples/platform-list-with-group-header-example.component.html b/apps/docs/src/app/platform/component-docs/platform-list/platform-list-examples/platform-list-with-group-header-example.component.html index d2244378598..90b7450a8f1 100644 --- a/apps/docs/src/app/platform/component-docs/platform-list/platform-list-examples/platform-list-with-group-header-example.component.html +++ b/apps/docs/src/app/platform/component-docs/platform-list/platform-list-examples/platform-list-with-group-header-example.component.html @@ -1,10 +1,10 @@
Cozy
- + - + @@ -14,11 +14,11 @@
Cozy
Compact
- + - + diff --git a/apps/docs/src/app/platform/component-docs/platform-standard-list-item/platform-standard-list-item-examples/platform-standard-list-item-example.component.html b/apps/docs/src/app/platform/component-docs/platform-standard-list-item/platform-standard-list-item-examples/platform-standard-list-item-example.component.html index 832694bffce..ccb1071448a 100644 --- a/apps/docs/src/app/platform/component-docs/platform-standard-list-item/platform-standard-list-item-examples/platform-standard-list-item-example.component.html +++ b/apps/docs/src/app/platform/component-docs/platform-standard-list-item/platform-standard-list-item-examples/platform-standard-list-item-example.component.html @@ -1,6 +1,6 @@

Cozy Mode

- + Cozy Mode

Compact Mode

- + Declarative Approach - + Declarative Approach description="Third text item in Byline (Standard text item)" > - + - + diff --git a/libs/platform/src/lib/list/list.component.html b/libs/platform/src/lib/list/list.component.html index 8795805f7c8..80f26bedfae 100644 --- a/libs/platform/src/lib/list/list.component.html +++ b/libs/platform/src/lib/list/list.component.html @@ -45,7 +45,7 @@ *ngIf="loadMore && !loadOnScroll" (click)="_getMoreData()" fd-list-item - (keydown)="_loadOnkeyPress($event)" + (keydown)="_loadOnKeyPress($event)" class="fd-list__item fd-list__item--growing fd-list__item--action" [tabindex]="0" role="button" diff --git a/libs/platform/src/lib/list/list.component.ts b/libs/platform/src/lib/list/list.component.ts index 6741ccec734..f1d3b0bc7e1 100644 --- a/libs/platform/src/lib/list/list.component.ts +++ b/libs/platform/src/lib/list/list.component.ts @@ -383,16 +383,10 @@ export class ListComponent extends CollectionBaseInput implements OnInit, Aft /** * @hidden - * Instailization of list with selection mode + * Initialization of the lis component with selection mode */ ngOnInit(): void { - if (this._dsItems.length !== null && this.itemSize !== 0) { - this._startIndex = 0; - this._lastIndex = this.itemSize; - this._items = this._dsItems.slice(this._startIndex, this._lastIndex); - } else { - this._items = this._dsItems; - } + this._setItems(); this.stateChanges.next(this._items); this.id = `fdp-list-${nextListId++}`; @@ -487,7 +481,7 @@ export class ListComponent extends CollectionBaseInput implements OnInit, Aft * @hidden * load more on enter or space press */ - _loadOnkeyPress(event: KeyboardEvent): void { + _loadOnKeyPress(event: KeyboardEvent): void { if (KeyUtil.isKeyCode(event, [ENTER, SPACE])) { this._getMoreData(); } @@ -503,7 +497,7 @@ export class ListComponent extends CollectionBaseInput implements OnInit, Aft this._loading = true; of(this._loadNewItems()) .pipe( - tap((data) => { + tap(async (data) => { if (isBlank(data)) { console.error('===Invalid Response recived==='); } @@ -511,7 +505,7 @@ export class ListComponent extends CollectionBaseInput implements OnInit, Aft this._language, 'platformList.loadingAriaLabel' ); - this._liveAnnouncer.announce(this.loadingLabel, 'assertive'); + await this._liveAnnouncer.announce(this.loadingLabel, 'assertive'); }), delay(this.delayTime), takeUntil(this._destroyed) @@ -588,6 +582,19 @@ export class ListComponent extends CollectionBaseInput implements OnInit, Aft this.stateChanges.next(item); } + /** @hidden */ + private _setItems(): void { + if (this._dsItems.length !== null && this.itemSize !== 0) { + this._startIndex = 0; + this._lastIndex = this.itemSize; + this._items = this._dsItems.slice(this._startIndex, this._lastIndex); + } else { + this._items = this._dsItems; + } + + this.stateChanges.next(this._items); + } + /** @hidden */ private _initializeDS(ds: FdpListDataSource): void { this._dsItems = []; @@ -638,6 +645,7 @@ export class ListComponent extends CollectionBaseInput implements OnInit, Aft .subscribe((data) => { this._dsItems = data || []; this.stateChanges.next(this._dsItems); + this._setItems(); this._cd.markForCheck(); }); @@ -814,30 +822,28 @@ export class ListComponent extends CollectionBaseInput implements OnInit, Aft @Component({ selector: 'fdp-list-footer', - template: `
  • + template: `
    • ` }) -// eslint-disable-next-line @angular-eslint/component-class-suffix -export class ListFooter extends BaseComponent {} +export class ListFooterComponent extends BaseComponent {} @Component({ selector: 'fdp-list-group-header', template: `
  • - {{ grpheaderTitle }} + {{ groupHeaderTitle }}
    • `, - providers: [{ provide: BaseListItem, useExisting: forwardRef(() => ListGroupHeader) }] + providers: [{ provide: BaseListItem, useExisting: forwardRef(() => ListGroupHeaderComponent) }] }) -// eslint-disable-next-line @angular-eslint/component-class-suffix -export class ListGroupHeader extends BaseListItem implements OnInit { +export class ListGroupHeaderComponent extends BaseListItem implements OnInit { /** Displays list goup header title */ @Input() - grpheaderTitle?: string; + groupHeaderTitle?: string; /** * @hidden - * Instailization of list header + * Initialization of the list header component */ ngOnInit(): void { this.id = `fdp-list-${nextListGrpHeaderId++}`; diff --git a/libs/platform/src/lib/list/list.module.ts b/libs/platform/src/lib/list/list.module.ts index a641ae19665..2655dfb1804 100644 --- a/libs/platform/src/lib/list/list.module.ts +++ b/libs/platform/src/lib/list/list.module.ts @@ -10,12 +10,16 @@ import { BusyIndicatorModule } from '@fundamental-ngx/core/busy-indicator'; import { InfiniteScrollModule } from '@fundamental-ngx/core/infinite-scroll'; import { ContentDensityModule } from '@fundamental-ngx/core/content-density'; import { PlatformContentDensityDeprecationsModule } from '@fundamental-ngx/platform/shared'; -import { ListComponent, ListFooter, ListGroupHeader } from './list.component'; -import { ListItemDef } from './base-list-item'; import { I18nModule } from '@fundamental-ngx/i18n'; +import { ActionListItemModule } from './action-list-item/action-list-item.module'; +import { DisplayListItemModule } from './display-list-item/display-list-item.module'; +import { ListComponent, ListFooterComponent, ListGroupHeaderComponent } from './list.component'; +import { ListItemDef } from './base-list-item'; +import { ObjectListItemModule } from './object-list-item/object-list-item.module'; +import { StandardListItemModule } from './standard-list-item/standard-list-item.module'; @NgModule({ - declarations: [ListComponent, ListFooter, ListGroupHeader, ListItemDef], + declarations: [ListComponent, ListFooterComponent, ListGroupHeaderComponent, ListItemDef], imports: [ CommonModule, FormsModule, @@ -27,15 +31,23 @@ import { I18nModule } from '@fundamental-ngx/i18n'; BusyIndicatorModule, InfiniteScrollModule, PlatformContentDensityDeprecationsModule, - ContentDensityModule + ContentDensityModule, + StandardListItemModule, + ObjectListItemModule, + DisplayListItemModule, + ActionListItemModule ], exports: [ ListComponent, - ListFooter, - ListGroupHeader, + ListFooterComponent, + ListGroupHeaderComponent, ListItemDef, PlatformContentDensityDeprecationsModule, - ContentDensityModule + ContentDensityModule, + StandardListItemModule, + ObjectListItemModule, + DisplayListItemModule, + ActionListItemModule ] }) export class PlatformListModule {} diff --git a/libs/platform/src/lib/shared/domain/data-source.ts b/libs/platform/src/lib/shared/domain/data-source.ts index 0b6360fa07f..beea9ede0ea 100644 --- a/libs/platform/src/lib/shared/domain/data-source.ts +++ b/libs/platform/src/lib/shared/domain/data-source.ts @@ -113,7 +113,7 @@ export abstract class DataProvider { protected _matchingStrategy: MatchingStrategy = MatchingStrategy.STARTS_WITH; protected _matchingBy: MatchingBy | null = null; - abstract fetch(params: ProviderParams): Observable; + abstract fetch(params: ProviderParams, start?: number, end?: number): Observable; /** * Tells if this DataProvider supports INSERT, REMOVE @@ -173,7 +173,7 @@ export class ComboBoxDataSource implements DataSource { constructor(public dataProvider: DataProvider) {} - match(predicate: string | Map = new Map()): void { + match(predicate: string | Map = new Map(), start = 0, end = Infinity): void { this._onDataRequested$.next(); this._dataLoading = true; const searchParam = new Map(); @@ -191,7 +191,7 @@ export class ComboBoxDataSource implements DataSource { } this.dataProvider - .fetch(searchParam) + .fetch(searchParam, start, end) .pipe(takeUntil(this._onDestroy$)) .subscribe( (result: T[]) => { From 65aece0622d8e5991d3b884fb64aaea731831c45 Mon Sep 17 00:00:00 2001 From: Denis Severin Date: Fri, 9 Sep 2022 16:47:22 +0300 Subject: [PATCH 2/2] fix(platform): pr comments --- libs/platform/src/lib/list/list.component.ts | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/libs/platform/src/lib/list/list.component.ts b/libs/platform/src/lib/list/list.component.ts index f1d3b0bc7e1..0116b3c9ae8 100644 --- a/libs/platform/src/lib/list/list.component.ts +++ b/libs/platform/src/lib/list/list.component.ts @@ -841,6 +841,12 @@ export class ListGroupHeaderComponent extends BaseListItem implements OnInit { @Input() groupHeaderTitle?: string; + /** @deprecated Use `groupHeaderTitle` instead */ + @Input() + set grpheaderTitle(value: string) { + this.groupHeaderTitle = value; + } + /** * @hidden * Initialization of the list header component