<h2 mat-dialog-title translate>
  Choose a drive folder within the Nano client: <span>{{ createDriveDialogData.nanoSlot.detail.name }}</span>
</h2>
<h3 id="path-subheader" mat-subheader>{{ path.length === 0 ? '(root)' : path.join('') }}</h3>
<mat-dialog-content class="mat-typography">
  <mat-list [disabled]="isLoading">
    <mat-list-item matRipple (click)="stepBack()" [disabled]="path.length === 0">
      <mat-icon matListItemIcon>keyboard_return</mat-icon>
      <div matListItemLine id="return">[..]</div>
    </mat-list-item>
    <mat-list-item matRipple *ngFor="let folder of folders" (click)="listFolders(folder.name)">
      <mat-icon *ngIf="!folder.unresolved" matListItemIcon>folder</mat-icon>
      <div *ngIf="!folder.unresolved" matListItemLine>{{ folder.name }}</div>
      <mat-icon *ngIf="folder.unresolved" matListItemIcon class="data-error">tab_unselected</mat-icon>
      <div *ngIf="folder.unresolved" matListItemLine>
        <span class="data-error">{{ folder.name }} <span translate>(unresolved)</span></span>
      </div>
    </mat-list-item>
  </mat-list>
</mat-dialog-content>
<mat-dialog-actions align="end">
  <button mat-button mat-dialog-close><span translate>Cancel</span></button>
  <button mat-button [disabled]="path.length === 0" (click)="newFolderDialog()"><span translate>New folder</span></button>
  <button color="primary" mat-raised-button (click)="chooseCurrentPath()" [disabled]="path.length === 0"><span translate>Choose current folder</span></button>
</mat-dialog-actions>
