From db222970d8ad0fdba681696c3407c3c886480ca8 Mon Sep 17 00:00:00 2001
From: Jessie Keck <jessie.keck@gmail.com>
Date: Tue, 19 Mar 2019 15:41:43 -0700
Subject: [PATCH] Implement the AnnotationSettings component in the sidebar and
use the state it supplied to determine which annotations to show.
---
.../WindowSideBarAnnotationsPanel.test.js | 5 +++
__tests__/src/selectors/index.test.js | 37 +++++++++++++++++++
.../WindowSideBarAnnotationsPanel.js | 2 +
src/containers/OpenSeadragonViewer.js | 7 ++--
src/state/selectors/index.js | 17 +++++++++
5 files changed, 65 insertions(+), 3 deletions(-)
diff --git a/__tests__/src/components/WindowSideBarAnnotationsPanel.test.js b/__tests__/src/components/WindowSideBarAnnotationsPanel.test.js
index d403cd1c2..44039692c 100644
--- a/__tests__/src/components/WindowSideBarAnnotationsPanel.test.js
+++ b/__tests__/src/components/WindowSideBarAnnotationsPanel.test.js
@@ -1,5 +1,6 @@
import React from 'react';
import { shallow } from 'enzyme';
+import AnnotationSettings from '../../../src/containers/AnnotationSettings';
import { WindowSideBarAnnotationsPanel } from '../../../src/components/WindowSideBarAnnotationsPanel';
/** */
@@ -27,6 +28,10 @@ describe('WindowSideBarAnnotationsPanel', () => {
).toBe('annotations');
});
+ it('has the AnnotationSettings component', () => {
+ expect(createWrapper().find(AnnotationSettings).length).toBe(1);
+ });
+
it('renders a list with a list item for each annotation', () => {
wrapper = createWrapper({
annotations: [
diff --git a/__tests__/src/selectors/index.test.js b/__tests__/src/selectors/index.test.js
index 67c95aa78..a61266579 100644
--- a/__tests__/src/selectors/index.test.js
+++ b/__tests__/src/selectors/index.test.js
@@ -1,4 +1,5 @@
import {
+ getAllOrSelectedAnnotations,
getAnnotationResourcesByMotivation,
getIdAndContentOfResources,
getLanguagesFromConfigWithCurrent,
@@ -166,3 +167,39 @@ it('getSelectedTargetAnnotationResources filters the annotation resources by the
getSelectedTargetAnnotationResources(state, ['cid1'], ['annoId1', 'annoId2'])[0].resources.length,
).toBe(2);
});
+
+describe('getAllOrSelectedAnnotations', () => {
+ it('returns all annotations if the given window is set to display all', () => {
+ const state = {
+ windows: {
+ abc123: { displayAllAnnotations: true },
+ },
+ annotations: {
+ cid1: {
+ annoId1: { id: 'annoId1', json: { resources: [{ '@id': 'annoId1' }, { '@id': 'annoId2' }] } },
+ },
+ },
+ };
+
+ expect(
+ getAllOrSelectedAnnotations(state, 'abc123', ['cid1'], ['annoId1'])[0].resources.length,
+ ).toBe(2);
+ });
+
+ it('returns only selected annotations if the window is not set to display all', () => {
+ const state = {
+ windows: {
+ abc123: { displayAllAnnotations: false },
+ },
+ annotations: {
+ cid1: {
+ annoId1: { id: 'annoId1', json: { resources: [{ '@id': 'annoId1' }, { '@id': 'annoId2' }] } },
+ },
+ },
+ };
+
+ expect(
+ getAllOrSelectedAnnotations(state, 'abc123', ['cid1'], ['annoId1'])[0].resources.length,
+ ).toBe(1);
+ });
+});
diff --git a/src/components/WindowSideBarAnnotationsPanel.js b/src/components/WindowSideBarAnnotationsPanel.js
index 33052018a..1b784e798 100644
--- a/src/components/WindowSideBarAnnotationsPanel.js
+++ b/src/components/WindowSideBarAnnotationsPanel.js
@@ -4,6 +4,7 @@ import List from '@material-ui/core/List';
import ListItem from '@material-ui/core/ListItem';
import Typography from '@material-ui/core/Typography';
import { SanitizedHtml } from './SanitizedHtml';
+import AnnotationSettings from '../containers/AnnotationSettings';
import CompanionWindow from '../containers/CompanionWindow';
import ns from '../config/css-ns';
@@ -62,6 +63,7 @@ export class WindowSideBarAnnotationsPanel extends Component {
} = this.props;
return (
<CompanionWindow title={t('annotations')} paperClassName={ns('window-sidebar-annotation-panel')} windowId={windowId} id={id}>
+ <AnnotationSettings windowId={windowId} />
<div className={classes.section}>
<Typography variant="subtitle2">{t('showingNumAnnotations', { number: annotations.length })}</Typography>
</div>
diff --git a/src/containers/OpenSeadragonViewer.js b/src/containers/OpenSeadragonViewer.js
index d0aecea6e..1959e3638 100644
--- a/src/containers/OpenSeadragonViewer.js
+++ b/src/containers/OpenSeadragonViewer.js
@@ -7,9 +7,9 @@ import { withPlugins } from '../extend';
import { OpenSeadragonViewer } from '../components/OpenSeadragonViewer';
import * as actions from '../state/actions';
import {
+ getAllOrSelectedAnnotations,
getCanvasLabel,
getSelectedAnnotationIds,
- getSelectedTargetAnnotationResources,
} from '../state/selectors';
/**
@@ -22,8 +22,9 @@ const mapStateToProps = ({
}, { windowId, currentCanvases }) => ({
viewer: viewers[windowId],
label: getCanvasLabel({ windows, manifests }, { windowId, canvasIndex: 'selected' }),
- annotations: getSelectedTargetAnnotationResources(
- { annotations },
+ annotations: getAllOrSelectedAnnotations(
+ { annotations, windows },
+ windowId,
currentCanvases.map(c => c.id),
getSelectedAnnotationIds({ windows }, windowId, currentCanvases.map(c => c.id)),
),
diff --git a/src/state/selectors/index.js b/src/state/selectors/index.js
index 41a9aef4b..d8362934c 100644
--- a/src/state/selectors/index.js
+++ b/src/state/selectors/index.js
@@ -105,3 +105,20 @@ export function getSelectedTargetAnnotationResources(state, targetIds, annotatio
resources: annotation.resources.filter(r => annotationIds && annotationIds.includes(r.id)),
}));
}
+
+/**
+* Return all of the given canvases annotations if the window
+* is set to display all, otherwise only return selected
+* @param {object} state
+* @param {String} windowId
+* @param {Array} targetIds
+* @param {Array} annotationIds
+* @return {Array}
+*/
+export function getAllOrSelectedAnnotations(state, windowId, targetIds, annotationIds) {
+ if (state.windows[windowId].displayAllAnnotations) {
+ return getSelectedTargetsAnnotations(state, targetIds);
+ }
+
+ return getSelectedTargetAnnotationResources(state, targetIds, annotationIds);
+}
--
GitLab