dbf-mirador 4.2.3

package/src/containers/AttributionPanel.js

@@ -0,0 +1,20 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { getManifestLogo, getRequiredStatement, getRights } from '../state/selectors';
+import { withPlugins } from '../extend/withPlugins';
+import { AttributionPanel } from '../components/AttributionPanel';
+
+/**
+ * mapStateToProps - to hook up connect
+ * @memberof WindowSideBarInfoPanel
+ * @private
+ */
+const mapStateToProps = (state, { id, windowId }) => ({
+  manifestLogo: getManifestLogo(state, { windowId }),
+  requiredStatement: getRequiredStatement(state, { windowId }),
+  rights: getRights(state, { windowId }),
+});
+
+const enhance = compose(connect(mapStateToProps), withPlugins('AttributionPanel'));
+
+export default enhance(AttributionPanel);

package/src/containers/AudioViewer.js

@@ -0,0 +1,16 @@
+import { connect } from 'react-redux';
+import { compose } from 'redux';
+import { withPlugins } from '../extend/withPlugins';
+import { AudioViewer } from '../components/AudioViewer';
+import { getConfig, getVisibleCanvasAudioResources, getVisibleCanvasCaptions } from '../state/selectors';
+
+/** */
+const mapStateToProps = (state, { windowId }) => ({
+  audioOptions: getConfig(state).audioOptions,
+  audioResources: getVisibleCanvasAudioResources(state, { windowId }) || [],
+  captions: getVisibleCanvasCaptions(state, { windowId }) || [],
+});
+
+const enhance = compose(connect(mapStateToProps, null), withPlugins('AudioViewer'));
+
+export default enhance(AudioViewer);

package/src/containers/BackgroundPluginArea.js

@@ -0,0 +1,4 @@
+import { withPlugins } from '../extend/withPlugins';
+import { BackgroundPluginArea } from '../components/BackgroundPluginArea';
+
+export default withPlugins('BackgroundPluginArea')(BackgroundPluginArea);

package/src/containers/Branding.js

@@ -0,0 +1,4 @@
+import { withPlugins } from '../extend/withPlugins';
+import { Branding } from '../components/Branding';
+
+export default withPlugins('Branding')(Branding);

package/src/containers/CanvasAnnotations.js

@@ -0,0 +1,32 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import * as actions from '../state/actions';
+import { getAnnotationResourcesDataForCanvas, getCanvasLabel, getSelectedAnnotationId, getConfig } from '../state/selectors';
+import { CanvasAnnotations } from '../components/CanvasAnnotations';
+
+/** For connect */
+const mapStateToProps = (state, { canvasId, windowId }) => ({
+  annotations: getAnnotationResourcesDataForCanvas(state, { canvasId, windowId }),
+  htmlSanitizationRuleSet: getConfig(state).annotations.htmlSanitizationRuleSet,
+  label: getCanvasLabel(state, {
+    canvasId,
+    windowId,
+  }),
+  selectedAnnotationId: getSelectedAnnotationId(state, { windowId }),
+});
+
+/**
+ * mapDispatchToProps - to hook up connect
+ * @memberof WindowSideBarAnnotationsPanel
+ * @private
+ */
+const mapDispatchToProps = {
+  deselectAnnotation: actions.deselectAnnotation,
+  hoverAnnotation: actions.hoverAnnotation,
+  selectAnnotation: actions.selectAnnotation,
+};
+
+const enhance = compose(connect(mapStateToProps, mapDispatchToProps), withPlugins('CanvasAnnotations'));
+
+export default enhance(CanvasAnnotations);

package/src/containers/CanvasInfo.js

@@ -0,0 +1,20 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import { getCanvasMetadata, getCanvasLabel, getCanvasDescription } from '../state/selectors';
+import { CanvasInfo } from '../components/CanvasInfo';
+
+/**
+ * mapStateToProps - to hook up connect
+ * @memberof WindowSideBarInfoPanel
+ * @private
+ */
+const mapStateToProps = (state, { canvasId, companionWindowId, windowId }) => ({
+  canvasDescription: getCanvasDescription(state, { canvasId, companionWindowId, windowId }),
+  canvasLabel: getCanvasLabel(state, { canvasId, companionWindowId, windowId }),
+  canvasMetadata: getCanvasMetadata(state, { canvasId, companionWindowId, windowId }),
+});
+
+const enhance = compose(connect(mapStateToProps), withPlugins('CanvasInfo'));
+
+export default enhance(CanvasInfo);

package/src/containers/CanvasLayers.js

@@ -0,0 +1,25 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import * as actions from '../state/actions';
+import { getCanvasLabel, getLayers, getSortedLayers } from '../state/selectors';
+import { CanvasLayers } from '../components/CanvasLayers';
+
+/** For connect */
+const mapStateToProps = (state, { canvasId, companionWindowId, windowId }) => ({
+  label: getCanvasLabel(state, { canvasId, companionWindowId, windowId }),
+  layerMetadata: getLayers(state, { canvasId, companionWindowId, windowId }),
+  layers: getSortedLayers(state, { canvasId, companionWindowId, windowId }),
+});
+
+/**
+ * mapDispatchToProps - to hook up connect
+ * @memberof WindowSideBarAnnotationsPanel
+ * @private
+ */
+const mapDispatchToProps = {
+  updateLayers: actions.updateLayers,
+};
+
+const enhance = compose(connect(mapStateToProps, mapDispatchToProps));
+
+export default enhance(CanvasLayers);

package/src/containers/ChangeThemeDialog.js

@@ -0,0 +1,29 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import * as actions from '../state/actions';
+import { getThemeIds, getConfig } from '../state/selectors';
+import { ChangeThemeDialog } from '../components/ChangeThemeDialog';
+
+/**
+ * mapDispatchToProps - used to hook up connect to action creators
+ * @memberof ChangeThemeDialog
+ * @private
+ */
+const mapDispatchToProps = (dispatch, { windowId }) => ({
+  setSelectedTheme: (theme) => dispatch(actions.updateConfig({ selectedTheme: theme })),
+});
+
+/**
+ * mapStateToProps - to hook up connect
+ * @memberof ChangeThemeDialog
+ * @private
+ */
+const mapStateToProps = (state) => ({
+  selectedTheme: getConfig(state).selectedTheme,
+  themeIds: getThemeIds(state),
+});
+
+const enhance = compose(connect(mapStateToProps, mapDispatchToProps), withPlugins('ChangeThemeDialog'));
+
+export default enhance(ChangeThemeDialog);

package/src/containers/CollapsibleSection.js

@@ -0,0 +1,3 @@
+import { CollapsibleSection } from '../components/CollapsibleSection';
+
+export default CollapsibleSection;

package/src/containers/CollectionDialog.js

@@ -0,0 +1,48 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import * as actions from '../state/actions';
+import { getManifest, getManifestoInstance, getSequenceBehaviors, getWindow } from '../state/selectors';
+import { CollectionDialog } from '../components/CollectionDialog';
+
+/**
+ * mapDispatchToProps - used to hook up connect to action creators
+ * @memberof CollectionDialog
+ * @private
+ */
+const mapDispatchToProps = {
+  addWindow: actions.addWindow,
+  hideCollectionDialog: actions.hideCollectionDialog,
+  setWorkspaceAddVisibility: actions.setWorkspaceAddVisibility,
+  showCollectionDialog: actions.showCollectionDialog,
+  updateWindow: actions.updateWindow,
+};
+
+/**
+ * mapStateToProps - to hook up connect
+ * @memberof CollectionDialog
+ * @private
+ */
+const mapStateToProps = (state, { windowId }) => {
+  const { collectionManifestId: manifestId, dialogCollectionPath } = getWindow(state, { windowId });
+  const manifest = getManifest(state, { manifestId });
+
+  const collectionId = dialogCollectionPath && dialogCollectionPath[dialogCollectionPath.length - 1];
+  const collection = collectionId && getManifest(state, { manifestId: collectionId });
+
+  return {
+    collection: collection && getManifestoInstance(state, { manifestId: collection.id }),
+    dialogCollectionPath,
+    error: manifest && manifest.error,
+    isMultipart: getSequenceBehaviors(state, { manifestId }).includes('multi-part'),
+    manifest: manifest && getManifestoInstance(state, { manifestId }),
+    manifestId,
+    open: state.workspace.collectionDialogOn,
+    ready: manifest && !!manifest.json,
+    windowId,
+  };
+};
+
+const enhance = compose(connect(mapStateToProps, mapDispatchToProps), withPlugins('CollectionDialog'));
+
+export default enhance(CollectionDialog);

package/src/containers/CollectionInfo.js

@@ -0,0 +1,29 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import { getManifestTitle, getWindow } from '../state/selectors';
+import * as actions from '../state/actions';
+import { CollectionInfo } from '../components/CollectionInfo';
+
+/**
+ * mapStateToProps - to hook up connect
+ * @memberof WindowSideBarInfoPanel
+ * @private
+ */
+const mapStateToProps = (state, { windowId }) => {
+  const { collectionPath } = getWindow(state, { windowId }) || {};
+  const manifestId = collectionPath[collectionPath.length - 1];
+
+  return {
+    collectionLabel: getManifestTitle(state, { manifestId }),
+    collectionPath,
+  };
+};
+
+const mapDispatchToProps = {
+  showCollectionDialog: actions.showCollectionDialog,
+};
+
+const enhance = compose(connect(mapStateToProps, mapDispatchToProps), withPlugins('CollectionInfo'));
+
+export default enhance(CollectionInfo);

package/src/containers/CompanionArea.js

@@ -0,0 +1,22 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import { getCompanionWindowIdsForPosition, getCompanionAreaVisibility, getThemeDirection, getWindow } from '../state/selectors';
+import * as actions from '../state/actions';
+import { CompanionArea } from '../components/CompanionArea';
+
+/** */
+const mapStateToProps = (state, { windowId, position }) => ({
+  companionAreaOpen: getCompanionAreaVisibility(state, { position, windowId }),
+  companionWindowIds: getCompanionWindowIdsForPosition(state, { position, windowId }),
+  direction: getThemeDirection(state),
+  sideBarOpen: (getWindow(state, { windowId }) || {}).sideBarOpen,
+});
+
+const mapDispatchToProps = {
+  setCompanionAreaOpen: actions.setCompanionAreaOpen,
+};
+
+const enhance = compose(connect(mapStateToProps, mapDispatchToProps), withPlugins('CompanionArea'));
+
+export default enhance(CompanionArea);

package/src/containers/CompanionWindow.js

@@ -0,0 +1,40 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import * as actions from '../state/actions';
+import { getCompanionWindow, getThemeDirection, getWindowConfig } from '../state/selectors';
+import { CompanionWindow } from '../components/CompanionWindow';
+
+/**
+ * mapStateToProps - to hook up connect
+ * @memberof CompanionWindow
+ * @private
+ */
+const mapStateToProps = (state, { id, windowId }) => {
+  const companionWindow = getCompanionWindow(state, { companionWindowId: id });
+  const { defaultSidebarPanelHeight, defaultSidebarPanelWidth } = getWindowConfig(state, {
+    windowId,
+  });
+
+  return {
+    ...companionWindow,
+    defaultSidebarPanelHeight,
+    defaultSidebarPanelWidth,
+    direction: getThemeDirection(state),
+    isDisplayed: companionWindow && companionWindow.content && companionWindow.content.length > 0,
+  };
+};
+
+/**
+ * mapDispatchToProps - to hook up connect
+ * @memberof CompanionWindow
+ * @private
+ */
+const mapDispatchToProps = (dispatch, { windowId, id }) => ({
+  onCloseClick: () => dispatch(actions.removeCompanionWindow(windowId, id)),
+  updateCompanionWindow: (...args) => dispatch(actions.updateCompanionWindow(windowId, id, ...args)),
+});
+
+const enhance = compose(connect(mapStateToProps, mapDispatchToProps, null, { forwardRef: true }), withPlugins('CompanionWindow'));
+
+export default enhance(CompanionWindow);

package/src/containers/CompanionWindowFactory.js

@@ -0,0 +1,23 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import { getCompanionWindow } from '../state/selectors';
+import { CompanionWindowFactory } from '../components/CompanionWindowFactory';
+
+/**
+ * mapStateToProps - to hook up connect
+ * @memberof CompanionWindow
+ * @private
+ */
+const mapStateToProps = (state, { id }) => {
+  const companionWindow = getCompanionWindow(state, { companionWindowId: id });
+
+  return {
+    content: companionWindow.content,
+    id,
+  };
+};
+
+const enhance = compose(connect(mapStateToProps), withPlugins('CompanionWindowFactory'));
+
+export default enhance(CompanionWindowFactory);

package/src/containers/CustomPanel.js

@@ -0,0 +1,13 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import { CustomPanel } from '../components/CustomPanel';
+
+/**
+ * mapStateToProps - to hook up connect
+ */
+const mapStateToProps = (state, { id, windowId }) => ({});
+
+const enhance = compose(connect(mapStateToProps), withPlugins('CustomPanel'));
+
+export default enhance(CustomPanel);

package/src/containers/ErrorContent.js

@@ -0,0 +1,20 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import { ErrorContent } from '../components/ErrorContent';
+import { getCompanionWindow, getManifest, getWindow, getViewer, getConfig } from '../state/selectors';
+
+/** mapStateToProps */
+const mapStateToProps = (state, { companionWindowId, windowId }) => ({
+  metadata: {
+    companionWindow: companionWindowId && getCompanionWindow(state, { companionWindowId }),
+    manifest: getManifest(state, { windowId }),
+    viewer: getViewer(state, { windowId }),
+    window: getWindow(state, { windowId }),
+  },
+  showJsError: getConfig(state).window.showJsError,
+});
+
+const enhance = compose(connect(mapStateToProps), withPlugins('ErrorContent'));
+
+export default enhance(ErrorContent);

package/src/containers/ErrorDialog.js

@@ -0,0 +1,28 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import { ErrorDialog } from '../components/ErrorDialog';
+import * as actions from '../state/actions';
+import { getLatestError } from '../state/selectors';
+
+/**
+ * mapStateToProps - to hook up connect
+ * @memberof ErrorDialog
+ * @private
+ */
+const mapStateToProps = (state) => ({
+  error: getLatestError(state),
+});
+
+/**
+ * mapDispatchToProps - used to hook up connect to action creators
+ * @memberof App
+ * @private
+ */
+const mapDispatchToProps = {
+  removeError: actions.removeError,
+};
+
+const enhance = compose(connect(mapStateToProps, mapDispatchToProps), withPlugins('ErrorDialog'));
+
+export default enhance(ErrorDialog);

package/src/containers/FullScreenButton.js

@@ -0,0 +1,22 @@
+import { connect } from 'react-redux';
+import { compose } from 'redux';
+import { withPlugins } from '../extend/withPlugins';
+import { FullScreenButton } from '../components/FullScreenButton';
+
+/**
+ * mapStateToProps - to hook up connect
+ * @memberof FullScreenButton
+ * @private
+ */
+const mapStateToProps = (_state) => ({});
+
+/**
+ * mapDispatchToProps - used to hook up connect to action creators
+ * @memberof ManifestListItem
+ * @private
+ */
+const mapDispatchToProps = {};
+
+const enhance = compose(connect(mapStateToProps, mapDispatchToProps), withPlugins('FullScreenButton'));
+
+export default enhance(FullScreenButton);

package/src/containers/GalleryView.js

@@ -0,0 +1,23 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import { GalleryView } from '../components/GalleryView';
+import { getCanvases, getSequenceViewingDirection } from '../state/selectors';
+
+/**
+ * mapStateToProps - to hook up connect
+ * @memberof WindowViewer
+ * @private
+ */
+const mapStateToProps = (state, { windowId }) => ({
+  canvases: getCanvases(state, { windowId }),
+  viewingDirection: getSequenceViewingDirection(state, { windowId }),
+});
+
+const enhance = compose(
+  connect(mapStateToProps),
+  withPlugins('GalleryView'),
+  // further HOC go here
+);
+
+export default enhance(GalleryView);

package/src/containers/GalleryViewThumbnail.js

@@ -0,0 +1,51 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import * as actions from '../state/actions';
+import { GalleryViewThumbnail } from '../components/GalleryViewThumbnail';
+import {
+  getSearchAnnotationsForWindow,
+  getCurrentCanvas,
+  getConfig,
+  getPresentAnnotationsOnSelectedCanvases,
+  getCompanionWindowsForContent,
+} from '../state/selectors';
+
+/** */
+const mapStateToProps = (state, { canvas, windowId }) => {
+  const currentCanvas = getCurrentCanvas(state, { windowId });
+  const searchAnnotations = getSearchAnnotationsForWindow(state, { windowId });
+
+  const canvasAnnotations = searchAnnotations.flatMap((a) => a.resources).filter((a) => a.targetId === canvas.id);
+
+  const hasOpenAnnotationsWindow = getCompanionWindowsForContent(state, { content: 'annotations', windowId }).length > 0;
+
+  return {
+    annotationsCount: (() => {
+      if (!hasOpenAnnotationsWindow) return undefined;
+      const annotations = getPresentAnnotationsOnSelectedCanvases(state, { canvasId: canvas.id });
+
+      return annotations.reduce((v, a) => v + a.resources.filter((r) => r.targetId === canvas.id).length, 0);
+    })(),
+    config: getConfig(state).galleryView,
+    searchAnnotationsCount: canvasAnnotations.length,
+    selected: currentCanvas && currentCanvas.id === canvas.id,
+  };
+};
+
+/**
+ * mapDispatchToProps - used to hook up connect to action creators
+ * @memberof WindowViewer
+ * @private
+ */
+const mapDispatchToProps = (dispatch, { canvas, id, windowId }) => ({
+  focusOnCanvas: () => dispatch(actions.setWindowViewType(windowId, 'single')),
+  requestCanvasAnnotations: () => dispatch(actions.requestCanvasAnnotations(windowId, canvas.id)),
+  setCanvas: (...args) => dispatch(actions.setCanvas(windowId, ...args)),
+});
+
+const enhance = compose(
+  connect(mapStateToProps, mapDispatchToProps),
+  // further HOC go here
+);
+
+export default enhance(GalleryViewThumbnail);

package/src/containers/IIIFAuthentication.js

@@ -0,0 +1,86 @@
+import { connect } from 'react-redux';
+import { compose } from 'redux';
+import { Utils } from 'manifesto.js';
+import { withPlugins } from '../extend/withPlugins';
+import * as actions from '../state/actions';
+import { getAuth, getAuthProfiles, selectCurrentAuthServices, getAccessTokens } from '../state/selectors';
+import { IIIFAuthentication } from '../components/IIIFAuthentication';
+
+/**
+ * mapStateToProps - to hook up connect
+ * @memberof FullScreenButton
+ * @private
+ */
+// eslint-disable-next-line complexity
+const mapStateToProps = (state, { windowId }) => {
+  const services = selectCurrentAuthServices(state, { windowId });
+
+  // TODO: get the most actionable auth service...
+  const service = services[0];
+
+  const accessTokenService =
+    service &&
+    (Utils.getService(service, 'http://iiif.io/api/auth/1/token') ||
+      Utils.getService(service, 'http://iiif.io/api/auth/0/token'));
+  const logoutService =
+    service &&
+    (Utils.getService(service, 'http://iiif.io/api/auth/1/logout') ||
+      Utils.getService(service, 'http://iiif.io/api/auth/0/logout'));
+
+  const authStatuses = getAuth(state);
+  const authStatus = service && authStatuses[service.id];
+  const accessTokens = getAccessTokens(state);
+  const accessTokenStatus = accessTokenService && accessTokens[accessTokenService.id];
+
+  let status = null;
+
+  if (!authStatus) {
+    status = null;
+  } else if (authStatus.isFetching) {
+    if (authStatus.windowId === windowId) status = 'cookie';
+  } else if (accessTokenStatus && accessTokenStatus.isFetching) {
+    if (authStatus.windowId === windowId) status = 'token';
+  } else if (authStatus.ok) {
+    status = 'ok';
+  } else if (authStatus.ok === false) {
+    status = 'failed';
+  }
+
+  const authProfiles = getAuthProfiles(state);
+
+  const profile = service && service.getProfile();
+
+  const isInteractive = authProfiles.some((config) => config.profile === profile && !(config.external || config.kiosk));
+
+  return {
+    accessTokenServiceId: accessTokenService && accessTokenService.id,
+    authServiceId: service && service.id,
+    confirm: service && service.getConfirmLabel(),
+    description: service && service.getDescription(),
+    failureDescription: service && service.getFailureDescription(),
+    failureHeader: service && service.getFailureHeader(),
+    header: service && service.getHeader(),
+    isInteractive,
+    label: service && service.getLabel()[0].value,
+    logoutConfirm: logoutService && logoutService.getLabel()[0] && logoutService.getLabel()[0].value,
+    logoutServiceId: logoutService && logoutService.id,
+    profile,
+    status,
+  };
+};
+
+/**
+ * mapDispatchToProps - used to hook up connect to action creators
+ * @memberof ManifestListItem
+ * @private
+ */
+const mapDispatchToProps = {
+  handleAuthInteraction: actions.addAuthenticationRequest,
+  resetAuthenticationState: actions.resetAuthenticationState,
+  resolveAccessTokenRequest: actions.resolveAccessTokenRequest,
+  resolveAuthenticationRequest: actions.resolveAuthenticationRequest,
+};
+
+const enhance = compose(connect(mapStateToProps, mapDispatchToProps), withPlugins('IIIFAuthentication'));
+
+export default enhance(IIIFAuthentication);

package/src/containers/IIIFThumbnail.js

@@ -0,0 +1,17 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import { getConfig } from '../state/selectors';
+import { IIIFThumbnail } from '../components/IIIFThumbnail';
+
+/**
+ * mapStateToProps - to hook up connect
+ * @private
+ */
+const mapStateToProps = (state) => ({
+  thumbnailsConfig: getConfig(state).thumbnails,
+});
+
+const enhance = compose(connect(mapStateToProps), withPlugins('IIIFThumbnail'));
+
+export default enhance(IIIFThumbnail);

package/src/containers/LabelValueMetadata.js

@@ -0,0 +1,14 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import { getConfig } from '../state/selectors';
+import { LabelValueMetadata } from '../components/LabelValueMetadata';
+
+/** */
+const mapStateToProps = (state) => ({
+  labelValueJoiner: getConfig(state).labelValueJoiner,
+});
+
+const enhance = compose(connect(mapStateToProps), withPlugins('LabelValueMetadata'));
+
+export default enhance(LabelValueMetadata);

package/src/containers/LanguageSettings.js

@@ -0,0 +1,26 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import * as actions from '../state/actions';
+import { getLanguagesFromConfigWithCurrent } from '../state/selectors';
+import { LanguageSettings } from '../components/LanguageSettings';
+
+/**
+ * Map state to props for connect
+ */
+const mapStateToProps = (state) => ({
+  languages: getLanguagesFromConfigWithCurrent(state),
+});
+
+/**
+ * Map action dispatches to props for connect
+ */
+const mapDispatchToProps = (dispatch, { afterSelect }) => ({
+  handleClick: (language) => {
+    dispatch(actions.updateConfig({ language }));
+
+    afterSelect && afterSelect();
+  },
+});
+
+export default compose(connect(mapStateToProps, mapDispatchToProps), withPlugins('LanguageSettings'))(LanguageSettings);

package/src/containers/LayersPanel.js

@@ -0,0 +1,16 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { withPlugins } from '../extend/withPlugins';
+import { LayersPanel } from '../components/LayersPanel';
+import { getVisibleCanvasIds } from '../state/selectors';
+
+/**
+ * mapStateToProps - to hook up connect
+ */
+const mapStateToProps = (state, { id, windowId }) => ({
+  canvasIds: getVisibleCanvasIds(state, { windowId }),
+});
+
+const enhance = compose(connect(mapStateToProps), withPlugins('LayersPanel'));
+
+export default enhance(LayersPanel);