Files
clearml-web/src/app/webapp-common/datasets/simple-datasets/simple-datasets.component.html
2023-05-23 15:48:02 +03:00

58 lines
2.7 KiB
HTML

<div class="sm-card-list-layout projects"
[class.in-empty-state]="!(((projectsList$ | async)?.length !== 0 && (!allExamples || (showExamples$ | async)))|| searching)">
<sm-projects-header
(orderByChanged)="orderByChanged($event)"
[sortByField]="projectsOrderBy$ | async"
[sortOrder]="projectsSortOrder$ | async"
[enableTagsFilter]="true"
[tags]="projectsTags$ | async"
>
<sm-button-toggle
left-items
class="ms-3"
[value]="!!projectId"
[options]="[
{value: false, icon: 'al-ico-flat-view', label: 'List view'},
{value: true, icon:'al-ico-project-path', label: 'Project view'}
]"
(valueChanged)="!(!!projectId && $event) && toggleNestedView($event)"
></sm-button-toggle>
<button
class="btn btn-cml-primary d-flex align-items-center"
(click)="createDataset()">
<i class="al-icon al-ico-add sm me-2" data-id="NewDatasetButton"></i>NEW DATASET
</button>
</sm-projects-header>
<ng-container
*ngIf="((projectsList$ | async)?.length !== 0 && (!allExamples || (showExamples$ | async)))|| searching; else emptyState">
<sm-simple-dataset-card *ngFor="let project of projectsList$ | async; trackBy: trackById ;let last=last"
[hideMenu]="['All Experiments'].includes(project.name) || project['isRoot'] || isExample(project)"
[hideProjectPathIcon]="!!projectId"
[project]="project"
[allTags]="projectsTags$ | async"
(projectCardClicked)="projectCardClicked($event)"
(projectNameChanged)="projectNameChanged({id: project.id, name: $event})"
(addTag)="addTag(project, $event)"
(removeTag)="removeTag(project, $event)"
(delete)="deleteProject(project)"
></sm-simple-dataset-card>
</ng-container>
<div class="load-more" *ngIf="(noMoreProjects$ | async) === false && (projectsList$ | async)?.length > 0">
<button (click)="loadMore()" class="btn btn-cml-primary load-more-btn">LOAD MORE</button>
</div>
</div>
<ng-template #emptyState>
<div class="empty-datasets">
<div class="title-icon"><i class="al-icon al-ico-datasets xxl"></i></div>
<div class="title">NO DATASETS TO SHOW</div>
<div class="sub-title">Run your first dataset to see it displayed here
<ng-container *ngIf="allExamples"> or <a href="" (click)="$event.preventDefault(); createExamples()" class="link">generate
example
</a></ng-container>
</div>
<sm-dataset-empty [showButton]="true"></sm-dataset-empty>
</div>
</ng-template>