DataTable2Component

<vdr-data-table-2    id="product-review-list"    [items]="items$ | async"    [itemsPerPage]="itemsPerPage$ | async"    [totalItems]="totalItems$ | async"    [currentPage]="currentPage$ | async"    [filters]="filters"    (pageChange)="setPageNumber($event)"    (itemsPerPageChange)="setItemsPerPage($event)">    <vdr-bulk-action-menu        locationId="product-review-list"        [hostComponent]="this"        [selectionManager]="selectionManager"    />    <vdr-dt2-search        [searchTermControl]="searchTermControl"        searchTermPlaceholder="Filter by title"    />    <vdr-dt2-column [heading]="'common.id' | translate" [hiddenByDefault]="true">        <ng-template let-review="item">            {{ review.id }}        </ng-template>    </vdr-dt2-column>    <vdr-dt2-column        [heading]="'common.created-at' | translate"        [hiddenByDefault]="true"        [sort]="sorts.get('createdAt')"    >        <ng-template let-review="item">            {{ review.createdAt | localeDate : 'short' }}        </ng-template>    </vdr-dt2-column>    <vdr-dt2-column        [heading]="'common.updated-at' | translate"        [hiddenByDefault]="true"        [sort]="sorts.get('updatedAt')"    >        <ng-template let-review="item">            {{ review.updatedAt | localeDate : 'short' }}        </ng-template>    </vdr-dt2-column>    <vdr-dt2-column [heading]="'common.name' | translate" [optional]="false" [sort]="sorts.get('name')">        <ng-template let-review="item">            <a class="button-ghost" [routerLink]="['./', review.id]"                ><span>{{ review.name }}</span>                <clr-icon shape="arrow right"></clr-icon>            </a>        </ng-template>    </vdr-dt2-column></vdr-data-table-2>

class DataTable2Component<T> implements AfterContentInit, OnChanges, OnDestroy {    @Input() id: DataTableLocationId;    @Input() items: T[];    @Input() itemsPerPage: number;    @Input() currentPage: number;    @Input() totalItems: number;    @Input() emptyStateLabel: string;    @Input() filters: DataTableFilterCollection;    @Input() activeIndex = -1;    @Input() trackByPath = 'id';    @Output() pageChange = new EventEmitter<number>();    @Output() itemsPerPageChange = new EventEmitter<number>();    @Output() visibleColumnsChange = new EventEmitter<Array<DataTable2ColumnComponent<T>>>();    @ContentChildren(DataTable2ColumnComponent) columns: QueryList<DataTable2ColumnComponent<T>>;    @ContentChildren(DataTableCustomFieldColumnComponent)    customFieldColumns: QueryList<DataTableCustomFieldColumnComponent<T>>;    @ContentChild(DataTable2SearchComponent) searchComponent: DataTable2SearchComponent;    @ContentChild(BulkActionMenuComponent) bulkActionMenuComponent: BulkActionMenuComponent;    @ContentChild('vdrDt2CustomSearch') customSearchTemplate: TemplateRef<any>;    @ContentChildren(TemplateRef) templateRefs: QueryList<TemplateRef<any>>;    injector = inject(Injector);    route = inject(ActivatedRoute);    filterPresetService = inject(FilterPresetService);    dataTableCustomComponentService = inject(DataTableCustomComponentService);    dataTableConfigService = inject(DataTableConfigService);    protected customComponents = new Map<string, { config: DataTableComponentConfig; injector: Injector }>();    rowTemplate: TemplateRef<any>;    currentStart: number;    currentEnd: number;    disableSelect = false;    showSearchFilterRow = false;    protected uiLanguage$: Observable<LanguageCode>;    protected destroy$ = new Subject<void>();    constructor(changeDetectorRef: ChangeDetectorRef, dataService: DataService)    selectionManager: void    allColumns: void    visibleSortedColumns: void    sortedColumns: void    ngOnChanges(changes: SimpleChanges) => ;    ngOnDestroy() => ;    ngAfterContentInit() => void;    onColumnReorder(event: { column: DataTable2ColumnComponent<any>; newIndex: number }) => ;    onColumnsReset() => ;    toggleSearchFilterRow() => ;    trackByFn(index: number, item: any) => ;    onToggleAllClick() => ;    onRowClick(item: T, event: MouseEvent) => ;}