<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-back-button></ion-back-button>
    </ion-buttons>
    <ion-title>Developer Tools</ion-title>
    <ion-buttons slot="end">
      <badge-menu-button></badge-menu-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-item-divider>Projects</ion-item-divider>

  <ion-item button detail="false" (click)="openCreateProjectModal()">
    <ion-icon slot="start" name="add" color="dark"></ion-icon>
    <ion-label>
      <ion-text color="dark">Create project</ion-text>
    </ion-label>
  </ion-item>

  <ion-item
    button
    *ngFor="let entry of devData | keyvalue"
    (click)="goToProject(entry.key)"
  >
    <p>{{ entry.value.name }}</p>
    <ion-button
      slot="end"
      fill="clear"
      (click)="presentAction(entry.key, $event)"
    >
      <ion-icon name="ellipsis-horizontal-outline"></ion-icon>
    </ion-button>
  </ion-item>
</ion-content>
