@if (categories?.length && (categories?.length || 0) >= 2) {
  <fieldset class="fieldset">
    <div>
      @for (category of categories; track category) {
        <button class="rdio-button" [ngClass]="category.status"
          (click)="toggle(category)">
          {{ category.label }}
        </button>
      }
      <button class="rdio-button-mini all-off" (click)="avoid({ all: false })">
        OFF
      </button>
      <button class="rdio-button-mini all-on" (click)="avoid({ all: true })">
        ON
      </button>
    </div>
  </fieldset>
}
@for (system of systems; track system) {
  @if (system.talkgroups.length) {
    <fieldset class="fieldset">
      <legend>
        {{ system.label }}
      </legend>
      <div>
        @for (talkgroup of system.talkgroups; track talkgroup) {
          <button class="rdio-button"
            [ngClass]="{ off: !(map[system.id] && map[system.id][talkgroup.id]).active, on: map[system.id] && map[system.id][talkgroup.id].active, blink: map[system.id][talkgroup.id].minutes }"
            (click)="avoid({ system: system, talkgroup: talkgroup })">
            {{ talkgroup.label }}
          </button>
        }
        @if (system.talkgroups.length > 1) {
          <button class="rdio-button-mini all-off" (click)="avoid({ system: system, status: false })">
            OFF
          </button>
          <button class="rdio-button-mini all-on" (click)="avoid({ system: system, status: true })">
            ON
          </button>
        }
      </div>
    </fieldset>
  }
}
@if (systems?.length === 0) {
  No talkgroup configured!
}