diff --git a/package.json b/package.json index ca67eded..661710f9 100644 --- a/package.json +++ b/package.json @@ -18,6 +18,7 @@ "chart.js": "^2.7.2", "moment": "^2.22.2", "promise": "8.0.1", + "prop-types": "^15.6.2", "qs": "^6.5.2", "ramda": "^0.25.0", "react": "^16.3.2", diff --git a/src/common/AsideMenu.js b/src/common/AsideMenu.js index e9fa832f..db2e783e 100644 --- a/src/common/AsideMenu.js +++ b/src/common/AsideMenu.js @@ -1,12 +1,13 @@ -import listIcon from '@fortawesome/fontawesome-free-solid/faBars' -import createIcon from '@fortawesome/fontawesome-free-solid/faPlus' -import FontAwesomeIcon from '@fortawesome/react-fontawesome' -import React from 'react' -import { NavLink } from 'react-router-dom' -import DeleteServerButton from '../servers/DeleteServerButton' -import './AsideMenu.scss' +import listIcon from '@fortawesome/fontawesome-free-solid/faBars'; +import createIcon from '@fortawesome/fontawesome-free-solid/faPlus'; +import FontAwesomeIcon from '@fortawesome/react-fontawesome'; +import React from 'react'; +import { NavLink } from 'react-router-dom'; +import DeleteServerButton from '../servers/DeleteServerButton'; +import './AsideMenu.scss'; +import PropTypes from 'prop-types'; -export default function AsideMenu({ selectedServer, history }) { +export default function AsideMenu({ selectedServer }) { const serverId = selectedServer ? selectedServer.id : ''; return ( @@ -31,10 +32,18 @@ export default function AsideMenu({ selectedServer, history }) { ); } + +AsideMenu.propTypes = { + selectedServer: PropTypes.shape({ + id: PropTypes.string, + name: PropTypes.string, + url: PropTypes.string, + apiKey: PropTypes.string, + }), +}; diff --git a/src/common/MenuLayout.js b/src/common/MenuLayout.js index 7105746a..4b3a983f 100644 --- a/src/common/MenuLayout.js +++ b/src/common/MenuLayout.js @@ -16,9 +16,11 @@ export class MenuLayout extends React.Component { } render() { + const { selectedServer } = this.props; + return (
- +
this.setState({ isModalOpen: !this.state.isModalOpen })} - history={history} server={server} key="deleteServerModal" /> diff --git a/src/servers/DeleteServerModal.js b/src/servers/DeleteServerModal.js index b0f62fad..95a0b554 100644 --- a/src/servers/DeleteServerModal.js +++ b/src/servers/DeleteServerModal.js @@ -1,9 +1,12 @@ +import PropTypes from 'prop-types'; import React from 'react'; import { connect } from 'react-redux'; +import { withRouter } from 'react-router-dom'; import { Modal, ModalBody, ModalFooter, ModalHeader } from 'reactstrap'; +import { compose } from 'redux'; import { deleteServer } from './reducers/server'; -export const DeleteServerModal = ({ server, deleteServer, toggle, history, isOpen }) => { +export const DeleteServerModal = ({ server, toggle, isOpen, deleteServer, history }) => { const closeModal = () => { deleteServer(server); toggle(); @@ -15,7 +18,10 @@ export const DeleteServerModal = ({ server, deleteServer, toggle, history, isOpe Delete server

Are you sure you want to delete server {server ? server.name : ''}?

-

No data will be deleted, only the access to that server will be removed from this host. You can create it again at any moment.

+

+ No data will be deleted, only the access to that server will be removed from this host. + You can create it again at any moment. +

@@ -25,4 +31,18 @@ export const DeleteServerModal = ({ server, deleteServer, toggle, history, isOpe ); }; -export default connect(null, { deleteServer })(DeleteServerModal); +DeleteServerModal.propTypes = { + toggle: PropTypes.func.isRequired, + isOpen: PropTypes.bool.isRequired, + server: PropTypes.shape({ + id: PropTypes.string, + name: PropTypes.string, + url: PropTypes.string, + apiKey: PropTypes.string, + }), +}; + +export default compose( + withRouter, + connect(null, { deleteServer }) +)(DeleteServerModal); diff --git a/test/home/Home.test.js b/test/common/Home.test.js similarity index 88% rename from test/home/Home.test.js rename to test/common/Home.test.js index 52af9f97..1495604f 100644 --- a/test/home/Home.test.js +++ b/test/common/Home.test.js @@ -1,8 +1,8 @@ -import { shallow } from 'enzyme' -import { values } from 'ramda' -import React from 'react' -import * as sinon from 'sinon' -import { Home } from '../../src/common/Home' +import { shallow } from 'enzyme'; +import { values } from 'ramda'; +import React from 'react'; +import * as sinon from 'sinon'; +import { Home } from '../../src/common/Home'; describe('', () => { let wrapped;