Consistently Use selectors to pull state into containers

src/containers/AppProviders.js

@@ -2,7 +2,7 @@ import { compose } from 'redux';
 import { connect } from 'react-redux';
 import { withPlugins } from '../extend/withPlugins';
 import * as actions from '../state/actions';
-import { getTheme } from '../state/selectors';
+import { getConfig, getTheme, getFullScreenEnabled } from '../state/selectors';
 import { AppProviders } from '../components/AppProviders';
 
 /**
@@ -12,11 +12,11 @@ import { AppProviders } from '../components/AppProviders';
  */
 const mapStateToProps = state => (
   {
-    classPrefix: state.config.classPrefix,
-    isFullscreenEnabled: state.workspace.isFullscreenEnabled,
-    language: state.config.language,
+    classPrefix: getConfig(state).classPrefix,
+    isFullscreenEnabled: getFullScreenEnabled(state),
+    language: getConfig(state).language,
     theme: getTheme(state),
-    translations: state.config.translations,
+    translations: getConfig(state).translations,
   }
 );
 

src/containers/CanvasAnnotations.js

@@ -8,6 +8,7 @@ import {
   getAnnotationResourcesByMotivationForCanvas,
   getCanvasLabel,
   getSelectedAnnotationId,
+  getConfig,
 } from '../state/selectors';
 import { CanvasAnnotations } from '../components/CanvasAnnotations';
 
@@ -31,7 +32,7 @@ const mapStateToProps = (state, { canvasId, windowId }) => ({
       state, { canvasId, windowId },
     ),
   ),
-  htmlSanitizationRuleSet: state.config.annotations.htmlSanitizationRuleSet,
+  htmlSanitizationRuleSet: getConfig(state).annotations.htmlSanitizationRuleSet,
   label: getCanvasLabel(state, {
     canvasId,
     windowId,

src/containers/ChangeThemeDialog.js

@@ -4,7 +4,7 @@ import { withStyles } from '@material-ui/core';
 import { withTranslation } from 'react-i18next';
 import { withPlugins } from '../extend/withPlugins';
 import * as actions from '../state/actions';
-import { getThemeIds } from '../state/selectors';
+import { getThemeIds, getConfig } from '../state/selectors';
 import { ChangeThemeDialog } from '../components/ChangeThemeDialog';
 
 /**
@@ -22,7 +22,7 @@ const mapDispatchToProps = (dispatch, { windowId }) => ({
  * @private
  */
 const mapStateToProps = state => ({
-  selectedTheme: state.config.selectedTheme,
+  selectedTheme: getConfig(state).selectedTheme,
   themeIds: getThemeIds(state),
 });
 

src/containers/ErrorContent.js

@@ -9,6 +9,7 @@ import {
   getManifest,
   getWindow,
   getViewer,
+  getConfig,
 } from '../state/selectors';
 
 /** mapStateToProps */
@@ -19,7 +20,7 @@ const mapStateToProps = (state, { companionWindowId, windowId }) => ({
     viewer: getViewer(state, { windowId }),
     window: getWindow(state, { windowId }),
   },
-  showJsError: state.config.window.showJsError,
+  showJsError: getConfig(state).window.showJsError,
 });
 
 /**

src/containers/GalleryViewThumbnail.js

@@ -8,6 +8,7 @@ import {
   getSearchAnnotationsForWindow,
   getSelectedContentSearchAnnotationIds,
   getCurrentCanvas,
+  getConfig,
 } from '../state/selectors';
 
 /**
@@ -70,7 +71,7 @@ const mapStateToProps = (state, { canvas, windowId }) => {
   return {
     annotationsCount: canvasAnnotations.length,
     annotationSelected: canvasAnnotations.some(a => selectedAnnotationIds.includes(a.id)),
-    config: state.config.galleryView,
+    config: getConfig(state).galleryView,
     selected: currentCanvas && currentCanvas.id === canvas.id,
   };
 };

src/containers/MinimalWindow.js

@@ -5,11 +5,12 @@ import { withStyles } from '@material-ui/core/styles';
 import { withPlugins } from '../extend/withPlugins';
 import * as actions from '../state/actions';
 import { MinimalWindow } from '../components/MinimalWindow';
+import { getWindowConfig } from '../state/selectors';
 
 /** mapStateToProps */
 const mapStateToProps = (state, { windowId }) => ({
-  allowClose: state.config.window.allowClose,
-  allowWindowSideBar: state.config.window.allowWindowSideBar,
+  allowClose: getWindowConfig(state, { windowId }).allowClose,
+  allowWindowSideBar: getWindowConfig(state, { windowId }).allowWindowSideBar,
 });
 
 /**

src/containers/OpenSeadragonViewer.js

@@ -43,7 +43,7 @@ const mapStateToProps = (state, { windowId }) => {
         && infoResponse.isFetching === false
         && infoResponse.error === undefined)),
     nonTiledImages: getVisibleCanvasNonTiledResources(state, { windowId }),
-    osdConfig: state.config.osdConfig,
+    osdConfig: getConfig(state).osdConfig,
     viewerConfig: getViewer(state, { windowId }),
   };
 };

src/containers/ThumbnailNavigation.js

@@ -7,9 +7,10 @@ import CanvasGroupings from '../lib/CanvasGroupings';
 import * as actions from '../state/actions';
 import { ThumbnailNavigation } from '../components/ThumbnailNavigation';
 import {
+  getCompanionWindow, getWindow,
   getNextCanvasGrouping, getPreviousCanvasGrouping,
   getCanvases, getCanvasIndex, getWindowViewType,
-  getSequenceViewingDirection,
+  getSequenceViewingDirection, getConfig,
 } from '../state/selectors';
 
 /**
@@ -27,8 +28,10 @@ const mapStateToProps = (state, { windowId }) => {
     canvasIndex: getCanvasIndex(state, { windowId }),
     hasNextCanvas: !!getNextCanvasGrouping(state, { windowId }),
     hasPreviousCanvas: !!getPreviousCanvasGrouping(state, { windowId }),
-    position: state.companionWindows[state.windows[windowId].thumbnailNavigationId].position,
-    thumbnailNavigation: state.config.thumbnailNavigation,
+    position: getCompanionWindow(state, {
+      companionWindowId: getWindow(state, { windowId }).thumbnailNavigationId,
+    }).position,
+    thumbnailNavigation: getConfig(state).thumbnailNavigation,
     view: viewType,
     viewingDirection: getSequenceViewingDirection(state, { windowId }),
   };

src/containers/WindowCanvasNavigationControls.js

@@ -7,6 +7,7 @@ import { withPlugins } from '../extend/withPlugins';
 import {
   getCurrentCanvas,
   getCanvasLabel,
+  getWorkspace,
 } from '../state/selectors';
 import { WindowCanvasNavigationControls } from '../components/WindowCanvasNavigationControls';
 
@@ -16,7 +17,7 @@ const mapStateToProps = (state, { windowId }) => ({
     canvasId: (getCurrentCanvas(state, { windowId }) || {}).id,
     windowId,
   }),
-  visible: state.workspace.focusedWindowId === windowId,
+  visible: getWorkspace(state).focusedWindowId === windowId,
 });
 
 /**

src/containers/WindowList.js

@@ -3,7 +3,7 @@ import { compose } from 'redux';
 import { withTranslation } from 'react-i18next';
 import { withPlugins } from '../extend/withPlugins';
 import * as actions from '../state/actions';
-import { getContainerId, getWindowTitles } from '../state/selectors';
+import { getContainerId, getWindowIds, getWindowTitles } from '../state/selectors';
 import { WindowList } from '../components/WindowList';
 
 /**
@@ -24,7 +24,7 @@ const mapStateToProps = state => (
   {
     containerId: getContainerId(state),
     titles: getWindowTitles(state),
-    windowIds: Object.keys(state.windows),
+    windowIds: getWindowIds(state),
   }
 );
 

src/containers/WindowSideBarInfoPanel.js

@@ -5,6 +5,7 @@ import { withStyles } from '@material-ui/core/styles';
 import { withPlugins } from '../extend/withPlugins';
 import * as actions from '../state/actions';
 import {
+  getCompanionWindow,
   getManifestLocale,
   getMetadataLocales,
   getVisibleCanvases,
@@ -19,7 +20,8 @@ import { WindowSideBarInfoPanel } from '../components/WindowSideBarInfoPanel';
  */
 const mapStateToProps = (state, { id, windowId }) => ({
   availableLocales: getMetadataLocales(state, { companionWindowId: id, windowId }),
-  locale: state.companionWindows[id].locale || getManifestLocale(state, { windowId }),
+  locale: getCompanionWindow(state, { companionWindowId: id }).locale
+    || getManifestLocale(state, { windowId }),
   selectedCanvases: getVisibleCanvases(state, { windowId }),
   showLocalePicker: getWindowConfig(state, { windowId }).showLocalePicker,
 });

src/containers/Workspace.js

@@ -4,7 +4,10 @@ import { withTranslation } from 'react-i18next';
 import { withStyles } from '@material-ui/core/styles';
 import { withPlugins } from '../extend/withPlugins';
 import { Workspace } from '../components/Workspace';
-import { getMaximizedWindowsIds, getWindowIds, getWorkspaceType } from '../state/selectors';
+import {
+  getMaximizedWindowsIds, getWindowIds, getWorkspaceType,
+  getConfig, getWorkspace,
+} from '../state/selectors';
 import * as actions from '../state/actions';
 
 /**
@@ -14,11 +17,11 @@ import * as actions from '../state/actions';
  */
 const mapStateToProps = state => (
   {
-    allowNewWindows: state.config.workspace.allowNewWindows,
-    isWorkspaceControlPanelVisible: state.config.workspaceControlPanel.enabled,
+    allowNewWindows: getConfig(state).workspace.allowNewWindows,
+    isWorkspaceControlPanelVisible: getConfig(state).workspaceControlPanel.enabled,
     maximizedWindowIds: getMaximizedWindowsIds(state),
     windowIds: getWindowIds(state),
-    workspaceId: state.workspace.id,
+    workspaceId: getWorkspace(state).id,
     workspaceType: getWorkspaceType(state),
   }
 );

src/containers/WorkspaceAdd.js

@@ -5,13 +5,14 @@ import { withStyles } from '@material-ui/core';
 import { withPlugins } from '../extend/withPlugins';
 import * as actions from '../state/actions';
 import { WorkspaceAdd } from '../components/WorkspaceAdd';
+import { getCatalog } from '../state/selectors';
 
 /**
  * mapStateToProps - to hook up connect
  * @memberof Workspace
  * @private
  */
-const mapStateToProps = state => ({ catalog: state.catalog });
+const mapStateToProps = state => ({ catalog: getCatalog(state) });
 
 /**
  * mapDispatchToProps - used to hook up connect to action creators

src/containers/WorkspaceAddButton.js

@@ -5,6 +5,7 @@ import { withStyles } from '@material-ui/core';
 import withWidth from '@material-ui/core/withWidth';
 import { withPlugins } from '../extend/withPlugins';
 import * as actions from '../state/actions';
+import { getWindowIds, getWorkspace } from '../state/selectors';
 import { WorkspaceAddButton } from '../components/WorkspaceAddButton';
 
 /**
@@ -13,13 +14,13 @@ import { WorkspaceAddButton } from '../components/WorkspaceAddButton';
  * @private
  */
 const mapStateToProps = (state, { width }) => {
-  const { isWorkspaceAddVisible } = state.workspace;
+  const { isWorkspaceAddVisible } = getWorkspace(state);
   return {
     isWorkspaceAddVisible,
     useExtendedFab: (
       (width !== 'xs')
         && !isWorkspaceAddVisible
-        && Object.keys(state.windows).length === 0
+        && getWindowIds(state).length === 0
     ),
   };
 };

src/containers/WorkspaceElasticWindow.js

@@ -3,7 +3,10 @@ import { connect } from 'react-redux';
 import { withStyles } from '@material-ui/core';
 import * as actions from '../state/actions';
 import WorkspaceElasticWindow from '../components/WorkspaceElasticWindow';
-import { selectCompanionWindowDimensions } from '../state/selectors';
+import {
+  selectCompanionWindowDimensions, getWorkspace,
+  getElasticLayout,
+} from '../state/selectors';
 
 /**
  * mapStateToProps - to hook up connect
@@ -14,8 +17,8 @@ const mapStateToProps = (state, { windowId }) => (
   {
     companionWindowDimensions: selectCompanionWindowDimensions(state, { windowId }),
     focused: state.workspace.focusedWindowId === windowId,
-    layout: state.elasticLayout[windowId],
-    workspace: state.workspace,
+    layout: getElasticLayout(state)[windowId],
+    workspace: getWorkspace(state),
   }
 );
 

src/containers/WorkspaceMenu.js

@@ -3,7 +3,10 @@ import { connect } from 'react-redux';
 import { withTranslation } from 'react-i18next';
 import { withPlugins } from '../extend/withPlugins';
 import * as actions from '../state/actions';
-import { getContainerId, getShowZoomControlsConfig, getThemeIds } from '../state/selectors';
+import {
+  getContainerId, getShowZoomControlsConfig, getThemeIds,
+  getWorkspace,
+} from '../state/selectors';
 import { WorkspaceMenu } from '../components/WorkspaceMenu';
 
 /**
@@ -22,7 +25,7 @@ const mapDispatchToProps = {
  */
 const mapStateToProps = state => ({
   containerId: getContainerId(state),
-  isWorkspaceAddVisible: state.workspace.isWorkspaceAddVisible,
+  isWorkspaceAddVisible: getWorkspace(state).isWorkspaceAddVisible,
   showThemePicker: getThemeIds(state).length > 0,
   showZoomControls: getShowZoomControlsConfig(state),
 });