Merge branch 'glitch-soc:main' into maratang

.github/workflows/lint-haml.yml

@@ -36,4 +36,4 @@ jobs:
       - name: Run haml-lint
         run: |
           echo "::add-matcher::.github/workflows/haml-lint-problem-matcher.json"
-          bundle exec haml-lint
+          bundle exec haml-lint --reporter github

Gemfile.lock

@@ -333,7 +333,7 @@ GEM
     http-form_data (2.3.0)
     http_accept_language (2.1.1)
     httpclient (2.8.3)
-    httplog (1.6.2)
+    httplog (1.6.3)
       rack (>= 2.0)
       rainbow (>= 2.0.0)
     i18n (1.14.1)
@@ -744,7 +744,7 @@ GEM
     terrapin (1.0.1)
       climate_control
     test-prof (1.3.1)
-    thor (1.3.0)
+    thor (1.3.1)
     tilt (2.3.0)
     timeout (0.4.1)
     tpm-key_attestation (0.12.0)

app/controllers/application_controller.rb

@@ -180,7 +180,7 @@ def check_self_destruct!
         use_pack 'error'
         render 'errors/self_destruct', layout: 'auth', status: 410, formats: [:html]
       end
-      format.json { render json: { error: Rack::Utils::HTTP_STATUS_CODES[410] }, status: code }
+      format.json { render json: { error: Rack::Utils::HTTP_STATUS_CODES[410] }, status: 410 }
     end
   end
 

app/javascript/core/admin.js

@@ -93,18 +93,6 @@ Rails.delegate(document, batchCheckboxClassName, 'change', () => {
   }
 });
 
-Rails.delegate(document, '.media-spoiler-show-button', 'click', () => {
-  [].forEach.call(document.querySelectorAll('button.media-spoiler'), (element) => {
-    element.click();
-  });
-});
-
-Rails.delegate(document, '.media-spoiler-hide-button', 'click', () => {
-  [].forEach.call(document.querySelectorAll('.spoiler-button.spoiler-button--visible button'), (element) => {
-    element.click();
-  });
-});
-
 Rails.delegate(document, '.filter-subset--with-select select', 'change', ({ target }) => {
   target.form.submit();
 });

app/javascript/flavours/glitch/features/compose/components/dropdown_icon_button.jsx

@@ -5,7 +5,7 @@ import Overlay from 'react-overlays/Overlay';
 
 import { IconButton } from 'flavours/glitch/components/icon_button';
 
-import DropdownMenu from './dropdown_menu';
+import { PrivacyDropdownMenu } from './privacy_dropdown_menu';
 
 export const DropdownIconButton = ({ value, disabled, icon, onChange, iconComponent, title, options }) => {
   const containerRef = useRef(null);
@@ -53,7 +53,7 @@ export const DropdownIconButton = ({ value, disabled, icon, onChange, iconCompon
         {({ props, placement }) => (
           <div {...props}>
             <div className={`dropdown-animation privacy-dropdown__dropdown ${placement}`}>
-              <DropdownMenu
+              <PrivacyDropdownMenu
                 items={options}
                 value={value}
                 onClose={handleClose}

app/javascript/flavours/glitch/features/compose/components/language_dropdown.jsx

@@ -141,6 +141,7 @@ class LanguageDropdownMenu extends PureComponent {
     case 'Escape':
       onClose();
       break;
+    case ' ':
     case 'Enter':
       this.handleClick(e);
       break;

app/javascript/flavours/glitch/features/compose/components/privacy_dropdown.jsx

@@ -5,16 +5,16 @@ import { injectIntl, defineMessages } from 'react-intl';
 
 import classNames from 'classnames';
 
-import { supportsPassiveEvents } from 'detect-passive-events';
 import Overlay from 'react-overlays/Overlay';
 
 import AlternateEmailIcon from '@/material-icons/400-24px/alternate_email.svg?react';
-import InfoIcon from '@/material-icons/400-24px/info.svg?react';
 import LockIcon from '@/material-icons/400-24px/lock.svg?react';
 import PublicIcon from '@/material-icons/400-24px/public.svg?react';
 import QuietTimeIcon from '@/material-icons/400-24px/quiet_time.svg?react';
 import { Icon }  from 'flavours/glitch/components/icon';
 
+import { PrivacyDropdownMenu } from './privacy_dropdown_menu';
+
 const messages = defineMessages({
   public_short: { id: 'privacy.public.short', defaultMessage: 'Public' },
   public_long: { id: 'privacy.public.long', defaultMessage: 'Anyone on and off Mastodon' },
@@ -28,126 +28,6 @@ const messages = defineMessages({
   unlisted_extra: { id: 'privacy.unlisted.additional', defaultMessage: 'This behaves exactly like public, except the post will not appear in live feeds or hashtags, explore, or Mastodon search, even if you are opted-in account-wide.' },
 });
 
-const listenerOptions = supportsPassiveEvents ? { passive: true, capture: true } : true;
-
-class PrivacyDropdownMenu extends PureComponent {
-
-  static propTypes = {
-    style: PropTypes.object,
-    items: PropTypes.array.isRequired,
-    value: PropTypes.string.isRequired,
-    onClose: PropTypes.func.isRequired,
-    onChange: PropTypes.func.isRequired,
-  };
-
-  handleDocumentClick = e => {
-    if (this.node && !this.node.contains(e.target)) {
-      this.props.onClose();
-      e.stopPropagation();
-    }
-  };
-
-  handleKeyDown = e => {
-    const { items } = this.props;
-    const value = e.currentTarget.getAttribute('data-index');
-    const index = items.findIndex(item => {
-      return (item.value === value);
-    });
-    let element = null;
-
-    switch(e.key) {
-    case 'Escape':
-      this.props.onClose();
-      break;
-    case 'Enter':
-      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.props.onChange(element.getAttribute('data-index'));
-      e.preventDefault();
-      e.stopPropagation();
-    }
-  };
-
-  handleClick = e => {
-    const value = e.currentTarget.getAttribute('data-index');
-
-    e.preventDefault();
-
-    this.props.onClose();
-    this.props.onChange(value);
-  };
-
-  componentDidMount () {
-    document.addEventListener('click', this.handleDocumentClick, { capture: true });
-    document.addEventListener('touchend', this.handleDocumentClick, listenerOptions);
-    if (this.focusedItem) this.focusedItem.focus({ preventScroll: true });
-  }
-
-  componentWillUnmount () {
-    document.removeEventListener('click', this.handleDocumentClick, { capture: true });
-    document.removeEventListener('touchend', this.handleDocumentClick, listenerOptions);
-  }
-
-  setRef = c => {
-    this.node = c;
-  };
-
-  setFocusRef = c => {
-    this.focusedItem = c;
-  };
-
-  render () {
-    const { style, items, value } = this.props;
-
-    return (
-      <div style={{ ...style }} role='listbox' ref={this.setRef}>
-        {items.map(item => (
-          <div role='option' tabIndex={0} key={item.value} data-index={item.value} onKeyDown={this.handleKeyDown} onClick={this.handleClick} className={classNames('privacy-dropdown__option', { active: item.value === value })} aria-selected={item.value === value} ref={item.value === value ? this.setFocusRef : null}>
-            <div className='privacy-dropdown__option__icon'>
-              <Icon id={item.icon} icon={item.iconComponent} />
-            </div>
-
-            <div className='privacy-dropdown__option__content'>
-              <strong>{item.text}</strong>
-              {item.meta}
-            </div>
-
-            {item.extra && (
-              <div className='privacy-dropdown__option__additional' title={item.extra}>
-                <Icon id='info-circle' icon={InfoIcon} />
-              </div>
-            )}
-          </div>
-        ))}
-      </div>
-    );
-  }
-
-}
-
 class PrivacyDropdown extends PureComponent {
 
   static propTypes = {