[UXP-34] fix conflicts, align code

Author: FrancescoMolinaro

src/app/shared/carousel/carousel.component.html

@@ -1,5 +1,5 @@
 <ngb-carousel #carousel [interval]="2000" (slide)="onSlide($event)" class="ds-carousel">
-  <ng-template ngbSlide *ngFor="let item of items; let i = index; let last = last">
+  <ng-template ngbSlide *ngFor="let item of currentPageItems(); let i = index; let last = last">
     <ng-container *ngIf="getItemLink(item.indexableObject); let currentLink; else carouselContent">
       <a *ngIf="internalLinkService.isLinkInternal(currentLink)" [routerLink]="internalLinkService.getRelativePath(currentLink)">
         <ng-container *ngTemplateOutlet="carouselContent"></ng-container>
@@ -39,3 +39,38 @@
     <i class="fas fa-pause" *ngIf="!paused"></i>
   </button>
 </div>
+<div class="mt-4 w-100 d-flex justify-content-center align-items-center" *ngIf="totalPages > 1">
+  <button (click)="previousPage()" [disabled]="currentPage === 1" class="prev border-0 bg-transparent">
+    <i class="fa fa-arrow-left"></i>
+  </button>
+  <button
+    *ngFor="let page of pages()"
+    class="number"
+    (click)="changePage(page)"
+    style="border: none; background: none; margin: 0 5px"
+    [style.color]="page === currentPage ? '#000000' : '#7c7c7c'">
+    {{ page < 10 ? '0' + page : page }}
+  </button>
+  <button (click)="nextPage()" [disabled]="currentPage === pages().length" class="next border-0 bg-transparent">
+    <i class="fa fa-arrow-right"></i>
+  </button>
+</div>
+
+<div
+  class="carousel-content-wrapper"
+  [ngStyle]="{
+                'height': carouselOptions.keepAspectRatio ? null : carouselOptions.carouselHeightPx + 'px',
+                'aspect-ratio': carouselOptions.keepAspectRatio ? carouselOptions.aspectRatio : null
+           }"
+  *ngIf="(isLoading$ | async)"
+>
+  <a
+    href="#"
+    target="_blank"
+    class="img-container-el">
+    <div class="picsum-img-wrapper flex-column">
+      <img class="img-fluid" src="assets/images/replacement_image.svg">
+      {{'loading.default' | translate}}
+    </div>
+  </a>
+</div>

src/app/shared/carousel/carousel.component.spec.ts

@@ -38,6 +38,7 @@ import { CarouselOptions } from './carousel-options.model';
 import { SortDirection } from '../../core/cache/models/sort-options.model';
 import { SearchManager } from '../../core/browse/search-manager';
 import { toRemoteData } from '../../browse-by/browse-by-metadata-page/browse-by-metadata-page.component.spec';
+import { InternalLinkService } from '../../core/services/internal-link.service';
 
 describe('CarouselComponent', () => {
     let component: CarouselComponent;
@@ -180,7 +181,8 @@ describe('CarouselComponent', () => {
             providers: [
                 CarouselComponent,
                 { provide: ObjectCacheService, useValue: {} },
-                { provide: UUIDService, useValue: {} },
+              { provide: InternalLinkService, useValue: {} },
+              { provide: UUIDService, useValue: {} },
                 { provide: Store, useValue: {} },
                 { provide: RemoteDataBuildService, useValue: {} },
                 { provide: HALEndpointService, useValue: {} },

src/app/shared/carousel/carousel.component.ts

@@ -20,6 +20,7 @@ import { SortOptions } from '../../core/cache/models/sort-options.model';
 import { PaginationComponentOptions } from '../pagination/pagination-component-options.model';
 import { PaginatedSearchOptions } from '../search/models/paginated-search-options.model';
 import { DSpaceObjectType } from '../../core/shared/dspace-object-type.model';
+import { InternalLinkService } from '../../core/services/internal-link.service';
 
 /**
  * Component representing the Carousel component section.
@@ -112,6 +113,7 @@ export class CarouselComponent implements OnInit {
   constructor(
     protected bitstreamDataService: BitstreamDataService,
     private searchManager: SearchManager,
+    public internalLinkService: InternalLinkService,
     @Inject(NativeWindowService) private _window: NativeWindowRef,
   ) {
   }
@@ -215,9 +217,6 @@ export class CarouselComponent implements OnInit {
     return item.firstMetadataValue(this.link);
   }
 
-  isLinkInternal(link: string) {
-    return link.startsWith('/');
-  }
 
   /**
    * to open a link of an item