PropTypes and refactoring

src/components/InfoDetails/InfoDetails.js

@@ -1,28 +1,13 @@
 import React from 'react';
-import { dismissInfo, notifyError } from '../../redux/actions/error_actions';
-import { connect } from 'react-redux';
+import './InfoDetails.css';
 import Box from '../UI/Box/Box';
 import Button from '../UI/Button/Button';
-import './InfoDetails.css';
+import PropTypes from 'prop-types';
+import { connect } from 'react-redux';
+import { dismissInfo, notifyError } from '../../redux/actions/error_actions';
 import { promptLocationAndSaveFile } from '../../utils';
 
-const mapStateToProps = (state) => {
-  return {
-    InfoMessage: state.error.InfoStack.length > 0 ? state.error.InfoStack[0] : '',
-  };
-};
-
-const mapDispatchToProps = (dispatch) => {
-  return {
-    notifyError: (msg) => dispatch(notifyError(msg)),
-    dismissInfo: () => dispatch(dismissInfo()),
-  };
-};
-
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
-)((props) => {
+const InfoDetails = (props) => {
   let msg = props.InfoMessage.message;
   const classes = ['InfoDetailsContent'];
 
@@ -90,4 +75,25 @@ export default connect(
       )}
     </Box>
   );
-});
+};
+
+const mapStateToProps = (state) => {
+  return {
+    InfoMessage: state.error.InfoStack.length > 0 ? state.error.InfoStack[0] : '',
+  };
+};
+
+const mapDispatchToProps = (dispatch) => {
+  return {
+    notifyError: (msg) => dispatch(notifyError(msg)),
+    dismissInfo: () => dispatch(dismissInfo()),
+  };
+};
+
+InfoDetails.propTypes = {
+  InfoMessage: PropTypes.object.isRequired,
+  dismissInfo: PropTypes.func.isRequired,
+  notifyError: PropTypes.func.isRequired,
+};
+
+export default connect(mapStateToProps, mapDispatchToProps)(InfoDetails);