diff --git a/js/components/contextMenu.js b/js/components/contextMenu.js
index 040b0d1d39..295c6b5009 100644
--- a/js/components/contextMenu.js
+++ b/js/components/contextMenu.js
@@ -21,9 +21,16 @@ class ContextMenuItem extends ImmutableComponent {
get submenu () {
return this.props.contextMenuItem.get('submenu')
}
+ get items () {
+ return this.props.contextMenuItem.get('items')
+ }
get hasSubmenu () {
return this.submenu && this.submenu.size > 0
}
+ get isMulti () {
+ return this.items && this.items.size > 0
+ }
+
get accelerator () {
const accelerator = this.props.contextMenuItem.get('accelerator')
return accelerator && typeof accelerator === 'string'
@@ -138,17 +145,6 @@ class ContextMenuItem extends ImmutableComponent {
return
- } else if (this.props.contextMenuItem.get('type') === 'multi') {
- return
-
- {
- this.props.contextMenuItem.get('submenu').map((subItem) =>
-
- {this.getLabelForItem(subItem)}
-
)
- }
-
}
const props = {
className: cx({
@@ -156,7 +152,8 @@ class ContextMenuItem extends ImmutableComponent {
hasFaIcon: faIcon,
checkedMenuItem: this.props.contextMenuItem.get('checked'),
hasIcon: icon || faIcon,
- selectedByKeyboard: this.props.selected
+ selectedByKeyboard: this.props.selected,
+ multiContextMenuItem: this.isMulti
}),
role: 'listitem'
}
@@ -194,6 +191,13 @@ class ContextMenuItem extends ImmutableComponent {
}
{this.props.contextMenuItem.get('label')}
+ {
+ this.isMulti && this.props.contextMenuItem.get('items').map((subItem) =>
+
+ {this.getLabelForItem(subItem)}
+
)
+ }
{
this.hasSubmenu
?
diff --git a/js/contextMenus.js b/js/contextMenus.js
index da5871a5ec..9251041555 100644
--- a/js/contextMenus.js
+++ b/js/contextMenus.js
@@ -755,8 +755,7 @@ function hamburgerTemplateInit (location, e) {
CommonMenu.separatorMenuItem,
{
l10nLabelId: 'zoom',
- type: 'multi',
- submenu: [{
+ items: [{
label: '-',
click: () => {
ipc.emit(messages.SHORTCUT_ACTIVE_FRAME_ZOOM_OUT)
diff --git a/less/contextMenu.less b/less/contextMenu.less
index 36946770f4..62da081907 100644
--- a/less/contextMenu.less
+++ b/less/contextMenu.less
@@ -107,7 +107,7 @@
text-align: center;
}
- .multiItemTitle {
+ .contextMenuItemText {
margin-top: auto;
margin-bottom: auto;
padding-right: 10px;