diff --git a/app/soapbox/actions/auth.js b/app/soapbox/actions/auth.js index e99ad9fdb..8f6345508 100644 --- a/app/soapbox/actions/auth.js +++ b/app/soapbox/actions/auth.js @@ -190,8 +190,8 @@ export function logOut() { }; } -export function switchAccount(accountId) { - return { type: SWITCH_ACCOUNT, accountId }; +export function switchAccount(accountId, reload = true) { + return { type: SWITCH_ACCOUNT, accountId, reload }; } export function fetchOwnAccounts() { diff --git a/app/soapbox/components/dropdown_menu.js b/app/soapbox/components/dropdown_menu.js index abaea33fe..056070329 100644 --- a/app/soapbox/components/dropdown_menu.js +++ b/app/soapbox/components/dropdown_menu.js @@ -117,6 +117,24 @@ class DropdownMenu extends React.PureComponent { } } + handleMiddleClick = e => { + const i = Number(e.currentTarget.getAttribute('data-index')); + const { middleClick } = this.props.items[i]; + + this.props.onClose(); + + if (e.button === 1 && typeof middleClick === 'function') { + e.preventDefault(); + middleClick(e); + } + } + + handleAuxClick = e => { + if (e.button === 1) { + this.handleMiddleClick(e); + } + } + renderItem(option, i) { if (option === null) { return
; @@ -132,6 +150,7 @@ class DropdownMenu extends React.PureComponent { tabIndex='0' ref={i === 0 ? this.setFocusRef : null} onClick={this.handleClick} + onAuxClick={this.handleAuxClick} onKeyDown={this.handleItemKeyDown} data-index={i} target={newTab ? '_blank' : null} diff --git a/app/soapbox/features/ui/components/profile_dropdown.js b/app/soapbox/features/ui/components/profile_dropdown.js index 2b3f7df7f..da638240a 100644 --- a/app/soapbox/features/ui/components/profile_dropdown.js +++ b/app/soapbox/features/ui/components/profile_dropdown.js @@ -64,6 +64,14 @@ class ProfileDropdown extends React.PureComponent { }; } + handleMiddleClick = account => { + return e => { + this.props.dispatch(switchAccount(account.get('id'), false)); + window.open('/', '_blank', 'noopener,noreferrer'); + e.preventDefault(); + }; + } + fetchOwnAccounts = throttle(() => { this.props.dispatch(fetchOwnAccounts()); }, 2000); @@ -80,7 +88,7 @@ class ProfileDropdown extends React.PureComponent { return (