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

package/projects/media-viewer/src/lib/store/reducers/annotations.reducer.spec.ts

@@ -0,0 +1,153 @@
+import { mockComments } from 'test/mocks/data/mock-comments';
+import { Comment } from '../../annotations/comment-set/comment/comment.model';
+import * as fromAnnotations from './annotations.reducer';
+import * as fromActions from '../actions/annotation.actions';
+import { Filters } from '../models/filters.interface';
+
+const annotationSet = {
+  annotations: [{
+    createdBy: 'fab3a662-4375-42e8-850c-664b9daaa716',
+    annotationId: '1234',
+    createdByDetails: {
+      forename: 'EM',
+      surname: 'showcase',
+      email: 'emshowcaseuser@hmcts.net'
+    },
+    lastModifiedByDetails: {
+      forename: 'EM',
+      surname: 'showcase',
+      email: 'emshowcaseuser@hmcts.net'
+    },
+    createdDate: '2020-03-25T11:15:03.601Z',
+    lastModifiedBy: 'fab3a662-4375-42e8-850c-664b9daaa716',
+    lastModifiedDate: '2020-03-25T11:15:03.601Z',
+    id: '961bd154-d0d4-40d2-bb9d-f0f0af772473',
+    page: 1,
+    color: 'FFFF00',
+    annotationSetId: null,
+    comments: [],
+    tags: [],
+    rectangles: [
+      {
+        createdBy: 'fab3a662-4375-42e8-850c-664b9daaa716',
+        createdByDetails: {
+          forename: 'EM',
+          surname: 'showcase',
+          email: 'emshowcaseuser@hmcts.net'
+        },
+        lastModifiedByDetails: {
+          forename: 'EM',
+          surname: 'showcase',
+          email: 'emshowcaseuser@hmcts.net'
+        },
+        createdDate: '2020-03-25T11:15:03.659Z',
+        lastModifiedBy: 'fab3a662-4375-42e8-850c-664b9daaa716',
+        lastModifiedDate: '2020-03-25T11:15:03.659Z',
+        id: 'b6239fb3-062e-4690-82e4-ac6d2f8e5769',
+        x: 174,
+        y: 159,
+        width: 185,
+        height: 139,
+        annotationId: '961bd154-d0d4-40d2-bb9d-f0f0af772473'
+      }
+    ],
+    type: 'highlight'
+  }]};
+
+describe('AnnotationReducer', () => {
+  describe('undefined action', () => {
+    it('should return the default state', () => {
+      const { initialState } = fromAnnotations;
+      const action = {} as any;
+      const state = fromAnnotations.reducer(undefined, action);
+
+      expect(state).toBe(initialState);
+    });
+  });
+
+  describe('LOAD_ANNOTATION_SET action', () => {
+    it('should set loading to true', () => {
+      const { initialState } = fromAnnotations;
+      const action = new fromActions.LoadAnnotationSet('12345');
+      const state = fromAnnotations.reducer(initialState, action);
+      expect(state.loading).toEqual(true);
+    });
+  });
+
+  describe('LOAD_ANNOTATION_SET_SUCCESS action', () => {
+    it('should set annotation entities page entities and comment entities', () => {
+      const { initialState } = fromAnnotations;
+      const payload: any = annotationSet;
+      const action = new fromActions.LoadAnnotationSetSucess(payload);
+      const state = fromAnnotations.reducer(initialState, action);
+      expect(state.loading).toEqual(false);
+      expect(state.loaded).toEqual(true);
+      // todo add the other exception once be is finished.
+    });
+  });
+
+  describe('SAVE_ANNOTATION_SET_SUCCESS action', () => {
+    it('should set annotation entities page entities and comment entities', () => {
+      const { initialState } = fromAnnotations;
+      const payload: any = annotationSet;
+      const action = new fromActions.SaveAnnotationSetSuccess(payload);
+      const state = fromAnnotations.reducer(initialState, action);
+      expect(state.loading).toEqual(false);
+      expect(state.loaded).toEqual(true);
+    });
+  });
+
+  describe('DELETE_ANNOTATION_SUCCESS action', () => {
+    it('should delete annotations', () => {
+      const { initialState } = fromAnnotations;
+      const payload1: any = { status: 200, body: annotationSet };
+      const action1 = new fromActions.LoadAnnotationSetSucess(payload1);
+      const state = fromAnnotations.reducer(initialState, action1);
+      const payload2 = annotationSet.annotations[0].id;
+      const action = new fromActions.DeleteAnnotationSuccess(payload2);
+      const state2 = fromAnnotations.reducer(state, action);
+      expect(state2.annotationEntities).toEqual({});
+      expect(state2.annotationPageEntities).toEqual({1: []});
+    });
+  });
+
+  describe('ADD_OR_EDIT_COMMENT action', () => {
+    it('should change comments', () => {
+      const { initialState } = fromAnnotations;
+      const payload: Comment = mockComments[0];
+      const action = new fromActions.AddOrEditComment(payload);
+      const state = fromAnnotations.reducer(initialState, action);
+      expect(state.commentEntities[mockComments[0].annotationId]).toEqual(mockComments[0]);
+    });
+  });
+
+  describe('SELECT_ANNOTATION action', () => {
+    it('should change comments', () => {
+      const { initialState } = fromAnnotations;
+      const payload2 = {annotationId: '1234', editable: true, selected: true};
+      const action2 = new fromActions.SelectedAnnotation(payload2);
+      const state2 =  fromAnnotations.reducer(initialState, action2);
+      expect(state2.selectedAnnotation).toEqual(payload2);
+    });
+  });
+
+  describe('SEARCH_COMMENT action', () => {
+    it('should change comments', () => {
+      const { initialState } = fromAnnotations;
+      const payload2 = 'MY SEARCH TEXT';
+      const action2 = new fromActions.SearchComment(payload2);
+      const state2 =  fromAnnotations.reducer(initialState, action2);
+      expect(state2.commentSearchQueries.commentSearch).toEqual(payload2);
+    });
+  });
+
+  describe('APPLY_COMMENT_SUMMARY_FILTER action', () => {
+    it('should add filters to the state', () => {
+      const { initialState } = fromAnnotations;
+      const payload: Filters = { tagFilters: { color: 'blue' }};
+      const action = new fromActions.ApplyCommentSymmaryFilter(payload);
+      const state =  fromAnnotations.reducer(initialState, action);
+      expect(state.commentSummaryFilters).toEqual({ hasFilter: true, filters: payload });
+    });
+  });
+});

package/projects/media-viewer/src/lib/store/reducers/annotations.reducer.ts

@@ -0,0 +1,246 @@
+import { v4 as uuid } from 'uuid';
+import * as fromAnnotations from '../actions/annotation.actions';
+import { Annotation } from '../../annotations/annotation-set/annotation-view/annotation.model';
+import { Comment } from '../../annotations/comment-set/comment/comment.model';
+import { StoreUtils } from '../store-utils';
+import { SelectionAnnotation } from '../../annotations/models/event-select.model';
+import { Filters } from '../models/filters.interface';
+
+export interface AnnotationSetState {
+  annotationSet: any;
+  annotationEntities: { [id: string]: any };
+  annotationPageEntities: { [id: string]: Annotation[] };
+  commentEntities: { [id: string]: Comment };
+  selectedAnnotation: SelectionAnnotation;
+  commentSearchQueries: { commentSearch: string };
+  commentSummaryFilters: { hasFilter: boolean; filters: Filters };
+  loaded: boolean;
+  loading: boolean;
+}
+
+export const initialState: AnnotationSetState = {
+  annotationSet: {},
+  annotationEntities: {},
+  commentEntities: {},
+  annotationPageEntities: {},
+  selectedAnnotation: null,
+  commentSearchQueries: { commentSearch: '' },
+  commentSummaryFilters: { hasFilter: false, filters: {} },
+  loading: false,
+  loaded: false,
+};
+
+export function reducer(
+  state = initialState,
+  action: fromAnnotations.AnnotationsActions
+): AnnotationSetState {
+  switch (action.type) {
+
+    case fromAnnotations.LOAD_ANNOTATION_SET: {
+      const annotationSet = {
+        ...state.annotationSet,
+        documentId: action.payload
+      };
+      return {
+        ...initialState,
+        annotationSet,
+        loading: true
+      };
+    }
+    case fromAnnotations.LOAD_ANNOTATION_SET_SUCCESS:
+    case fromAnnotations.LOAD_ANNOTATION_SET_FAIL: {
+      const annotationSet = action.payload.status === 200 ? action.payload.body :
+        {
+          ...state.annotationSet,
+          annotations: [],
+          id: uuid()
+        };
+      const annotationEntities = StoreUtils.generateAnnotationEntities(annotationSet.annotations);
+      const annotationPageEntities = StoreUtils.groupByKeyEntities(annotationSet.annotations, 'page');
+      const commentEntities = StoreUtils.generateCommentsEntities(annotationSet.annotations);
+      return {
+        ...state,
+        annotationSet,
+        annotationEntities,
+        annotationPageEntities,
+        commentEntities,
+        loading: false,
+        loaded: true
+      };
+    }
+
+    case fromAnnotations.SAVE_ANNOTATION_SET_SUCCESS: {
+      const anno = action.payload.annotations;
+      const annEntities = {
+        ...state.annotationEntities,
+        ...anno
+      };
+      const annotArray = Object.keys(annEntities).map(key => annEntities[key]);
+      const annotationEntities = StoreUtils.generateAnnotationEntities(annotArray);
+      const annotationPageEntities = StoreUtils.groupByKeyEntities(annotArray, 'page');
+      const commentEntities = StoreUtils.generateCommentsEntities(annotArray);
+      const selectedAnnotation = {
+        ...state.selectedAnnotation,
+        ...anno,
+        editable: false
+      };
+      return {
+        ...state,
+        annotationEntities,
+        annotationPageEntities,
+        commentEntities,
+        selectedAnnotation,
+        loading: false,
+        loaded: true
+      };
+
+    }
+
+    case fromAnnotations.SAVE_ANNOTATION_SUCCESS: {
+      const anno = action.payload;
+      const annEntities = {
+        ...state.annotationEntities,
+        [anno.id]: anno
+      };
+      const annotArray = Object.keys(annEntities).map(key => annEntities[key]);
+      const annotationEntities = StoreUtils.generateAnnotationEntities(annotArray);
+      const annotationPageEntities = StoreUtils.groupByKeyEntities(annotArray, 'page');
+      const commentEntities = StoreUtils.generateCommentsEntities(annotArray);
+      const selectedAnnotation = {
+        ...state.selectedAnnotation,
+        annotationId: anno.id,
+        editable: false
+      };
+      return {
+        ...state,
+        annotationEntities,
+        annotationPageEntities,
+        commentEntities,
+        selectedAnnotation,
+        loading: false,
+        loaded: true
+      };
+    }
+
+    case fromAnnotations.DELETE_ANNOTATION_SUCCESS: {
+      const id = action.payload;
+      const page = state.annotationEntities[id].page;
+      const annotationEntities = {
+        ...state.annotationEntities
+      };
+      delete annotationEntities[id];
+      const pageAnnotationsRemoved = [
+        ...state.annotationPageEntities[page].filter(anno => anno.id !== id)
+      ];
+      const annotationPageEntities = {
+        ...state.annotationPageEntities,
+        [page]: pageAnnotationsRemoved
+      };
+      const commentEntities = {
+        ...state.commentEntities
+      };
+      if (state.commentEntities[id]) {
+        delete commentEntities[id];
+      }
+      return {
+        ...state,
+        annotationEntities,
+        annotationPageEntities,
+        commentEntities
+      };
+    }
+
+    case fromAnnotations.ADD_OR_EDIT_COMMENT: {
+      const comment = {
+        [action.payload.annotationId]: action.payload
+      };
+      const comments = {
+        ...state.commentEntities,
+        ...comment
+      };
+      return {
+        ...state,
+        commentEntities: comments
+      };
+    }
+
+    case fromAnnotations.SELECT_ANNOTATION: {
+      const payload = action.payload;
+      const commentEntity = {
+        ...state.commentEntities[payload.annotationId],
+        editable: payload.editable,
+        selected: payload.selected
+      };
+
+      const resetCommentEntSelect = StoreUtils.resetCommentEntSelect({ ...state.commentEntities });
+
+      const commentEntities = payload.annotationId && state.commentEntities[payload.annotationId] ? {
+        ...resetCommentEntSelect,
+        [payload.annotationId]: commentEntity
+      } : { ...resetCommentEntSelect };
+
+      return {
+        ...state,
+        commentEntities,
+        selectedAnnotation: action.payload
+      };
+    }
+
+    case fromAnnotations.SEARCH_COMMENT: {
+      const commentSearchQueries = {
+        ...state.commentSearchQueries,
+        commentSearch: action.payload
+      };
+
+      const commentEntities = StoreUtils.resetCommentEntSelect({ ...state.commentEntities });
+      return {
+        ...state,
+        commentEntities,
+        commentSearchQueries
+      };
+    }
+
+    case fromAnnotations.APPLY_COMMENT_SUMMARY_FILTER: {
+      const payload = action.payload;
+      const hasTagFilter = () => {
+        let isFiltered = false;
+        if (payload.tagFilters) {
+          Object.keys(payload.tagFilters).map(filter => {
+            if (payload.tagFilters[filter] && !isFiltered) {
+              isFiltered = true;
+            }
+          });
+        }
+        return isFiltered;
+      };
+      const hasFilter = (hasTagFilter() || !!payload.dateRangeFrom || !!payload.dateRangeTo);
+      const commentSummaryFilters = {
+        hasFilter,
+        filters: payload
+      };
+      return {
+        ...state,
+        commentSummaryFilters: commentSummaryFilters
+      };
+    }
+
+    case fromAnnotations.CLEAR_COMMENT_SUMMARY_FILTER: {
+
+      return {
+        ...state,
+        commentSummaryFilters: { ...initialState.commentSummaryFilters }
+      };
+    }
+  }
+
+
+  return state;
+}
+
+export const getAnnoSet = (state: AnnotationSetState) => state.annotationSet;
+export const getCommentEnts = (state: AnnotationSetState) => state.commentEntities;
+export const getAnnoPageEnt = (state: AnnotationSetState) => state.annotationPageEntities;
+export const getAnnoEnt = (state: AnnotationSetState) => state.annotationEntities;
+export const getSelectedAnno = (state: AnnotationSetState) => state.selectedAnnotation;
+export const commentSearchQ = (state: AnnotationSetState) => state.commentSearchQueries;
+export const getSummaryFilters = (state: AnnotationSetState) => state.commentSummaryFilters;

package/projects/media-viewer/src/lib/store/reducers/bookmarks.reducer.spec.ts

@@ -0,0 +1,141 @@
+import {
+  CreateBookmarkSuccess,
+  LoadBookmarks,
+  LoadBookmarksFailure,
+  LoadBookmarksSuccess,
+  DeleteBookmarkSuccess,
+  UpdateBookmarkSuccess, MoveBookmarkSuccess,
+  UpdateBookmarkScrollTop
+} from '../actions/bookmark.actions';
+import * as fromBookmarks from './bookmarks.reducer';
+import * as fromDocActions from '../actions/document.actions';
+import { TestBed } from '@angular/core/testing';
+import { Store, StoreModule } from '@ngrx/store';
+import { reducers, State } from './reducers';
+
+describe('BookmarksReducer', () => {
+
+  const bookmark = {
+    name: 'bookmark', xCoordinate: 100, yCoordinate: 50, documentId: 'documentId', id: 'id', pageNumber: 1, zoom: 1
+  } as any;
+
+  let store: Store<State>;
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        StoreModule.forRoot({}),
+        StoreModule.forFeature('media-viewer', reducers),
+      ],
+    });
+    store = TestBed.inject(Store);
+    spyOn(store, 'dispatch').and.callThrough();
+  });
+
+  it('should start loading  bookmarks', () => {
+    const state = fromBookmarks.bookmarksReducer(fromBookmarks.initialBookmarksState, new LoadBookmarks());
+
+    expect(state.bookmarks).toEqual([]);
+    expect(state.bookmarkEntities).toEqual({});
+    expect(state.editableBookmark).toBeUndefined();
+    expect(state.loaded).toBeFalse();
+    expect(state.loading).toBeTrue();
+  });
+
+  it('should load bookmarks on success', () => {
+    const bookmarks = [bookmark];
+    const res = { body: bookmarks, status: 200 };
+    const state = fromBookmarks.bookmarksReducer(fromBookmarks.initialBookmarksState, new LoadBookmarksSuccess(res));
+
+    expect(state.bookmarks).toEqual(bookmarks);
+    expect(state.loaded).toBeTrue();
+    expect(state.loading).toBeFalse();
+  });
+
+  it('should load bookmarks on failure', () => {
+    const res = { body: [], status: 404 };
+    const state = fromBookmarks.bookmarksReducer(fromBookmarks.initialBookmarksState, new LoadBookmarksFailure(res));
+
+    expect(state.bookmarks).toEqual([]);
+    expect(state.loaded).toBeTrue();
+    expect(state.loading).toBeFalse();
+  });
+
+  it('should load created bookmark', () => {
+    const state = fromBookmarks.bookmarksReducer(fromBookmarks.initialBookmarksState, new CreateBookmarkSuccess(bookmark));
+
+    expect(state.bookmarkEntities).toEqual({ [bookmark.id]: bookmark });
+    expect(state.loaded).toBeTrue();
+    expect(state.loading).toBeFalse();
+  });
+
+  it('should load update bookmark scroll top', () => {
+    const scrollTop = 195;
+    const state = fromBookmarks.bookmarksReducer(fromBookmarks.initialBookmarksState, new UpdateBookmarkScrollTop(scrollTop));
+
+    expect(state.scrollTop).toEqual(scrollTop);
+  });
+
+  it('should delete bookmark', () => {
+    const bookmarksState: fromBookmarks.BookmarksState = {
+      bookmarks: [bookmark],
+      bookmarkEntities: { [bookmark.id]: bookmark },
+      bookmarkPageEntities: { [bookmark.pageNumber]: [bookmark] },
+      editableBookmark: undefined,
+      loaded: true,
+      loading: false
+    };
+    store.dispatch(new fromDocActions.AddPages([{
+      div: {
+        offsetHeight: 466.666
+      },
+      scale: 1,
+      rotation: 0,
+      id: '1',
+      viewportScale: 1.33333
+    }]));
+
+    const state = fromBookmarks.bookmarksReducer(bookmarksState, new DeleteBookmarkSuccess([bookmark.id]));
+    expect(state.bookmarkEntities).toEqual({});
+    expect(state.loaded).toBeTrue();
+    expect(state.loading).toBeFalse();
+  });
+
+
+  it('should update bookmark', () => {
+    const bookmarksState: fromBookmarks.BookmarksState = {
+      bookmarks: [bookmark],
+      bookmarkEntities: { [bookmark.id]: bookmark },
+      bookmarkPageEntities: { [bookmark.pageNumber]: [bookmark] },
+
+      editableBookmark: undefined,
+      loaded: true,
+      loading: false
+    };
+    bookmark.name = 'updated bookmark';
+
+    const state = fromBookmarks.bookmarksReducer(bookmarksState, new UpdateBookmarkSuccess(bookmark));
+
+    expect(state.bookmarkEntities).toEqual({ [bookmark.id]: bookmark });
+    expect(state.loaded).toBeTrue();
+    expect(state.loading).toBeFalse();
+  });
+
+  it('should move bookmark on success', () => {
+    const bookmark2 = { ...bookmark, name: 'bookmark 2', id: 'id2', previous: 'id' };
+    const bookmarksState: fromBookmarks.BookmarksState = {
+      bookmarks: [{ ...bookmark }, bookmark2],
+      bookmarkEntities: { [bookmark.id]: { ...bookmark }, [bookmark2.id]: bookmark2 },
+      bookmarkPageEntities: { [bookmark.pageNumber]: [bookmark] },
+      editableBookmark: undefined,
+      loaded: true,
+      loading: false
+    };
+    bookmark.previous = 'id2';
+    bookmark2.previous = undefined;
+
+    const state = fromBookmarks.bookmarksReducer(bookmarksState, new MoveBookmarkSuccess([bookmark, bookmark2]));
+
+    expect(state.bookmarkEntities['id'].previous).toEqual('id2');
+    expect(state.bookmarkEntities['id2'].previous).toBeUndefined();
+  });
+});

package/projects/media-viewer/src/lib/store/reducers/bookmarks.reducer.ts

@@ -0,0 +1,150 @@
+import * as fromBookmarks from '../actions/bookmark.actions';
+import { Bookmark } from '../../viewers/pdf-viewer/side-bar/bookmarks/bookmarks.interfaces';
+import { StoreUtils } from '../store-utils';
+import { generateBookmarkEntities } from '../bookmarks-store-utils';
+
+export interface BookmarksState {
+  bookmarks: Bookmark[];
+  bookmarkEntities: { [id: string]: Bookmark };
+  bookmarkPageEntities: { [id: string]: any };
+  editableBookmark: string;
+  loaded: boolean;
+  loading: boolean;
+  scrollTop?: number;
+}
+
+export const initialBookmarksState: BookmarksState = {
+  bookmarks: [],
+  bookmarkEntities: {},
+  bookmarkPageEntities: {},
+  editableBookmark: undefined,
+  loaded: false,
+  loading: false,
+  scrollTop: null,
+};
+
+export function bookmarksReducer(state = initialBookmarksState,
+  action: fromBookmarks.BookmarksActions): BookmarksState {
+
+  switch (action.type) {
+
+    case fromBookmarks.LOAD_BOOKMARKS: {
+      return {
+        ...state,
+        loading: true
+      };
+    }
+
+    case fromBookmarks.LOAD_BOOKMARKS_SUCCESS:
+    case fromBookmarks.LOAD_BOOKMARKS_FAIL: {
+      const bookmarks = action.payload.status === 200 ? action.payload.body : [];
+      const bookmarkEntities = generateBookmarkEntities(bookmarks);
+      const bookmarkPageEntities = StoreUtils.groupByKeyEntities(bookmarks, 'pageNumber');
+
+      return {
+        ...state,
+        bookmarks,
+        bookmarkEntities,
+        bookmarkPageEntities,
+        loaded: true
+      };
+    }
+
+    case fromBookmarks.CREATE_BOOKMARK_SUCCESS: {
+      const bookmark: Bookmark = action.payload;
+      const bookmarkEntities = {
+        ...state.bookmarkEntities,
+        [bookmark.id]: bookmark,
+      };
+      const bookmarkArray = Object.keys(bookmarkEntities).map(key => bookmarkEntities[key]);
+      const bookmarkPageEntities = StoreUtils.groupByKeyEntities(bookmarkArray, 'pageNumber');
+      const editableBookmark = bookmark.id;
+      return {
+        ...state,
+        bookmarkEntities,
+        editableBookmark,
+        bookmarkPageEntities,
+        loading: false,
+        loaded: true
+      };
+    }
+
+    case fromBookmarks.MOVE_BOOKMARK_SUCCESS: {
+      const movedBookmarks = generateBookmarkEntities(action.payload);
+      const bookmarkEntities = {
+        ...state.bookmarkEntities,
+        ...movedBookmarks
+      };
+      return {
+        ...state,
+        bookmarkEntities,
+        loading: false,
+        loaded: true
+      };
+    }
+
+    case fromBookmarks.DELETE_BOOKMARK_SUCCESS: {
+      const bookmarkIds: string[] = action.payload;
+      const bookmarkEntities = { ...state.bookmarkEntities };
+      const bookmarkPageEntities = { ...state.bookmarkPageEntities };
+      const removeBookmarksByPage: { [pageNumber: number]: string[] } = {};
+      bookmarkIds.forEach(bookmarkId => {
+        if (removeBookmarksByPage[bookmarkEntities[bookmarkId].pageNumber] !== undefined &&
+          removeBookmarksByPage[bookmarkEntities[bookmarkId].pageNumber].length > 0) {
+          removeBookmarksByPage[bookmarkEntities[bookmarkId].pageNumber].push(bookmarkId);
+        } else {
+          removeBookmarksByPage[bookmarkEntities[bookmarkId].pageNumber] = [bookmarkId];
+        }
+        delete bookmarkEntities[bookmarkId];
+      });
+
+      Object.entries(removeBookmarksByPage).forEach(
+        ([pageNumber, bmrkIds]) => {
+          bookmarkPageEntities[pageNumber]
+            = bookmarkPageEntities[pageNumber].filter(bookmark => !bmrkIds.includes(bookmark.id));
+        }
+      );
+
+      return {
+        ...state,
+        bookmarkEntities,
+        bookmarkPageEntities,
+        loading: false,
+        loaded: true
+      };
+    }
+
+    case fromBookmarks.UPDATE_BOOKMARK_SUCCESS: {
+      const bookmark: Bookmark = action.payload;
+      const bookmarkEntities = {
+        ...state.bookmarkEntities,
+        [bookmark.id]: { ...bookmark }
+      };
+      const bookmarkArray = Object.keys(bookmarkEntities).map(key => bookmarkEntities[key]);
+      const bookmarkPageEntities = StoreUtils.groupByKeyEntities(bookmarkArray, 'pageNumber');
+      const editableBookmark = undefined;
+      return {
+        ...state,
+        bookmarkEntities,
+        editableBookmark,
+        bookmarkPageEntities,
+        loading: false,
+        loaded: true
+      };
+    }
+    case fromBookmarks.UPDATE_BOOKMARK_SCROLL_TOP: {
+      const scrollTop: number = action.payload;
+      return {
+        ...state,
+        scrollTop: scrollTop
+      }
+    }
+  }
+  return state;
+}
+
+export const getBookmarks = (state: BookmarksState) => state.bookmarks;
+export const getBookmarkEnts = (state: BookmarksState) => state.bookmarkEntities;
+export const getBookmarkPageEnt = (state: BookmarksState) => state.bookmarkPageEntities;
+export const getEditBookmark = (state: BookmarksState) => state.editableBookmark;
+export const getScrollTop = (state: BookmarksState) => state.scrollTop;