diff --git a/src/components/menu-bar/menu-bar.jsx b/src/components/menu-bar/menu-bar.jsx
index 7122aff64..507f35c58 100644
--- a/src/components/menu-bar/menu-bar.jsx
+++ b/src/components/menu-bar/menu-bar.jsx
@@ -14,7 +14,14 @@ import {MenuItem, MenuSection} from '../menu/menu.jsx';
import SaveButton from '../../containers/save-button.jsx';
import {openFeedbackForm} from '../../reducers/modals';
-import {openFileMenu, closeFileMenu, MENU_FILE} from '../../reducers/menus';
+import {
+ openFileMenu,
+ closeFileMenu,
+ fileMenuOpen,
+ openEditMenu,
+ closeEditMenu,
+ editMenuOpen
+} from '../../reducers/menus';
import styles from './menu-bar.css';
@@ -151,10 +158,29 @@ const MenuBar = props => (
-
-
+
+
Edit
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -249,26 +275,26 @@ const MenuBar = props => (
);
MenuBar.propTypes = {
+ editMenuOpen: PropTypes.bool,
fileMenuOpen: PropTypes.bool,
+ onClickEdit: PropTypes.func,
onClickFile: PropTypes.func,
onGiveFeedback: PropTypes.func.isRequired,
+ onRequestCloseEdit: PropTypes.func,
onRequestCloseFile: PropTypes.func
};
const mapStateToProps = state => ({
- fileMenuOpen: state.menus[MENU_FILE]
+ fileMenuOpen: fileMenuOpen(state),
+ editMenuOpen: editMenuOpen(state)
});
const mapDispatchToProps = dispatch => ({
- onGiveFeedback: () => {
- dispatch(openFeedbackForm());
- },
- onClickFile: () => {
- dispatch(openFileMenu());
- },
- onRequestCloseFile: () => {
- dispatch(closeFileMenu());
- }
+ onGiveFeedback: () => dispatch(openFeedbackForm()),
+ onClickFile: () => dispatch(openFileMenu()),
+ onRequestCloseFile: () => dispatch(closeFileMenu()),
+ onClickEdit: () => dispatch(openEditMenu()),
+ onRequestCloseEdit: () => dispatch(closeEditMenu())
});
export default connect(
diff --git a/src/components/menu/menu.css b/src/components/menu/menu.css
index 98e1d8d5e..0219815ee 100644
--- a/src/components/menu/menu.css
+++ b/src/components/menu/menu.css
@@ -7,6 +7,7 @@
background-color: $motion-primary;
padding: 0;
margin: 0;
+ min-width: 186px;
max-width: 260px;
overflow: visible;
color: $ui-white;
diff --git a/src/components/menu/menu.jsx b/src/components/menu/menu.jsx
index 5268efb88..543b998c8 100644
--- a/src/components/menu/menu.jsx
+++ b/src/components/menu/menu.jsx
@@ -70,7 +70,7 @@ const addDividerClassToFirstChild = (child, id) => (
const MenuSection = ({children}) => (
{
- children.map(addDividerClassToFirstChild)
+ React.Children.map(children, addDividerClassToFirstChild)
}
);
diff --git a/src/reducers/menus.js b/src/reducers/menus.js
index d506d9064..aac3fb852 100644
--- a/src/reducers/menus.js
+++ b/src/reducers/menus.js
@@ -2,10 +2,12 @@ const OPEN_MENU = 'scratch-gui/menus/OPEN_MENU';
const CLOSE_MENU = 'scratch-gui/menus/CLOSE_MENU';
const MENU_FILE = 'fileMenu';
+const MENU_EDIT = 'editMenu';
const initialState = {
- [MENU_FILE]: false
+ [MENU_FILE]: false,
+ [MENU_EDIT]: false
};
const reducer = function (state, action) {
@@ -23,28 +25,27 @@ const reducer = function (state, action) {
return state;
}
};
-const openMenu = function (menu) {
- return {
- type: OPEN_MENU,
- menu: menu
- };
-};
-const closeMenu = function (menu) {
- return {
- type: CLOSE_MENU,
- menu: menu
- };
-};
-const openFileMenu = function () {
- return openMenu(MENU_FILE);
-};
-const closeFileMenu = function () {
- return closeMenu(MENU_FILE);
-};
+const openMenu = menu => ({
+ type: OPEN_MENU,
+ menu: menu
+});
+const closeMenu = menu => ({
+ type: CLOSE_MENU,
+ menu: menu
+});
+const openFileMenu = () => openMenu(MENU_FILE);
+const closeFileMenu = () => closeMenu(MENU_FILE);
+const fileMenuOpen = state => state.menus[MENU_FILE];
+const openEditMenu = () => openMenu(MENU_EDIT);
+const closeEditMenu = () => closeMenu(MENU_EDIT);
+const editMenuOpen = state => state.menus[MENU_EDIT];
export {
reducer as default,
openFileMenu,
closeFileMenu,
- MENU_FILE
+ openEditMenu,
+ closeEditMenu,
+ fileMenuOpen,
+ editMenuOpen
};