diff --git a/__tests__/integration/mirador/plugins/add.html b/__tests__/integration/mirador/plugins/add.html index cb5bda4e7ac5b041b8c7ad6767ee8141198422e8..d50ca8046d8881c31f8962580a8613104e4b3781 100644 --- a/__tests__/integration/mirador/plugins/add.html +++ b/__tests__/integration/mirador/plugins/add.html @@ -49,6 +49,12 @@ ) } + const AddPluginComponentE = (props) => ( + <div id="add-plugin-component-e"> + <input value="hello world"/> + </div> + ); + const addPluginA = { target: 'WorkspaceControlPanelButtons', mode: 'add', @@ -73,7 +79,13 @@ component: WrapPluginComponent, }; - const miradorInstance = Mirador.viewer(config, [addPluginA, addPluginB, addPluginC, wrapPluginD]); + const addPluginE = { + target: 'WindowTopBarPluginArea', + mode: 'add', + component: AddPluginComponentE, + }; + + const miradorInstance = Mirador.viewer(config, [addPluginA, addPluginB, addPluginC, wrapPluginD, addPluginE]); </script> </body> diff --git a/__tests__/src/components/WindowTopBar.test.js b/__tests__/src/components/WindowTopBar.test.js index 425f1a012ed72689eff687145baf312b21226ec4..92c832beb115b1e2d9d0ee7c22157b2ee555cfa6 100644 --- a/__tests__/src/components/WindowTopBar.test.js +++ b/__tests__/src/components/WindowTopBar.test.js @@ -5,6 +5,7 @@ import Toolbar from '@material-ui/core/Toolbar'; import AppBar from '@material-ui/core/AppBar'; import WindowTopMenuButton from '../../../src/containers/WindowTopMenuButton'; +import WindowTopBarPluginArea from '../../../src/containers/WindowTopBarPluginArea'; import WindowTopBarPluginMenu from '../../../src/containers/WindowTopBarPluginMenu'; import WindowTopBarTitle from '../../../src/containers/WindowTopBarTitle'; import MiradorMenuButton from '../../../src/containers/MiradorMenuButton'; @@ -35,6 +36,7 @@ describe('WindowTopBar', () => { expect(wrapper.find(Toolbar).length).toBe(1); expect(wrapper.find(MiradorMenuButton).length).toBe(3); expect(wrapper.find(WindowTopBarTitle).length).toBe(1); + expect(wrapper.find(WindowTopBarPluginArea).length).toBe(1); expect(wrapper.find(WindowTopBarPluginMenu).length).toBe(1); expect(wrapper.find(WindowTopMenuButton).length).toBe(1); expect(wrapper.find(FullScreenButton).length).toBe(0); diff --git a/__tests__/src/components/WindowTopBarPluginArea.test.js b/__tests__/src/components/WindowTopBarPluginArea.test.js new file mode 100644 index 0000000000000000000000000000000000000000..31e9e2d33f9ef9721752db628df21d57e53d419d --- /dev/null +++ b/__tests__/src/components/WindowTopBarPluginArea.test.js @@ -0,0 +1,9 @@ +import React from 'react'; +import { shallow } from 'enzyme'; +import { WindowTopBarPluginArea } from '../../../src/components/WindowTopBarPluginArea'; +import { PluginHook } from '../../../src/components/PluginHook'; + +it('renders the component', () => { + const wrapper = shallow(<WindowTopBarPluginArea />); + expect(wrapper.find(PluginHook).length).toBe(1); +}); diff --git a/src/components/WindowTopBar.js b/src/components/WindowTopBar.js index 45aeaf3ffb8ada9b0de147c235b89e845c4aade3..940017674495c9d4fd74ccb94214e0eccb8f4381 100644 --- a/src/components/WindowTopBar.js +++ b/src/components/WindowTopBar.js @@ -6,6 +6,7 @@ import Toolbar from '@material-ui/core/Toolbar'; import AppBar from '@material-ui/core/AppBar'; import classNames from 'classnames'; import WindowTopMenuButton from '../containers/WindowTopMenuButton'; +import WindowTopBarPluginArea from '../containers/WindowTopBarPluginArea'; import WindowTopBarPluginMenu from '../containers/WindowTopBarPluginMenu'; import WindowTopBarTitle from '../containers/WindowTopBarTitle'; import MiradorMenuButton from '../containers/MiradorMenuButton'; @@ -58,6 +59,7 @@ export class WindowTopBar extends Component { {allowTopMenuButton && ( <WindowTopMenuButton className={ns('window-menu-btn')} windowId={windowId} /> )} + <WindowTopBarPluginArea windowId={windowId} /> <WindowTopBarPluginMenu windowId={windowId} /> {allowMaximize && ( <MiradorMenuButton diff --git a/src/components/WindowTopBarPluginArea.js b/src/components/WindowTopBarPluginArea.js new file mode 100644 index 0000000000000000000000000000000000000000..ce5ec626f4317974bf6fd0dbf143fe6c41c219f0 --- /dev/null +++ b/src/components/WindowTopBarPluginArea.js @@ -0,0 +1,16 @@ +import React, { Component } from 'react'; +import { PluginHook } from './PluginHook'; + +/** + * + */ +export class WindowTopBarPluginArea extends Component { + /** */ + render() { + return ( + <> + <PluginHook {...this.props} /> + </> + ); + } +} diff --git a/src/containers/WindowTopBarPluginArea.js b/src/containers/WindowTopBarPluginArea.js new file mode 100644 index 0000000000000000000000000000000000000000..4bcdc88f5ae95da56b721b52d856012ded348c0a --- /dev/null +++ b/src/containers/WindowTopBarPluginArea.js @@ -0,0 +1,19 @@ +import { compose } from 'redux'; +import { connect } from 'react-redux'; +import { withTranslation } from 'react-i18next'; +import { withStyles } from '@material-ui/core'; +import { withPlugins } from '../extend/withPlugins'; +import { WindowTopBarPluginArea } from '../components/WindowTopBarPluginArea'; + +/** + */ +const styles = {}; + +const enhance = compose( + withTranslation(), + withStyles(styles), + connect(null, null), + withPlugins('WindowTopBarPluginArea'), +); + +export default enhance(WindowTopBarPluginArea);