@hmcts/media-viewer 4.2.4-exui-3994-f → 4.2.4-exui-3994-g

package/projects/media-viewer/src/lib/annotations/tags/tags.component.ts

@@ -1,52 +0,0 @@
-import {Component, Input, ViewEncapsulation} from '@angular/core';
-import {TagsModel} from '../models/tags.model';
-import {TagsServices} from '../services/tags/tags.services';
-import {UntypedFormControl} from '@angular/forms';
-import {Observable} from 'rxjs';
-
-@Component({
-    selector: 'mv-tags',
-    templateUrl: './tags.component.html',
-    encapsulation: ViewEncapsulation.None,
-    standalone: false
-})
-export class TagsComponent {
-  @Input() tagItems: TagsModel[];
-  @Input() userId: string;
-  @Input() editable: boolean;
-  @Input() annoId: string;
-
-  public validators = [this.minLength, this.maxLength20];
-  public errorMessages: {[id: string]: string} = {
-    'minLength': 'Minimum of 2 characters',
-    'maxLength20': 'Maximum of 20 characters'
-  };
-
-  constructor(private tagsServices: TagsServices) {}
-
-  onUpdateTags(value) {
-    this.tagsServices.updateTagItems(value, this.annoId);
-  }
-
-  public requestAutocompleteItems = (text: string): Observable<any[]> => {
-    return this.tagsServices.getAllTags(this.userId);
-  }
-
-  private minLength(control: UntypedFormControl) {
-    if (control.value.length < 2) {
-      return {
-        'minLength': true
-      };
-    }
-    return null;
-  }
-
-  private maxLength20(control: UntypedFormControl) {
-    if (control.value.length >= 20) {
-      return {
-        'maxLength20': true
-      };
-    }
-    return null;
-  }
-}

package/projects/media-viewer/src/lib/bookmark/components/bookmark-icons.component.html

@@ -1,19 +0,0 @@
-<div class="pageContainer">
-  <div *ngFor="let bookmarks of (bookmarksPerPage$ | async);  index as i"
-       class="pageContainer__page"
-       [ngStyle]="{
-         'width.px': bookmarks.styles.width,
-         'height.px': bookmarks.styles.height
-       }">
-    <div class="pageContainer__page-item">
-      <ng-container *ngFor="let bMrk of bookmarks.bookmark">
-        <div class="bookmark__here"
-           [style.width]="16 * zoom + 'px'"
-           [style.height]="24 * zoom + 'px'"
-           [style.top]="bMrk.yCoordinate * zoom + 'px'"
-           [title]="bMrk.name">
-        </div>
-      </ng-container>
-    </div>
-  </div>
-</div>

package/projects/media-viewer/src/lib/bookmark/components/bookmark-icons.component.ts

@@ -1,27 +0,0 @@
-import {Bookmark, BookmarksPerPage} from '../../viewers/pdf-viewer/side-bar/bookmarks/bookmarks.interfaces';
-import {Component, Input, OnInit} from '@angular/core';
-import { select, Store } from '@ngrx/store';
-import * as fromStore from '../../store/reducers/reducers';
-import * as fromSelectors from '../../store/selectors/bookmark.selectors';
-import { Observable } from 'rxjs';
-
-@Component({
-    selector: 'mv-bookmark-icons',
-    templateUrl: './bookmark-icons.component.html',
-    standalone: false
-})
-export class BookmarkIconsComponent implements OnInit {
-
-  @Input() zoom: number;
-  @Input() rotate: number;
-  bookmarksPerPage$: Observable<BookmarksPerPage[]>;
-  bookmarks: Bookmark[];
-  documentId: string;
-
-  constructor(private store: Store<fromStore.State>) {}
-
-  ngOnInit(): void {
-    this.bookmarksPerPage$ = this.store.pipe(select(fromSelectors.getBookmarksPerPage));
-  }
-
-}

package/projects/media-viewer/src/lib/icp/confirm-exit/confirm-action-dialog.component.html

@@ -1,16 +0,0 @@
-<div id="modal-background" class="modal" (click)="onCancel()">
-  <div id="modal" 
-    class="modal-content govuk-width-container clearfix"
-    (click)="$event.stopPropagation()"
-    #modalContainer
-    tabIndex="-1"
-    role="dialog"
-    aria-modal="true"
-  >
-    <h2 class="govuk-heading-s">Are you sure you want to leave the presentation?</h2>
-    <div class="button-container">
-      <button id="modal-close-button" (click)="onConfirm()" class="govuk-button">Confirm</button>
-      <button (click)="onCancel()" class="govuk-button govuk-button--secondary">Cancel</button>
-    </div>
-  </div>
-</div>

package/projects/media-viewer/src/lib/icp/confirm-exit/confirm-action-dialog.component.spec.ts

@@ -1,124 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { ConfirmActionDialogComponent } from './confirm-action-dialog.component';
-import { IcpEventService } from '../../toolbar/icp-event.service';
-
-describe('ConfirmActionDialogComponent', () => {
-  let component: ConfirmActionDialogComponent;
-  let fixture: ComponentFixture<ConfirmActionDialogComponent>;
-  let icpEventService: IcpEventService;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      declarations: [ ConfirmActionDialogComponent ],
-      providers: [{
-        provide: IcpEventService,
-        useValue: {
-          confirmExit: () => {},
-          leavingSession: {
-            next: (a: boolean) => {}
-          }
-        }
-      }]
-    });
-
-    icpEventService = TestBed.inject(IcpEventService);
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(ConfirmActionDialogComponent);
-    component = fixture.componentInstance;
-
-    fixture.detectChanges();
-  });
-
-  it('should emit new leavingSession event on cancel', () => {
-    spyOn(icpEventService.leavingSession, 'next').and.callThrough();
-    component.onCancel();
-
-    expect(icpEventService.leavingSession.next).toHaveBeenCalledWith(false);
-  });
-
-  it('should call confirmExit and emit a new leavingSession event', () => {
-    spyOn(icpEventService, 'confirmExit').and.callThrough();
-    spyOn(icpEventService.leavingSession, 'next').and.callThrough();
-    component.onConfirm();
-
-    expect(icpEventService.confirmExit).toHaveBeenCalled();
-    expect(icpEventService.leavingSession.next).toHaveBeenCalledWith(false);
-  });
-
-  it('should create the component', () => {
-    expect(component).toBeTruthy();
-  });
-
-  it('should have onCancel method defined', () => {
-    expect(component.onCancel).toBeDefined();
-  });
-
-  it('should have onConfirm method defined', () => {
-    expect(component.onConfirm).toBeDefined();
-  });
-
-  it('should call confirmExit when onConfirm is called', () => {
-    spyOn(icpEventService, 'confirmExit').and.callThrough();
-    component.onConfirm();
-    expect(icpEventService.confirmExit).toHaveBeenCalled();
-  });
-
-  it('should emit leavingSession event with false when onCancel is called', () => {
-    spyOn(icpEventService.leavingSession, 'next').and.callThrough();
-    component.onCancel();
-    expect(icpEventService.leavingSession.next).toHaveBeenCalledWith(false);
-  });
-
-  it('should emit leavingSession event with false when onConfirm is called', () => {
-    spyOn(icpEventService.leavingSession, 'next').and.callThrough();
-    component.onConfirm();
-    expect(icpEventService.leavingSession.next).toHaveBeenCalledWith(false);
-  });
-
-  it('should not call confirmExit when onCancel is called', () => {
-    spyOn(icpEventService, 'confirmExit').and.callThrough();
-    component.onCancel();
-    expect(icpEventService.confirmExit).not.toHaveBeenCalled();
-  });
-
-  it('should call leavingSession.next with true when onConfirm is called', () => {
-    spyOn(icpEventService.leavingSession, 'next').and.callThrough();
-    component.onConfirm();
-    expect(icpEventService.leavingSession.next).toHaveBeenCalledWith(false);
-  });
-
-  it('should not call leavingSession.next with true when onCancel is called', () => {
-    spyOn(icpEventService.leavingSession, 'next').and.callThrough();
-    component.onCancel();
-    expect(icpEventService.leavingSession.next).not.toHaveBeenCalledWith(true);
-  });
-
-  describe('Focus functionality', () => {
-    it('should have modalContainer ViewChild defined after view initialization', () => {
-      expect(component.modalContainer).toBeDefined();
-      expect(component.modalContainer.nativeElement).toBeTruthy();
-    });
-
-    it('should set focus to the modal element when ngAfterViewInit is called', () => {
-      const focusSpy = spyOn(component.modalContainer.nativeElement, 'focus');
-
-      component.ngAfterViewInit();
-
-      expect(focusSpy).toHaveBeenCalled();
-    });
-
-    it('should not throw error if modalContainer is undefined', () => {
-      component.modalContainer = undefined;
-
-      expect(() => component.ngAfterViewInit()).not.toThrow();
-    });
-
-    it('should have tabindex attribute set to -1 on modal dialog', () => {
-      const modalElement = fixture.nativeElement.querySelector('#modal');
-
-      expect(modalElement.getAttribute('tabindex')).toBe('-1');
-    });
-  });
-});

package/projects/media-viewer/src/lib/icp/confirm-exit/confirm-action-dialog.component.ts

@@ -1,28 +0,0 @@
-import { AfterViewInit, Component, ElementRef, ViewChild } from '@angular/core';
-import { IcpEventService } from '../../toolbar/icp-event.service';
-
-@Component({
-    selector: 'mv-confirm-action',
-    templateUrl: './confirm-action-dialog.component.html',
-    standalone: false
-})
-export class ConfirmActionDialogComponent implements AfterViewInit {
-  @ViewChild('modalContainer') modalContainer: ElementRef;
-
-  constructor(private icpEventService: IcpEventService) {}
-
-  ngAfterViewInit(): void {
-    if (this.modalContainer) {
-      this.modalContainer.nativeElement.focus();
-    }
-  }
-
-  onCancel() {
-    this.icpEventService.leavingSession.next(false);
-  }
-
-  onConfirm() {
-    this.icpEventService.confirmExit();
-    this.icpEventService.leavingSession.next(false);
-  }
-}

package/projects/media-viewer/src/lib/icp/icp-follower.service.spec.ts

@@ -1,80 +0,0 @@
-import { fakeAsync, inject, TestBed } from '@angular/core/testing';
-import { Store, StoreModule } from '@ngrx/store';
-import { PdfPosition, reducers } from '../store/reducers/reducers';
-import { IcpUpdateService } from './icp-update.service';
-import { IcpFollowerService } from './icp-follower.service';
-import { ViewerEventService } from '../viewers/viewer-event.service';
-import { ToolbarEventService } from '../toolbar/toolbar-event.service';
-import { PdfPositionUpdate } from '../store/actions/document.actions';
-
-describe('Icp Follower Service', () => {
-
-  let followerService: IcpFollowerService;
-  const mockUpdateService = {
-    newParticipantJoined: () => { },
-    updateScreen: () => { },
-    updatePresenter: () => { },
-    screenUpdated: () => { }
-  } as any;
-
-  const pdfPosition: PdfPosition = {
-    pageNumber: 1,
-    top: 1,
-    left: 1,
-    rotation: 270,
-    scale: 1
-  };
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      imports: [
-        StoreModule.forFeature('media-viewer', reducers),
-        StoreModule.forRoot({})
-      ],
-      providers: [IcpFollowerService,
-        { provide: IcpUpdateService, useValue: mockUpdateService }]
-    });
-
-    followerService = TestBed.inject(IcpFollowerService);
-  });
-
-  it('should be created', () => {
-    expect(followerService).toBeTruthy();
-  });
-
-  it('should call subscribe if client is follower', () => {
-    spyOn(followerService, 'subscribe');
-
-    followerService.update(true);
-
-    expect(followerService.subscribe).toHaveBeenCalled();
-  });
-
-  it('should call unsubscribe if client is not follower', () => {
-    spyOn(followerService, 'unsubscribe');
-
-    followerService.update(false);
-
-    expect(followerService.unsubscribe).toHaveBeenCalled();
-  });
-
-  it('should should set subscription to undefined', () => {
-    followerService.unsubscribe();
-
-    expect(followerService.$subscription).toEqual(undefined);
-  });
-
-  it('should follow screen updates',
-    inject([Store, ViewerEventService, ToolbarEventService], fakeAsync((store, viewerEvents, toolbarEvents) => {
-      spyOn(viewerEvents, 'goToDestinationICP');
-      spyOn(toolbarEvents, 'rotate');
-
-      store.dispatch(new PdfPositionUpdate({ ...pdfPosition, rotation: 0 }));
-
-      followerService.followScreenUpdate({ pdfPosition });
-
-      expect(viewerEvents.goToDestinationICP).toHaveBeenCalled();
-      expect(toolbarEvents.rotate).toHaveBeenCalled();
-    }))
-  );
-});

package/projects/media-viewer/src/lib/icp/icp-follower.service.ts

@@ -1,69 +0,0 @@
-import { Injectable } from '@angular/core';
-import { ToolbarEventService } from '../toolbar/toolbar-event.service';
-import { select, Store } from '@ngrx/store';
-import { Subscription } from 'rxjs';
-import { IcpUpdateService } from './icp-update.service';
-import { ViewerEventService } from '../viewers/viewer-event.service';
-import { distinctUntilChanged, take } from 'rxjs/operators';
-import { IcpState, IcpSession } from './icp.interfaces';
-import * as fromDocSelectors from '../store/selectors/document.selectors';
-
-@Injectable({ providedIn: 'root' })
-export class IcpFollowerService {
-
-  session: IcpSession;
-  private previousRotation: number|null = null;
-  $subscription: Subscription;
-
-  constructor(private readonly toolbarEvents: ToolbarEventService,
-    private readonly viewerEvents: ViewerEventService,
-    private readonly socketService: IcpUpdateService,
-    private store: Store<IcpState>) { }
-
-
-  update(isFollower: boolean) {
-    if (isFollower) {
-      this.subscribe();
-    } else {
-      this.unsubscribe();
-    }
-  }
-
-  subscribe() {
-    if (!this.$subscription) {
-      this.$subscription = this.socketService.screenUpdated()
-        .subscribe(screen => this.followScreenUpdate(screen));
-    }
-  }
-
-  unsubscribe() {
-    if (this.$subscription) {
-      this.$subscription.unsubscribe();
-      this.$subscription = undefined;
-    }
-  }
-
-  followScreenUpdate({ pdfPosition }) {
-    if (pdfPosition) {
-      this.viewerEvents.goToDestinationICP([
-        pdfPosition.pageNumber - 1,
-        { 'name': 'XYZ' },
-        pdfPosition.left,
-        pdfPosition.top
-      ]);
-    }
-    this.store.pipe(
-      select(fromDocSelectors.getPdfPosition), 
-      take(1), 
-      distinctUntilChanged(undefined, a => a.rotation))
-      .subscribe(position => {
-        if (this.previousRotation === pdfPosition.rotation) {
-          return;
-        }
-        const rotationDelta = (pdfPosition.rotation - position.rotation) % 360;
-        if (rotationDelta && rotationDelta !== 0) {
-          this.toolbarEvents.rotate(rotationDelta);
-        }
-      });
-  }
-}

package/projects/media-viewer/src/lib/icp/icp-presenter.service.spec.ts

@@ -1,119 +0,0 @@
-import { fakeAsync, inject, TestBed } from '@angular/core/testing';
-import { IcpPresenterService } from './icp-presenter.service';
-import { IcpUpdateService } from './icp-update.service';
-import { Store, StoreModule } from '@ngrx/store';
-import { PdfPosition, reducers } from '../store/reducers/reducers';
-import { IcpSocketSessionJoined } from '../store/actions/icp.actions';
-import { PdfPositionUpdate } from '../store/actions/document.actions';
-import { IcpParticipant, IcpSession } from './icp.interfaces';
-import { of } from 'rxjs';
-
-describe('Icp Presenter Service', () => {
-
-  let presenterService: IcpPresenterService;
-  let updateService: IcpUpdateService;
-  const mockUpdateService = {
-    newParticipantJoined: () => of('client'),
-    updateScreen: () => { },
-    updatePresenter: () => { },
-    screenUpdated: () => { }
-  } as any;
-
-  const session: IcpSession = {
-    caseId: 'caseId',
-    documentId: 'documentId',
-    sessionId: 'sessionId',
-    dateOfHearing: new Date(),
-    connectionUrl: ''
-  };
-  const participant: IcpParticipant = {
-    id: 'id',
-    username: 'name'
-  };
-  const pdfPosition: PdfPosition = {
-    pageNumber: 1,
-    top: 1,
-    left: 1,
-    rotation: 90,
-    scale: 1
-  };
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      imports: [
-        StoreModule.forFeature('media-viewer', reducers),
-        StoreModule.forRoot({})
-      ],
-      providers: [IcpPresenterService,
-        { provide: IcpUpdateService, useValue: mockUpdateService }]
-    });
-
-    presenterService = TestBed.inject(IcpPresenterService);
-    updateService = TestBed.inject(IcpUpdateService);
-  });
-
-  it('should be created', () => {
-    expect(presenterService).toBeTruthy();
-  });
-
-  it('should call subscribe if client is presenter', () => {
-    spyOn(presenterService, 'subscribe');
-
-    presenterService.update(true);
-
-    expect(presenterService.subscribe).toHaveBeenCalled();
-  });
-
-  it('should call unsubscribe if client is not presenter', () => {
-    spyOn(presenterService, 'unsubscribe');
-
-    presenterService.update(false);
-
-    expect(presenterService.unsubscribe).toHaveBeenCalled();
-  });
-
-  it('should set up subscriptions',
-    inject([Store], fakeAsync((store) => {
-      spyOn(presenterService, 'onNewParticipantJoined');
-      spyOn(presenterService, 'onPositionUpdate');
-
-      presenterService.subscribe();
-
-      const joinedPayload = { session: session, participantInfo: { client: participant, presenter: participant } };
-      store.dispatch(new IcpSocketSessionJoined(joinedPayload));
-      store.dispatch(new PdfPositionUpdate(pdfPosition));
-      mockUpdateService.newParticipantJoined();
-
-      expect(presenterService.presenter).toEqual(participant);
-      expect(presenterService.pdfPosition).toEqual(pdfPosition);
-      expect(presenterService.onPositionUpdate).toHaveBeenCalledWith(pdfPosition);
-      expect(presenterService.onNewParticipantJoined).toHaveBeenCalled();
-    }))
-  );
-
-  it('should should set subscription to undefined', () => {
-    presenterService.unsubscribe();
-
-    expect(presenterService.$subscription).toEqual(undefined);
-  });
-
-  it('should call service to update screen position', () => {
-    spyOn(updateService, 'updateScreen');
-
-    presenterService.onPositionUpdate(pdfPosition);
-
-    expect(updateService.updateScreen).toHaveBeenCalledWith({ pdfPosition, document: undefined });
-  });
-
-  it('should call service to update presenter', () => {
-    spyOn(presenterService, 'onPositionUpdate');
-    spyOn(updateService, 'updatePresenter');
-
-    presenterService.pdfPosition = pdfPosition;
-    presenterService.presenter = participant;
-    presenterService.onNewParticipantJoined();
-
-    expect(presenterService.onPositionUpdate).toHaveBeenCalledWith(pdfPosition);
-    expect(updateService.updatePresenter).toHaveBeenCalledWith(participant);
-  });
-});

package/projects/media-viewer/src/lib/icp/icp-presenter.service.ts

@@ -1,61 +0,0 @@
-import { Injectable } from '@angular/core';
-import { ToolbarEventService } from '../toolbar/toolbar-event.service';
-import { select, Store } from '@ngrx/store';
-import * as fromDocSelectors from '../store/selectors/document.selectors';
-import { distinctUntilChanged, Subscription, take } from 'rxjs';
-import { IcpUpdateService } from './icp-update.service';
-import { IcpState, IcpScreenUpdate, IcpSession, IcpParticipant } from './icp.interfaces';
-import * as fromIcpSelectors from '../store/selectors/icp.selectors';
-import { PdfPosition } from '../store/reducers/document.reducer';
-
-@Injectable({ providedIn: 'root' })
-export class IcpPresenterService {
-
-  session: IcpSession;
-  presenter: IcpParticipant;
-  pdfPosition: PdfPosition;
-
-  $subscription: Subscription;
-
-  constructor(private readonly toolbarEvents: ToolbarEventService,
-              private readonly socketService: IcpUpdateService,
-              private store: Store<IcpState>) {}
-
-  update(isPresenter: boolean) {
-    if (isPresenter) {
-      this.subscribe();
-    } else {
-      this.unsubscribe();
-    }
-  }
-
-  subscribe() {
-    if (!this.$subscription) {
-      this.$subscription = this.store.pipe(select(fromDocSelectors.getPdfPosition)).subscribe(pdfPosition => {
-          this.pdfPosition = pdfPosition;
-          this.onPositionUpdate(pdfPosition);
-        });
-      this.$subscription.add(this.store.pipe(select(fromIcpSelectors.getPresenter)).subscribe(presenter => {
-        this.presenter = presenter;
-      }));
-      this.$subscription.add(this.socketService.newParticipantJoined().subscribe(() => this.onNewParticipantJoined()));
-    }
-  }
-
-  unsubscribe() {
-    if (this.$subscription) {
-      this.$subscription.unsubscribe();
-      this.$subscription = undefined;
-    }
-  }
-
-  onPositionUpdate(pdfPosition: PdfPosition) {
-    const screen: IcpScreenUpdate = { pdfPosition, document: undefined };
-    this.socketService.updateScreen(screen);
-  }
-
-  onNewParticipantJoined() {
-    this.onPositionUpdate(this.pdfPosition);
-    this.socketService.updatePresenter(this.presenter);
-  }
-}

package/projects/media-viewer/src/lib/icp/icp-session-api.service.spec.ts

@@ -1,52 +0,0 @@
-import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
-import { IcpSessionApiService } from './icp-session-api.service';
-import { IcpSession } from './icp.interfaces';
-import { fakeAsync, inject, TestBed } from '@angular/core/testing';
-
-describe('IcpSessionApiService', () => {
-
-  let httpMock: HttpTestingController;
-  let api: IcpSessionApiService;
-
-  const caseId = 'caseId';
-  const documentId = 'documentId';
-  const session: IcpSession = {
-    caseId: 'caseId',
-    documentId: documentId,
-    sessionId: 'sessionId',
-    dateOfHearing: new Date(),
-    connectionUrl: ''
-  };
-  const username = 'name';
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      providers: [
-        IcpSessionApiService
-      ],
-      imports: [
-        HttpClientTestingModule
-      ]
-    });
-
-    api = TestBed.inject(IcpSessionApiService);
-    api.ICP_SESSION_API = '/my-context-path';
-    httpMock = TestBed.inject(HttpTestingController);
-  });
-
-  it('should be created', inject([IcpSessionApiService], (service: IcpSessionApiService) => {
-    expect(service).toBeTruthy();
-  }));
-
-  it('load icp session', fakeAsync((done) => {
-    api.loadSession({ caseId: 'caseId', documentId: 'documentId' })
-      .subscribe(response => {
-        expect(response.username).toBe(username);
-        expect(response.session).toBe(session);
-      }, error => done(error));
-
-    const req = httpMock.expectOne(`/my-context-path/${caseId}/${documentId}`);
-    expect(req.request.method).toBe('GET');
-    req.flush({ session, username });
-  }));
-});

package/projects/media-viewer/src/lib/icp/icp-session-api.service.ts

@@ -1,26 +0,0 @@
-import { Injectable } from '@angular/core';
-import { HttpClient } from '@angular/common/http';
-import { map } from 'rxjs/operators';
-import { Observable } from 'rxjs';
-import { IcpSession } from './icp.interfaces';
-
-@Injectable({ providedIn: 'root' })
-export class IcpSessionApiService {
-
-  public ICP_SESSION_API = '/icp/sessions';
-
-  constructor(private readonly httpClient: HttpClient) { }
-
-  public loadSession(payload: { caseId: string, documentId: string }): Observable<any> {
-    return this.httpClient
-      .get<{ username: string, session: IcpSession }>(`${this.ICP_SESSION_API}/${payload.caseId}/${payload.documentId}`,
-        { observe: 'response', withCredentials: true })
-      .pipe(map(response => {
-        const token = response.headers.get('X-Access-Token');
-        return { 
-          ...response.body, 
-          token
-        };
-      }));
-  }
-}