<!--
~ Copyright (C) 2023 StApps
~ This program is free software: you can redistribute it and/or modify it
~ under the terms of the GNU General Public License as published by the Free
~ Software Foundation, version 3.
~
~ This program is distributed in the hope that it will be useful, but WITHOUT
~ ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
~ FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for
~ more details.
~
~ You should have received a copy of the GNU General Public License along with
~ this program. If not, see <https://www.gnu.org/licenses/>.
-->

@if (canBeRated | async) {
  <ion-button
    fill="clear"
    (click)="$event.stopPropagation(); performRating.next(true)"
    [disabled]="wasAlreadyRated | async"
  >
    <ion-icon slot="icon-only" color="medium" name="thumbs_up_down"></ion-icon>
  </ion-button>
}
@if ((performRating | async) && (wasAlreadyRated | async) !== true) {
  <div class="rating-stars" [@rating]="(userRating | async) === undefined ? 'abandoned' : 'rated'">
    @for (i of [5, 4, 3, 2, 1]; track i) {
      <ion-icon
        [class.rated-value]="(userRating | async) === i"
        (click)="$event.stopPropagation(); userRating.next(i)"
        slot="icon-only"
        [size]="32"
        color="medium"
        name="star"
      ></ion-icon>
    }
    <label class="thank-you">{{ 'ratings.thank_you' | translate }}</label>
  </div>
}
