<div class="main-container">
  @if (isReady | async) {
    <div class="scrollable-area classification-container">
      @if ((hasLabels | async) === false) {
        <p>
          {{ 'resource.classification.no-resource-labelset' | translate }}
          <a [routerLink]="(kbUrl | async) + '/label-sets'">{{ 'resource.classification-page-link' | translate }}</a>
        </p>
      }
      @if (((currentLabels | async) || []).length > 0) {
        <div class="labels-container">
          <app-label-list
            [labelSets]="resourceLabelSets | async"
            [labelSelection]="(currentLabels | async) || []"
            (labelSelectionChange)="updateLabels($event)"></app-label-list>
        </div>
      }

      @if ((isAdminOrContrib | async) === true) {
        <nsi-labels-expander
          [labelSets]="resourceLabelSets | async"
          [currentSelection]="currentSelection"
          (updateSelection)="updateLabel($event)"></nsi-labels-expander>
      }
    </div>
  }
</div>

@if (hasLabels | async) {
  <footer class="form-buttons">
    <pa-button
      kind="primary"
      [disabled]="!isModified"
      (click)="save()">
      {{ 'generic.save' | translate }}
    </pa-button>

    <pa-button
      aspect="basic"
      [disabled]="!isModified"
      (click)="cancel()">
      {{ 'generic.cancel' | translate }}
    </pa-button>
  </footer>
}
