feat: library account adjustments

Closes #214

frontend/app/src/app/modules/library/account/elements/paia-item/paiaitem.component.ts

@@ -14,7 +14,7 @@
  */
 
 import {Component, EventEmitter, Input, Output} from '@angular/core';
-import {DocumentAction, PAIADocument, PAIADocumentStatus} from '../../../types';
+import {DocumentAction, PAIADocument, PAIADocumentStatus, PAIADocumentVisualStatus} from '../../../types';
 import {LibraryAccountService} from '../../library-account.service';
 
 @Component({
@@ -27,12 +27,15 @@ export class PAIAItemComponent {
 
   renewable: boolean;
 
+  visualStatus?: PAIADocumentVisualStatus;
+
   constructor(private readonly libraryAccountService: LibraryAccountService) {}
 
   @Input()
   set item(value: PAIADocument) {
     this._item = value;
     void this.setRenewable();
+    this.visualStatus = this.getVisualStatus(Number(this.item.status));
   }
 
   get item(): PAIADocument {
@@ -56,4 +59,18 @@ export class PAIAItemComponent {
     const isActive = await this.libraryAccountService.isActivePatron();
     this.renewable = isActive && Number(this.item.status) === PAIADocumentStatus.Held;
   }
+
+  private getVisualStatus(status: PAIADocumentStatus): PAIADocumentVisualStatus | undefined {
+    switch (status) {
+      case PAIADocumentStatus.Ordered: {
+        return {color: 'warning', status: status, statusText: 'ordered'};
+      }
+      case PAIADocumentStatus.Provided: {
+        return {color: 'success', status: status, statusText: 'ready'};
+      }
+      default: {
+        return undefined;
+      }
+    }
+  }
 }

frontend/app/src/app/modules/library/account/elements/paia-item/paiaitem.html

@@ -14,10 +14,16 @@
 -->
 
 <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">
     @if (item.about) {
-      <h2 class="name">{{ item.about }}</h2>
+      <h2 class="name">
+        @if (visualStatus) {
+          <ion-badge [color]="visualStatus.color" slot="start">
+            {{ 'library.account.pages' + '.' + listName + '.' + visualStatus.statusText | translate }}
+          </ion-badge>
+        }
+        {{ item.about }}
+      </h2>
     }
     @for (property of propertiesToShow; track property) {
       @if (item[property]) {

frontend/app/src/app/modules/library/account/elements/paia-item/paiaitem.scss

@@ -12,3 +12,6 @@
  * 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-badge {
+  vertical-align: bottom;
+}

frontend/app/src/app/modules/library/account/holds/holds-page.html

@@ -35,23 +35,13 @@
       @switch (activeSegment) {
         @case ('orders') {
           @for (hold of paiaDocuments; track hold) {
-            @if (toNumber(hold.status) === paiaDocumentStatus.Provided) {
+            <stapps-paia-item
-              <stapps-paia-item
+              [item]="hold"
-                [item]="hold"
+              [propertiesToShow]="['label', 'storage']"
-                [propertiesToShow]="['label', 'storage']"
+              (documentAction)="onDocumentAction($event)"
-                (documentAction)="onDocumentAction($event)"
+              listName="holds"
-                listName="holds"
+            >
-              >
+            </stapps-paia-item>
-              </stapps-paia-item>
-            } @else {
-              <stapps-paia-item
-                [item]="hold"
-                [propertiesToShow]="['label']"
-                (documentAction)="onDocumentAction($event)"
-                listName="holds"
-              >
-              </stapps-paia-item>
-            }
           }
         }
         @case ('reservations') {

frontend/app/src/app/modules/library/types.ts

@@ -88,3 +88,9 @@ export interface DocumentAction {
   action: 'cancel' | 'renew';
   doc: PAIADocument;
 }
+
+export interface PAIADocumentVisualStatus {
+  color: 'warning' | 'success';
+  status: PAIADocumentStatus;
+  statusText: 'ordered' | 'ready';
+}

frontend/app/src/assets/i18n/de.json

@@ -336,13 +336,15 @@
             "title": "Titel",
             "about": "Mehr Informationen",
             "label": "Signatur",
-            "starttime": "Übermittelt am",
+            "starttime": "Vorgemerkt am",
             "endtime": "Abzuholen bis",
             "storage": "Abholtheke",
             "queue": "Position in der Warteschlange"
           },
           "holds": "Bestellungen",
-          "reservations": "Vormerkungen"
+          "reservations": "Vormerkungen",
+          "ordered": "Bestellt",
+          "ready": "Abholbereit"
         },
         "checked_out": {
           "title": "Deine Ausleihen",

frontend/app/src/assets/i18n/en.json

@@ -336,13 +336,15 @@
             "title": "Title",
             "about": "More information",
             "label": "Shelfmark",
-            "starttime": "Submitted at",
+            "starttime": "Reserved on",
             "endtime": "Available for pickup until",
-            "storage": "Pick-up counter",
+            "storage": "Pickup counter",
             "queue": "Position in the queue"
           },
           "holds": "orders",
-          "reservations": "reservations"
+          "reservations": "reservations",
+          "ordered": "Ordered",
+          "ready": "Ready for pickup"
         },
         "checked_out": {
           "title": "checked out items",