<div class="main-content">
	<div class="container-fluid">
		<h3>{{titlePrefix}} {{'DATASET-PROFILE-LISTING.TITLE' | translate}}</h3>

		<app-dataset-profile-criteria-component></app-dataset-profile-criteria-component>
		<mat-card class="row 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-PROFILE-LISTING.COLUMNS.NAME' | translate}}</mat-header-cell>
					<mat-cell *matCellDef="let row">{{row.label}}</mat-cell>
				</ng-container>

				<!-- Column Definition: Description -->
				<ng-container cdkColumnDef="description">
					<mat-header-cell *matHeaderCellDef>{{'DATASET-PROFILE-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-PROFILE-LISTING.COLUMNS.CREATED' |
						translate}}</mat-header-cell>
					<mat-cell *matCellDef="let row">{{row.created | date:'shortDate'}}</mat-cell>
				</ng-container>

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

				<!-- Column Definition: Submission Time -->
				<ng-container cdkColumnDef="actions">
					<mat-header-cell *matHeaderCellDef>{{'DATASET-PROFILE-LISTING.COLUMNS.ACTIONS' | translate}}
					</mat-header-cell>
					<mat-cell *matCellDef="let row" (click)="$event.stopPropagation()">
						<mat-menu #actionsMenu="matMenu">
							<button mat-menu-item (click)="newVersion(row.id, row.label)">
								<mat-icon>queue</mat-icon>{{'DATASET-PROFILE-LISTING.ACTIONS.NEW-VERSION' | translate}}
							</button>
							<button mat-menu-item (click)="clone(row.id)">
								<mat-icon>filter_none</mat-icon>{{'DATASET-PROFILE-LISTING.ACTIONS.CLONE' | translate}}
							</button>
							<button mat-menu-item (click)="viewVersions(row.groupId, row.label)">
								<mat-icon>library_books</mat-icon>
								{{'DATASET-PROFILE-LISTING.ACTIONS.VIEW-VERSIONS' | translate}}
							</button>
							<!--<button *ngIf="row.status==1" mat-menu-item (click)="makeItPublic(row.id)"><mat-icon>people_outline</mat-icon>{{'DATASET-LISTING.ACTIONS.MAKE-IT-PUBLIC' | translate}}</button> -->
						</mat-menu>
						<button mat-icon-button [matMenuTriggerFor]="actionsMenu">
							<mat-icon>more_vert</mat-icon>
						</button>
					</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 class="row justify-content-end pr-2">
			<button mat-fab class="mat-fab-bottom-right" color="primary" [routerLink]="['./new']">
				<mat-icon class="mat-24">add</mat-icon>
			</button>
		</div>
	</div>
</div>
