Skip to content

Commit 472c27b

Browse files
cbeercbeer
committed
Use context to pass the windowId prop around
1 parent 41e2a86 commit 472c27b

File tree

87 files changed

+271
-159
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

87 files changed

+271
-159
lines changed

‎__tests__/src/components/CompanionWindowFactory.test.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,11 @@ import { CompanionWindowFactory } from '../../../src/components/CompanionWindowF
66
function createWrapper({ content = 'closed', ...props }) {
77
return render(
88
<CompanionWindowFactory
9-
windowId="x"
109
id="123"
1110
content={content}
1211
{...props}
1312
/>,
14-
{ preloadedState: { companionWindows: { 123: { content }, thumb: {} }, windows: { x: { thumbnailNavigationId: 'thumb' } } } },
13+
{ preloadedState: { companionWindows: { 123: { content }, thumb: {} }, windows: { x: { thumbnailNavigationId: 'thumb' } } }, windowId: 'x' },
1514
);
1615
}
1716

‎__tests__/src/components/GalleryView.test.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,10 @@ function createWrapper(props) {
99
return render(
1010
<GalleryView
1111
canvases={Utils.parseManifest(manifestJson).getSequences()[0].getCanvases()}
12-
windowId="1234"
1312
selectedCanvasIndex={0}
1413
{...props}
1514
/>,
15+
{ windowId: '1234' },
1616
);
1717
}
1818

‎__tests__/src/components/PrimaryWindow.test.js

Lines changed: 3 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,9 @@ function createWrapper(props) {
66
return render(
77
<PrimaryWindow
88
classes={{}}
9-
windowId="xyz"
109
{...props}
1110
/>,
12-
{ preloadedState: { windows: { xyz: { collectionPath: [{}], companionWindowIds: [] } } } },
11+
{ preloadedState: { windows: { xyz: { collectionPath: [{}], companionWindowIds: [] } } }, windowId: 'xyz' },
1312
);
1413
}
1514

@@ -30,10 +29,7 @@ describe('PrimaryWindow', () => {
3029
});
3130
it('should render <GalleryView> if fetching is complete and view is gallery', async () => {
3231
createWrapper({ isFetching: false, view: 'gallery' });
33-
await screen.findByTestId('test-window');
34-
await waitFor(() => {
35-
expect(document.querySelector('#xyz-gallery')).toBeInTheDocument(); // eslint-disable-line testing-library/no-node-access
36-
});
32+
expect(await screen.findByRole('region', { accessibleName: 'gallery section' })).toBeInTheDocument();
3733
});
3834
it('should render <CollectionDialog> and <SelectCollection> if manifest is collection and isCollectionDialogVisible', async () => {
3935
render(<div id="xyz" />);
@@ -42,9 +38,8 @@ describe('PrimaryWindow', () => {
4238
classes={{}}
4339
isCollection
4440
isCollectionDialogVisible
45-
windowId="xyz"
4641
/>,
47-
{ preloadedState: { windows: { xyz: { collectionPath: [{}] } } } },
42+
{ preloadedState: { windows: { xyz: { collectionPath: [{}] } } }, windowId: 'xyz' },
4843
);
4944
await screen.findByRole('button', { accessibleName: 'show collection' });
5045
});

‎__tests__/src/components/SearchResults.test.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,7 @@ function createWrapper(props) {
6464
window: {},
6565
},
6666
},
67+
windowId: 'window',
6768
},
6869
);
6970
}

‎__tests__/src/components/WindowSideBar.test.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ import { WindowSideBar } from '../../../src/components/WindowSideBar';
55
function createWrapper({ ...props }) {
66
return render(
77
<WindowSideBar
8-
windowId="xyz"
98
{...props}
109
/>,
1110
{
@@ -17,6 +16,7 @@ function createWrapper({ ...props }) {
1716
},
1817
},
1918
},
19+
windowId: 'xyz',
2020
},
2121
);
2222
}

‎__tests__/src/components/WindowSideBarAnnotationsPanel.test.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,9 @@ function createWrapper(props, state) {
99
annotationCount={4}
1010
classes={{}}
1111
id="xyz"
12-
windowId="abc"
1312
{...props}
1413
/>,
15-
{ preloadedState: { companionWindows: { xyz: { content: 'annotations' } }, windows: { abc: {} }, ...state } },
14+
{ preloadedState: { companionWindows: { xyz: { content: 'annotations' } }, windows: { abc: {} }, ...state }, windowId: 'abc' },
1615
);
1716
}
1817

‎__tests__/utils/test-utils.js

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import { I18nextProvider } from 'react-i18next';
88
import createRootReducer from '../../src/state/reducers/rootReducer';
99
import settings from '../../src/config/settings';
1010
import createI18nInstance from '../../src/i18n';
11+
import WindowContext from '../../src/contexts/WindowContext';
1112

1213
/** Mirador viewer setup for Integration tests */
1314
import Mirador from '../../src/index';
@@ -29,19 +30,24 @@ function renderWithProviders(
2930
preloadedState = {},
3031
// Automatically create a store instance if no store was passed in
3132
store = createStore(rootReducer, preloadedState, applyMiddleware(thunk)),
33+
windowId,
3234
...renderOptions
3335
} = {},
3436
) {
37+
const windowContext = windowId ? { id: windowId } : {};
38+
3539
/** :nodoc: */
3640
function Wrapper({ children }) {
3741
return (
38-
<I18nextProvider i18n={i18n}>
39-
<ThemeProvider theme={theme}>
40-
<Provider store={store}>
41-
{children}
42-
</Provider>
43-
</ThemeProvider>
44-
</I18nextProvider>
42+
<WindowContext.Provider value={windowContext}>
43+
<I18nextProvider i18n={i18n}>
44+
<ThemeProvider theme={theme}>
45+
<Provider store={store}>
46+
{children}
47+
</Provider>
48+
</ThemeProvider>
49+
</I18nextProvider>
50+
</WindowContext.Provider>
4551
);
4652
}
4753

‎src/components/AnnotationSettings.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,5 +28,4 @@ AnnotationSettings.propTypes = {
2828
displayAll: PropTypes.bool.isRequired,
2929
displayAllDisabled: PropTypes.bool.isRequired,
3030
toggleAnnotationDisplay: PropTypes.func.isRequired,
31-
windowId: PropTypes.string.isRequired, // eslint-disable-line react/no-unused-prop-types
3231
};

‎src/components/AttributionPanel.js

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,6 @@ export function AttributionPanel({
2626
manifestLogo = null,
2727
requiredStatement = null,
2828
rights = null,
29-
windowId,
3029
id,
3130
}) {
3231
const { t } = useTranslation();
@@ -37,7 +36,6 @@ export function AttributionPanel({
3736
<CompanionWindow
3837
title={t('attributionTitle')}
3938
paperClassName={ns('attribution-panel')}
40-
windowId={windowId}
4139
id={id}
4240
>
4341
<CompanionWindowSection>
@@ -86,5 +84,4 @@ AttributionPanel.propTypes = {
8684
value: PropTypes.string,
8785
})),
8886
rights: PropTypes.arrayOf(PropTypes.string),
89-
windowId: PropTypes.string.isRequired,
9087
};

‎src/components/CompanionArea.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -97,7 +97,7 @@ export function CompanionArea({
9797
className={`${ns('companion-windows')}`}
9898
>
9999
{companionWindowIds.map((id) => (
100-
<CompanionWindowFactory id={id} key={id} windowId={windowId} />
100+
<CompanionWindowFactory id={id} key={id} />
101101
))}
102102
</Container>
103103
</Slide>

‎src/components/CompanionWindowFactory.js

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -10,32 +10,30 @@ import ErrorContent from '../containers/ErrorContent';
1010
* Render a companion window using the appropriate component for the content
1111
*/
1212
export function CompanionWindowFactory({
13-
content = null, id, windowId,
13+
content = null, id,
1414
}) {
1515
const { t } = useTranslation();
1616
const ErroredCompanionWindow = useCallback(({ error }) => (
1717
<CompanionWindow
1818
title={t('error')}
19-
windowId={windowId}
2019
id={id}
2120
>
22-
<ErrorContent error={error} windowId={windowId} companionWindowId={id} />
21+
<ErrorContent error={error} companionWindowId={id} />
2322
</CompanionWindow>
24-
), [windowId, t, id]);
23+
), [t, id]);
2524

2625
const DynamicCompanionWindowType = CompanionWindowRegistry[content];
2726

2827
if (!DynamicCompanionWindowType) return null;
2928

3029
return (
3130
<ErrorBoundary fallbackComponent={ErroredCompanionWindow}>
32-
<DynamicCompanionWindowType id={id} windowId={windowId} />
31+
<DynamicCompanionWindowType id={id} />
3332
</ErrorBoundary>
3433
);
3534
}
3635

3736
CompanionWindowFactory.propTypes = {
3837
content: PropTypes.string,
3938
id: PropTypes.string.isRequired,
40-
windowId: PropTypes.string.isRequired,
4139
};

‎src/components/CustomPanel.js

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,14 +6,13 @@ import CompanionWindow from '../containers/CompanionWindow';
66
* a custom panel that can be used for anything
77
*/
88
export function CustomPanel({
9-
id, children = null, title, windowId,
9+
id, children = null, title,
1010
}) {
1111
const { t } = useTranslation();
1212
return (
1313
<CompanionWindow
1414
title={t(title)}
1515
id={id}
16-
windowId={windowId}
1716
>
1817
{children}
1918
</CompanionWindow>
@@ -24,5 +23,4 @@ CustomPanel.propTypes = {
2423
children: PropTypes.node,
2524
id: PropTypes.string.isRequired,
2625
title: PropTypes.string.isRequired,
27-
windowId: PropTypes.string.isRequired,
2826
};

‎src/components/GalleryView.js

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ const Root = styled(Paper, { name: 'GalleryView', slot: 'root' })(({ theme }) =>
1717
/**
1818
* Renders a GalleryView overview of the manifest.
1919
*/
20-
export function GalleryView({ canvases, viewingDirection = '', windowId }) {
20+
export function GalleryView({ canvases, viewingDirection = '' }) {
2121
const htmlDir = viewingDirection === 'right-to-left' ? 'rtl' : 'ltr';
2222
return (
2323
<Root
@@ -26,13 +26,11 @@ export function GalleryView({ canvases, viewingDirection = '', windowId }) {
2626
dir={htmlDir}
2727
square
2828
elevation={0}
29-
id={`${windowId}-gallery`}
3029
>
3130
{
3231
canvases.map(canvas => (
3332
<GalleryViewThumbnail
3433
key={canvas.id}
35-
windowId={windowId}
3634
canvas={canvas}
3735
/>
3836
))
@@ -44,5 +42,4 @@ export function GalleryView({ canvases, viewingDirection = '', windowId }) {
4442
GalleryView.propTypes = {
4543
canvases: PropTypes.array.isRequired, // eslint-disable-line react/forbid-prop-types
4644
viewingDirection: PropTypes.string,
47-
windowId: PropTypes.string.isRequired,
4845
};

‎src/components/IIIFAuthentication.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,6 @@ export function IIIFAuthentication({
2626
authServiceId,
2727
hasLogoutService: !!logoutServiceId,
2828
status,
29-
windowId,
3029
});
3130

3231
/** handle the IIIF logout workflow */

‎src/components/LayersPanel.js

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,22 +7,20 @@ import CanvasLayers from '../containers/CanvasLayers';
77
* a panel showing the canvases for a given manifest
88
*/
99
export function LayersPanel({
10-
canvasIds = [], id, windowId,
10+
canvasIds = [], id,
1111
}) {
1212
const { t } = useTranslation();
1313
return (
1414
<CompanionWindow
1515
title={t('layers')}
1616
id={id}
17-
windowId={windowId}
1817
>
1918
{canvasIds.map((canvasId, index) => (
2019
<CanvasLayers
2120
canvasId={canvasId}
2221
index={index}
2322
key={canvasId}
2423
totalSize={canvasIds.length}
25-
windowId={windowId}
2624
/>
2725
))}
2826
</CompanionWindow>
@@ -32,5 +30,4 @@ export function LayersPanel({
3230
LayersPanel.propTypes = {
3331
canvasIds: PropTypes.arrayOf(PropTypes.string),
3432
id: PropTypes.string.isRequired,
35-
windowId: PropTypes.string.isRequired,
3633
};

‎src/components/OpenSeadragonViewer.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -135,7 +135,7 @@ export function OpenSeadragonViewer({
135135
);
136136
})}
137137
{ drawAnnotations
138-
&& <AnnotationsOverlay viewer={viewer} windowId={windowId} /> }
138+
&& <AnnotationsOverlay viewer={viewer} /> }
139139
{ enhancedChildren }
140140
<PluginHook viewer={viewer} {...pluginProps} />
141141
</OpenSeadragonComponent>

‎src/components/PrimaryWindow.js

Lines changed: 10 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -26,41 +26,31 @@ const Root = styled('div', { name: 'PrimaryWindow', slot: 'root' })(() => ({
2626
/** */
2727
const TypeSpecificViewer = ({
2828
audioResources = [], isCollection = false,
29-
isFetching = false, videoResources = [], view = undefined, windowId,
29+
isFetching = false, videoResources = [], view = undefined,
3030
}) => {
3131
if (isCollection) {
3232
return (
33-
<SelectCollection
34-
windowId={windowId}
35-
/>
33+
<SelectCollection />
3634
);
3735
}
3836
if (isFetching === false) {
3937
if (view === 'gallery') {
4038
return (
41-
<GalleryView
42-
windowId={windowId}
43-
/>
39+
<GalleryView />
4440
);
4541
}
4642
if (videoResources.length > 0) {
4743
return (
48-
<VideoViewer
49-
windowId={windowId}
50-
/>
44+
<VideoViewer />
5145
);
5246
}
5347
if (audioResources.length > 0) {
5448
return (
55-
<AudioViewer
56-
windowId={windowId}
57-
/>
49+
<AudioViewer />
5850
);
5951
}
6052
return (
61-
<WindowViewer
62-
windowId={windowId}
63-
/>
53+
<WindowViewer />
6454
);
6555
}
6656
return null;
@@ -72,7 +62,6 @@ TypeSpecificViewer.propTypes = {
7262
isFetching: PropTypes.bool,
7363
videoResources: PropTypes.arrayOf(PropTypes.object), // eslint-disable-line react/forbid-prop-types
7464
view: PropTypes.string,
75-
windowId: PropTypes.string.isRequired,
7665
};
7766

7867
/**
@@ -81,22 +70,21 @@ TypeSpecificViewer.propTypes = {
8170
*/
8271
export function PrimaryWindow({
8372
audioResources = undefined, isCollection = false, isFetching = false, videoResources = undefined,
84-
view = undefined, windowId, isCollectionDialogVisible = false, children = null, className = undefined,
73+
view = undefined, isCollectionDialogVisible = false, children = null, className = undefined,
8574
}) {
8675
const viewerProps = {
8776
audioResources,
8877
isCollection,
8978
isFetching,
9079
videoResources,
9180
view,
92-
windowId,
9381
};
9482

9583
return (
9684
<Root data-testid="test-window" className={classNames(ns('primary-window'), className)}>
97-
<WindowSideBar windowId={windowId} />
98-
<CompanionArea windowId={windowId} position="left" />
99-
{ isCollectionDialogVisible && <CollectionDialog windowId={windowId} /> }
85+
<WindowSideBar />
86+
<CompanionArea position="left" />
87+
{ isCollectionDialogVisible && <CollectionDialog /> }
10088
<Suspense fallback={<div />}>
10189
{children || <TypeSpecificViewer {...viewerProps} />}
10290
</Suspense>
@@ -113,5 +101,4 @@ PrimaryWindow.propTypes = {
113101
isFetching: PropTypes.bool,
114102
videoResources: PropTypes.arrayOf(PropTypes.object), // eslint-disable-line react/forbid-prop-types
115103
view: PropTypes.string,
116-
windowId: PropTypes.string.isRequired,
117104
};

0 commit comments

Comments
 (0)