chore: improvements and fixes

Co-Authored-by: Bertrand Zuchuat <[email protected]> Co-Authored-by: Johnny Mariéthoz <[email protected]>
rero · Feb 20, 2025 · 2efe75d · 2efe75d
1 parent b8062d6
commit 2efe75d
Show file tree

Hide file tree

Showing 20 changed files with 85 additions and 107 deletions.
diff --git a/projects/admin/src/app/circulation/item/item.component.html b/projects/admin/src/app/circulation/item/item.component.html
@@ -29,7 +29,7 @@
       <div class="flex flex-column gap-2">
         <a [routerLink]="['/records','items','detail', item.pid]">{{ item.barcode }}</a>
         @if (isCollapsed) {
-          <shared-inherited-call-number class="d-block small" [item]="item" />
+          <shared-inherited-call-number class="block text-sm" [item]="item" />
         }
       </div>
       @if (item.actionDone) {

diff --git a/...h-location/item-switch-location-standalone/item-switch-location-standalone.component.html b/...h-location/item-switch-location-standalone/item-switch-location-standalone.component.html
@@ -1,6 +1,6 @@
 <!--
   RERO ILS UI
-  Copyright (C) 2019-2024 RERO
+  Copyright (C) 2019-2025 RERO
   Copyright (C) 2019-2023 UCLouvain
 
   This program is free software: you can redistribute it and/or modify
@@ -16,8 +16,5 @@
   along with this program.  If not, see <http://www.gnu.org/licenses/>.
 -->
 @if (item) {
-  <div class="main-content">
-    <h1>{{ 'Barcode' | translate }} {{ item.barcode }}</h1>
-    <admin-item-switch-location [item]="item" (itemChange)="updatedItem($event)"></admin-item-switch-location>
-  </div>
+  <admin-item-switch-location [item]="item" (itemChange)="updatedItem($event)" />
 }
diff --git a/...components/items/switch-location/item-switch-location/item-switch-location.component.html b/...components/items/switch-location/item-switch-location/item-switch-location.component.html
@@ -1,6 +1,6 @@
 <!--
   RERO ILS UI
-  Copyright (C) 2019-2024 RERO
+  Copyright (C) 2019-2025 RERO
   Copyright (C) 2019-2023 UCLouvain
 
   This program is free software: you can redistribute it and/or modify
@@ -15,41 +15,30 @@
   You should have received a copy of the GNU Affero General Public License
   along with this program.  If not, see <http://www.gnu.org/licenses/>.
 -->
-@if (initialLocation.length > 0 && options.length > 0) {
+<h1>{{'Switch item location' | translate}}: {{ initialLocationName }} ({{ item.barcode }})</h1>
+
+@if (initialLocationName && options.length > 0) {
   <form [formGroup]="form" (ngSubmit)="submit()">
-    <div class="card container mt-3">
-      <dl class="card-text row my-2">
-        <dt class="col-2 label-title my-auto">Source</dt>
-        <dd class="col-10">
-          <p-dropdown
-            [options]="initialLocation"
-            [styleClass]="'w-100'"
-            [disabled]="true"
-          ></p-dropdown>
-        </dd>
-        <dd class="offset-2 col-10 text-center my-2">
-          <i class="fa fa-exchange fa-rotate-90 fa-lg"></i>
-        </dd>
-        <dt class="col-2 label-title my-auto">Target</dt>
-        <dd class="col-10">
+    <p-card>
+      <div class="flex flex-column gap-1">
+        <label for="target">{{ 'Target' | translate }}&nbsp;*</label>
         <p-dropdown
+          inputId="target"
           formControlName="target"
           [options]="options"
           [group]="true"
           [placeholder]="'Select…' | translate"
-          [styleClass]="'w-100'"
-          [scrollHeight]="'40vh'"
+          styleClass="w-full"
           [filter]="isFilterActive()"
           filterBy="label"
-        ></p-dropdown>
-        </dd>
-      </dl>
-      <div class="card-footer row form-group mb-0">
-        <div class="col text-right">
-          <button type="reset" class="btn btn-outline-danger mr-2" (click)="cancel()" translate>Cancel</button>
-          <button type="submit" class="btn btn-primary" [disabled]="form.invalid" translate>Save</button>
-        </div>
+        />
       </div>
-    </div>
+      <ng-template pTemplate="footer">
+        <div class="flex gap-2 justify-content-end">
+          <p-button outlined severity="danger" (onClick)="cancel()" translate>Cancel</p-button>
+          <p-button type="submit" [disabled]="form.invalid" translate>Save</p-button>
+        </div>
+      </ng-template>
+    </p-card>
   </form>
 }
diff --git a/...p/components/items/switch-location/item-switch-location/item-switch-location.component.ts b/...p/components/items/switch-location/item-switch-location/item-switch-location.component.ts
@@ -23,7 +23,7 @@ import { LocationService } from '@app/admin/service/location.service';
 import { TranslateService } from '@ngx-translate/core';
 import { Error, extractIdOnRef } from '@rero/ng-core';
 import { UserService } from '@rero/shared';
-import { MessageService, SelectItem, SelectItemGroup } from 'primeng/api';
+import { MessageService, SelectItemGroup } from 'primeng/api';
 import { finalize, map } from 'rxjs/operators';
 
 @Component({
@@ -52,7 +52,7 @@ export class ItemSwitchLocationComponent implements OnInit {
   form: UntypedFormGroup;
   /** options of the dropdown menu */
   options: SelectItemGroup[] = [];
-  initialLocation: SelectItem[] = [];
+  initialLocationName = '';
 
   constructor() {
     this.form = this.formBuilder.group({
@@ -70,14 +70,9 @@ export class ItemSwitchLocationComponent implements OnInit {
       )
       .subscribe(locations => {
         this._buildOptions(locations);
-        const filteredLocations = locations.filter(loc => loc.pid === extractIdOnRef(this.item.location.$ref));
-        if (filteredLocations) {
-          const currentLocation = filteredLocations.pop();
-          this.initialLocation = [{
-            label: currentLocation.name,
-            value: currentLocation.pid
-          }];
-        }
+        this.initialLocationName = locations
+        .filter(loc => loc.pid === extractIdOnRef(this.item.location.$ref))
+        .pop().name;
       });
   }
 

diff --git a/projects/admin/src/app/record/brief-view/issues-brief-view/issues-brief-view.component.html b/projects/admin/src/app/record/brief-view/issues-brief-view/issues-brief-view.component.html
@@ -26,7 +26,7 @@ <h5>
       @if ((callNumber.first | json) !== '{}' || (callNumber.second | json) !== '{}') {
         <dt translate>Call number</dt>
         <dd>
-          <shared-inherited-call-number [item]="record" context="first"></shared-inherited-call-number>
+          <shared-inherited-call-number [item]="record" context="first" />
         </dd>
       }
     }

diff --git a/projects/admin/src/app/record/brief-view/loans-brief-view/loans-brief-view.component.html b/projects/admin/src/app/record/brief-view/loans-brief-view/loans-brief-view.component.html
@@ -52,14 +52,14 @@ <h5 class="flex-grow-1">{{ record.metadata.document.title | mainTitle }}</h5>
             @if (record.metadata?.is_late) {
               <p-tag severity="danger" translate>overdue</p-tag>
               ({{ 'due date' | translate }}
-              <span [ngClass]="{'text-danger font-bold': record.metadata?.is_late}">
+              <span [ngClass]="{'text-error font-bold': record.metadata?.is_late}">
                 {{record.metadata.end_date | date: 'shortDate' }}</span>)
             }
           }
           <!-- REQUEST additional information -->
           @case (loanState.ITEM_AT_DESK) {
             ({{ 'request expire at' | translate }}
-            <span [ngClass]="{'text-danger': isRequestExpired}">{{ record.metadata.request_expire_date | date: 'shortDate' }}</span>)
+            <span [ngClass]="{'text-error': isRequestExpired}">{{ record.metadata.request_expire_date | date: 'shortDate' }}</span>)
           }
         }
       </dd>

diff --git a/.../circulation-log/circulation-log-notification/circulation-log-notification.component.html b/.../circulation-log/circulation-log-notification/circulation-log-notification.component.html
@@ -73,7 +73,7 @@
         @if (notificationRecord.notification_sent) {
           <i class="fa fa-circle text-success"></i> {{ 'message sent' | translate }}
         } @else {
-          <i class="fa fa-circle text-danger"></i> {{ 'message not sent' | translate }}
+          <i class="fa fa-circle text-error"></i> {{ 'message not sent' | translate }}
         }
       </dd>
     }

diff --git a/projects/admin/src/app/record/custom-editor/holding-editor/holding-editor.component.html b/projects/admin/src/app/record/custom-editor/holding-editor/holding-editor.component.html
@@ -15,44 +15,42 @@
   along with this program.  If not, see <http://www.gnu.org/licenses/>.
 -->
 
-<div class="row">
-  <div [ngClass]="{'col-md-9 col-xl-8': serialPatternsTemplate != null, 'col-12': serialPatternsTemplate == null}" role="main">
+<div class="grid">
+  <div class="md:col-9 col-8">
     <ng-core-editor [model]="model" (modelChange)="modelChanged($event)" (canDeactivateChange)="canDeactivateChanged($event)"></ng-core-editor>
   </div>
-  @if (serialPatternsTemplate != null) {
-    <div class="col-md-3 col-xl-4 bd-sidebar">
-      <div class="card">
-        <div class="card-header">
-          <h5 translate>Examples (preview)</h5>
-        </div>
-        <div class="card-body">
-          @if (!serialPreviewError) {
-            @if (serialPreviewExamples && serialPreviewExamples.length > 0) {
-              <ul class="list-unstyled">
-                @for (issue of serialPreviewExamples | slice:0:10; track issue) {
-                  <li>{{ issue.issue }}</li>
-                }
-              </ul>
-              ...
-              <ul class="list-unstyled">
-                @for (issue of serialPreviewExamples | slice:97:100; track issue) {
-                  <li>{{ issue.issue }}</li>
-                }
-
-              </ul>
-            } @else {
-              <div class="alert alert-light" role="alert" translate>
-                No preview available
-              </div>
+  <div class="col">
+    <p-fieldset [legend]="'Predictions' | translate">
+      @if (!serialPreviewError) {
+        @if (serialPreviewExamples && serialPreviewExamples.length > 0) {
+          <ul class="list-none p-0 m-0">
+            @for (issue of serialPreviewExamples | slice:0:10; track issue) {
+              <li>{{ issue.issue }}</li>
+            }
+          </ul>
+          …
+          <ul class="list-none p-0 m-0">
+            @for (issue of serialPreviewExamples | slice:97:100; track issue) {
+              <li>{{ issue.issue }}</li>
             }
+          </ul>
+        } @else {
+          <p-messages
+            [value]="[{ severity: 'info', detail: 'No preview available' | translate }]"
+            [closable]="false"
+            [enableService]="false"
+            showTransitionOptions="0ms"
+          />
+        }
 
-          } @else {
-            <div class="alert alert-danger" role="alert">
-              <strong translate>Template</strong> {{ serialPreviewError.status }}
-            </div>
-          }
-        </div>
-      </div>
-    </div>
-  }
+      } @else {
+        <p-messages
+          [value]="[{ severity: 'error', detail: ('Template' | translate) + '&nbsp;' + serialPreviewError.status }]"
+          [closable]="false"
+          [enableService]="false"
+          showTransitionOptions="0ms"
+        />
+      }
+    </p-fieldset>
+  </div>
 </div>
diff --git a/projects/admin/src/app/record/custom-editor/holding-editor/holding-editor.component.ts b/projects/admin/src/app/record/custom-editor/holding-editor/holding-editor.component.ts
@@ -1,6 +1,6 @@
 /*
  * RERO ILS UI
- * Copyright (C) 2020-2024 RERO
+ * Copyright (C) 2020-2025 RERO
  *
  * This program is free software: you can redistribute it and/or modify
  * it under the terms of the GNU Affero General Public License as published by
@@ -17,7 +17,7 @@
 import { Component, inject, OnDestroy, OnInit } from '@angular/core';
 import { AbstractCanDeactivateComponent, removeEmptyValues } from '@rero/ng-core';
 import { BehaviorSubject, of, Subscription } from 'rxjs';
-import { catchError, debounceTime, distinctUntilChanged, switchMap } from 'rxjs/operators';
+import { catchError, debounceTime, distinctUntilChanged, switchMap, tap } from 'rxjs/operators';
 import { EditorService } from '../../../service/editor.service';
 import { PredictionIssue } from '../../../service/holdings.service';
 
@@ -98,14 +98,13 @@ export class HoldingEditorComponent extends AbstractCanDeactivateComponent imple
    */
   modelChanged(modelValue) {
     modelValue = removeEmptyValues(modelValue);
-    if (
-      modelValue.patterns
-      && modelValue.patterns.template
-    ) {
+    if (modelValue.patterns && modelValue.patterns.template) {
       this.serialPatternsTemplate = modelValue.patterns.template;
       this.serialPreviewError = null;
+      this.serialPreviewExamples = [];
       this.predictionModel$.next(modelValue);
     } else {
+      this.serialPreviewExamples = [];
       this.serialPatternsTemplate = null;
     }
   }

diff --git a/...src/app/record/detail-view/circ-policy-detail-view/circ-policy-detail-view.component.html b/...src/app/record/detail-view/circ-policy-detail-view/circ-policy-detail-view.component.html
@@ -58,7 +58,7 @@ <h1 class="mb-3">{{ record.metadata.name | translate }}</h1>
             @if (record.metadata.is_default) {
               <i id="cipo-is-default" class="fa fa-check  text-success" aria-hidden="true"></i>
             } @else {
-              <i id="cipo-is-default" class="fa fa-times text-danger" aria-hidden="true"></i>
+              <i id="cipo-is-default" class="fa fa-times text-error" aria-hidden="true"></i>
             }
           </dd>
           <!-- CHECKOUT SETTINGS-->
@@ -86,22 +86,22 @@ <h1 class="mb-3">{{ record.metadata.name | translate }}</h1>
               @if (record.metadata.automatic_renewal) {
                 <i class="fa fa-check text-success" aria-hidden="true"></i>
               } @else {
-                <i class="fa fa-times text-danger" aria-hidden="true"></i>
+                <i class="fa fa-times text-error" aria-hidden="true"></i>
               }
             </dd>
             </dl>
             </dd>
           } @else {
             <dd>
-              <i id="cipo-allow-checkout" class="fa fa-times text-danger" aria-hidden="true"></i>
+              <i id="cipo-allow-checkout" class="fa fa-times text-error" aria-hidden="true"></i>
             </dd>
           }
           <dt translate>Allow requests</dt>
           <dd>
             @if (record.metadata.allow_requests) {
               <i id="cipo-allow-request" class="fa fa-check  text-success" aria-hidden="true"></i>
             } @else {
-              <i id="cipo-allow-request" class="fa fa-times text-danger" aria-hidden="true"></i>
+              <i id="cipo-allow-request" class="fa fa-times text-error" aria-hidden="true"></i>
             }
           </dd>
         </dl>

diff --git a/...ew/holding/holding-item-temporary-item-type/holding-item-temporary-item-type.component.ts b/...ew/holding/holding-item-temporary-item-type/holding-item-temporary-item-type.component.ts
@@ -30,7 +30,7 @@ import { DateTime } from 'luxon';
         <dd>
           {{ record.metadata.temporary_item_type.pid | getRecord:'item_types': 'field':'name' | async }}
           @if (record.metadata.temporary_item_type.end_date; as endDate) {
-            &nbsp;<span class="small text-secondary">
+            &nbsp;<span class="text-sm text-secondary">
               (<i class="fa fa-long-arrow-right" aria-hidden="true"></i> {{ endDate | dateTranslate :'shortDate' }})
             </span>
           }

diff --git a/...l-view/local/local-organisation-detail-view/local-organisation-detail-view.component.html b/...l-view/local/local-organisation-detail-view/local-organisation-detail-view.component.html
@@ -54,7 +54,7 @@
     <dd>
       <i class="fa mr-2" [ngClass]="{
         'fa-check text-success': record.conference,
-        'fa-times text-danger': !record.conference
+        'fa-times text-error': !record.conference
       }"></i>
     </dd>
   }

diff --git a/...lding-detail-view/serial-holding-detail-view/received-issue/received-issue.component.html b/...lding-detail-view/serial-holding-detail-view/received-issue/received-issue.component.html
@@ -37,7 +37,7 @@
           @if (issue.metadata.notes) {
             <i class="fa fa-sticky-note-o text-warning"></i>
           }
-          <shared-inherited-call-number class="call-numbers px-2" [item]="issue" />
+          <shared-inherited-call-number class="px-2" [item]="issue" />
           @if (issue.metadata?.issue?.claims?.counter > 0 && isCollapsed) {
             <i class="fa fa-exclamation-triangle text-warning" aria-hidden="true"></i>
           }
@@ -51,7 +51,7 @@
           <dl class="metadata">
             @if (issue.metadata._masked) {
               <dt></dt>
-              <dd class="text-danger">
+              <dd class="text-error">
                 <i class="fa fa-eye-slash"></i>&nbsp;
                 {{ 'This issue has been marked as masked' | translate }}
               </dd>

diff --git a/...holding-detail-view/serial-holding-detail-view/received-issue/received-issue.component.ts b/...holding-detail-view/serial-holding-detail-view/received-issue/received-issue.component.ts
@@ -102,7 +102,7 @@ export class ReceivedIssueComponent implements OnInit, OnDestroy {
    */
   getIcon(realState: boolean = false): string {
     return (this.issue.metadata._masked && !realState)
-      ? 'fa-eye-slash text-danger'
+      ? 'fa-eye-slash text-error'
       : this.holdingService.getIcon(this.issue.metadata.issue.status);
   }
 

diff --git a/projects/admin/src/app/record/detail-view/item-detail-view/item-detail-view.component.html b/projects/admin/src/app/record/detail-view/item-detail-view/item-detail-view.component.html
@@ -117,7 +117,7 @@ <h1>{{ 'Barcode' | translate }} {{ record.metadata.barcode }}</h1>
       <dt translate>New acquisition</dt>
       <dd>
         <i class="fa"
-          [ngClass]="(record.metadata.acquisition_date) ? 'fa-check text-success' : 'fa-times text-danger'"
+          [ngClass]="(record.metadata.acquisition_date) ? 'fa-check text-success' : 'fa-times text-error'"
           aria-hidden="true"
         >
         </i>
@@ -154,7 +154,7 @@ <h3 translate>Issue data</h3>
         <dt translate>Regular issue</dt>
         <dd>
           <i class="fa"
-            [ngClass]="record.metadata.issue.regular ? 'fa-check text-success' : 'fa-times text-danger'"
+            [ngClass]="record.metadata.issue.regular ? 'fa-check text-success' : 'fa-times text-error'"
             aria-hidden="true"
           >
           </i>

diff --git a/...admin/src/app/record/detail-view/location-detail-view/location-detail-view.component.html b/...admin/src/app/record/detail-view/location-detail-view/location-detail-view.component.html
@@ -102,7 +102,7 @@ <h4 class="mt-4" translate>Restrictions</h4>
             <dl class="grid mb-1">
               <dt class="col-3 label-title" translate>Restrict pickup to</dt>
               <dd class="col-7 mb-0">
-                <ul>
+                <ul class="list-none m-0 p-0">
                   @for (location of data.restrict_pickup_to; track location) {
                     <li>
                       {{ location.pid | getRecord: 'locations' : 'field' : 'pickup_name' | async  }}

diff --git a/projects/admin/src/app/record/detail-view/record-masked/record-masked.component.spec.ts b/projects/admin/src/app/record/detail-view/record-masked/record-masked.component.spec.ts
@@ -113,7 +113,7 @@ describe('MaskedComponent', () => {
     const icon = fixture.nativeElement.querySelector('i');
     expect(icon.attributes.title.textContent).toContain('No masked');
     expect(icon.attributes.class.textContent).toContain('fa-circle');
-    expect(icon.attributes.class.textContent).toContain('text-danger');
+    expect(icon.attributes.class.textContent).toContain('text-error');
   });
 
   it('should return a bullet red icon with label (record with flag _masked true)', () => {