about summary refs log tree commit diff
path: root/app/javascript/flavours/glitch/features/compose/components/dropdown_menu.js
diff options
context:
space:
mode:
authorStarfall <us@starfall.systems>2023-04-14 19:22:47 -0500
committerStarfall <us@starfall.systems>2023-04-14 19:22:47 -0500
commit4fe1689de43f4404eb9530fcfbcbfb26d6c1c13a (patch)
tree6811b845bb7f4966b10dcefa3dea404246f161c7 /app/javascript/flavours/glitch/features/compose/components/dropdown_menu.js
parent65c1e53a32cabcdbb7bca57002bb0f6acdebe07e (diff)
parentbed63f6dae0879ac840066b031229e0d139089cd (diff)
Merge remote-tracking branch 'glitch/main' HEAD main
Diffstat (limited to 'app/javascript/flavours/glitch/features/compose/components/dropdown_menu.js')
-rw-r--r--app/javascript/flavours/glitch/features/compose/components/dropdown_menu.js199
1 files changed, 0 insertions, 199 deletions
diff --git a/app/javascript/flavours/glitch/features/compose/components/dropdown_menu.js b/app/javascript/flavours/glitch/features/compose/components/dropdown_menu.js
deleted file mode 100644
index c4895dfd0..000000000
--- a/app/javascript/flavours/glitch/features/compose/components/dropdown_menu.js
+++ /dev/null
@@ -1,199 +0,0 @@
-//  Package imports.
-import PropTypes from 'prop-types';
-import React from 'react';
-import ImmutablePureComponent from 'react-immutable-pure-component';
-import classNames from 'classnames';
-
-//  Components.
-import Icon from 'flavours/glitch/components/icon';
-
-//  Utils.
-import { withPassive } from 'flavours/glitch/utils/dom_helpers';
-import { assignHandlers } from 'flavours/glitch/utils/react_helpers';
-
-//  The component.
-export default class ComposerOptionsDropdownContent extends React.PureComponent {
-
-  static propTypes = {
-    items: PropTypes.arrayOf(PropTypes.shape({
-      icon: PropTypes.string,
-      meta: PropTypes.node,
-      name: PropTypes.string.isRequired,
-      text: PropTypes.node,
-    })),
-    onChange: PropTypes.func.isRequired,
-    onClose: PropTypes.func.isRequired,
-    style: PropTypes.object,
-    value: PropTypes.string,
-    renderItemContents: PropTypes.func,
-    openedViaKeyboard: PropTypes.bool,
-    closeOnChange: PropTypes.bool,
-  };
-
-  static defaultProps = {
-    style: {},
-    closeOnChange: true,
-  };
-
-  state = {
-    value: this.props.openedViaKeyboard ? this.props.items[0].name : undefined,
-  };
-
-  //  When the document is clicked elsewhere, we close the dropdown.
-  handleDocumentClick = (e) => {
-    if (this.node && !this.node.contains(e.target)) {
-      this.props.onClose();
-    }
-  }
-
-  //  Stores our node in `this.node`.
-  setRef = (node) => {
-    this.node = node;
-  }
-
-  //  On mounting, we add our listeners.
-  componentDidMount () {
-    document.addEventListener('click', this.handleDocumentClick, false);
-    document.addEventListener('touchend', this.handleDocumentClick, withPassive);
-    if (this.focusedItem) {
-      this.focusedItem.focus({ preventScroll: true });
-    } else {
-      this.node.firstChild.focus({ preventScroll: true });
-    }
-  }
-
-  //  On unmounting, we remove our listeners.
-  componentWillUnmount () {
-    document.removeEventListener('click', this.handleDocumentClick, false);
-    document.removeEventListener('touchend', this.handleDocumentClick, withPassive);
-  }
-
-  handleClick = (e) => {
-    const i = Number(e.currentTarget.getAttribute('data-index'));
-
-    const {
-      onChange,
-      onClose,
-      closeOnChange,
-      items,
-    } = this.props;
-
-    const { name } = this.props.items[i];
-    e.preventDefault();  //  Prevents change in focus on click
-    if (closeOnChange) {
-      onClose();
-    }
-    onChange(name);
-  }
-
-  // Handle changes differently whether the dropdown is a list of options or actions
-  handleChange = (name) => {
-    if (this.props.value) {
-      this.props.onChange(name);
-    } else {
-      this.setState({ value: name });
-    }
-  }
-
-  handleKeyDown = (e) => {
-    const index = Number(e.currentTarget.getAttribute('data-index'));
-    const { items } = this.props;
-    let element = null;
-
-    switch(e.key) {
-    case 'Escape':
-      this.props.onClose();
-      break;
-    case 'Enter':
-    case ' ':
-      this.handleClick(e);
-      break;
-    case 'ArrowDown':
-      element = this.node.childNodes[index + 1] || this.node.firstChild;
-      break;
-    case 'ArrowUp':
-      element = this.node.childNodes[index - 1] || this.node.lastChild;
-      break;
-    case 'Tab':
-      if (e.shiftKey) {
-        element = this.node.childNodes[index - 1] || this.node.lastChild;
-      } else {
-        element = this.node.childNodes[index + 1] || this.node.firstChild;
-      }
-      break;
-    case 'Home':
-      element = this.node.firstChild;
-      break;
-    case 'End':
-      element = this.node.lastChild;
-      break;
-    }
-
-    if (element) {
-      element.focus();
-      this.handleChange(this.props.items[Number(element.getAttribute('data-index'))].name);
-      e.preventDefault();
-      e.stopPropagation();
-    }
-  }
-
-  setFocusRef = c => {
-    this.focusedItem = c;
-  }
-
-  renderItem = (item, i) => {
-    const { name, icon, meta, text } = item;
-
-    const active = (name === (this.props.value || this.state.value));
-
-    const computedClass = classNames('privacy-dropdown__option', { active });
-
-    let contents = this.props.renderItemContents && this.props.renderItemContents(item, i);
-
-    if (!contents) {
-      contents = (
-        <React.Fragment>
-          {icon && <Icon className='icon' fixedWidth id={icon} />}
-
-          <div className='privacy-dropdown__option__content'>
-            <strong>{text}</strong>
-            {meta}
-          </div>
-        </React.Fragment>
-      );
-    }
-
-    return (
-      <div
-        className={computedClass}
-        onClick={this.handleClick}
-        onKeyDown={this.handleKeyDown}
-        role='option'
-        tabIndex='0'
-        key={name}
-        data-index={i}
-        ref={active ? this.setFocusRef : null}
-      >
-        {contents}
-      </div>
-    );
-  }
-
-  //  Rendering.
-  render () {
-    const {
-      items,
-      onChange,
-      onClose,
-      style,
-    } = this.props;
-
-    //  The result.
-    return (
-      <div style={{ ...style }} role='listbox' ref={this.setRef}>
-        {!!items && items.map((item, i) => this.renderItem(item, i))}
-      </div>
-    );
-  }
-
-}