<div class="container-fluid">
	<div class="row d-flex">
		<div class="col-12 pr-4 pl-4" *ngIf="!isPublic && !isFinalized">
			<div class="add-dataset">
				<button mat-raised-button color="primary" (click)="addDataset(dmp.id)"
					class="lightblue-btn ml-2 text-uppercase">
					<mat-icon>add</mat-icon> {{ 'DMP-LISTING.ACTIONS.ADD-DATASET' | translate }}
				</button>
			</div>
		</div>
	</div>
	<div class="row pt-2 pb-4 pl-3 pr-3" *ngIf="dmp.datasets">
		<div *ngFor="let dataset of dmp.datasets" class="col-md-3">
			<div class="dataset-card" (click)="datasetClicked(dataset.id)">
				<mat-icon *ngIf="isDraft(dataset)" class="draft-bookmark">bookmark</mat-icon>
				<mat-icon *ngIf="!isDraft(dataset)" class="finalized-bookmark">bookmark</mat-icon>
				<h4 *ngIf="isDraft(dataset)"><span>{{ 'TYPES.DATASET-STATUS.DRAFT' | translate }}:</span>
					{{ dataset.label }}</h4>
				<h4 *ngIf="!isDraft(dataset)">{{ dataset.label }}</h4>
				<div matTooltip="{{ dataset.profile }}" class="chip">
					{{ dataset.profile }}</div>
			</div>
		</div>
	</div>
</div>
<div *ngIf="dmp.datasets.length > 9" class="gray-container d-flex justify-content-center">
	<button mat-button (click)="datasetsClicked(dmp.id)" class="show-more">
		<mat-icon class="mr-2">expand_more</mat-icon>{{ 'GENERAL.ACTIONS.SHOW-MORE' | translate }}
	</button>
</div>
