<!--
  ~ 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/>.
  -->

<ion-item>
  <!-- TODO: text not selectable in Chrome, bugfix needed https://github.com/ionic-team/ionic-framework/issues/24956 -->
  <ion-label class="ion-text-wrap"
    ><h2 *ngIf="item.about" class="name">{{ item.about }}</h2>
    <ng-container *ngFor="let property of propertiesToShow">
      <p *ngIf="item[property]">
        {{ 'library.account.pages' + '.' + listName + '.' + 'labels' + '.' + property | translate }}:
        <ng-container *ngIf="!['endtime', 'duedate'].includes(property); else date">
          {{ item[property] }}
        </ng-container>
        <ng-template #date> {{ item[property] | amDateFormat : 'll' }} </ng-template>
      </p>
    </ng-container>
    <span class="ion-float-right">
      <!--      TODO: Add "cancel button" when functionality ready for production-->
      <!--      <ion-button-->
      <!--        *ngIf="item.cancancel"-->
      <!--        color="primary"-->
      <!--        (click)="onClick('cancel')"-->
      <!--      >-->
      <!--        {{ 'library.account.actions.cancel.header' | translate }}</ion-button-->
      <!--      >-->
      <ion-button *ngIf="item.canrenew" color="primary" (click)="onClick('renew')">
        {{ 'library.account.actions.renew.header' | translate }}</ion-button
      >
    </span>
  </ion-label>
</ion-item>
