diff options
author | Claire <claire.github-309c@sitedethib.com> | 2022-02-09 17:25:57 +0100 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-02-09 17:25:57 +0100 |
commit | 8987ea4d6b236657b8ea97d619902668768ae8ff (patch) | |
tree | d1be73fd2f80572f4b54857c51bae95327314e40 /app/javascript/flavours/glitch/components/dropdown_menu.js | |
parent | 2fd1db7c9d0fe8c1cca159b9b0818c72e7c318aa (diff) | |
parent | 0bb3d445ab0167ac33bd804333c7f9741c7526ae (diff) |
Merge pull request #1682 from ClearlyClaire/glitch-soc/fixes/dropdowns-modals
Refactor and fix dropdown/action dialog
Diffstat (limited to 'app/javascript/flavours/glitch/components/dropdown_menu.js')
-rw-r--r-- | app/javascript/flavours/glitch/components/dropdown_menu.js | 11 |
1 files changed, 6 insertions, 5 deletions
diff --git a/app/javascript/flavours/glitch/components/dropdown_menu.js b/app/javascript/flavours/glitch/components/dropdown_menu.js index 023fecb9a..a4d0dfc50 100644 --- a/app/javascript/flavours/glitch/components/dropdown_menu.js +++ b/app/javascript/flavours/glitch/components/dropdown_menu.js @@ -116,7 +116,7 @@ class DropdownMenu extends React.PureComponent { if (typeof action === 'function') { e.preventDefault(); - action(); + action(e); } else if (to) { e.preventDefault(); this.context.router.history.push(to); @@ -128,11 +128,11 @@ class DropdownMenu extends React.PureComponent { return <li key={`sep-${i}`} className='dropdown-menu__separator' />; } - const { text, href = '#' } = option; + const { text, href = '#', target = '_blank', method } = option; return ( <li className='dropdown-menu__item' key={`${text}-${i}`}> - <a href={href} target='_blank' rel='noopener noreferrer' role='button' tabIndex='0' ref={i === 0 ? this.setFocusRef : null} onClick={this.handleClick} onKeyPress={this.handleItemKeyPress} data-index={i}> + <a href={href} target={target} data-method={method} rel='noopener noreferrer' role='button' tabIndex='0' ref={i === 0 ? this.setFocusRef : null} onClick={this.handleClick} onKeyPress={this.handleItemKeyPress} data-index={i}> {text} </a> </li> @@ -149,7 +149,7 @@ class DropdownMenu extends React.PureComponent { // It should not be transformed when mounting because the resulting // size will be used to determine the coordinate of the menu by // react-overlays - <div className='dropdown-menu' style={{ ...style, opacity: opacity, transform: mounted ? `scale(${scaleX}, ${scaleY})` : null }} ref={this.setRef}> + <div className={`dropdown-menu ${placement}`} style={{ ...style, opacity: opacity, transform: mounted ? `scale(${scaleX}, ${scaleY})` : null }} ref={this.setRef}> <div className={`dropdown-menu__arrow ${placement}`} style={{ left: arrowOffsetLeft, top: arrowOffsetTop }} /> <ul> @@ -236,7 +236,8 @@ export default class Dropdown extends React.PureComponent { } } - handleItemClick = (i, e) => { + handleItemClick = e => { + const i = Number(e.currentTarget.getAttribute('data-index')); const { action, to } = this.props.items[i]; this.handleClose(); |