argos/dmp-frontend/src/app/ui/explore-dataset/explore-dataset-listing.component.html

<div class="explore-dataset">
	<h3 class="text-center">{{'DATASET-PUBLIC-LISTING.TITLE' | translate}} {{titlePrefix}}</h3>
	<div class="row">
		<div class="col-md-3">
			<app-explore-dataset-filters-component (facetCriteriaChange)="onCriteriaChange($event)"></app-explore-dataset-filters-component>
		</div>
		<div class="col-md-9">
			<div>
				<mat-card class="mat-card">
					<mat-table [dataSource]="dataSource" matSort (matSortChange)="refresh()">

						<!-- Column Definition: Name -->
						<ng-container cdkColumnDef="label">
							<mat-header-cell *matHeaderCellDef mat-sort-header="label">{{'DATASET-LISTING.COLUMNS.NAME' | translate}}</mat-header-cell>
							<mat-cell *matCellDef="let row">{{row.label}}</mat-cell>
						</ng-container>

						<!-- Column Definition: Dmp -->
						<ng-container cdkColumnDef="project">
							<mat-header-cell *matHeaderCellDef>{{'DATASET-LISTING.COLUMNS.PROJECT' |
								translate}}</mat-header-cell>
							<mat-cell *matCellDef="let row"> {{row.project}} </mat-cell>
						</ng-container>

						<!-- Column Definition: Profile -->
						<ng-container cdkColumnDef="profile">
							<mat-header-cell *matHeaderCellDef mat-sort-header="|join|profile:label">{{'DATASET-LISTING.COLUMNS.PROFILE'
								| translate}}</mat-header-cell>
							<mat-cell *matCellDef="let row"> {{row.profile}} </mat-cell>
						</ng-container>

						<!-- Column Definition: DataRepositories -->
						<!-- <ng-container cdkColumnDef="dataRepositories">
              <mat-header-cell *matHeaderCellDef>{{'DATASET-LISTING.COLUMNS.DATAREPOSITORIES' | translate}}</mat-header-cell>
              <mat-cell *matCellDef="let row"> {{row.dataRepositories}} </mat-cell>
            </ng-container> -->

						<!-- Column Definition: DataRepositories -->
						<!-- <ng-container cdkColumnDef="registries">
              <mat-header-cell *matHeaderCellDef>{{'DATASET-LISTING.COLUMNS.REGISTRIES' | translate}}</mat-header-cell>
              <mat-cell *matCellDef="let row"> {{row.registries}} </mat-cell>
            </ng-container> -->

						<!-- Column Definition: DataRepositories -->
						<!-- <ng-container cdkColumnDef="services">
              <mat-header-cell *matHeaderCellDef>{{'DATASET-LISTING.COLUMNS.SERVICES' | translate}}</mat-header-cell>
              <mat-cell *matCellDef="let row"> {{row.services}} </mat-cell>
            </ng-container> -->

						<!-- Column Definition: Status -->
						<!-- <ng-container cdkColumnDef="status">
              <mat-header-cell *matHeaderCellDef>{{'DATASET-LISTING.COLUMNS.STATUS' | translate}}</mat-header-cell>
              <mat-cell *matCellDef="let row"> {{row.status}}
              </mat-cell>
            </ng-container> -->

						<!-- Column Definition: Description -->
						<ng-container cdkColumnDef="description">
							<mat-header-cell *matHeaderCellDef>{{'DATASET-LISTING.COLUMNS.DESCRIPTION' | translate}}</mat-header-cell>
							<mat-cell *matCellDef="let row"> {{row.description}} </mat-cell>
						</ng-container>

						<!-- Column Definition: Created -->
						<ng-container cdkColumnDef="created">
							<mat-header-cell *matHeaderCellDef mat-sort-header="created">{{'DATASET-LISTING.COLUMNS.CREATED' |
								translate}}</mat-header-cell>
							<mat-cell *matCellDef="let row">{{row.created | date:'shortDate'}}</mat-cell>
						</ng-container>



						<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
						<mat-row *matRowDef="let row; columns: displayedColumns" (click)="rowClick(row.id)"></mat-row>
						<!-- (click)="rowClick(row.id)" -->

					</mat-table>
					<mat-paginator #paginator [length]="dataSource?.totalCount" [pageSizeOptions]="[10, 25, 100]">
					</mat-paginator>
				</mat-card>

			</div>

		</div>
	</div>
</div>