chore: improvements and fixes

* Removes unsed organisation views. * Removes boostrap relicas. * Moves keyboard shortcuts to primeng. * Fixes item issues predictions view. Co-Authored-by: Bertrand Zuchuat <[email protected]> Co-Authored-by: Johnny Mariéthoz <[email protected]>
rero · Feb 24, 2025 · 86f012c · 86f012c
1 parent b8062d6
commit 86f012c
Show file tree

Hide file tree

Showing 33 changed files with 132 additions and 330 deletions.
diff --git a/projects/admin/src/app/acquisition/pipes/note-badge-color.pipe.ts b/projects/admin/src/app/acquisition/pipes/note-badge-color.pipe.ts
@@ -26,7 +26,7 @@ export class NoteBadgeColorPipe implements PipeTransform {
   /**
    * Get the color (class) to use to highlight a note.
    * @param note: the note to analyze
-   * @return: the color/class (bootstrap) to use for the note.
+   * @return: the color/class (primeng) to use for the note.
    */
   transform(note: IAcqNote): string {
     switch (note.type) {

diff --git a/projects/admin/src/app/app.module.ts b/projects/admin/src/app/app.module.ts
@@ -149,7 +149,6 @@ import { LibraryDetailViewComponent } from './record/detail-view/library-detail-
 import { LocationComponent } from './record/detail-view/library-detail-view/location/location.component';
 import { LocalFieldComponent } from './record/detail-view/local-field/local-field.component';
 import { LocationDetailViewComponent } from './record/detail-view/location-detail-view/location-detail-view.component';
-import { OrganisationDetailViewComponent } from './record/detail-view/organisation-detail-view/organisation-detail-view.component';
 import { PatronDetailViewComponent } from './record/detail-view/patron-detail-view/patron-detail-view.component';
 import { PatronPermissionComponent } from './record/detail-view/patron-detail-view/patron-permissions/patron-permission/patron-permission.component';
 import { PatronPermissionsComponent } from './record/detail-view/patron-detail-view/patron-permissions/patron-permissions.component';
@@ -242,7 +241,6 @@ export function appInitFactory(appInitializerService: AppInitializerService): ()
     VendorDetailViewComponent,
     VendorBriefViewComponent,
     AddressTypeComponent,
-    OrganisationDetailViewComponent,
     RelatedResourceComponent,
     ItemRequestComponent,
     ErrorPageComponent,

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/...min/src/app/circulation/patron/ill-request/ill-request-item/ill-request-item.component.ts b/...min/src/app/circulation/patron/ill-request/ill-request-item/ill-request-item.component.ts
@@ -31,7 +31,7 @@ export class IllRequestItemComponent {
   isCollapsed: boolean = true;
 
   // COMPONENT FUNCTIONS ======================================================
-  /** get the bootstrap color to apply on the request status badge */
+  /** get the primeng color to apply on the request status badge */
   badgeColor(status: string): string {
     return getTagSeverityFromStatus(status) ;
   }

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/directives/tab-order.directive.ts b/projects/admin/src/app/directives/tab-order.directive.ts
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/projects/admin/src/app/record/brief-view/patrons-brief-view/patrons-brief-view.component.ts b/projects/admin/src/app/record/brief-view/patrons-brief-view/patrons-brief-view.component.ts
@@ -15,7 +15,7 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-import { Component, inject, Input, OnInit } from '@angular/core';
+import { Component, inject, Input } from '@angular/core';
 import { ResultItem } from '@rero/ng-core';
 import { PERMISSIONS, PermissionsService } from '@rero/shared';
 import { roleTagSeverity } from '../../../utils/roles';
@@ -46,7 +46,7 @@ export class PatronsBriefViewComponent implements ResultItem {
   /**
    * Get the color badge to apply for a specific role
    * @param role: the role to check.
-   * @return the bootstrap badge class to use for this role.
+   * @return the primeng badge class to use for this role.
    */
   getRoleTagSeverity(role: string): string {
     return roleTagSeverity(role);

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;
     }
   }