feat: show other new tab options on long click on new tab button, closes #4398

js/components/tabs.js

@@ -11,8 +11,9 @@ const windowActions = require('../actions/windowActions')
 const windowStore = require('../stores/windowStore')
 const dragTypes = require('../constants/dragTypes')
 const cx = require('../lib/classSet')
+const contextMenus = require('../contextMenus')
 
-const Button = require('./button')
+const LongPressButton = require('./longPressButton')
 const Tab = require('./tab')
 const dnd = require('../dnd')
 const dndData = require('../dndData')
@@ -87,6 +88,10 @@ class Tabs extends ImmutableComponent {
     windowActions.newFrame()
   }
 
+  onNewTabLongPress (rect) {
+    contextMenus.onNewTabContextMenu(rect)
+  }
+
   render () {
     this.tabRefs = []
     const index = this.props.previewTabPageIndex !== undefined
@@ -125,10 +130,15 @@ class Tabs extends ImmutableComponent {
               onClick={this.onNextPage} />
           }
         })()}
-        <Button label='+'
+
+        <LongPressButton
+          label='+'
           l10nId='newTabButton'
-          className='navbutton newFrameButton'
-          onClick={this.newTab} />
+          className='browserButton navbutton newFrameButton'
+          disabled={false}
+          onClick={this.newTab}
+          onLongPress={this.onNewTabLongPress}
+        />
       </span>
     </div>
   }

js/contextMenus.js

@@ -555,6 +555,15 @@ function getMisspelledSuggestions (selection, isMisspelled, suggestions) {
   return items
 }
 
+function newTabMenuTemplateInit (location, e) {
+  const template = [
+    CommonMenu.newPrivateTabMenuItem(),
+    CommonMenu.newPartitionedTabMenuItem(),
+    CommonMenu.newWindowMenuItem()
+  ]
+  return template
+}
+
 function getEditableItems (selection, editFlags) {
   const hasSelection = selection.length > 0
   const hasClipboard = clipboard.readText().length > 0
@@ -1042,6 +1051,16 @@ function onTabContextMenu (frameProps, e) {
   tabMenu.destroy()
 }
 
+function onNewTabContextMenu (rect) {
+  const menuTemplate = newTabMenuTemplateInit(rect)
+
+  windowActions.setContextMenuDetail(Immutable.fromJS({
+    left: rect.left,
+    top: rect.bottom + 2,
+    template: menuTemplate
+  }))
+}
+
 function onTabsToolbarContextMenu (activeFrame, closestDestinationDetail, isParent, e) {
   e.stopPropagation()
   const tabsToolbarMenu = Menu.buildFromTemplate(tabsToolbarTemplateInit(activeFrame, closestDestinationDetail, isParent))
@@ -1245,6 +1264,7 @@ module.exports = {
   onHamburgerMenu,
   onMainContextMenu,
   onTabContextMenu,
+  onNewTabContextMenu,
   onTabsToolbarContextMenu,
   onDownloadsToolbarContextMenu,
   onTabPageContextMenu,