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

package/projects/media-viewer/src/lib/store/selectors/bookmark.selectors.ts

@@ -0,0 +1,73 @@
+import { createSelector } from '@ngrx/store';
+
+import * as fromFeature from '../reducers/reducers';
+import * as fromBookmarks from '../reducers/bookmarks.reducer';
+import { generateBookmarkNodes } from '../bookmarks-store-utils';
+import * as fromDocument from './document.selectors';
+
+export const getBookmarkState = createSelector(
+  fromFeature.getMVState,
+  (state: fromFeature.State) => state.bookmarks
+);
+
+export const getBookmarkPages = createSelector(
+  getBookmarkState,
+  fromBookmarks.getBookmarkPageEnt
+);
+
+export const getBookmarkEntities = createSelector(
+  getBookmarkState,
+  fromBookmarks.getBookmarkEnts
+);
+
+export const getBookmarkNodes = createSelector(
+  getBookmarkEntities,
+  (entities) => generateBookmarkNodes(entities)
+);
+
+export const getEditableBookmark = createSelector(
+  getBookmarkState,
+  fromBookmarks.getEditBookmark
+);
+
+export const getScrollTop = createSelector(
+  getBookmarkState,
+  fromBookmarks.getScrollTop
+);
+
+export const getBookmarkInfo = createSelector(
+  getBookmarkNodes,
+  fromDocument.getDocumentId,
+  fromDocument.getPdfPosition,
+  fromDocument.getPages,
+  (bookmarkNodes, docId, pdfPosition, pages) => {
+    return {
+      pageNumber: pdfPosition.pageNumber - 1,
+      xCoordinate: pdfPosition.left,
+      yCoordinate: ((pages[pdfPosition.pageNumber].styles.height)
+        - (pdfPosition.top * (pages[pdfPosition.pageNumber].viewportScale)))
+        / parseFloat(pages[pdfPosition.pageNumber].scaleRotation.scale),
+      previous: bookmarkNodes.length > 0 ? bookmarkNodes.sort((a, b) => a.index - b.index)[bookmarkNodes.length - 1].id : undefined,
+      documentId: docId
+    };
+  }
+);
+
+export const getBookmarksPerPage = createSelector(
+  fromDocument.getPages,
+  getBookmarkPages,
+  (pages, pageEnt) => {
+    if (pages && pageEnt) {
+      const arr = [];
+      Object.keys(pages).forEach(key => {
+        const pageIdx = Number(key) - 1; // -1 as the thisPages array is 0 indexed
+        const thisPage = pageEnt[pageIdx];
+        arr.push({
+          bookmark: thisPage ? thisPage : [],
+          styles: pages[key].styles
+        });
+      });
+      return arr;
+    }
+  }
+);

package/projects/media-viewer/src/lib/store/selectors/document.selectors.spec.ts

@@ -0,0 +1,53 @@
+import { TestBed } from '@angular/core/testing';
+import { select, Store, StoreModule } from '@ngrx/store';
+import { reducers, State } from '../reducers/reducers';
+
+import * as fromSelectors from './document.selectors';
+import * as fromActions from '../actions/document.actions';
+
+describe('Document selectors', () => {
+  let store: Store<State>;
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        StoreModule.forRoot({}),
+        StoreModule.forFeature('media-viewer', reducers),
+      ],
+    });
+    store = TestBed.inject(Store);
+    spyOn(store, 'dispatch').and.callThrough();
+  });
+
+  describe('getPages', () => {
+    it('should return document pages', () => {
+      let result;
+      store.pipe(select(fromSelectors.getPages)).subscribe(value => {
+        result = value;
+      });
+      const payload: any = [{
+        div: {},
+        scale: 1,
+        rotation: 0,
+        id: '1',
+        viewportScale: 1.33333
+      }];
+      store.dispatch(new fromActions.AddPages(payload));
+      const expected = {
+        '1': {
+          styles: {
+            left: undefined,
+            height: undefined,
+            width: undefined
+          },
+          scaleRotation: {
+            scale: 1,
+            rotation: 0
+          },
+          viewportScale: 1.33333
+        }
+      };
+      expect(result).toEqual(expected);
+    });
+  });
+
+});

package/projects/media-viewer/src/lib/store/selectors/document.selectors.ts

@@ -0,0 +1,49 @@
+import { createSelector } from '@ngrx/store';
+
+import * as fromFeature from '../reducers/reducers';
+import * as fromDocument from '../reducers/document.reducer';
+
+export const getDocumentState = createSelector(
+  fromFeature.getMVState,
+  (state: fromFeature.State) => state.document
+);
+
+export const getPages = createSelector(
+  getDocumentState,
+  fromDocument.getDocPages
+);
+
+export const getPageList = createSelector(
+  getPages,
+  (pages) => Object.values(pages)
+);
+
+export const getDocumentId = createSelector(
+  getDocumentState,
+  fromDocument.getDocId
+);
+
+export const getPdfPosition = createSelector(
+  getDocumentState,
+  fromDocument.getPdfPos
+);
+
+export const getPageDifference = createSelector(
+  getDocumentState,
+  fromDocument.getHasDifferentPageSizes
+);
+
+export const getConvertedDocument = createSelector(
+  getDocumentState,
+  fromDocument.getConvertedDocument
+);
+
+export const getRotation = createSelector(
+  getDocumentState,
+  fromDocument.getRotation
+);
+
+export const rotationLoaded = createSelector(
+  getDocumentState,
+  fromDocument.rotationLoaded
+);

package/projects/media-viewer/src/lib/store/selectors/icp.selectors.spec.ts

@@ -0,0 +1,140 @@
+import { select, Store, StoreModule } from '@ngrx/store';
+import { reducers, State } from '../reducers/reducers';
+import { TestBed } from '@angular/core/testing';
+import * as fromSelectors from './icp.selectors';
+import * as fromActions from '../actions/icp.actions';
+
+const icpState = {
+  session: {
+    caseId: 'caseId',
+    sessionId: 'sessionId',
+    documentId: "documentId",
+    dateOfHearing: new Date(),
+    connectionUrl: 'url-connectionstring'
+  },
+  client: {
+    id: 'clientId',
+    username: 'name'
+  },
+  presenter: {
+    id: 'presenterId',
+    username: 'name'
+  },
+  participants: [{
+    id: 'participantId',
+    username: 'name'
+  }]
+};
+
+describe('Icp selectors', () => {
+  let store: Store<State>;
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        StoreModule.forRoot({}),
+        StoreModule.forFeature('media-viewer', reducers),
+      ],
+    });
+    store = TestBed.inject(Store);
+    spyOn(store, 'dispatch').and.callThrough();
+  });
+
+  describe('getIcpState', () => {
+    it('should return the state', () => {
+      let result;
+      store.pipe(select(fromSelectors.getIcpState)).subscribe(value => result = value);
+
+      const joinPayload = {
+        session: icpState.session,
+        participantInfo: {
+          client: icpState.client,
+          presenter: icpState.presenter
+        }
+      };
+      store.dispatch(new fromActions.IcpSocketSessionJoined(joinPayload));
+
+      const participantPayload = { 'participantId': 'name' };
+      store.dispatch(new fromActions.IcpParticipantListUpdated(participantPayload));
+
+      expect(result).toEqual(icpState);
+    });
+  });
+
+  describe('getCaseId', () => {
+    it('should return the case id', () => {
+      let result;
+      store.pipe(select(fromSelectors.getCaseId)).subscribe(value => result = value);
+
+      store.dispatch(new fromActions.SetCaseId(icpState.session.caseId));
+      expect(result).toEqual(icpState.session.caseId);
+    });
+  });
+
+  describe('getIcpSession', () => {
+    it('should return the session', () => {
+      let result;
+      store.pipe(select(fromSelectors.getIcpSession)).subscribe(value => result = value);
+
+      const payload = {
+        session: icpState.session,
+        participantInfo: {
+          client: icpState.client,
+          presenter: icpState.presenter
+        }
+      };
+      store.dispatch(new fromActions.IcpSocketSessionJoined(payload));
+      expect(result).toEqual(icpState.session);
+    });
+  });
+
+  describe('getIcpPresenter', () => {
+    it('should return icp presenter', () => {
+      let result;
+      store.pipe(select(fromSelectors.getPresenter)).subscribe(value => result = value);
+      store.dispatch(new fromActions.IcpPresenterUpdated(icpState.presenter));
+      expect(result).toEqual(icpState.presenter);
+    });
+  });
+
+  describe('getIcpPresenterName', () => {
+    it('should return the presenter name', () => {
+      let result;
+      store.pipe(select(fromSelectors.getPresenterName)).subscribe(value => result = value);
+      store.dispatch(new fromActions.IcpPresenterUpdated(icpState.presenter));
+      expect(result).toEqual(icpState.presenter.username);
+    });
+  });
+
+  describe('isPresenter', () => {
+    it('should return true if client is presenter', () => {
+      let result;
+      store.pipe(select(fromSelectors.isPresenter)).subscribe(value => result = value);
+
+      const payload = {
+        session: icpState.session,
+        participantInfo: {
+          client: icpState.client,
+          presenter: icpState.presenter
+        }
+      };
+      store.dispatch(new fromActions.IcpSocketSessionJoined(payload));
+
+      const newPresenter = {
+        id: 'clientId',
+        username: 'name'
+      };
+      store.dispatch(new fromActions.IcpPresenterUpdated(newPresenter));
+      expect(result).toEqual(true);
+    });
+  });
+
+  describe('getIcpParticipantsList', () => {
+    it('should return the participants list', () => {
+      let result;
+      store.pipe(select(fromSelectors.getParticipants)).subscribe(value => result = value);
+      store.dispatch(new fromActions.IcpParticipantListUpdated({ 'participantId': 'name' }));
+      expect(result).toEqual(icpState.participants);
+    });
+  });
+
+});

package/projects/media-viewer/src/lib/store/selectors/icp.selectors.ts

@@ -0,0 +1,44 @@
+import { createSelector } from '@ngrx/store';
+import * as fromFeature from '../reducers/reducers';
+import * as fromIcp from '../reducers/icp.reducer';
+
+export const getIcpState = createSelector(
+  fromFeature.getMVState,
+  (state: fromFeature.State) =>  state.icp
+);
+
+export const getIcpSession = createSelector(
+  getIcpState,
+  fromIcp.getIcpSession
+);
+
+export const getCaseId = createSelector(
+  getIcpSession,
+  session => session === null ? null : session.caseId
+);
+
+export const getPresenter = createSelector(
+  getIcpState,
+  fromIcp.getPresenter
+);
+
+export const getPresenterName = createSelector(
+  getPresenter,
+  presenter => presenter === null ? null : presenter.username
+);
+
+export const getClient = createSelector(
+  getIcpState,
+  fromIcp.getClient
+);
+
+export const isPresenter = createSelector(
+  getPresenter,
+  getClient,
+  (presenter, client) => presenter === null ? undefined : presenter.id === client.id // isPresenter is called when = false.
+);
+
+export const getParticipants = createSelector(
+  getIcpState,
+  fromIcp.getParticipants
+);

package/projects/media-viewer/src/lib/store/selectors/redaction.selectors.ts

@@ -0,0 +1,57 @@
+import {createSelector} from '@ngrx/store';
+import * as fromFeature from '../reducers/reducers';
+import * as fromRedactions from '../reducers/redaction.reducer';
+import * as fromDocument from './document.selectors';
+
+export const getRedactionState = createSelector(
+  fromFeature.getMVState,
+  (state: fromFeature.State) =>  state.redactions
+);
+
+export const getRedactionPages = createSelector(
+  getRedactionState,
+  fromRedactions.getPageEnt
+);
+
+export const getSelected = createSelector(
+  getRedactionState,
+  fromRedactions.getSelectedRedaction
+);
+
+export const getRedactedDocumentInfo = createSelector(
+  getRedactionState,
+  fromRedactions.getRedactedDocInfo
+);
+
+export const getRedactionEnt = createSelector(
+  getRedactionState,
+  fromRedactions.getRedactionEnt
+);
+
+export const getRedactionArray = createSelector(
+  getRedactionEnt,
+  fromDocument.getDocumentId,
+  (ent, documentId) => {
+    const redactions = Object.keys(ent).map(key => ent[key]);
+    return { redactions, documentId };
+  }
+);
+
+export const getRedactionsPerPage = createSelector(
+  fromDocument.getPages,
+  getRedactionPages,
+  (pages, pageEnt) => {
+    if (pages && pageEnt) {
+      const arr = [];
+      Object.keys(pages).forEach(key => {
+        arr.push({
+          anno: pageEnt[key] ? pageEnt[key] : [],
+          styles: pages[key].styles
+        });
+      });
+
+      return arr;
+    }
+  }
+);
+

package/projects/media-viewer/src/lib/store/selectors/tag.selectors.spec.ts

@@ -0,0 +1,185 @@
+import { TestBed } from '@angular/core/testing';
+import { select, Store, StoreModule } from '@ngrx/store';
+
+import * as fromSelectors from './tag.selectors';
+import * as fromActions from '../actions/annotation.actions';
+import * as fromTags from '../actions/tag.actions';
+import { initialTagState, reducers, State } from '../reducers/reducers';
+
+const comment = {
+  createdBy: 'b3afcb72-5e30-49cd-b833-88ab7aab619b',
+  createdByDetails: {
+    forename: 'EM',
+    surname: 'showcase',
+    email: 'emshowcaseuser@hmcts.net'
+  },
+  lastModifiedByDetails: {
+    forename: 'EM',
+    surname: 'showcase',
+    email: 'emshowcaseuser@hmcts.net'
+  },
+  createdDate: '2020-04-17T12:54:26.117Z',
+  lastModifiedBy: 'b3afcb72-5e30-49cd-b833-88ab7aab619b',
+  lastModifiedDate: '2020-04-17T12:54:34.417Z',
+  id: '9f84cb89-8286-4602-a3b9-672c15efc7eb',
+  content: 'this is my comment',
+  annotationId: 'c3adf070-353b-45d2-9a84-c912851cf34d'
+};
+const tags = [
+  {
+    name: 'important',
+    createdBy: 'b3afcb72-5e30-49cd-b833-88ab7aab619b',
+    label: 'important',
+    color: null
+  }
+];
+const anno = {
+  createdBy: 'b3afcb72-5e30-49cd-b833-88ab7aab619b',
+  createdByDetails: {
+    forename: 'EM',
+    surname: 'showcase',
+    email: 'emshowcaseuser@hmcts.net'
+  },
+  lastModifiedByDetails: {
+    forename: 'EM',
+    surname: 'showcase',
+    email: 'emshowcaseuser@hmcts.net'
+  },
+  createdDate: '2020-04-17T11:52:06.344Z',
+  lastModifiedBy: 'b3afcb72-5e30-49cd-b833-88ab7aab619b',
+  lastModifiedDate: '2020-04-17T11:52:06.344Z',
+  id: 'c3adf070-353b-45d2-9a84-c912851cf34d',
+  page: 1,
+  color: 'FFFF00',
+  annotationSetId: '200bcec6-d9cf-4866-b208-f2cc5db77279',
+  comments: [
+    comment
+  ],
+  tags,
+  rectangles: [
+    {
+      createdBy: 'b3afcb72-5e30-49cd-b833-88ab7aab619b',
+      createdByDetails: {
+        forename: 'EM',
+        surname: 'showcase',
+        email: 'emshowcaseuser@hmcts.net'
+      },
+      lastModifiedByDetails: {
+        forename: 'EM',
+        surname: 'showcase',
+        email: 'emshowcaseuser@hmcts.net'
+      },
+      createdDate: '2020-04-17T11:52:06.409Z',
+      lastModifiedBy: 'b3afcb72-5e30-49cd-b833-88ab7aab619b',
+      lastModifiedDate: '2020-04-17T11:52:06.409Z',
+      id: '10baecbb-7882-4efc-8da7-b694b180309e',
+      x: 148,
+      y: 673,
+      width: 325,
+      height: 173,
+      annotationId: 'c3adf070-353b-45d2-9a84-c912851cf34d'
+    }
+  ],
+  type: 'highlight',
+  positionTop: 673
+};
+
+
+describe('Tags selectors', () => {
+  let store: Store<State>;
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        StoreModule.forRoot({}),
+        StoreModule.forFeature('media-viewer', reducers),
+      ],
+    });
+    store = TestBed.inject(Store);
+    spyOn(store, 'dispatch').and.callThrough();
+  });
+
+  describe('getTagsRootState', () => {
+    it('should return initial state', () => {
+      let result;
+      store.pipe(select(fromSelectors.getTagsRootState)).subscribe(value => {
+        result = value;
+      });
+      expect(result).toEqual(initialTagState);
+    });
+  });
+
+  describe('getTagEntities', () => {
+    it('should return tag entities', () => {
+      let result;
+      store.pipe(select(fromSelectors.getTagEntities)).subscribe(value => {
+        result = value;
+      });
+
+      store.dispatch(new fromActions.SaveAnnotationSuccess(anno));
+      const expected = {
+        important: {
+          'c3adf070-353b-45d2-9a84-c912851cf34d': 'c3adf070-353b-45d2-9a84-c912851cf34d'
+        }
+      };
+      expect(result).toEqual(expected);
+    });
+  });
+
+  describe('getTagFilters', () => {
+    it('should return array of tag filters', () => {
+      let result;
+      store.pipe(select(fromSelectors.getTagFilters)).subscribe(value => {
+        result = value;
+      });
+
+      store.dispatch(new fromActions.SaveAnnotationSuccess(anno));
+      store.dispatch(new fromTags.AddFilterTags({ important: true }));
+      expect(result).toEqual(['important']);
+    });
+  });
+
+  describe('getTagFiltered', () => {
+    it('should return filtered tags', () => {
+      let result;
+      store.pipe(select(fromSelectors.getTagFiltered)).subscribe(value => {
+        result = value;
+      });
+
+      store.dispatch(new fromActions.SaveAnnotationSuccess(anno));
+      store.dispatch(new fromTags.AddFilterTags({ important: true }));
+      const expected = {
+        'c3adf070-353b-45d2-9a84-c912851cf34d': 'c3adf070-353b-45d2-9a84-c912851cf34d'
+      };
+      expect(result).toEqual(expected);
+    });
+  });
+
+  describe('getFilteredPageEntities', () => {
+    it('should return filtered page annotations', () => {
+      let result;
+      store.pipe(select(fromSelectors.getFilteredPageEntities)).subscribe(value => {
+        result = value;
+      });
+
+      store.dispatch(new fromActions.SaveAnnotationSuccess(anno));
+      store.dispatch(new fromTags.AddFilterTags({ important: true }));
+      const expected = {
+        '1': [anno]
+      };
+
+      expect(result).toEqual(expected);
+    });
+  });
+
+  describe('getAllTagsArr', () => {
+    it('should return filtered page annotations', () => {
+      let result;
+      store.pipe(select(fromSelectors.getAllTagsArr)).subscribe(value => {
+        result = value;
+      });
+
+      store.dispatch(new fromActions.SaveAnnotationSuccess(anno));
+      expect(result).toEqual([{ key: 'important', length: 1 }]);
+    });
+  });
+});

package/projects/media-viewer/src/lib/store/selectors/tag.selectors.ts

@@ -0,0 +1,38 @@
+import {createSelector} from '@ngrx/store';
+import * as fromFeature from '../reducers/reducers';
+import * as fromTags from '../reducers/tags.reducer';
+
+export const getTagsRootState = createSelector(
+  fromFeature.getMVState,
+  (state: fromFeature.State) =>  state.tags
+);
+
+export const getTagEntities = createSelector(
+  getTagsRootState,
+  fromTags.getTagNameEnt
+);
+
+export const getTagFilters = createSelector(
+  getTagsRootState,
+  fromTags.getFilters
+);
+
+export const getTagFiltered = createSelector(
+  getTagsRootState,
+  fromTags.getFilteredComments
+);
+
+export const getFilteredPageEntities = createSelector(
+  getTagsRootState,
+  fromTags.getFilteredPageEnt
+);
+
+export const getAllTagsArr = createSelector(
+  getTagEntities,
+  (tagEnt) => Object.keys(tagEnt).map(key => {
+    return {
+      key,
+      length: Object.keys(tagEnt[key]).length
+    };
+  })
+);