@for (interval of translatedIntervals; track interval.id) {
  <li
    [ngClass]="{
      active: interval.id === value
    }"
  >
    <button
      type="button"
      [attr.data-cy]="'interval-picker--' + interval.id"
      (click)="onChange(interval.id)"
    >
      <span
        [ngClass]="{
          'text-primary': interval.id === value
        }"
      >
        <span
          c8yIcon="check"
          [ngStyle]="{ visibility: interval.id === value ? 'visible' : 'hidden' }"
        ></span>
        {{ interval.title }}
      </span>
    </button>
  </li>
}