Use context to pass the window id around

Author: cbeer

src/components/AnnotationSettings.js

@@ -35,5 +35,4 @@ AnnotationSettings.propTypes = {
   displayAllDisabled: PropTypes.bool.isRequired,
   t: PropTypes.func.isRequired,
   toggleAnnotationDisplay: PropTypes.func.isRequired,
-  windowId: PropTypes.string.isRequired, // eslint-disable-line react/no-unused-prop-types
 };

src/components/AttributionPanel.js

@@ -22,7 +22,6 @@ export class AttributionPanel extends Component {
       manifestLogo,
       requiredStatement,
       rights,
-      windowId,
       id,
       classes,
       t,
@@ -32,7 +31,6 @@ export class AttributionPanel extends Component {
       <CompanionWindow
         title={t('attributionTitle')}
         paperClassName={ns('attribution-panel')}
-        windowId={windowId}
         id={id}
       >
         <div className={classes.section}>
@@ -85,7 +83,6 @@ AttributionPanel.propTypes = {
   })),
   rights: PropTypes.arrayOf(PropTypes.string),
   t: PropTypes.func,
-  windowId: PropTypes.string.isRequired,
 };
 
 AttributionPanel.defaultProps = {

src/components/CompanionArea.js

@@ -61,7 +61,7 @@ export class CompanionArea extends Component {
           <div className={[ns('companion-windows'), companionWindowIds.length > 0 && classes[position], this.areaLayoutClass()].join(' ')} style={{ display: companionAreaOpen ? 'flex' : 'none' }}>
             {
               companionWindowIds.map(id => (
-                <CompanionWindowFactory id={id} key={id} windowId={windowId} />
+                <CompanionWindowFactory id={id} key={id} />
               ))
             }
           </div>

src/components/CompanionWindowFactory.js

@@ -40,7 +40,6 @@ export class CompanionWindowFactory extends Component {
   render() {
     const {
       content,
-      windowId,
       id,
       t,
     } = this.props;
@@ -50,10 +49,9 @@ export class CompanionWindowFactory extends Component {
       return (
         <CompanionWindow
           title={t('error')}
-          windowId={windowId}
           id={id}
         >
-          <ErrorContent error={error} windowId={windowId} companionWindowId={id} />
+          <ErrorContent error={error} companionWindowId={id} />
         </CompanionWindow>
       );
     }
@@ -62,15 +60,14 @@ export class CompanionWindowFactory extends Component {
 
     if (!type) return null;
 
-    return createElement(type, { id, windowId });
+    return createElement(type, { id });
   }
 }
 
 CompanionWindowFactory.propTypes = {
   content: PropTypes.string,
   id: PropTypes.string.isRequired,
   t: PropTypes.func,
-  windowId: PropTypes.string.isRequired,
 };
 
 CompanionWindowFactory.defaultProps = {

src/components/CustomPanel.js

@@ -15,14 +15,12 @@ export class CustomPanel extends Component {
       children,
       t,
       title,
-      windowId,
     } = this.props;
 
     return (
       <CompanionWindow
         title={t(title)}
         id={id}
-        windowId={windowId}
       >
         {children}
       </CompanionWindow>
@@ -35,7 +33,6 @@ CustomPanel.propTypes = {
   id: PropTypes.string.isRequired,
   t: PropTypes.func.isRequired,
   title: PropTypes.string.isRequired,
-  windowId: PropTypes.string.isRequired,
 };
 
 CustomPanel.defaultProps = {

src/components/GalleryView.js

@@ -12,7 +12,7 @@ export class GalleryView extends Component {
    */
   render() {
     const {
-      canvases, classes, viewingDirection, windowId,
+      canvases, classes, viewingDirection,
     } = this.props;
     const htmlDir = viewingDirection === 'right-to-left' ? 'rtl' : 'ltr';
     return (
@@ -22,13 +22,11 @@ export class GalleryView extends Component {
         square
         elevation={0}
         className={classes.galleryContainer}
-        id={`${windowId}-gallery`}
       >
         {
           canvases.map(canvas => (
             <GalleryViewThumbnail
               key={canvas.id}
-              windowId={windowId}
               canvas={canvas}
             />
           ))
@@ -42,7 +40,6 @@ GalleryView.propTypes = {
   canvases: PropTypes.array.isRequired, // eslint-disable-line react/forbid-prop-types
   classes: PropTypes.objectOf(PropTypes.string),
   viewingDirection: PropTypes.string,
-  windowId: PropTypes.string.isRequired,
 };
 
 GalleryView.defaultProps = {

src/components/IIIFAuthentication.js

@@ -28,14 +28,13 @@ export class IIIFAuthentication extends Component {
   /** */
   defaultAuthBarProps() {
     const {
-      authServiceId, windowId, status, logoutServiceId,
+      authServiceId, status, logoutServiceId,
     } = this.props;
 
     return {
       authServiceId,
       hasLogoutService: !!logoutServiceId,
       status,
-      windowId,
     };
   }
 

src/components/LayersPanel.js

@@ -15,22 +15,19 @@ export class LayersPanel extends Component {
       canvasIds,
       id,
       t,
-      windowId,
     } = this.props;
 
     return (
       <CompanionWindow
         title={t('layers')}
         id={id}
-        windowId={windowId}
       >
         {canvasIds.map((canvasId, index) => (
           <CanvasLayers
             canvasId={canvasId}
             index={index}
             key={canvasId}
             totalSize={canvasIds.length}
-            windowId={windowId}
           />
         ))}
       </CompanionWindow>
@@ -42,7 +39,6 @@ LayersPanel.propTypes = {
   canvasIds: PropTypes.arrayOf(PropTypes.string),
   id: PropTypes.string.isRequired,
   t: PropTypes.func.isRequired,
-  windowId: PropTypes.string.isRequired,
 };
 
 LayersPanel.defaultProps = {

src/components/OpenSeadragonViewer.js

@@ -374,7 +374,7 @@ export class OpenSeadragonViewer extends Component {
         aria-live="polite"
       >
         { drawAnnotations
-            && <AnnotationsOverlay viewer={viewer} windowId={windowId} /> }
+            && <AnnotationsOverlay viewer={viewer} /> }
         { enhancedChildren }
         <PluginHook viewer={viewer} {...{ ...this.props, children: null }} />
       </section>

src/components/PrimaryWindow.js

@@ -29,41 +29,31 @@ export class PrimaryWindow extends Component {
   renderViewer() {
     const {
       audioResources, isCollection,
-      isFetching, videoResources, view, windowId,
+      isFetching, videoResources, view,
     } = this.props;
     if (isCollection) {
       return (
-        <SelectCollection
-          windowId={windowId}
-        />
+        <SelectCollection />
       );
     }
     if (isFetching === false) {
       if (view === 'gallery') {
         return (
-          <GalleryView
-            windowId={windowId}
-          />
+          <GalleryView />
         );
       }
       if (videoResources.length > 0) {
         return (
-          <VideoViewer
-            windowId={windowId}
-          />
+          <VideoViewer />
         );
       }
       if (audioResources.length > 0) {
         return (
-          <AudioViewer
-            windowId={windowId}
-          />
+          <AudioViewer />
         );
       }
       return (
-        <WindowViewer
-          windowId={windowId}
-        />
+        <WindowViewer />
       );
     }
     return null;
@@ -74,13 +64,13 @@ export class PrimaryWindow extends Component {
    */
   render() {
     const {
-      isCollectionDialogVisible, windowId, classes, children,
+      isCollectionDialogVisible, classes, children,
     } = this.props;
     return (
       <div className={classNames(ns('primary-window'), classes.primaryWindow)}>
-        <WindowSideBar windowId={windowId} />
-        <CompanionArea windowId={windowId} position="left" />
-        { isCollectionDialogVisible && <CollectionDialog windowId={windowId} /> }
+        <WindowSideBar />
+        <CompanionArea position="left" />
+        { isCollectionDialogVisible && <CollectionDialog /> }
         <Suspense fallback={<div />}>
           {children || this.renderViewer()}
         </Suspense>
@@ -98,7 +88,6 @@ PrimaryWindow.propTypes = {
   isFetching: PropTypes.bool,
   videoResources: PropTypes.arrayOf(PropTypes.object), // eslint-disable-line react/forbid-prop-types
   view: PropTypes.string,
-  windowId: PropTypes.string.isRequired,
 };
 
 PrimaryWindow.defaultProps = {