<ul class="nsi-list">
  @for (labelSet of labelSets; track labelSet.id) {
    <li
      [class.selected]="rla.isActive"
      routerLinkActive
      #rla="routerLinkActive"
      [attr.data-cy]="'label-set-' + labelSet.id"
      [routerLink]="'./' + labelSet.id">
      <div
        class="label-set-item"
        paEllipsisTooltip>
        <span class="label-set-title">{{ labelSet.title }}</span>
        <span class="label-set-id">(id: {{ labelSet.id }})</span>
      </div>
      @if (isAdmin) {
        <div class="action-buttons-container">
          <pa-button
            icon="trash"
            aspect="basic"
            kind="destructive"
            size="small"
            (click)="delete(labelSet.id, labelSet, rla.isActive)">
            {{ 'label-set.delete.label' | translate }}
          </pa-button>
        </div>
      }
    </li>
  }
</ul>
