diff --git a/app/javascript/flavours/glitch/features/compose/components/dropdown_menu.js b/app/javascript/flavours/glitch/features/compose/components/dropdown_menu.js index c2446c6ddf..16eb1ef9d6 100644 --- a/app/javascript/flavours/glitch/features/compose/components/dropdown_menu.js +++ b/app/javascript/flavours/glitch/features/compose/components/dropdown_menu.js @@ -77,14 +77,16 @@ export default class ComposerOptionsDropdownContent extends React.PureComponent document.removeEventListener('touchend', this.handleDocumentClick, withPassive); } - handleClick = (name, e) => { + handleClick = (e) => { + const i = Number(e.currentTarget.getAttribute('data-index')); + const { onChange, onClose, items, } = this.props; - const { on } = this.props.items.find(item => item.name === name); + const { on, name } = this.props.items[i]; e.preventDefault(); // Prevents change in focus on click if ((on === null || typeof on === 'undefined')) { onClose(); @@ -101,11 +103,9 @@ export default class ComposerOptionsDropdownContent extends React.PureComponent } } - handleKeyDown = (name, e) => { + handleKeyDown = (e) => { + const index = Number(e.currentTarget.getAttribute('data-index')); const { items } = this.props; - const index = items.findIndex(item => { - return (item.name === name); - }); let element = null; switch(e.key) { @@ -139,7 +139,7 @@ export default class ComposerOptionsDropdownContent extends React.PureComponent if (element) { element.focus(); - this.handleChange(element.getAttribute('data-index')); + this.handleChange(this.props.items[Number(element.getAttribute('data-index'))].name); e.preventDefault(); e.stopPropagation(); } @@ -149,7 +149,7 @@ export default class ComposerOptionsDropdownContent extends React.PureComponent this.focusedItem = c; } - renderItem = (item) => { + renderItem = (item, i) => { const { name, icon, meta, on, text } = item; const active = (name === (this.props.value || this.state.value)); @@ -159,7 +159,7 @@ export default class ComposerOptionsDropdownContent extends React.PureComponent let prefix = null; if (on !== null && typeof on !== 'undefined') { - prefix = ; + prefix = ; } else if (icon) { prefix = } @@ -167,12 +167,12 @@ export default class ComposerOptionsDropdownContent extends React.PureComponent return (
{prefix} @@ -223,7 +223,7 @@ export default class ComposerOptionsDropdownContent extends React.PureComponent transform: mounted ? `scale(${scaleX}, ${scaleY})` : null, }} > - {!!items && items.map(item => this.renderItem(item))} + {!!items && items.map((item, i) => this.renderItem(item, i))}
)}