<div class="card card-draft">
	<div class="card-header card-header-plain">
		<div class="card-desc">
			<h4 class="card-title">{{ 'TYPES.DATASET-STATUS.DRAFT' | translate }}</h4>
			<p class="card-category">{{ 'TYPES.DATASET-STATUS.DRAFT-DESC' | translate }}</p>
		</div>
		<a class="view-all" [class.clickable]="isAuthenticated()" [routerLink]="['/datasets']" [queryParams]="{status: 0}">{{ 'GENERAL.ACTIONS.VIEW-ALL' | translate}}</a>
	</div>
	<div class="card-body table-responsive">
		<table class="table table-hover">
			<tbody *ngIf="datasetDrafts != null">
				<tr *ngFor="let dataset of datasetDrafts" (click)="redirect(dataset.id, datasetDraftsTypeEnum.Dataset)" style="cursor: pointer;">
					<td>
						<div class="row">
							<div class="col-md-2">
								<i class="material-icons-outlined grey">library_books</i>
							</div>
							<div class="col-md-10">
								<!-- <div class="drafts-more-btn">
									<i class="material-icons more-icon">more_horiz</i>
								</div> -->
								<div class="draft-title">
									{{'GENERAL.NAMES.DATASET' | translate}}: {{ dataset.label }} {{'DRAFTS.FOR-DMP' | translate}} {{ dataset.dmp }} {{'DRAFTS.FOR-GRANT' | translate}} {{ dataset.grant }}
								</div>
								<div class="draft-subtitle">{{ dataset.created | date: "shortDate"}}</div>
								<div class="draft-desc">{{ dataset.description }}</div>
								<div matTooltip="{{ dataset.profile }}" class="grant-pill">{{ dataset.profile }}</div>
							</div>
						</div>
					</td>
				</tr>
			</tbody>
			<tbody *ngIf="datasetDrafts == null">
				<td></td>
			</tbody>
		</table>
	</div>
</div>
