diff --git a/__tests__/src/components/App.test.js b/__tests__/src/components/App.test.js
index b992db59bf8071c63a44df3b2d64a32584066adf..0a84c0f4545125de88f3dc692967d122758ecd91 100644
--- a/__tests__/src/components/App.test.js
+++ b/__tests__/src/components/App.test.js
@@ -2,7 +2,7 @@ import React from 'react';
import { shallow } from 'enzyme';
import { MuiThemeProvider } from '@material-ui/core/styles';
import Fullscreen from 'react-fullscreen-crossbrowser';
-import WorkspaceControlPanel from '../../../src/components/WorkspaceControlPanel';
+import WorkspaceControlPanel from '../../../src/containers/WorkspaceControlPanel';
import Workspace from '../../../src/containers/Workspace';
import WorkspaceAdd from '../../../src/containers/WorkspaceAdd';
import App from '../../../src/components/App';
@@ -21,7 +21,7 @@ function createWrapper(props) {
classes={{}}
{...props}
/>,
- ).dive(); // to unwrapp HOC created by withStyle()
+ );
}
describe('App', () => {
diff --git a/__tests__/src/components/CompanionWindow.test.js b/__tests__/src/components/CompanionWindow.test.js
index f155abd8ef11cdfcad8ea38296e1f6fee67137bb..13ba8c1de3fe8b1f7d0744010b9061e209327d6f 100644
--- a/__tests__/src/components/CompanionWindow.test.js
+++ b/__tests__/src/components/CompanionWindow.test.js
@@ -14,7 +14,7 @@ function createWrapper(props) {
position="right"
{...props}
/>,
- ).dive(); // unwrap HOC created by withStyles()
+ );
}
describe('CompanionWindow', () => {
diff --git a/__tests__/src/components/ManifestListItem.test.js b/__tests__/src/components/ManifestListItem.test.js
index f3c85f267e08c931a273e443c99c6b0e819cb188..142af43e4b6149fa405a659885b8c4d3ddec4fd0 100644
--- a/__tests__/src/components/ManifestListItem.test.js
+++ b/__tests__/src/components/ManifestListItem.test.js
@@ -15,7 +15,7 @@ function createWrapper(props) {
t={t => t}
{...props}
/>,
- ).dive(); // to unwrapp HOC created by withStyle()
+ );
}
describe('ManifestListItem', () => {
diff --git a/__tests__/src/components/ManifestListItemError.test.js b/__tests__/src/components/ManifestListItemError.test.js
index 9606b3de0e3ed051f716e3d8c7d736edfd2dd416..5d84fd79a1192d63c363252871aabef79c9e7340 100644
--- a/__tests__/src/components/ManifestListItemError.test.js
+++ b/__tests__/src/components/ManifestListItemError.test.js
@@ -9,13 +9,14 @@ import ManifestListItemError from '../../../src/components/ManifestListItemError
function createWrapper(props) {
return shallow(
<ManifestListItemError
+ classes={{}}
manifestId="http://example.com"
onDismissClick={() => {}}
onTryAgainClick={() => {}}
t={key => key}
{...props}
/>,
- ).dive(); // unwrap HOC created by withStyles()
+ );
}
describe('ManifestListItemError', () => {
diff --git a/__tests__/src/components/WindowSideBar.test.js b/__tests__/src/components/WindowSideBar.test.js
index 74d0d015084cf699b32a91edb3d3548978b1a04c..be0694041bb622300f71f9d67c930a6acc418dd1 100644
--- a/__tests__/src/components/WindowSideBar.test.js
+++ b/__tests__/src/components/WindowSideBar.test.js
@@ -5,7 +5,7 @@ import WindowSideBar from '../../../src/components/WindowSideBar';
describe('WindowSideBar', () => {
let wrapper;
beforeEach(() => {
- wrapper = shallow(<WindowSideBar windowId="1" classes={{}} />).dive();
+ wrapper = shallow(<WindowSideBar windowId="1" classes={{}} />);
});
it('renders without an error', () => {
diff --git a/__tests__/src/components/WindowSideBarCanvasPanel.test.js b/__tests__/src/components/WindowSideBarCanvasPanel.test.js
index 8f1de0a17d2631a0008d6b713e9344170a2d59af..3ca22f646c615f08aa25da2db4686216fca45044 100644
--- a/__tests__/src/components/WindowSideBarCanvasPanel.test.js
+++ b/__tests__/src/components/WindowSideBarCanvasPanel.test.js
@@ -27,7 +27,7 @@ describe('WindowSideBarCanvasPanel', () => {
setCanvas={setCanvas}
config={{ canvasNavigation: { height: 100 } }}
/>,
- ).dive();
+ );
});
it('renders all needed elements', () => {
diff --git a/__tests__/src/components/WindowSideBarInfoPanel.test.js b/__tests__/src/components/WindowSideBarInfoPanel.test.js
index c9cbc2cb76e08ad2c775d2373091e959ebdb9663..ec625de88c82cf7238730ea4abf1eb83832250af 100644
--- a/__tests__/src/components/WindowSideBarInfoPanel.test.js
+++ b/__tests__/src/components/WindowSideBarInfoPanel.test.js
@@ -21,7 +21,7 @@ describe('WindowSideBarInfoPanel', () => {
manifestMetadata={metadata}
t={str => str}
/>,
- ).dive();
+ );
});
it('renders header', () => {
@@ -89,7 +89,7 @@ describe('WindowSideBarInfoPanel', () => {
beforeEach(() => {
wrapper = shallow(
<WindowSideBarInfoPanel />,
- ).dive();
+ );
});
it('does render header', () => {
diff --git a/__tests__/src/components/WindowTopBar.test.js b/__tests__/src/components/WindowTopBar.test.js
index 4fe237023b1c07600e28eb782d73d9eea2941d25..94c0c0f2d4b807ed4eb0c8e569306b650455cb3f 100644
--- a/__tests__/src/components/WindowTopBar.test.js
+++ b/__tests__/src/components/WindowTopBar.test.js
@@ -24,7 +24,7 @@ function createWrapper(props) {
toggleWindowSideBar={() => {}}
{...props}
/>,
- ).dive(); // unwrap HOC created by withStyles()
+ );
}
describe('WindowTopBar', () => {
diff --git a/__tests__/src/components/WindowTopMenuButton.test.js b/__tests__/src/components/WindowTopMenuButton.test.js
index 4a0dea2650019a0b321f163bb03fe90fa3408ec8..7da21e820d7252668e7a46034fb13338a19d1857 100644
--- a/__tests__/src/components/WindowTopMenuButton.test.js
+++ b/__tests__/src/components/WindowTopMenuButton.test.js
@@ -14,7 +14,7 @@ function createWrapper(props) {
t={str => str}
{...props}
/>,
- ).dive(); // unwrap HOC created by withStyles()
+ );
}
describe('WindowTopMenuButton', () => {
diff --git a/__tests__/src/components/WorkspaceAdd.test.js b/__tests__/src/components/WorkspaceAdd.test.js
index 91a63ca19e8508630203d6d43f3f8bf2ac782f6c..cd0c32b0ec49304f32ec81940789460e2c62ace8 100644
--- a/__tests__/src/components/WorkspaceAdd.test.js
+++ b/__tests__/src/components/WorkspaceAdd.test.js
@@ -1,7 +1,9 @@
import React from 'react';
import { shallow } from 'enzyme';
import WorkspaceAdd from '../../../src/components/WorkspaceAdd';
+import ManifestListItem from '../../../src/containers/ManifestListItem';
import fixture from '../../fixtures/version-2/002.json';
+import ManifestForm from '../../../src/containers/ManifestForm';
/** create wrapper */
function createWrapper(props) {
@@ -13,20 +15,20 @@ function createWrapper(props) {
t={str => str}
{...props}
/>,
- ).dive();
+ );
}
-describe('WorkspaceAddButton', () => {
+describe('WorkspaceAdd', () => {
it('renders a list item for each manifest in the state', () => {
const wrapper = createWrapper();
- expect(wrapper.find('Connect(LoadNamespace(WithStyles(ManifestListItem)))').length).toBe(2);
+ expect(wrapper.find(ManifestListItem).length).toBe(2);
});
it('toggles the workspace visibility', () => {
const setWorkspaceAddVisibility = jest.fn();
const wrapper = createWrapper({ setWorkspaceAddVisibility });
- wrapper.find('Connect(LoadNamespace(WithStyles(ManifestListItem)))').first().props().handleClose();
+ wrapper.find(ManifestListItem).first().props().handleClose();
expect(setWorkspaceAddVisibility).toHaveBeenCalledWith(false);
});
@@ -54,8 +56,8 @@ describe('WorkspaceAddButton', () => {
const wrapper = createWrapper();
wrapper.setState({ addResourcesOpen: true });
- expect(wrapper.find('WithStyles(Drawer) Connect(LoadNamespace(ManifestForm))').length).toBe(1);
- wrapper.find('WithStyles(Drawer) Connect(LoadNamespace(ManifestForm))').props().onCancel();
+ expect(wrapper.find('WithStyles(Drawer)').find(ManifestForm).length).toBe(1);
+ wrapper.find('WithStyles(Drawer)').find(ManifestForm).props().onCancel();
expect(wrapper.find('WithStyles(Drawer)').props().open).toBe(false);
});
});
diff --git a/__tests__/src/components/WorkspaceAddButton.test.js b/__tests__/src/components/WorkspaceAddButton.test.js
index 7ab45d043c1f002c65c03874ecce0df57242f5ab..9c1fea0831216e04b0fd7ce11ee2f3e5b9018ac9 100644
--- a/__tests__/src/components/WorkspaceAddButton.test.js
+++ b/__tests__/src/components/WorkspaceAddButton.test.js
@@ -13,7 +13,7 @@ function createWrapper(props) {
t={str => str}
{...props}
/>,
- ).dive(); // unwrap HOC created by withStyles()
+ );
}
describe('WorkspaceAddButton', () => {
diff --git a/__tests__/src/components/WorkspaceControlPanel.test.js b/__tests__/src/components/WorkspaceControlPanel.test.js
index 8da2654d195083fbcbcfa2a536ae587ad0ee6506..31e59d0a45fa1c752aa5199e6dcd2e06eacf03cc 100644
--- a/__tests__/src/components/WorkspaceControlPanel.test.js
+++ b/__tests__/src/components/WorkspaceControlPanel.test.js
@@ -11,7 +11,12 @@ describe('WorkspaceControlPanel', () => {
beforeEach(() => {
store.dispatch(actions.receiveManifest('foo', fixture));
store.dispatch(actions.receiveManifest('bar', fixture));
- wrapper = shallow(<WorkspaceControlPanel store={store} />).dive();
+ wrapper = shallow(
+ <WorkspaceControlPanel
+ classes={{}}
+ store={store}
+ />,
+ );
});
it('renders without an error', () => {
diff --git a/__tests__/src/components/WorkspaceFullScreenButton.test.js b/__tests__/src/components/WorkspaceFullScreenButton.test.js
index 4fcb48a6bf5d0ecf5ecf3a4b68b2f836ba067fe0..88598ae501a05afb97c54fa38c385753f5643b60 100644
--- a/__tests__/src/components/WorkspaceFullScreenButton.test.js
+++ b/__tests__/src/components/WorkspaceFullScreenButton.test.js
@@ -12,7 +12,7 @@ describe('WorkspaceFullScreenButton', () => {
classes={{}}
setWorkspaceFullscreen={setWorkspaceFullscreen}
/>,
- ).dive();
+ );
});
it('renders without an error', () => {
diff --git a/__tests__/src/components/WorkspaceMenuButton.test.js b/__tests__/src/components/WorkspaceMenuButton.test.js
index 9d127c5c7fc5dd854367a6a5bb9c0da0ace5bbfd..ba48a869e7781e5de14b23f2fdafe954ef95f77a 100644
--- a/__tests__/src/components/WorkspaceMenuButton.test.js
+++ b/__tests__/src/components/WorkspaceMenuButton.test.js
@@ -7,7 +7,7 @@ describe('WorkspaceMenuButton', () => {
beforeEach(() => {
wrapper = shallow(
<WorkspaceMenuButton classes={{}} />,
- ).dive();
+ );
});
it('renders without an error', () => {
diff --git a/__tests__/src/components/ZoomControls.test.js b/__tests__/src/components/ZoomControls.test.js
index ad3cc991019370031cdc0b9cc418b56f3d126631..1b8efb89d2b00eb22248ffa8fd1b98bf31328df0 100644
--- a/__tests__/src/components/ZoomControls.test.js
+++ b/__tests__/src/components/ZoomControls.test.js
@@ -12,12 +12,13 @@ describe('ZoomControls', () => {
updateViewport = jest.fn();
wrapper = shallow(
<ZoomControls
+ classes={{}}
windowId="xyz"
viewer={viewer}
showZoomControls={showZoomControls}
updateViewport={updateViewport}
/>,
- ).dive();
+ );
});
describe('with showZoomControls=false', () => {
@@ -32,12 +33,13 @@ describe('ZoomControls', () => {
updateViewport = jest.fn();
wrapper = shallow(
<ZoomControls
+ classes={{}}
windowId="xyz"
viewer={viewer}
showZoomControls
updateViewport={updateViewport}
/>,
- ).dive();
+ );
});
it('renders a couple buttons', () => {
diff --git a/src/components/App.js b/src/components/App.js
index e4b236f02b2d7e8bacdbcac2b8354058a1e73ffd..cee00e4bc969f20504dce767615e67935a112927 100644
--- a/src/components/App.js
+++ b/src/components/App.js
@@ -1,10 +1,10 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
-import { MuiThemeProvider, createMuiTheme, withStyles } from '@material-ui/core/styles';
+import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles';
import Fullscreen from 'react-fullscreen-crossbrowser';
import { I18nextProvider } from 'react-i18next';
-import WorkspaceControlPanel from './WorkspaceControlPanel';
+import WorkspaceControlPanel from '../containers/WorkspaceControlPanel';
import Workspace from '../containers/Workspace';
import WorkspaceAdd from '../containers/WorkspaceAdd';
import ns from '../config/css-ns';
@@ -68,14 +68,6 @@ App.defaultProps = {
isFullscreenEnabled: false,
isWorkspaceAddVisible: false,
};
-/**
- Material UI style overrides
- @private
- */
-const styles = theme => ({
- background: {
- background: theme.palette.background.default,
- },
-});
-export default withStyles(styles)(App);
+
+export default App;
diff --git a/src/components/CompanionWindow.js b/src/components/CompanionWindow.js
index b26f2f84ce1b900d64c531b9dca218a779650b55..4e373821ae33017ae3e0aef6584713b03acf3b59 100644
--- a/src/components/CompanionWindow.js
+++ b/src/components/CompanionWindow.js
@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
import CloseIcon from '@material-ui/icons/Close';
import IconButton from '@material-ui/core/IconButton';
import Paper from '@material-ui/core/Paper';
-import { withStyles } from '@material-ui/core/styles';
import ns from '../config/css-ns';
import WindowSideBarInfoPanel from '../containers/WindowSideBarInfoPanel';
import WindowSideBarCanvasPanel from '../containers/WindowSideBarCanvasPanel';
@@ -76,20 +75,4 @@ CompanionWindow.defaultProps = {
t: key => key,
};
-/**
- * Styles for Material-UI HOC
- */
-const styles = theme => ({
- closeButton: {
- position: 'absolute',
- right: 0,
- top: 0,
- },
- root: {
- ...theme.mixins.gutters(),
- width: '200px',
- overflowY: 'scroll',
- },
-});
-
-export default withStyles(styles)(CompanionWindow);
+export default CompanionWindow;
diff --git a/src/components/ManifestListItem.js b/src/components/ManifestListItem.js
index 6f91563f5ec041781a797855c4c7339edc3b77c2..c827ef8c54a6d139f7ce210abb8e5a19db13854c 100644
--- a/src/components/ManifestListItem.js
+++ b/src/components/ManifestListItem.js
@@ -1,6 +1,5 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { withStyles } from '@material-ui/core/styles';
import Paper from '@material-ui/core/Paper';
import ButtonBase from '@material-ui/core/ButtonBase';
import Grid from '@material-ui/core/Grid';
@@ -161,15 +160,4 @@ ManifestListItem.defaultProps = {
isFetching: false,
};
-/** */
-const styles = theme => ({
- root: {
- ...theme.mixins.gutters(),
- },
- label: {
- textTransform: 'initial',
- textAlign: 'left',
- },
-});
-
-export default withStyles(styles)(ManifestListItem);
+export default ManifestListItem;
diff --git a/src/components/ManifestListItemError.js b/src/components/ManifestListItemError.js
index 2d4c82df387012d7ac2c3317205fb9817ebd16e6..24c1f419edfcf09510adab39ea6f9e2cc1a369a9 100644
--- a/src/components/ManifestListItemError.js
+++ b/src/components/ManifestListItemError.js
@@ -4,7 +4,6 @@ import Button from '@material-ui/core/Button';
import ErrorIcon from '@material-ui/icons/ErrorOutline';
import Grid from '@material-ui/core/Grid';
import Typography from '@material-ui/core/Typography';
-import { withStyles } from '@material-ui/core/styles';
/**
* ManifestListItemError renders a component displaying a
@@ -61,19 +60,4 @@ ManifestListItemError.propTypes = {
t: PropTypes.func.isRequired,
};
-/**
- Material UI styles
- @private
- */
-const styles = theme => ({
- errorIcon: {
- color: theme.palette.error.main,
- height: '2rem',
- width: '2rem',
- },
- manifestIdText: {
- wordBreak: 'break-all',
- },
-});
-
-export default withStyles(styles)(ManifestListItemError);
+export default ManifestListItemError;
diff --git a/src/components/WindowSideBar.js b/src/components/WindowSideBar.js
index 5d6e00d7a55bc849b9395579535fa07c392fa453..77dba007cf070c57f0e64eb162b598c4017ce648 100644
--- a/src/components/WindowSideBar.js
+++ b/src/components/WindowSideBar.js
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import Drawer from '@material-ui/core/Drawer';
-import { withStyles } from '@material-ui/core/styles';
import List from '@material-ui/core/List';
import WindowSideBarButtons from '../containers/WindowSideBarButtons';
import WindowSideBarPanel from '../containers/WindowSideBarPanel';
@@ -74,22 +73,4 @@ WindowSideBar.defaultProps = {
sideBarPanel: 'closed',
};
-/**
- Material UI style overrides
- @private
- */
-const styles = theme => ({
- toolbar: theme.mixins.toolbar,
- drawer: {
- overflowX: 'hidden',
- left: 0,
- width: 55,
- flexShrink: 0,
- height: '100%',
- },
- grow: {
- flexGrow: 1,
- },
-});
-
-export default withStyles(styles)(WindowSideBar);
+export default WindowSideBar;
diff --git a/src/components/WindowSideBarCanvasPanel.js b/src/components/WindowSideBarCanvasPanel.js
index e0e241f5c9a009d7b37039675fa7ec5b0b6f1288..b777144800153c5e9f6bf8097422711d8330450c 100644
--- a/src/components/WindowSideBarCanvasPanel.js
+++ b/src/components/WindowSideBarCanvasPanel.js
@@ -4,7 +4,6 @@ import classNames from 'classnames';
import Typography from '@material-ui/core/Typography';
import List from '@material-ui/core/List';
import ListItem from '@material-ui/core/ListItem';
-import { withStyles } from '@material-ui/core/styles';
import ValidationCanvas from './ValidationCanvas';
import CanvasThumbnail from './CanvasThumbnail';
import { getIdAndLabelOfCanvases } from '../state/selectors';
@@ -83,19 +82,4 @@ WindowSideBarCanvasPanel.propTypes = {
windowId: PropTypes.string.isRequired,
};
-/**
- * @private
- * custom style definitions
- */
-const styles = theme => ({
- windowSideBarH2: theme.typography.h5,
- clickable: {
- cursor: 'pointer',
- },
- label: {
- fontSize: '8pt',
- paddingLeft: 8,
- },
-});
-
-export default withStyles(styles)(WindowSideBarCanvasPanel);
+export default WindowSideBarCanvasPanel;
diff --git a/src/components/WindowSideBarInfoPanel.js b/src/components/WindowSideBarInfoPanel.js
index 0bdf0f6b59363f282c7b1fe6a6ad4cf47c11933a..a93dd6537f255b3a36cf41cccc55ecab74c67324 100644
--- a/src/components/WindowSideBarInfoPanel.js
+++ b/src/components/WindowSideBarInfoPanel.js
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
import PropTypes from 'prop-types';
import Divider from '@material-ui/core/Divider';
import Typography from '@material-ui/core/Typography';
-import { withStyles } from '@material-ui/core/styles';
import LabelValueMetadata from './LabelValueMetadata';
import SanitizedHtml from './SanitizedHtml';
import ns from '../config/css-ns';
@@ -96,12 +95,4 @@ WindowSideBarInfoPanel.defaultProps = {
t: key => key,
};
-/**
- * @private
- */
-const styles = theme => ({
- windowSideBarH2: theme.typography.h5,
- windowSideBarH3: theme.typography.h6,
-});
-
-export default withStyles(styles)(WindowSideBarInfoPanel);
+export default WindowSideBarInfoPanel;
diff --git a/src/components/WindowTopBar.js b/src/components/WindowTopBar.js
index 846fe95780dc0d91dd256a410a856a66bacc5f2c..61d1942c044130124d0f203ac9f135ade34733ab 100644
--- a/src/components/WindowTopBar.js
+++ b/src/components/WindowTopBar.js
@@ -1,6 +1,5 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
-import { withStyles } from '@material-ui/core/styles';
import Typography from '@material-ui/core/Typography';
import IconButton from '@material-ui/core/IconButton';
import MenuIcon from '@material-ui/icons/Menu';
@@ -70,15 +69,4 @@ WindowTopBar.defaultProps = {
t: key => key,
};
-const styles = {
- typographyBody: {
- flexGrow: 1,
- fontSize: '1em',
- },
- reallyDense: {
- minHeight: 32,
- paddingLeft: 4,
- },
-};
-
-export default withStyles(styles)(WindowTopBar);
+export default WindowTopBar;
diff --git a/src/components/WindowTopMenuButton.js b/src/components/WindowTopMenuButton.js
index a70bbb66850040fab080ded3669b0a650381b521..bbef7d0002d0cb18a2ccbf42d7bbf5d7cf1b2fac 100644
--- a/src/components/WindowTopMenuButton.js
+++ b/src/components/WindowTopMenuButton.js
@@ -1,7 +1,6 @@
import React, { Component } from 'react';
import IconButton from '@material-ui/core/IconButton';
import MoreVertIcon from '@material-ui/icons/MoreVert';
-import { withStyles } from '@material-ui/core/styles';
import PropTypes from 'prop-types';
import WindowTopMenu from '../containers/WindowTopMenu';
@@ -78,13 +77,4 @@ WindowTopMenuButton.defaultProps = {
t: key => key,
};
-/**
- * @private
- */
-const styles = theme => ({
- ctrlBtn: {
- margin: theme.spacing.unit,
- },
-});
-
-export default withStyles(styles)(WindowTopMenuButton);
+export default WindowTopMenuButton;
diff --git a/src/components/WorkspaceAdd.js b/src/components/WorkspaceAdd.js
index cd02c07667f3db27d483f267d8697cd40eee6239..256581132f4c91851edfc443f4f5784d2e250370 100644
--- a/src/components/WorkspaceAdd.js
+++ b/src/components/WorkspaceAdd.js
@@ -9,7 +9,6 @@ import IconButton from '@material-ui/core/IconButton';
import Paper from '@material-ui/core/Paper';
import Toolbar from '@material-ui/core/Toolbar';
import Typography from '@material-ui/core/Typography';
-import { withStyles } from '@material-ui/core/styles';
import ns from '../config/css-ns';
import ManifestForm from '../containers/ManifestForm';
import ManifestListItem from '../containers/ManifestListItem';
@@ -106,27 +105,4 @@ WorkspaceAdd.defaultProps = {
t: key => key,
};
-/** */
-const styles = theme => ({
- form: {
- ...theme.mixins.gutters(),
- paddingTop: theme.spacing.unit * 2,
- paddingBottom: theme.spacing.unit * 2,
- marginTop: 64,
- },
- fab: {
- position: 'absolute',
- bottom: theme.spacing.unit * 2,
- right: theme.spacing.unit * 2,
- },
- typographyBody: {
- flexGrow: 1,
- fontSize: '1em',
- },
- menuButton: {
- marginLeft: -12,
- marginRight: 20,
- },
-});
-
-export default withStyles(styles)(WorkspaceAdd);
+export default WorkspaceAdd;
diff --git a/src/components/WorkspaceAddButton.js b/src/components/WorkspaceAddButton.js
index 00de5550d874c20b90ae0e215c1cc920827c4890..027326832c2aee1aa124a39918b54079c56a2c42 100644
--- a/src/components/WorkspaceAddButton.js
+++ b/src/components/WorkspaceAddButton.js
@@ -4,7 +4,6 @@ import ListItem from '@material-ui/core/ListItem';
import Fab from '@material-ui/core/Fab';
import AddIcon from '@material-ui/icons/Add';
import ClearIcon from '@material-ui/icons/Clear';
-import { withStyles } from '@material-ui/core/styles';
/**
*/
@@ -49,13 +48,4 @@ WorkspaceAddButton.defaultProps = {
isWorkspaceAddVisible: false,
};
-/**
- * @private
- */
-const styles = theme => ({
- ctrlBtn: {
- margin: theme.spacing.unit,
- },
-});
-
-export default withStyles(styles)(WorkspaceAddButton);
+export default WorkspaceAddButton;
diff --git a/src/components/WorkspaceControlPanel.js b/src/components/WorkspaceControlPanel.js
index be919a78c3f8945034650382c3c8fa4dd0f38fb6..59a89b7d8efac49bab5159240d9b87bff2274603 100644
--- a/src/components/WorkspaceControlPanel.js
+++ b/src/components/WorkspaceControlPanel.js
@@ -1,7 +1,6 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
-import { withStyles } from '@material-ui/core/styles';
import Drawer from '@material-ui/core/Drawer';
import WorkspaceControlPanelButtons
from '../containers/WorkspaceControlPanelButtons';
@@ -36,17 +35,4 @@ WorkspaceControlPanel.propTypes = {
classes: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types
};
-/**
- * @private
- */
-const styles = theme => ({
- ctrlBtn: {
- margin: theme.spacing.unit,
- },
- drawer: {
- overflowX: 'hidden',
- height: '100%',
- },
-});
-
-export default withStyles(styles)(WorkspaceControlPanel);
+export default WorkspaceControlPanel;
diff --git a/src/components/WorkspaceFullScreenButton.js b/src/components/WorkspaceFullScreenButton.js
index 96bac8ab1b0f6ea5fbd744b51227a213939677b6..66867963de9f2899b96dd113c83d71ad621f1214 100644
--- a/src/components/WorkspaceFullScreenButton.js
+++ b/src/components/WorkspaceFullScreenButton.js
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
import IconButton from '@material-ui/core/IconButton';
import FullscreenIcon from '@material-ui/icons/Fullscreen';
import ListItem from '@material-ui/core/ListItem';
-import { withStyles } from '@material-ui/core/styles';
import PropTypes from 'prop-types';
/**
@@ -34,13 +33,4 @@ WorkspaceFullScreenButton.defaultProps = {
t: key => key,
};
-/**
- * @private
- */
-const styles = theme => ({
- ctrlBtn: {
- margin: theme.spacing.unit,
- },
-});
-
-export default withStyles(styles)(WorkspaceFullScreenButton);
+export default WorkspaceFullScreenButton;
diff --git a/src/components/WorkspaceMenuButton.js b/src/components/WorkspaceMenuButton.js
index 913acac4a1efd36c79a16501db09bd744021be54..3daaa8970027975743f22f36a4c313f4000fcdce 100644
--- a/src/components/WorkspaceMenuButton.js
+++ b/src/components/WorkspaceMenuButton.js
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
import IconButton from '@material-ui/core/IconButton';
import MenuIcon from '@material-ui/icons/Menu';
import ListItem from '@material-ui/core/ListItem';
-import { withStyles } from '@material-ui/core/styles';
import PropTypes from 'prop-types';
import WorkspaceMenu from '../containers/WorkspaceMenu';
@@ -80,13 +79,4 @@ WorkspaceMenuButton.defaultProps = {
t: key => key,
};
-/**
- * @private
- */
-const styles = theme => ({
- ctrlBtn: {
- margin: theme.spacing.unit,
- },
-});
-
-export default withStyles(styles)(WorkspaceMenuButton);
+export default WorkspaceMenuButton;
diff --git a/src/components/ZoomControls.js b/src/components/ZoomControls.js
index 77903229042d79f1454bb191801da8ac29bd0fc6..1896c60ac37ab8932aaf357c777e7cecd906345e 100644
--- a/src/components/ZoomControls.js
+++ b/src/components/ZoomControls.js
@@ -1,5 +1,4 @@
import React, { Component } from 'react';
-import { withStyles } from '@material-ui/core/styles';
import IconButton from '@material-ui/core/IconButton';
import List from '@material-ui/core/List';
import ListItem from '@material-ui/core/ListItem';
@@ -117,18 +116,4 @@ ZoomControls.defaultProps = {
t: key => key,
};
-/**
- * @private
- */
-const styles = theme => ({
- zoom_controls: {
- position: 'absolute',
- right: 0,
- },
- ListItem: {
- paddingTop: 0,
- paddingBottom: 0,
- },
-});
-
-export default withStyles(styles)(ZoomControls);
+export default ZoomControls;
diff --git a/src/containers/App.js b/src/containers/App.js
index 8b7f02d2ea08a0f6844677dcdff4807ee073b257..87ebc50d90b2ab0009497f471251a179a086081b 100644
--- a/src/containers/App.js
+++ b/src/containers/App.js
@@ -1,5 +1,6 @@
import { compose } from 'redux';
import { connect } from 'react-redux';
+import { withStyles } from '@material-ui/core/styles';
import * as actions from '../state/actions';
import App from '../components/App';
@@ -27,9 +28,20 @@ const mapDispatchToProps = {
setWorkspaceFullscreen: actions.setWorkspaceFullscreen,
};
+/**
+ *
+ * @param theme
+ * @returns {{background: {background: string}}}
+ */
+const styles = theme => ({
+ background: {
+ background: theme.palette.background.default,
+ },
+});
+
const enhance = compose(
+ withStyles(styles),
connect(mapStateToProps, mapDispatchToProps),
- // further HOC go here
);
export default enhance(App);
diff --git a/src/containers/CompanionWindow.js b/src/containers/CompanionWindow.js
index 0572435bf5a9c4fd7bc012dcdf47cacbc4b96d60..6f67db4c4f75133b708b971a140e6599ccb8131a 100644
--- a/src/containers/CompanionWindow.js
+++ b/src/containers/CompanionWindow.js
@@ -1,6 +1,7 @@
import { compose } from 'redux';
import { connect } from 'react-redux';
import { withNamespaces } from 'react-i18next';
+import { withStyles } from '@material-ui/core';
import * as actions from '../state/actions';
import miradorWithPlugins from '../lib/miradorWithPlugins';
import CompanionWindow from '../components/CompanionWindow';
@@ -30,11 +31,30 @@ const mapDispatchToProps = {
onCloseClick: actions.closeCompanionWindow,
};
+/**
+ *
+ * @param theme
+ * @returns {{closeButton: {top: number, position: string, right: number},
+ * root: {overflowY: string, width: string}}}
+ */
+const styles = theme => ({
+ closeButton: {
+ position: 'absolute',
+ right: 0,
+ top: 0,
+ },
+ root: {
+ ...theme.mixins.gutters(),
+ width: '200px',
+ overflowY: 'scroll',
+ },
+});
+
const enhance = compose(
+ withNamespaces(),
+ withStyles(styles),
connect(mapStateToProps, mapDispatchToProps),
miradorWithPlugins,
- withNamespaces(),
- // further HOC
);
export default enhance(CompanionWindow);
diff --git a/src/containers/ManifestForm.js b/src/containers/ManifestForm.js
index baae7e3c29edc9fc0d9d1967acbee96c0d274228..f8c68e390119803e07007606ab2ca76617afa774 100644
--- a/src/containers/ManifestForm.js
+++ b/src/containers/ManifestForm.js
@@ -12,9 +12,8 @@ import ManifestForm from '../components/ManifestForm';
const mapDispatchToProps = { fetchManifest: actions.fetchManifest };
const enhance = compose(
- connect(null, mapDispatchToProps),
withNamespaces(),
- // further HOC go here
+ connect(null, mapDispatchToProps),
);
export default enhance(ManifestForm);
diff --git a/src/containers/ManifestListItem.js b/src/containers/ManifestListItem.js
index bd49edaf081db55f7e97be8c193f390ffde2b115..da4d5bfd9ce60b8b4b88b5f22eb43ba2c989d62d 100644
--- a/src/containers/ManifestListItem.js
+++ b/src/containers/ManifestListItem.js
@@ -1,6 +1,7 @@
import { compose } from 'redux';
import { connect } from 'react-redux';
import { withNamespaces } from 'react-i18next';
+import { withStyles } from '@material-ui/core';
import {
getManifestTitle, getManifestLogo, getManifestThumbnail, getManifestCanvases, getManifestProvider,
} from '../state/selectors';
@@ -30,10 +31,25 @@ const mapStateToProps = (state, { manifestId }) => {
*/
const mapDispatchToProps = { addWindow: actions.addWindow, fetchManifest: actions.fetchManifest };
+/**
+ *
+ * @param theme
+ * @returns {{root: {}, label: {textAlign: string, textTransform: string}}}
+ */
+const styles = theme => ({
+ root: {
+ ...theme.mixins.gutters(),
+ },
+ label: {
+ textTransform: 'initial',
+ textAlign: 'left',
+ },
+});
+
const enhance = compose(
- connect(mapStateToProps, mapDispatchToProps),
withNamespaces(),
- // further HOC go here
+ withStyles(styles),
+ connect(mapStateToProps, mapDispatchToProps),
);
export default enhance(ManifestListItem);
diff --git a/src/containers/ManifestListItemError.js b/src/containers/ManifestListItemError.js
index 237c17f9b5a3048ec1db3f1e3d8e6bdf264c6c01..5aa930fd4bf4f4029f32c54b9394509f0b055a08 100644
--- a/src/containers/ManifestListItemError.js
+++ b/src/containers/ManifestListItemError.js
@@ -1,6 +1,7 @@
import { compose } from 'redux';
import { connect } from 'react-redux';
import { withNamespaces } from 'react-i18next';
+import { withStyles } from '@material-ui/core/styles';
import { fetchManifest, removeManifest } from '../state/actions/manifest';
import ManifestListItemError from '../components/ManifestListItemError';
@@ -10,10 +11,27 @@ const mapDispatchToProps = {
onTryAgainClick: fetchManifest,
};
+/**
+ *
+ * @param theme
+ * @returns {{manifestIdText: {wordBreak: string},
+ * errorIcon: {color: string, width: string, height: string}}}
+ */
+const styles = theme => ({
+ errorIcon: {
+ color: theme.palette.error.main,
+ height: '2rem',
+ width: '2rem',
+ },
+ manifestIdText: {
+ wordBreak: 'break-all',
+ },
+});
+
const enhance = compose(
- connect(null, mapDispatchToProps),
withNamespaces(),
- // further HOC
+ withStyles(styles),
+ connect(null, mapDispatchToProps),
);
export default enhance(ManifestListItemError);
diff --git a/src/containers/WindowIcon.js b/src/containers/WindowIcon.js
index 49e61e703c4b8c3c820b674fc009748a4e0c60ce..ac57448d9bb87019cd99d603ec6616c4c3fdf00c 100644
--- a/src/containers/WindowIcon.js
+++ b/src/containers/WindowIcon.js
@@ -1,4 +1,6 @@
import { connect } from 'react-redux';
+import { withStyles } from '@material-ui/core';
+import { compose } from 'redux';
import { getWindowManifest, getManifestLogo } from '../state/selectors';
import WindowIcon from '../components/WindowIcon';
@@ -7,4 +9,16 @@ const mapStateToProps = (state, { windowId }) => ({
manifestLogo: getManifestLogo(getWindowManifest(state, windowId)),
});
-export default connect(mapStateToProps)(WindowIcon);
+const styles = {
+ logo: {
+ height: '2.5rem',
+ paddingRight: 8,
+ },
+};
+
+const enhance = compose(
+ withStyles(styles),
+ connect(mapStateToProps),
+);
+
+export default enhance(WindowIcon);
diff --git a/src/containers/WindowList.js b/src/containers/WindowList.js
index 86814d210609682ed68a4259d967afa028d1f23c..4679a79c708982754358d8daeaf038f7140682ce 100644
--- a/src/containers/WindowList.js
+++ b/src/containers/WindowList.js
@@ -26,9 +26,8 @@ const mapStateToProps = state => (
);
const enhance = compose(
- connect(mapStateToProps, mapDispatchToProps),
withNamespaces(),
- // further HOC
+ connect(mapStateToProps, mapDispatchToProps),
);
export default enhance(WindowList);
diff --git a/src/containers/WindowSideBar.js b/src/containers/WindowSideBar.js
index 0a7232205cf9b63c7f35e1baca9a067e1d12d210..ab74ea2930a70e876dc55facf68048dbe476844d 100644
--- a/src/containers/WindowSideBar.js
+++ b/src/containers/WindowSideBar.js
@@ -1,5 +1,6 @@
import { connect } from 'react-redux';
import { compose } from 'redux';
+import { withStyles } from '@material-ui/core';
import miradorWithPlugins from '../lib/miradorWithPlugins';
import WindowSideBar from '../components/WindowSideBar';
@@ -15,10 +16,30 @@ const mapStateToProps = (state, props) => (
}
);
+/**
+ *
+ * @param theme
+ * @returns {{toolbar: CSSProperties | toolbar | {minHeight}, grow: {flexGrow: number},
+ * drawer: {overflowX: string, left: number, flexShrink: number, width: number, height: string}}}
+ */
+const styles = theme => ({
+ toolbar: theme.mixins.toolbar,
+ drawer: {
+ overflowX: 'hidden',
+ left: 0,
+ width: 55,
+ flexShrink: 0,
+ height: '100%',
+ },
+ grow: {
+ flexGrow: 1,
+ },
+});
+
const enhance = compose(
+ withStyles(styles),
connect(mapStateToProps, null),
miradorWithPlugins,
- // further HOC
);
export default enhance(WindowSideBar);
diff --git a/src/containers/WindowSideBarButtons.js b/src/containers/WindowSideBarButtons.js
index b95a16ffd930441dff96d2d0844efaee542a0b9d..6347829f033ab9f48d69551455556e6f024d69db 100644
--- a/src/containers/WindowSideBarButtons.js
+++ b/src/containers/WindowSideBarButtons.js
@@ -29,10 +29,9 @@ const mapStateToProps = (state, { windowId }) => ({
const enhance = compose(
+ withNamespaces(),
connect(mapStateToProps, mapDispatchToProps),
miradorWithPlugins,
- withNamespaces(),
- // further HOC go here
);
export default enhance(WindowSideBarButtons);
diff --git a/src/containers/WindowSideBarCanvasPanel.js b/src/containers/WindowSideBarCanvasPanel.js
index 4eb5035292dbacc2b14076ffe19812d59ef6bee7..dddabb541f1503c61eb3f6ef8db484113458a730 100644
--- a/src/containers/WindowSideBarCanvasPanel.js
+++ b/src/containers/WindowSideBarCanvasPanel.js
@@ -1,6 +1,7 @@
import { compose } from 'redux';
import { connect } from 'react-redux';
import { withNamespaces } from 'react-i18next';
+import { withStyles } from '@material-ui/core/styles';
import * as actions from '../state/actions';
import WindowSideBarCanvasPanel from '../components/WindowSideBarCanvasPanel';
import {
@@ -23,9 +24,27 @@ const mapStateToProps = (state, { windowId }) => {
const mapDispatchToProps = { setCanvas: actions.setCanvas };
+/**
+ *
+ * @param theme
+ * @returns {{clickable: {cursor: string},
+ * label: {fontSize: string, paddingLeft: number}, windowSideBarH2: *}}
+ */
+const styles = theme => ({
+ windowSideBarH2: theme.typography.h5,
+ clickable: {
+ cursor: 'pointer',
+ },
+ label: {
+ fontSize: '8pt',
+ paddingLeft: 8,
+ },
+});
+
const enhance = compose(
- connect(mapStateToProps, mapDispatchToProps),
withNamespaces(),
+ withStyles(styles),
+ connect(mapStateToProps, mapDispatchToProps),
);
export default enhance(WindowSideBarCanvasPanel);
diff --git a/src/containers/WindowSideBarInfoPanel.js b/src/containers/WindowSideBarInfoPanel.js
index 8214fc347c5d30964928f72e36682a0de5c3fa47..13b272b5fd430a89a1989abc17d9a20050a72cd8 100644
--- a/src/containers/WindowSideBarInfoPanel.js
+++ b/src/containers/WindowSideBarInfoPanel.js
@@ -1,6 +1,7 @@
import { compose } from 'redux';
import { connect } from 'react-redux';
import { withNamespaces } from 'react-i18next';
+import { withStyles } from '@material-ui/core';
import miradorWithPlugins from '../lib/miradorWithPlugins';
import {
getDestructuredMetadata,
@@ -30,11 +31,21 @@ const mapStateToProps = (state, { windowId }) => ({
manifestMetadata: getDestructuredMetadata(getWindowManifest(state, windowId).manifestation),
});
+/**
+ *
+ * @param theme
+ * @returns {{windowSideBarH2: *, windowSideBarH3: *}}
+ */
+const styles = theme => ({
+ windowSideBarH2: theme.typography.h5,
+ windowSideBarH3: theme.typography.h6,
+});
+
const enhance = compose(
- connect(mapStateToProps, null),
withNamespaces(),
+ withStyles(styles),
+ connect(mapStateToProps, null),
miradorWithPlugins,
- // further HOC
);
export default enhance(WindowSideBarInfoPanel);
diff --git a/src/containers/WindowSideBarPanel.js b/src/containers/WindowSideBarPanel.js
index e3552332975ae1046c2805fe6b77857a69cbaa58..8773ac5ae23e1d71483b36420fde2f96625b1a88 100644
--- a/src/containers/WindowSideBarPanel.js
+++ b/src/containers/WindowSideBarPanel.js
@@ -16,8 +16,7 @@ const mapStateToProps = (state, { windowId }) => ({
});
export default compose(
+ withNamespaces(),
connect(mapStateToProps, mapDispatchToProps),
miradorWithPlugins,
- withNamespaces(),
- // further HOC
)(WindowSideBarPanel);
diff --git a/src/containers/WindowThumbnailSettings.js b/src/containers/WindowThumbnailSettings.js
index a0463090f5707e1289ab7e8a47e208fc505e19b3..2f721a632953bc682695c05edcf1d9efc5f0d2b4 100644
--- a/src/containers/WindowThumbnailSettings.js
+++ b/src/containers/WindowThumbnailSettings.js
@@ -25,8 +25,8 @@ const mapStateToProps = (state, props) => (
);
const enhance = compose(
- connect(mapStateToProps, mapDispatchToProps),
withNamespaces(),
+ connect(mapStateToProps, mapDispatchToProps),
miradorWithPlugins,
// further HOC go here
);
diff --git a/src/containers/WindowTopBar.js b/src/containers/WindowTopBar.js
index 191ebb59ca3256d1f782028fc4f3583a9c30f3fb..245fca7d17299f4e4197db15b43ee2fbaa608a0c 100644
--- a/src/containers/WindowTopBar.js
+++ b/src/containers/WindowTopBar.js
@@ -1,6 +1,7 @@
import { compose } from 'redux';
import { connect } from 'react-redux';
import { withNamespaces } from 'react-i18next';
+import { withStyles } from '@material-ui/core';
import * as actions from '../state/actions';
import miradorWithPlugins from '../lib/miradorWithPlugins';
import { getWindowManifest, getManifestTitle } from '../state/selectors';
@@ -21,11 +22,23 @@ const mapDispatchToProps = (dispatch, { windowId }) => ({
toggleWindowSideBar: () => dispatch(actions.toggleWindowSideBar(windowId)),
});
+
+const styles = {
+ typographyBody: {
+ flexGrow: 1,
+ fontSize: '1em',
+ },
+ reallyDense: {
+ minHeight: 32,
+ paddingLeft: 4,
+ },
+};
+
const enhance = compose(
+ withNamespaces(),
+ withStyles(styles),
connect(mapStateToProps, mapDispatchToProps),
miradorWithPlugins,
- withNamespaces(),
- // further HOC go here
);
export default enhance(WindowTopBar);
diff --git a/src/containers/WindowTopMenuButton.js b/src/containers/WindowTopMenuButton.js
index ebfedfeb3d1d114cd7eabc4ea478137e681fe8fc..c3ea20eca68161339f6342fd2ae198321dc07a65 100644
--- a/src/containers/WindowTopMenuButton.js
+++ b/src/containers/WindowTopMenuButton.js
@@ -1,12 +1,24 @@
import { compose } from 'redux';
import { withNamespaces } from 'react-i18next';
+import { withStyles } from '@material-ui/core';
import miradorWithPlugins from '../lib/miradorWithPlugins';
import WindowTopMenuButton from '../components/WindowTopMenuButton';
+/**
+ *
+ * @param theme
+ * @returns {{ctrlBtn: {margin: (number|string)}}}
+ */
+const styles = theme => ({
+ ctrlBtn: {
+ margin: theme.spacing.unit,
+ },
+});
+
const enhance = compose(
withNamespaces(),
+ withStyles(styles),
miradorWithPlugins,
- // further HOC
);
export default enhance(WindowTopMenuButton);
diff --git a/src/containers/WindowViewSettings.js b/src/containers/WindowViewSettings.js
index 0b83fe4f2257cb278fda4d1b72cb30f0ffc3cfc6..b7e709397d94ba4157f0620864388805546342e3 100644
--- a/src/containers/WindowViewSettings.js
+++ b/src/containers/WindowViewSettings.js
@@ -25,10 +25,9 @@ const mapStateToProps = (state, props) => (
);
const enhance = compose(
- connect(mapStateToProps, mapDispatchToProps),
withNamespaces(),
+ connect(mapStateToProps, mapDispatchToProps),
miradorWithPlugins,
- // further HOC go here
);
export default enhance(WindowViewSettings);
diff --git a/src/containers/WorkspaceAdd.js b/src/containers/WorkspaceAdd.js
index 62fee859fbba2f4271792b4c06b17bd3ad74ee61..92a277f6f18db9374845908d504e94733a50ad4b 100644
--- a/src/containers/WorkspaceAdd.js
+++ b/src/containers/WorkspaceAdd.js
@@ -1,6 +1,7 @@
import { compose } from 'redux';
import { connect } from 'react-redux';
import { withNamespaces } from 'react-i18next';
+import { withStyles } from '@material-ui/core';
import * as actions from '../state/actions';
import WorkspaceAdd from '../components/WorkspaceAdd';
@@ -18,10 +19,40 @@ const mapStateToProps = state => ({ manifests: state.manifests });
*/
const mapDispatchToProps = { setWorkspaceAddVisibility: actions.setWorkspaceAddVisibility };
+/**
+ *
+ * @param theme
+ * @returns {{typographyBody: {flexGrow: number, fontSize: string},
+ * form: {paddingBottom: number, paddingTop: number, marginTop: number},
+ * fab: {bottom: number, position: string, right: number},
+ * menuButton: {marginRight: number, marginLeft: number}}}
+ */
+const styles = theme => ({
+ form: {
+ ...theme.mixins.gutters(),
+ paddingTop: theme.spacing.unit * 2,
+ paddingBottom: theme.spacing.unit * 2,
+ marginTop: 64,
+ },
+ fab: {
+ position: 'absolute',
+ bottom: theme.spacing.unit * 2,
+ right: theme.spacing.unit * 2,
+ },
+ typographyBody: {
+ flexGrow: 1,
+ fontSize: '1em',
+ },
+ menuButton: {
+ marginLeft: -12,
+ marginRight: 20,
+ },
+});
+
const enhance = compose(
- connect(mapStateToProps, mapDispatchToProps),
withNamespaces(),
- // further HOC go here
+ withStyles(styles),
+ connect(mapStateToProps, mapDispatchToProps),
);
export default enhance(WorkspaceAdd);
diff --git a/src/containers/WorkspaceAddButton.js b/src/containers/WorkspaceAddButton.js
index b13dbd15f8e7c3ce320317bdb59a3274919316ba..a52d04d31b4cbfdfae3259593936884f2ec13afc 100644
--- a/src/containers/WorkspaceAddButton.js
+++ b/src/containers/WorkspaceAddButton.js
@@ -1,6 +1,7 @@
import { connect } from 'react-redux';
import { compose } from 'redux';
import { withNamespaces } from 'react-i18next';
+import { withStyles } from '@material-ui/core';
import * as actions from '../state/actions';
import miradorWithPlugins from '../lib/miradorWithPlugins';
import WorkspaceAddButton from '../components/WorkspaceAddButton';
@@ -24,9 +25,21 @@ const mapStateToProps = state => (
*/
const mapDispatchToProps = { setWorkspaceAddVisibility: actions.setWorkspaceAddVisibility };
+/**
+ *
+ * @param theme
+ * @returns {{ctrlBtn: {margin: (number|string)}}}
+ */
+const styles = theme => ({
+ ctrlBtn: {
+ margin: theme.spacing.unit,
+ },
+});
+
const enhance = compose(
- connect(mapStateToProps, mapDispatchToProps),
withNamespaces(),
+ withStyles(styles),
+ connect(mapStateToProps, mapDispatchToProps),
miradorWithPlugins,
);
diff --git a/src/containers/WorkspaceControlPanel.js b/src/containers/WorkspaceControlPanel.js
new file mode 100644
index 0000000000000000000000000000000000000000..d25f6a3e67cfea2bbd5f6a4fe4e2dee99e3e56c3
--- /dev/null
+++ b/src/containers/WorkspaceControlPanel.js
@@ -0,0 +1,20 @@
+import { withStyles } from '@material-ui/core/styles';
+import WorkspaceControlPanel from '../components/WorkspaceControlPanel';
+
+/**
+ *
+ * @param theme
+ * @returns {{ctrlBtn: {margin: (number|string)},
+ * drawer: {overflowX: string, height: string}}}
+ */
+const styles = theme => ({
+ ctrlBtn: {
+ margin: theme.spacing.unit,
+ },
+ drawer: {
+ overflowX: 'hidden',
+ height: '100%',
+ },
+});
+
+export default withStyles(styles)(WorkspaceControlPanel);
diff --git a/src/containers/WorkspaceExport.js b/src/containers/WorkspaceExport.js
index 82dded070825354cb5fffba8ae5d5d3513218597..5157cafc05a07a2cf0700a6b234e86bd65532d60 100644
--- a/src/containers/WorkspaceExport.js
+++ b/src/containers/WorkspaceExport.js
@@ -12,10 +12,9 @@ import WorkspaceExport from '../components/WorkspaceExport';
const mapStateToProps = state => ({ state });
const enhance = compose(
+ withNamespaces(),
connect(mapStateToProps, {}),
miradorWithPlugins,
- withNamespaces(),
- // further HOC go here
);
export default enhance(WorkspaceExport);
diff --git a/src/containers/WorkspaceFullScreenButton.js b/src/containers/WorkspaceFullScreenButton.js
index 64f9bd73242ac485818d9b53a94ec1ea9196a16e..a274b21e2927cde348b43269b8d97c029f8acdd7 100644
--- a/src/containers/WorkspaceFullScreenButton.js
+++ b/src/containers/WorkspaceFullScreenButton.js
@@ -1,6 +1,7 @@
import { connect } from 'react-redux';
import { compose } from 'redux';
import { withNamespaces } from 'react-i18next';
+import { withStyles } from '@material-ui/core';
import miradorWithPlugins from '../lib/miradorWithPlugins';
import * as actions from '../state/actions';
import WorkspaceFullScreenButton
@@ -13,11 +14,22 @@ import WorkspaceFullScreenButton
*/
const mapDispatchToProps = { setWorkspaceFullscreen: actions.setWorkspaceFullscreen };
+/**
+ *
+ * @param theme
+ * @returns {{ctrlBtn: {margin: (number|string)}}}
+ */
+const styles = theme => ({
+ ctrlBtn: {
+ margin: theme.spacing.unit,
+ },
+});
+
const enhance = compose(
- connect(null, mapDispatchToProps),
withNamespaces(),
+ withStyles(styles),
+ connect(null, mapDispatchToProps),
miradorWithPlugins,
- // further HOC
);
export default enhance(WorkspaceFullScreenButton);
diff --git a/src/containers/WorkspaceMenu.js b/src/containers/WorkspaceMenu.js
index aa1bdd2e34d4b48d2c46818ff79d0551fafc1a73..38e36d2bbad72e428818dc301c1b468688a70032 100644
--- a/src/containers/WorkspaceMenu.js
+++ b/src/containers/WorkspaceMenu.js
@@ -22,10 +22,9 @@ const mapStateToProps = state => (
);
const enhance = compose(
- connect(mapStateToProps, mapDispatchToProps),
withNamespaces(),
+ connect(mapStateToProps, mapDispatchToProps),
miradorWithPlugins,
- // further HOC
);
export default enhance(WorkspaceMenu);
diff --git a/src/containers/WorkspaceMenuButton.js b/src/containers/WorkspaceMenuButton.js
index 0ccd4218f13526ebaac8a74b08b4b81abe17eb1a..1273953f2f67a1b6726e0de7d720f70a85556491 100644
--- a/src/containers/WorkspaceMenuButton.js
+++ b/src/containers/WorkspaceMenuButton.js
@@ -1,10 +1,23 @@
import { compose } from 'redux';
import { withNamespaces } from 'react-i18next';
+import { withStyles } from '@material-ui/core';
import miradorWithPlugins from '../lib/miradorWithPlugins';
import WorkspaceMenuButton from '../components/WorkspaceMenuButton';
+/**
+ *
+ * @param theme
+ * @returns {{ctrlBtn: {margin: (number|string)}}}
+ */
+const styles = theme => ({
+ ctrlBtn: {
+ margin: theme.spacing.unit,
+ },
+});
+
const enhance = compose(
withNamespaces(),
+ withStyles(styles),
miradorWithPlugins,
// further HOC
);
diff --git a/src/containers/WorkspaceSettings.js b/src/containers/WorkspaceSettings.js
index 50b6971352e0d0d3ec10e975d20410732cc7fc47..1250a96fac882a542ef4cfed64fde322f12b5921 100644
--- a/src/containers/WorkspaceSettings.js
+++ b/src/containers/WorkspaceSettings.js
@@ -25,9 +25,8 @@ const mapStateToProps = state => (
);
const enhance = compose(
- connect(mapStateToProps, mapDispatchToProps),
withNamespaces(),
- // further HOC go here
+ connect(mapStateToProps, mapDispatchToProps),
);
export default enhance(WorkspaceSettings);
diff --git a/src/containers/ZoomControls.js b/src/containers/ZoomControls.js
index a7acfd9825c913e4bb08ea8e8230f3c16e6927db..a3640e2ff25b860124415d96fe3331668f1b88b6 100644
--- a/src/containers/ZoomControls.js
+++ b/src/containers/ZoomControls.js
@@ -1,6 +1,7 @@
import { compose } from 'redux';
import { connect } from 'react-redux';
import { withNamespaces } from 'react-i18next';
+import { withStyles } from '@material-ui/core';
import * as actions from '../state/actions';
import ZoomControls from '../components/ZoomControls';
@@ -16,7 +17,6 @@ const mapStateToProps = (state, props) => (
}
);
-
/**
* mapDispatchToProps - used to hook up connect to action creators
* @memberof Workspace
@@ -24,10 +24,27 @@ const mapStateToProps = (state, props) => (
*/
const mapDispatchToProps = { updateViewport: actions.updateViewport };
+/**
+ *
+ * @param theme
+ * @returns {{zoom_controls: {position: string, right: number},
+ * ListItem: {paddingBottom: number, paddingTop: number}}}
+ */
+const styles = theme => ({
+ zoom_controls: {
+ position: 'absolute',
+ right: 0,
+ },
+ ListItem: {
+ paddingTop: 0,
+ paddingBottom: 0,
+ },
+});
+
const enhance = compose(
- connect(mapStateToProps, mapDispatchToProps),
withNamespaces(),
- // further HOC go here
+ withStyles(styles),
+ connect(mapStateToProps, mapDispatchToProps),
);
export default enhance(ZoomControls);