From 81ef21a0c802f1d905f37a2a818544a8b400793c Mon Sep 17 00:00:00 2001
From: Renaud Chaput <renchap@gmail.com>
Date: Sat, 25 Feb 2023 14:34:32 +0100
Subject: [Glitch] Rename JSX files with proper `.jsx` extension

Port 44a7d87cb1f5df953b6c14c16c59e2e4ead1bcb9 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
---
 .../glitch/features/ui/components/media_modal.jsx  | 252 +++++++++++++++++++++
 1 file changed, 252 insertions(+)
 create mode 100644 app/javascript/flavours/glitch/features/ui/components/media_modal.jsx

(limited to 'app/javascript/flavours/glitch/features/ui/components/media_modal.jsx')

diff --git a/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx
new file mode 100644
index 000000000..24559264e
--- /dev/null
+++ b/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx
@@ -0,0 +1,252 @@
+import React from 'react';
+import ReactSwipeableViews from 'react-swipeable-views';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import PropTypes from 'prop-types';
+import Video from 'flavours/glitch/features/video';
+import classNames from 'classnames';
+import { defineMessages, injectIntl } from 'react-intl';
+import IconButton from 'flavours/glitch/components/icon_button';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import ImageLoader from './image_loader';
+import Icon from 'flavours/glitch/components/icon';
+import GIFV from 'flavours/glitch/components/gifv';
+import Footer from 'flavours/glitch/features/picture_in_picture/components/footer';
+import { getAverageFromBlurhash } from 'flavours/glitch/blurhash';
+import { disableSwiping } from 'flavours/glitch/initial_state';
+
+const messages = defineMessages({
+  close: { id: 'lightbox.close', defaultMessage: 'Close' },
+  previous: { id: 'lightbox.previous', defaultMessage: 'Previous' },
+  next: { id: 'lightbox.next', defaultMessage: 'Next' },
+});
+
+export default @injectIntl
+class MediaModal extends ImmutablePureComponent {
+
+  static contextTypes = {
+    router: PropTypes.object,
+  };
+
+  static propTypes = {
+    media: ImmutablePropTypes.list.isRequired,
+    statusId: PropTypes.string,
+    index: PropTypes.number.isRequired,
+    onClose: PropTypes.func.isRequired,
+    intl: PropTypes.object.isRequired,
+    onChangeBackgroundColor: PropTypes.func.isRequired,
+    currentTime: PropTypes.number,
+    autoPlay: PropTypes.bool,
+    volume: PropTypes.number,
+  };
+
+  state = {
+    index: null,
+    navigationHidden: false,
+    zoomButtonHidden: false,
+  };
+
+  handleSwipe = (index) => {
+    this.setState({ index: index % this.props.media.size });
+  };
+
+  handleTransitionEnd = () => {
+    this.setState({
+      zoomButtonHidden: false,
+    });
+  };
+
+  handleNextClick = () => {
+    this.setState({
+      index: (this.getIndex() + 1) % this.props.media.size,
+      zoomButtonHidden: true,
+    });
+  };
+
+  handlePrevClick = () => {
+    this.setState({
+      index: (this.props.media.size + this.getIndex() - 1) % this.props.media.size,
+      zoomButtonHidden: true,
+    });
+  };
+
+  handleChangeIndex = (e) => {
+    const index = Number(e.currentTarget.getAttribute('data-index'));
+
+    this.setState({
+      index: index % this.props.media.size,
+      zoomButtonHidden: true,
+    });
+  };
+
+  handleKeyDown = (e) => {
+    switch(e.key) {
+    case 'ArrowLeft':
+      this.handlePrevClick();
+      e.preventDefault();
+      e.stopPropagation();
+      break;
+    case 'ArrowRight':
+      this.handleNextClick();
+      e.preventDefault();
+      e.stopPropagation();
+      break;
+    }
+  };
+
+  componentDidMount () {
+    window.addEventListener('keydown', this.handleKeyDown, false);
+    this._sendBackgroundColor();
+  }
+
+  componentWillUnmount () {
+    window.removeEventListener('keydown', this.handleKeyDown);
+    this.props.onChangeBackgroundColor(null);
+  }
+
+  getIndex () {
+    return this.state.index !== null ? this.state.index : this.props.index;
+  }
+
+  toggleNavigation = () => {
+    this.setState(prevState => ({
+      navigationHidden: !prevState.navigationHidden,
+    }));
+  };
+
+  componentDidUpdate (prevProps, prevState) {
+    if (prevState.index !== this.state.index) {
+      this._sendBackgroundColor();
+    }
+  }
+
+  _sendBackgroundColor () {
+    const { media, onChangeBackgroundColor } = this.props;
+    const index = this.getIndex();
+    const blurhash = media.getIn([index, 'blurhash']);
+
+    if (blurhash) {
+      const backgroundColor = getAverageFromBlurhash(blurhash);
+      onChangeBackgroundColor(backgroundColor);
+    }
+  }
+
+  render () {
+    const { media, statusId, intl, onClose } = this.props;
+    const { navigationHidden } = this.state;
+
+    const index = this.getIndex();
+
+    const leftNav  = media.size > 1 && <button tabIndex='0' className='media-modal__nav media-modal__nav--left' onClick={this.handlePrevClick} aria-label={intl.formatMessage(messages.previous)}><Icon id='chevron-left' fixedWidth /></button>;
+    const rightNav = media.size > 1 && <button tabIndex='0' className='media-modal__nav  media-modal__nav--right' onClick={this.handleNextClick} aria-label={intl.formatMessage(messages.next)}><Icon id='chevron-right' fixedWidth /></button>;
+
+    const content = media.map((image) => {
+      const width  = image.getIn(['meta', 'original', 'width']) || null;
+      const height = image.getIn(['meta', 'original', 'height']) || null;
+
+      if (image.get('type') === 'image') {
+        return (
+          <ImageLoader
+            previewSrc={image.get('preview_url')}
+            src={image.get('url')}
+            width={width}
+            height={height}
+            alt={image.get('description')}
+            key={image.get('url')}
+            onClick={this.toggleNavigation}
+            zoomButtonHidden={this.state.zoomButtonHidden}
+          />
+        );
+      } else if (image.get('type') === 'video') {
+        const { currentTime, autoPlay, volume } = this.props;
+
+        return (
+          <Video
+            preview={image.get('preview_url')}
+            blurhash={image.get('blurhash')}
+            src={image.get('url')}
+            width={image.get('width')}
+            height={image.get('height')}
+            frameRate={image.getIn(['meta', 'original', 'frame_rate'])}
+            currentTime={currentTime || 0}
+            autoPlay={autoPlay || false}
+            volume={volume || 1}
+            onCloseVideo={onClose}
+            detailed
+            alt={image.get('description')}
+            key={image.get('url')}
+          />
+        );
+      } else if (image.get('type') === 'gifv') {
+        return (
+          <GIFV
+            src={image.get('url')}
+            width={width}
+            height={height}
+            key={image.get('preview_url')}
+            alt={image.get('description')}
+            onClick={this.toggleNavigation}
+          />
+        );
+      }
+
+      return null;
+    }).toArray();
+
+    // you can't use 100vh, because the viewport height is taller
+    // than the visible part of the document in some mobile
+    // browsers when it's address bar is visible.
+    // https://developers.google.com/web/updates/2016/12/url-bar-resizing
+    const swipeableViewsStyle = {
+      width: '100%',
+      height: '100%',
+    };
+
+    const containerStyle = {
+      alignItems: 'center', // center vertically
+    };
+
+    const navigationClassName = classNames('media-modal__navigation', {
+      'media-modal__navigation--hidden': navigationHidden,
+    });
+
+    let pagination;
+
+    if (media.size > 1) {
+      pagination = media.map((item, i) => (
+        <button key={i} className={classNames('media-modal__page-dot', { active: i === index })} data-index={i} onClick={this.handleChangeIndex}>
+          {i + 1}
+        </button>
+      ));
+    }
+
+    return (
+      <div className='modal-root__modal media-modal'>
+        <div className='media-modal__closer' role='presentation' onClick={onClose} >
+          <ReactSwipeableViews
+            style={swipeableViewsStyle}
+            containerStyle={containerStyle}
+            onChangeIndex={this.handleSwipe}
+            onTransitionEnd={this.handleTransitionEnd}
+            index={index}
+            disabled={disableSwiping}
+          >
+            {content}
+          </ReactSwipeableViews>
+        </div>
+
+        <div className={navigationClassName}>
+          <IconButton className='media-modal__close' title={intl.formatMessage(messages.close)} icon='times' onClick={onClose} size={40} />
+
+          {leftNav}
+          {rightNav}
+
+          <div className='media-modal__overlay'>
+            {pagination && <ul className='media-modal__pagination'>{pagination}</ul>}
+            {statusId && <Footer statusId={statusId} withOpenButton onClose={onClose} />}
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+}
-- 
cgit 


From 0e476f3c4fbbcab9b4895b8abff93075dfd2bf0c Mon Sep 17 00:00:00 2001
From: Christian Schmidt <github@chsc.dk>
Date: Sun, 26 Feb 2023 20:13:27 +0100
Subject: [Glitch] Add `lang` attribute to media and poll options

Port d3eefead3014175b264cb56f6f4cb552cbaaeac6 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
---
 app/javascript/flavours/glitch/components/gifv.jsx         |  5 ++++-
 .../flavours/glitch/components/media_attachments.jsx       |  6 +++++-
 .../flavours/glitch/components/media_gallery.jsx           | 14 +++++++++-----
 app/javascript/flavours/glitch/components/poll.jsx         |  5 ++++-
 app/javascript/flavours/glitch/components/status.jsx       |  5 ++++-
 .../features/account_gallery/components/media_item.jsx     |  3 +++
 app/javascript/flavours/glitch/features/audio/index.jsx    |  4 +++-
 .../glitch/features/status/components/detailed_status.jsx  |  5 ++++-
 .../flavours/glitch/features/ui/components/audio_modal.jsx |  7 +++++--
 .../features/ui/components/compare_history_modal.jsx       | 11 +++++++----
 .../glitch/features/ui/components/image_loader.jsx         |  5 ++++-
 .../flavours/glitch/features/ui/components/media_modal.jsx | 13 +++++++++++--
 .../flavours/glitch/features/ui/components/video_modal.jsx | 12 ++++++++++--
 .../glitch/features/ui/components/zoomable_image.jsx       |  5 ++++-
 app/javascript/flavours/glitch/features/video/index.jsx    |  4 +++-
 15 files changed, 80 insertions(+), 24 deletions(-)

(limited to 'app/javascript/flavours/glitch/features/ui/components/media_modal.jsx')

diff --git a/app/javascript/flavours/glitch/components/gifv.jsx b/app/javascript/flavours/glitch/components/gifv.jsx
index 1f0f99b46..9ec201c6c 100644
--- a/app/javascript/flavours/glitch/components/gifv.jsx
+++ b/app/javascript/flavours/glitch/components/gifv.jsx
@@ -6,6 +6,7 @@ export default class GIFV extends React.PureComponent {
   static propTypes = {
     src: PropTypes.string.isRequired,
     alt: PropTypes.string,
+    lang: PropTypes.string,
     width: PropTypes.number,
     height: PropTypes.number,
     onClick: PropTypes.func,
@@ -35,7 +36,7 @@ export default class GIFV extends React.PureComponent {
   };
 
   render () {
-    const { src, width, height, alt } = this.props;
+    const { src, width, height, alt, lang } = this.props;
     const { loading } = this.state;
 
     return (
@@ -48,6 +49,7 @@ export default class GIFV extends React.PureComponent {
             tabIndex='0'
             aria-label={alt}
             title={alt}
+            lang={lang}
             onClick={this.handleClick}
           />
         )}
@@ -58,6 +60,7 @@ export default class GIFV extends React.PureComponent {
           tabIndex='0'
           aria-label={alt}
           title={alt}
+          lang={lang}
           muted
           loop
           autoPlay
diff --git a/app/javascript/flavours/glitch/components/media_attachments.jsx b/app/javascript/flavours/glitch/components/media_attachments.jsx
index 33f01bb5a..b11d3526f 100644
--- a/app/javascript/flavours/glitch/components/media_attachments.jsx
+++ b/app/javascript/flavours/glitch/components/media_attachments.jsx
@@ -10,6 +10,7 @@ export default class MediaAttachments extends ImmutablePureComponent {
 
   static propTypes = {
     status: ImmutablePropTypes.map.isRequired,
+    lang: PropTypes.string,
     height: PropTypes.number,
     width: PropTypes.number,
     revealed: PropTypes.bool,
@@ -49,7 +50,7 @@ export default class MediaAttachments extends ImmutablePureComponent {
   };
 
   render () {
-    const { status, width, height, revealed } = this.props;
+    const { status, lang, width, height, revealed } = this.props;
     const mediaAttachments = status.get('media_attachments');
 
     if (mediaAttachments.size === 0) {
@@ -65,6 +66,7 @@ export default class MediaAttachments extends ImmutablePureComponent {
             <Component
               src={audio.get('url')}
               alt={audio.get('description')}
+              lang={lang || status.get('language')}
               width={width}
               height={height}
               poster={audio.get('preview_url') || status.getIn(['account', 'avatar_static'])}
@@ -88,6 +90,7 @@ export default class MediaAttachments extends ImmutablePureComponent {
               blurhash={video.get('blurhash')}
               src={video.get('url')}
               alt={video.get('description')}
+              lang={lang || status.get('language')}
               width={width}
               height={height}
               inline
@@ -104,6 +107,7 @@ export default class MediaAttachments extends ImmutablePureComponent {
           {Component => (
             <Component
               media={mediaAttachments}
+              lang={lang || status.get('language')}
               sensitive={status.get('sensitive')}
               defaultWidth={width}
               revealed={revealed}
diff --git a/app/javascript/flavours/glitch/components/media_gallery.jsx b/app/javascript/flavours/glitch/components/media_gallery.jsx
index c11ac46c2..6ae510d08 100644
--- a/app/javascript/flavours/glitch/components/media_gallery.jsx
+++ b/app/javascript/flavours/glitch/components/media_gallery.jsx
@@ -36,6 +36,7 @@ class Item extends React.PureComponent {
 
   static propTypes = {
     attachment: ImmutablePropTypes.map.isRequired,
+    lang: PropTypes.string,
     standalone: PropTypes.bool,
     index: PropTypes.number.isRequired,
     size: PropTypes.number.isRequired,
@@ -98,7 +99,7 @@ class Item extends React.PureComponent {
   };
 
   render () {
-    const { attachment, index, size, standalone, letterbox, displayWidth, visible } = this.props;
+    const { attachment, lang, index, size, standalone, letterbox, displayWidth, visible } = this.props;
 
     let width  = 50;
     let height = 100;
@@ -154,7 +155,7 @@ class Item extends React.PureComponent {
     if (attachment.get('type') === 'unknown') {
       return (
         <div className={classNames('media-gallery__item', { standalone })} key={attachment.get('id')} style={{ left: left, top: top, right: right, bottom: bottom, width: `${width}%`, height: `${height}%` }}>
-          <a className='media-gallery__item-thumbnail' href={attachment.get('remote_url') || attachment.get('url')} style={{ cursor: 'pointer' }} title={attachment.get('description')} target='_blank' rel='noopener noreferrer'>
+          <a className='media-gallery__item-thumbnail' href={attachment.get('remote_url') || attachment.get('url')} style={{ cursor: 'pointer' }} title={attachment.get('description')} lang={lang} target='_blank' rel='noopener noreferrer'>
             <Blurhash
               hash={attachment.get('blurhash')}
               className='media-gallery__preview'
@@ -195,6 +196,7 @@ class Item extends React.PureComponent {
             sizes={sizes}
             alt={attachment.get('description')}
             title={attachment.get('description')}
+            lang={lang}
             style={{ objectPosition: letterbox ? null : `${x}% ${y}%` }}
             onLoad={this.handleImageLoad}
           />
@@ -209,6 +211,7 @@ class Item extends React.PureComponent {
             className={`media-gallery__item-gifv-thumbnail${letterbox ? ' letterbox' : ''}`}
             aria-label={attachment.get('description')}
             title={attachment.get('description')}
+            lang={lang}
             role='application'
             src={attachment.get('url')}
             onClick={this.handleClick}
@@ -251,6 +254,7 @@ class MediaGallery extends React.PureComponent {
     fullwidth: PropTypes.bool,
     hidden: PropTypes.bool,
     media: ImmutablePropTypes.list.isRequired,
+    lang: PropTypes.string,
     size: PropTypes.object,
     onOpenMedia: PropTypes.func.isRequired,
     intl: PropTypes.object.isRequired,
@@ -342,7 +346,7 @@ class MediaGallery extends React.PureComponent {
   }
 
   render () {
-    const { media, intl, sensitive, letterbox, fullwidth, defaultWidth, autoplay } = this.props;
+    const { media, lang, intl, sensitive, letterbox, fullwidth, defaultWidth, autoplay } = this.props;
     const { visible } = this.state;
     const size     = media.take(4).size;
     const uncached = media.every(attachment => attachment.get('type') === 'unknown');
@@ -364,9 +368,9 @@ class MediaGallery extends React.PureComponent {
     }
 
     if (this.isStandaloneEligible()) {
-      children = <Item standalone autoplay={autoplay} onClick={this.handleClick} attachment={media.get(0)} displayWidth={width} visible={visible} />;
+      children = <Item standalone autoplay={autoplay} onClick={this.handleClick} attachment={media.get(0)} lang={lang} displayWidth={width} visible={visible} />;
     } else {
-      children = media.take(4).map((attachment, i) => <Item key={attachment.get('id')} autoplay={autoplay} onClick={this.handleClick} attachment={attachment} index={i} size={size} letterbox={letterbox} displayWidth={width} visible={visible || uncached} />);
+      children = media.take(4).map((attachment, i) => <Item key={attachment.get('id')} autoplay={autoplay} onClick={this.handleClick} attachment={attachment} index={i} lang={lang} size={size} letterbox={letterbox} displayWidth={width} visible={visible || uncached} />);
     }
 
     if (uncached) {
diff --git a/app/javascript/flavours/glitch/components/poll.jsx b/app/javascript/flavours/glitch/components/poll.jsx
index 53ece560e..8b799309b 100644
--- a/app/javascript/flavours/glitch/components/poll.jsx
+++ b/app/javascript/flavours/glitch/components/poll.jsx
@@ -40,6 +40,7 @@ class Poll extends ImmutablePureComponent {
 
   static propTypes = {
     poll: ImmutablePropTypes.map,
+    lang: PropTypes.string,
     intl: PropTypes.object.isRequired,
     disabled: PropTypes.bool,
     refresh: PropTypes.func,
@@ -126,7 +127,7 @@ class Poll extends ImmutablePureComponent {
   };
 
   renderOption (option, optionIndex, showResults) {
-    const { poll, disabled, intl } = this.props;
+    const { poll, lang, disabled, intl } = this.props;
     const pollVotesCount  = poll.get('voters_count') || poll.get('votes_count');
     const percent         = pollVotesCount === 0 ? 0 : (option.get('votes_count') / pollVotesCount) * 100;
     const leading         = poll.get('options').filterNot(other => other.get('title') === option.get('title')).every(other => option.get('votes_count') >= other.get('votes_count'));
@@ -159,6 +160,7 @@ class Poll extends ImmutablePureComponent {
               onKeyPress={this.handleOptionKeyPress}
               aria-checked={active}
               aria-label={option.get('title')}
+              lang={lang}
               data-index={optionIndex}
             />
           )}
@@ -175,6 +177,7 @@ class Poll extends ImmutablePureComponent {
 
           <span
             className='poll__option__text translate'
+            lang={lang}
             dangerouslySetInnerHTML={{ __html: titleEmojified }}
           />
 
diff --git a/app/javascript/flavours/glitch/components/status.jsx b/app/javascript/flavours/glitch/components/status.jsx
index 34880efe4..2f919176c 100644
--- a/app/javascript/flavours/glitch/components/status.jsx
+++ b/app/javascript/flavours/glitch/components/status.jsx
@@ -630,6 +630,7 @@ class Status extends ImmutablePureComponent {
               <Component
                 src={attachment.get('url')}
                 alt={attachment.get('description')}
+                lang={status.get('language')}
                 poster={attachment.get('preview_url') || status.getIn(['account', 'avatar_static'])}
                 backgroundColor={attachment.getIn(['meta', 'colors', 'background'])}
                 foregroundColor={attachment.getIn(['meta', 'colors', 'foreground'])}
@@ -659,6 +660,7 @@ class Status extends ImmutablePureComponent {
               blurhash={attachment.get('blurhash')}
               src={attachment.get('url')}
               alt={attachment.get('description')}
+              lang={status.get('language')}
               inline
               sensitive={status.get('sensitive')}
               letterbox={settings.getIn(['media', 'letterbox'])}
@@ -680,6 +682,7 @@ class Status extends ImmutablePureComponent {
             {Component => (
               <Component
                 media={attachments}
+                lang={status.get('language')}
                 sensitive={status.get('sensitive')}
                 letterbox={settings.getIn(['media', 'letterbox'])}
                 fullwidth={settings.getIn(['media', 'fullwidth'])}
@@ -714,7 +717,7 @@ class Status extends ImmutablePureComponent {
     }
 
     if (status.get('poll')) {
-      contentMedia.push(<PollContainer pollId={status.get('poll')} />);
+      contentMedia.push(<PollContainer pollId={status.get('poll')} lang={status.get('language')} />);
       contentMediaIcons.push('tasks');
     }
 
diff --git a/app/javascript/flavours/glitch/features/account_gallery/components/media_item.jsx b/app/javascript/flavours/glitch/features/account_gallery/components/media_item.jsx
index d169875b0..5fd84996b 100644
--- a/app/javascript/flavours/glitch/features/account_gallery/components/media_item.jsx
+++ b/app/javascript/flavours/glitch/features/account_gallery/components/media_item.jsx
@@ -76,6 +76,7 @@ export default class MediaItem extends ImmutablePureComponent {
           <img
             src={attachment.get('preview_url') || attachment.getIn(['account', 'avatar_static'])}
             alt={attachment.get('description')}
+            lang={status.get('language')}
             onLoad={this.handleImageLoad}
           />
         );
@@ -95,6 +96,7 @@ export default class MediaItem extends ImmutablePureComponent {
           <img
             src={attachment.get('preview_url')}
             alt={attachment.get('description')}
+            lang={status.get('language')}
             style={{ objectPosition: `${x}% ${y}%` }}
             onLoad={this.handleImageLoad}
           />
@@ -105,6 +107,7 @@ export default class MediaItem extends ImmutablePureComponent {
             className='media-gallery__item-gifv-thumbnail'
             aria-label={attachment.get('description')}
             title={attachment.get('description')}
+            lang={status.get('language')}
             role='application'
             src={attachment.get('url')}
             onMouseEnter={this.handleMouseEnter}
diff --git a/app/javascript/flavours/glitch/features/audio/index.jsx b/app/javascript/flavours/glitch/features/audio/index.jsx
index c4aa98962..05c3beef9 100644
--- a/app/javascript/flavours/glitch/features/audio/index.jsx
+++ b/app/javascript/flavours/glitch/features/audio/index.jsx
@@ -28,6 +28,7 @@ class Audio extends React.PureComponent {
   static propTypes = {
     src: PropTypes.string.isRequired,
     alt: PropTypes.string,
+    lang: PropTypes.string,
     poster: PropTypes.string,
     duration: PropTypes.number,
     width: PropTypes.number,
@@ -464,7 +465,7 @@ class Audio extends React.PureComponent {
   };
 
   render () {
-    const { src, intl, alt, editable, autoPlay, sensitive, blurhash } = this.props;
+    const { src, intl, alt, lang, editable, autoPlay, sensitive, blurhash } = this.props;
     const { paused, muted, volume, currentTime, duration, buffer, dragging, revealed } = this.state;
     const progress = Math.min((currentTime / duration) * 100, 100);
 
@@ -509,6 +510,7 @@ class Audio extends React.PureComponent {
           onKeyDown={this.handleAudioKeyDown}
           title={alt}
           aria-label={alt}
+          lang={lang}
         />
 
         <div className={classNames('spoiler-button', { 'spoiler-button--hidden': revealed || editable })}>
diff --git a/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx b/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx
index 644881fa5..a94572855 100644
--- a/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx
+++ b/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx
@@ -169,6 +169,7 @@ class DetailedStatus extends ImmutablePureComponent {
           <Audio
             src={attachment.get('url')}
             alt={attachment.get('description')}
+            lang={status.get('language')}
             duration={attachment.getIn(['meta', 'original', 'duration'], 0)}
             poster={attachment.get('preview_url') || status.getIn(['account', 'avatar_static'])}
             backgroundColor={attachment.getIn(['meta', 'colors', 'background'])}
@@ -191,6 +192,7 @@ class DetailedStatus extends ImmutablePureComponent {
             blurhash={attachment.get('blurhash')}
             src={attachment.get('url')}
             alt={attachment.get('description')}
+            lang={status.get('language')}
             inline
             sensitive={status.get('sensitive')}
             letterbox={settings.getIn(['media', 'letterbox'])}
@@ -209,6 +211,7 @@ class DetailedStatus extends ImmutablePureComponent {
             standalone
             sensitive={status.get('sensitive')}
             media={status.get('media_attachments')}
+            lang={status.get('language')}
             letterbox={settings.getIn(['media', 'letterbox'])}
             fullwidth={settings.getIn(['media', 'fullwidth'])}
             hidden={!expanded}
@@ -225,7 +228,7 @@ class DetailedStatus extends ImmutablePureComponent {
     }
 
     if (status.get('poll')) {
-      contentMedia.push(<PollContainer pollId={status.get('poll')} />);
+      contentMedia.push(<PollContainer pollId={status.get('poll')} lang={status.get('language')} />);
       contentMediaIcons.push('tasks');
     }
 
diff --git a/app/javascript/flavours/glitch/features/ui/components/audio_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/audio_modal.jsx
index fc98cc6af..ff7687c1e 100644
--- a/app/javascript/flavours/glitch/features/ui/components/audio_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/audio_modal.jsx
@@ -7,15 +7,17 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
 import Footer from 'flavours/glitch/features/picture_in_picture/components/footer';
 
 const mapStateToProps = (state, { statusId }) => ({
+  language: state.getIn(['statuses', statusId, 'language']),
   accountStaticAvatar: state.getIn(['accounts', state.getIn(['statuses', statusId, 'account']), 'avatar_static']),
 });
 
-export default @connect(mapStateToProps)
+export default @connect(mapStateToProps, null, null, { forwardRef: true })
 class AudioModal extends ImmutablePureComponent {
 
   static propTypes = {
     media: ImmutablePropTypes.map.isRequired,
     statusId: PropTypes.string.isRequired,
+    language: PropTypes.string,
     accountStaticAvatar: PropTypes.string.isRequired,
     options: PropTypes.shape({
       autoPlay: PropTypes.bool,
@@ -29,7 +31,7 @@ class AudioModal extends ImmutablePureComponent {
   };
 
   render () {
-    const { media, accountStaticAvatar, statusId, onClose } = this.props;
+    const { media, language, accountStaticAvatar, statusId, onClose } = this.props;
     const options = this.props.options || {};
 
     return (
@@ -38,6 +40,7 @@ class AudioModal extends ImmutablePureComponent {
           <Audio
             src={media.get('url')}
             alt={media.get('description')}
+            lang={language}
             duration={media.getIn(['meta', 'original', 'duration'], 0)}
             height={150}
             poster={media.get('preview_url') || accountStaticAvatar}
diff --git a/app/javascript/flavours/glitch/features/ui/components/compare_history_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/compare_history_modal.jsx
index baf7f25be..4e74feb02 100644
--- a/app/javascript/flavours/glitch/features/ui/components/compare_history_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/compare_history_modal.jsx
@@ -12,6 +12,7 @@ import RelativeTimestamp from 'flavours/glitch/components/relative_timestamp';
 import MediaAttachments from 'flavours/glitch/components/media_attachments';
 
 const mapStateToProps = (state, { statusId }) => ({
+  language: state.getIn(['statuses', statusId, 'language']),
   versions: state.getIn(['history', statusId, 'items']),
 });
 
@@ -30,11 +31,12 @@ class CompareHistoryModal extends React.PureComponent {
     onClose: PropTypes.func.isRequired,
     index: PropTypes.number.isRequired,
     statusId: PropTypes.string.isRequired,
+    language: PropTypes.string.isRequired,
     versions: ImmutablePropTypes.list.isRequired,
   };
 
   render () {
-    const { index, versions, onClose } = this.props;
+    const { index, versions, language, onClose } = this.props;
     const currentVersion = versions.get(index);
 
     const emojiMap = currentVersion.get('emojis').reduce((obj, emoji) => {
@@ -65,12 +67,12 @@ class CompareHistoryModal extends React.PureComponent {
           <div className='status__content'>
             {currentVersion.get('spoiler_text').length > 0 && (
               <React.Fragment>
-                <div className='translate' dangerouslySetInnerHTML={spoilerContent} />
+                <div className='translate' dangerouslySetInnerHTML={spoilerContent} lang={language} />
                 <hr />
               </React.Fragment>
             )}
 
-            <div className='status__content__text status__content__text--visible translate' dangerouslySetInnerHTML={content} />
+            <div className='status__content__text status__content__text--visible translate' dangerouslySetInnerHTML={content} lang={language} />
 
             {!!currentVersion.get('poll') && (
               <div className='poll'>
@@ -82,6 +84,7 @@ class CompareHistoryModal extends React.PureComponent {
                       <span
                         className='poll__option__text translate'
                         dangerouslySetInnerHTML={{ __html: emojify(escapeTextContentForBrowser(option.get('title')), emojiMap) }}
+                        lang={language}
                       />
                     </li>
                   ))}
@@ -89,7 +92,7 @@ class CompareHistoryModal extends React.PureComponent {
               </div>
             )}
 
-            <MediaAttachments status={currentVersion} />
+            <MediaAttachments status={currentVersion} lang={language} />
           </div>
         </div>
       </div>
diff --git a/app/javascript/flavours/glitch/features/ui/components/image_loader.jsx b/app/javascript/flavours/glitch/features/ui/components/image_loader.jsx
index 92aeef5c4..9093eab28 100644
--- a/app/javascript/flavours/glitch/features/ui/components/image_loader.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/image_loader.jsx
@@ -8,6 +8,7 @@ export default class ImageLoader extends PureComponent {
 
   static propTypes = {
     alt: PropTypes.string,
+    lang: PropTypes.string,
     src: PropTypes.string.isRequired,
     previewSrc: PropTypes.string,
     width: PropTypes.number,
@@ -18,6 +19,7 @@ export default class ImageLoader extends PureComponent {
 
   static defaultProps = {
     alt: '',
+    lang: '',
     width: null,
     height: null,
   };
@@ -129,7 +131,7 @@ export default class ImageLoader extends PureComponent {
   };
 
   render () {
-    const { alt, src, width, height, onClick } = this.props;
+    const { alt, lang, src, width, height, onClick } = this.props;
     const { loading } = this.state;
 
     const className = classNames('image-loader', {
@@ -154,6 +156,7 @@ export default class ImageLoader extends PureComponent {
         ) : (
           <ZoomableImage
             alt={alt}
+            lang={lang}
             src={src}
             onClick={onClick}
             width={width}
diff --git a/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx
index 24559264e..9c67ed808 100644
--- a/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx
@@ -3,6 +3,7 @@ import ReactSwipeableViews from 'react-swipeable-views';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import PropTypes from 'prop-types';
 import Video from 'flavours/glitch/features/video';
+import { connect } from 'react-redux';
 import classNames from 'classnames';
 import { defineMessages, injectIntl } from 'react-intl';
 import IconButton from 'flavours/glitch/components/icon_button';
@@ -20,7 +21,12 @@ const messages = defineMessages({
   next: { id: 'lightbox.next', defaultMessage: 'Next' },
 });
 
-export default @injectIntl
+const mapStateToProps = (state, { statusId }) => ({
+  language: state.getIn(['statuses', statusId, 'language']),
+});
+
+export default @connect(mapStateToProps, null, null, { forwardRef: true })
+@injectIntl
 class MediaModal extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -131,7 +137,7 @@ class MediaModal extends ImmutablePureComponent {
   }
 
   render () {
-    const { media, statusId, intl, onClose } = this.props;
+    const { media, language, statusId, intl, onClose } = this.props;
     const { navigationHidden } = this.state;
 
     const index = this.getIndex();
@@ -151,6 +157,7 @@ class MediaModal extends ImmutablePureComponent {
             width={width}
             height={height}
             alt={image.get('description')}
+            lang={language}
             key={image.get('url')}
             onClick={this.toggleNavigation}
             zoomButtonHidden={this.state.zoomButtonHidden}
@@ -173,6 +180,7 @@ class MediaModal extends ImmutablePureComponent {
             onCloseVideo={onClose}
             detailed
             alt={image.get('description')}
+            lang={language}
             key={image.get('url')}
           />
         );
@@ -184,6 +192,7 @@ class MediaModal extends ImmutablePureComponent {
             height={height}
             key={image.get('preview_url')}
             alt={image.get('description')}
+            lang={language}
             onClick={this.toggleNavigation}
           />
         );
diff --git a/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx
index 90be11e4b..c1f837717 100644
--- a/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx
@@ -2,11 +2,17 @@ import React from 'react';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import PropTypes from 'prop-types';
 import Video from 'flavours/glitch/features/video';
+import { connect } from 'react-redux';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import Footer from 'flavours/glitch/features/picture_in_picture/components/footer';
 import { getAverageFromBlurhash } from 'flavours/glitch/blurhash';
 
-export default class VideoModal extends ImmutablePureComponent {
+const mapStateToProps = (state, { statusId }) => ({
+  language: state.getIn(['statuses', statusId, 'language']),
+});
+
+export default @connect(mapStateToProps, null, null, { forwardRef: true })
+class VideoModal extends ImmutablePureComponent {
 
   static contextTypes = {
     router: PropTypes.object,
@@ -15,6 +21,7 @@ export default class VideoModal extends ImmutablePureComponent {
   static propTypes = {
     media: ImmutablePropTypes.map.isRequired,
     statusId: PropTypes.string,
+    language: PropTypes.string,
     options: PropTypes.shape({
       startTime: PropTypes.number,
       autoPlay: PropTypes.bool,
@@ -35,7 +42,7 @@ export default class VideoModal extends ImmutablePureComponent {
   }
 
   render () {
-    const { media, statusId, onClose } = this.props;
+    const { media, statusId, language, onClose } = this.props;
     const options = this.props.options || {};
 
     return (
@@ -53,6 +60,7 @@ export default class VideoModal extends ImmutablePureComponent {
             autoFocus
             detailed
             alt={media.get('description')}
+            lang={language}
           />
         </div>
 
diff --git a/app/javascript/flavours/glitch/features/ui/components/zoomable_image.jsx b/app/javascript/flavours/glitch/features/ui/components/zoomable_image.jsx
index 50b36b478..82ba6e692 100644
--- a/app/javascript/flavours/glitch/features/ui/components/zoomable_image.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/zoomable_image.jsx
@@ -96,6 +96,7 @@ class ZoomableImage extends React.PureComponent {
 
   static propTypes = {
     alt: PropTypes.string,
+    lang: PropTypes.string,
     src: PropTypes.string.isRequired,
     width: PropTypes.number,
     height: PropTypes.number,
@@ -106,6 +107,7 @@ class ZoomableImage extends React.PureComponent {
 
   static defaultProps = {
     alt: '',
+    lang: '',
     width: null,
     height: null,
   };
@@ -403,7 +405,7 @@ class ZoomableImage extends React.PureComponent {
   };
 
   render () {
-    const { alt, src, width, height, intl } = this.props;
+    const { alt, lang, src, width, height, intl } = this.props;
     const { scale, lockTranslate } = this.state;
     const overflow = scale === MIN_SCALE ? 'hidden' : 'scroll';
     const zoomButtonShouldHide = this.state.navigationHidden || this.props.zoomButtonHidden || this.state.zoomMatrix.rate <= MIN_SCALE ? 'media-modal__zoom-button--hidden' : '';
@@ -431,6 +433,7 @@ class ZoomableImage extends React.PureComponent {
             ref={this.setImageRef}
             alt={alt}
             title={alt}
+            lang={lang}
             src={src}
             width={width}
             height={height}
diff --git a/app/javascript/flavours/glitch/features/video/index.jsx b/app/javascript/flavours/glitch/features/video/index.jsx
index cb923bcf7..9ab56b439 100644
--- a/app/javascript/flavours/glitch/features/video/index.jsx
+++ b/app/javascript/flavours/glitch/features/video/index.jsx
@@ -101,6 +101,7 @@ class Video extends React.PureComponent {
     frameRate: PropTypes.string,
     src: PropTypes.string.isRequired,
     alt: PropTypes.string,
+    lang: PropTypes.string,
     width: PropTypes.number,
     height: PropTypes.number,
     sensitive: PropTypes.bool,
@@ -538,7 +539,7 @@ class Video extends React.PureComponent {
   }
 
   render () {
-    const { preview, src, inline, onOpenVideo, onCloseVideo, intl, alt, letterbox, fullwidth, detailed, sensitive, editable, blurhash, autoFocus } = this.props;
+    const { preview, src, inline, onOpenVideo, onCloseVideo, intl, alt, lang, letterbox, fullwidth, detailed, sensitive, editable, blurhash, autoFocus } = this.props;
     const { containerWidth, currentTime, duration, volume, buffer, dragging, paused, fullscreen, hovered, muted, revealed } = this.state;
     const progress = Math.min((currentTime / duration) * 100, 100);
     const playerStyle = {};
@@ -603,6 +604,7 @@ class Video extends React.PureComponent {
           tabIndex='0'
           aria-label={alt}
           title={alt}
+          lang={lang}
           width={width}
           height={height}
           volume={volume}
-- 
cgit 


From 8215df76c070f7d400a6091fcb1c0f6ff78474a0 Mon Sep 17 00:00:00 2001
From: neatchee <neatchee@gmail.com>
Date: Fri, 24 Mar 2023 15:15:25 -0700
Subject: [Glitch] Remove legacy decorators syntax

Port d1b057a0ac41a5756b6a416d2f290b086cb59220 to glitch-soc
---
 app/javascript/flavours/glitch/components/account.jsx        |  3 ++-
 .../glitch/components/admin/ReportReasonSelector.jsx         |  3 ++-
 app/javascript/flavours/glitch/components/column_header.jsx  |  3 ++-
 .../flavours/glitch/components/dismissable_banner.jsx        |  3 ++-
 app/javascript/flavours/glitch/components/domain.jsx         |  3 ++-
 .../flavours/glitch/components/edited_timestamp/index.jsx    |  4 ++--
 app/javascript/flavours/glitch/components/inline_account.jsx |  3 ++-
 app/javascript/flavours/glitch/components/load_gap.jsx       |  3 ++-
 app/javascript/flavours/glitch/components/media_gallery.jsx  |  3 ++-
 .../flavours/glitch/components/navigation_portal.jsx         |  3 ++-
 .../glitch/components/notification_purge_buttons.jsx         |  3 ++-
 .../glitch/components/picture_in_picture_placeholder.jsx     |  3 ++-
 app/javascript/flavours/glitch/components/poll.jsx           |  3 ++-
 .../flavours/glitch/components/relative_timestamp.jsx        |  3 ++-
 .../flavours/glitch/components/scrollable_list.jsx           |  3 ++-
 app/javascript/flavours/glitch/components/server_banner.jsx  |  4 ++--
 app/javascript/flavours/glitch/components/status.jsx         |  3 ++-
 .../flavours/glitch/components/status_action_bar.jsx         |  3 ++-
 app/javascript/flavours/glitch/components/status_content.jsx |  4 ++--
 app/javascript/flavours/glitch/components/status_icons.jsx   |  3 ++-
 .../flavours/glitch/components/status_visibility_icon.jsx    |  3 ++-
 app/javascript/flavours/glitch/features/about/index.jsx      |  4 ++--
 .../glitch/features/account/components/account_note.jsx      |  3 ++-
 .../glitch/features/account/components/action_bar.jsx        |  3 ++-
 .../glitch/features/account/components/featured_tags.jsx     |  3 ++-
 .../flavours/glitch/features/account/components/header.jsx   |  3 ++-
 .../features/account/components/profile_column_header.jsx    |  3 ++-
 .../flavours/glitch/features/account/navigation.jsx          |  3 ++-
 .../flavours/glitch/features/account_gallery/index.jsx       |  3 ++-
 .../account_timeline/components/limited_account_hint.jsx     |  3 ++-
 .../flavours/glitch/features/account_timeline/index.jsx      |  3 ++-
 app/javascript/flavours/glitch/features/audio/index.jsx      |  3 ++-
 app/javascript/flavours/glitch/features/blocks/index.jsx     |  4 ++--
 .../flavours/glitch/features/bookmarked_statuses/index.jsx   |  4 ++--
 .../glitch/features/closed_registrations_modal/index.jsx     |  3 ++-
 .../community_timeline/components/column_settings.jsx        |  3 ++-
 .../flavours/glitch/features/community_timeline/index.jsx    |  4 ++--
 .../glitch/features/compose/components/action_bar.jsx        |  3 ++-
 .../glitch/features/compose/components/compose_form.jsx      |  3 ++-
 .../features/compose/components/emoji_picker_dropdown.jsx    |  8 +++++---
 .../flavours/glitch/features/compose/components/header.jsx   |  3 ++-
 .../glitch/features/compose/components/language_dropdown.jsx |  3 ++-
 .../flavours/glitch/features/compose/components/options.jsx  | 12 +++++++++---
 .../glitch/features/compose/components/poll_form.jsx         |  9 +++++----
 .../glitch/features/compose/components/privacy_dropdown.jsx  |  3 ++-
 .../glitch/features/compose/components/publisher.jsx         |  3 ++-
 .../glitch/features/compose/components/reply_indicator.jsx   |  3 ++-
 .../flavours/glitch/features/compose/components/search.jsx   |  3 ++-
 .../glitch/features/compose/components/search_results.jsx    |  3 ++-
 .../glitch/features/compose/components/textarea_icons.jsx    |  3 ++-
 app/javascript/flavours/glitch/features/compose/index.jsx    |  4 ++--
 .../features/direct_timeline/components/column_settings.jsx  |  3 ++-
 .../features/direct_timeline/components/conversation.jsx     |  3 ++-
 .../flavours/glitch/features/direct_timeline/index.jsx       |  4 ++--
 .../glitch/features/directory/components/account_card.jsx    |  5 ++---
 app/javascript/flavours/glitch/features/directory/index.jsx  |  4 ++--
 .../flavours/glitch/features/domain_blocks/index.jsx         |  4 ++--
 app/javascript/flavours/glitch/features/explore/index.jsx    |  4 ++--
 app/javascript/flavours/glitch/features/explore/links.jsx    |  3 ++-
 app/javascript/flavours/glitch/features/explore/results.jsx  |  4 ++--
 app/javascript/flavours/glitch/features/explore/statuses.jsx |  3 ++-
 .../flavours/glitch/features/explore/suggestions.jsx         |  3 ++-
 app/javascript/flavours/glitch/features/explore/tags.jsx     |  3 ++-
 .../flavours/glitch/features/favourited_statuses/index.jsx   |  4 ++--
 app/javascript/flavours/glitch/features/favourites/index.jsx |  4 ++--
 .../flavours/glitch/features/filters/added_to_filter.jsx     |  3 ++-
 .../flavours/glitch/features/filters/select_filter.jsx       |  4 ++--
 .../features/follow_recommendations/components/account.jsx   |  4 ++--
 .../glitch/features/follow_recommendations/index.jsx         |  3 ++-
 .../follow_requests/components/account_authorize.jsx         |  3 ++-
 .../flavours/glitch/features/follow_requests/index.jsx       |  4 ++--
 .../flavours/glitch/features/followed_tags/index.jsx         |  4 ++--
 app/javascript/flavours/glitch/features/followers/index.jsx  |  3 ++-
 app/javascript/flavours/glitch/features/following/index.jsx  |  3 ++-
 .../features/getting_started/components/announcements.jsx    |  3 ++-
 .../flavours/glitch/features/getting_started/index.jsx       |  4 ++--
 .../flavours/glitch/features/getting_started_misc/index.jsx  |  6 +++---
 .../features/hashtag_timeline/components/column_settings.jsx |  3 ++-
 .../flavours/glitch/features/hashtag_timeline/index.jsx      |  4 ++--
 .../features/home_timeline/components/column_settings.jsx    |  3 ++-
 .../flavours/glitch/features/home_timeline/index.jsx         |  4 ++--
 .../flavours/glitch/features/interaction_modal/index.jsx     |  3 ++-
 .../flavours/glitch/features/keyboard_shortcuts/index.jsx    |  4 ++--
 .../glitch/features/list_adder/components/account.jsx        |  4 ++--
 .../flavours/glitch/features/list_adder/components/list.jsx  |  6 +++---
 app/javascript/flavours/glitch/features/list_adder/index.jsx |  4 ++--
 .../features/list_editor/components/edit_list_form.jsx       |  4 ++--
 .../flavours/glitch/features/list_editor/index.jsx           |  4 ++--
 .../flavours/glitch/features/list_timeline/index.jsx         |  4 ++--
 .../glitch/features/lists/components/new_list_form.jsx       |  4 ++--
 app/javascript/flavours/glitch/features/lists/index.jsx      |  4 ++--
 .../glitch/features/local_settings/navigation/index.jsx      |  3 ++-
 .../flavours/glitch/features/local_settings/page/index.jsx   |  3 ++-
 app/javascript/flavours/glitch/features/mutes/index.jsx      |  4 ++--
 .../glitch/features/notifications/components/filter_bar.jsx  |  3 ++-
 .../features/notifications/components/follow_request.jsx     |  3 ++-
 .../components/notifications_permission_banner.jsx           |  4 ++--
 .../glitch/features/notifications/components/overlay.jsx     |  3 ++-
 .../glitch/features/notifications/components/report.jsx      |  3 ++-
 .../flavours/glitch/features/notifications/index.jsx         |  4 ++--
 .../glitch/features/picture_in_picture/components/footer.jsx |  4 ++--
 .../glitch/features/picture_in_picture/components/header.jsx |  4 ++--
 .../flavours/glitch/features/picture_in_picture/index.jsx    |  3 ++-
 .../glitch/features/pinned_accounts_editor/index.jsx         |  4 ++--
 .../flavours/glitch/features/pinned_statuses/index.jsx       |  4 ++--
 .../flavours/glitch/features/privacy_policy/index.jsx        |  3 ++-
 .../features/public_timeline/components/column_settings.jsx  |  3 ++-
 .../flavours/glitch/features/public_timeline/index.jsx       |  4 ++--
 app/javascript/flavours/glitch/features/reblogs/index.jsx    |  4 ++--
 app/javascript/flavours/glitch/features/report/category.jsx  |  4 ++--
 app/javascript/flavours/glitch/features/report/comment.jsx   |  3 ++-
 app/javascript/flavours/glitch/features/report/rules.jsx     |  3 ++-
 app/javascript/flavours/glitch/features/report/statuses.jsx  |  3 ++-
 app/javascript/flavours/glitch/features/report/thanks.jsx    |  3 ++-
 .../glitch/features/status/components/action_bar.jsx         |  3 ++-
 .../glitch/features/status/components/detailed_status.jsx    |  3 ++-
 app/javascript/flavours/glitch/features/status/index.jsx     |  4 ++--
 .../glitch/features/subscribed_languages_modal/index.jsx     |  4 ++--
 .../flavours/glitch/features/ui/components/audio_modal.jsx   |  3 ++-
 .../flavours/glitch/features/ui/components/block_modal.jsx   |  4 ++--
 .../flavours/glitch/features/ui/components/boost_modal.jsx   |  4 ++--
 .../glitch/features/ui/components/bundle_column_error.jsx    |  3 ++-
 .../glitch/features/ui/components/compare_history_modal.jsx  |  3 ++-
 .../flavours/glitch/features/ui/components/compose_panel.jsx |  3 ++-
 .../glitch/features/ui/components/confirmation_modal.jsx     |  3 ++-
 .../features/ui/components/deprecated_settings_modal.jsx     |  3 ++-
 .../features/ui/components/disabled_account_banner.jsx       |  4 ++--
 .../flavours/glitch/features/ui/components/doodle_modal.jsx  |  3 ++-
 .../flavours/glitch/features/ui/components/embed_modal.jsx   |  3 ++-
 .../glitch/features/ui/components/favourite_modal.jsx        |  3 ++-
 .../flavours/glitch/features/ui/components/filter_modal.jsx  |  4 ++--
 .../glitch/features/ui/components/focal_point_modal.jsx      |  6 ++++--
 .../features/ui/components/follow_requests_column_link.jsx   |  4 ++--
 .../flavours/glitch/features/ui/components/header.jsx        |  4 ++--
 .../flavours/glitch/features/ui/components/image_modal.jsx   |  3 ++-
 .../flavours/glitch/features/ui/components/link_footer.jsx   |  4 ++--
 .../flavours/glitch/features/ui/components/list_panel.jsx    |  4 ++--
 .../flavours/glitch/features/ui/components/media_modal.jsx   |  4 ++--
 .../flavours/glitch/features/ui/components/mute_modal.jsx    |  4 ++--
 .../glitch/features/ui/components/navigation_panel.jsx       |  3 ++-
 .../glitch/features/ui/components/onboarding_modal.jsx       |  4 ++--
 .../flavours/glitch/features/ui/components/report_modal.jsx  |  4 ++--
 .../flavours/glitch/features/ui/components/video_modal.jsx   |  3 ++-
 .../glitch/features/ui/components/zoomable_image.jsx         |  3 ++-
 app/javascript/flavours/glitch/features/ui/index.jsx         |  5 ++---
 app/javascript/flavours/glitch/features/video/index.jsx      |  3 ++-
 146 files changed, 309 insertions(+), 216 deletions(-)

(limited to 'app/javascript/flavours/glitch/features/ui/components/media_modal.jsx')

diff --git a/app/javascript/flavours/glitch/components/account.jsx b/app/javascript/flavours/glitch/components/account.jsx
index 7ce4b65aa..7b66d5a6e 100644
--- a/app/javascript/flavours/glitch/components/account.jsx
+++ b/app/javascript/flavours/glitch/components/account.jsx
@@ -23,7 +23,6 @@ const messages = defineMessages({
   block: { id: 'account.block', defaultMessage: 'Block @{name}' },
 });
 
-export default @injectIntl
 class Account extends ImmutablePureComponent {
 
   static propTypes = {
@@ -184,3 +183,5 @@ class Account extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(Account);
diff --git a/app/javascript/flavours/glitch/components/admin/ReportReasonSelector.jsx b/app/javascript/flavours/glitch/components/admin/ReportReasonSelector.jsx
index 771dbb452..8478ba366 100644
--- a/app/javascript/flavours/glitch/components/admin/ReportReasonSelector.jsx
+++ b/app/javascript/flavours/glitch/components/admin/ReportReasonSelector.jsx
@@ -84,7 +84,6 @@ class Rule extends React.PureComponent {
 
 }
 
-export default @injectIntl
 class ReportReasonSelector extends React.PureComponent {
 
   static propTypes = {
@@ -157,3 +156,5 @@ class ReportReasonSelector extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(ReportReasonSelector);
diff --git a/app/javascript/flavours/glitch/components/column_header.jsx b/app/javascript/flavours/glitch/components/column_header.jsx
index 3790960dd..6fbe2955d 100644
--- a/app/javascript/flavours/glitch/components/column_header.jsx
+++ b/app/javascript/flavours/glitch/components/column_header.jsx
@@ -12,7 +12,6 @@ const messages = defineMessages({
   moveRight: { id: 'column_header.moveRight_settings', defaultMessage: 'Move column to the right' },
 });
 
-export default @injectIntl
 class ColumnHeader extends React.PureComponent {
 
   static contextTypes = {
@@ -218,3 +217,5 @@ class ColumnHeader extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(ColumnHeader);
diff --git a/app/javascript/flavours/glitch/components/dismissable_banner.jsx b/app/javascript/flavours/glitch/components/dismissable_banner.jsx
index c4968ac3c..9b3faf6f2 100644
--- a/app/javascript/flavours/glitch/components/dismissable_banner.jsx
+++ b/app/javascript/flavours/glitch/components/dismissable_banner.jsx
@@ -8,7 +8,6 @@ const messages = defineMessages({
   dismiss: { id: 'dismissable_banner.dismiss', defaultMessage: 'Dismiss' },
 });
 
-export default @injectIntl
 class DismissableBanner extends React.PureComponent {
 
   static propTypes = {
@@ -49,3 +48,5 @@ class DismissableBanner extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(DismissableBanner);
diff --git a/app/javascript/flavours/glitch/components/domain.jsx b/app/javascript/flavours/glitch/components/domain.jsx
index e09fa4591..85ebdbde9 100644
--- a/app/javascript/flavours/glitch/components/domain.jsx
+++ b/app/javascript/flavours/glitch/components/domain.jsx
@@ -8,7 +8,6 @@ const messages = defineMessages({
   unblockDomain: { id: 'account.unblock_domain', defaultMessage: 'Unblock domain {domain}' },
 });
 
-export default @injectIntl
 class Account extends ImmutablePureComponent {
 
   static propTypes = {
@@ -40,3 +39,5 @@ class Account extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(Account);
diff --git a/app/javascript/flavours/glitch/components/edited_timestamp/index.jsx b/app/javascript/flavours/glitch/components/edited_timestamp/index.jsx
index c973bda58..6d73fa68c 100644
--- a/app/javascript/flavours/glitch/components/edited_timestamp/index.jsx
+++ b/app/javascript/flavours/glitch/components/edited_timestamp/index.jsx
@@ -16,8 +16,6 @@ const mapDispatchToProps = (dispatch, { statusId }) => ({
 
 });
 
-export default @connect(null, mapDispatchToProps)
-@injectIntl
 class EditedTimestamp extends React.PureComponent {
 
   static propTypes = {
@@ -68,3 +66,5 @@ class EditedTimestamp extends React.PureComponent {
   }
 
 }
+
+export default connect(null, mapDispatchToProps)(injectIntl(EditedTimestamp));
diff --git a/app/javascript/flavours/glitch/components/inline_account.jsx b/app/javascript/flavours/glitch/components/inline_account.jsx
index 2ef1f52cc..c04618d66 100644
--- a/app/javascript/flavours/glitch/components/inline_account.jsx
+++ b/app/javascript/flavours/glitch/components/inline_account.jsx
@@ -14,7 +14,6 @@ const makeMapStateToProps = () => {
   return mapStateToProps;
 };
 
-export default @connect(makeMapStateToProps)
 class InlineAccount extends React.PureComponent {
 
   static propTypes = {
@@ -32,3 +31,5 @@ class InlineAccount extends React.PureComponent {
   }
 
 }
+
+export default connect(makeMapStateToProps)(InlineAccount);
diff --git a/app/javascript/flavours/glitch/components/load_gap.jsx b/app/javascript/flavours/glitch/components/load_gap.jsx
index 6ed9a38c6..e70365d9e 100644
--- a/app/javascript/flavours/glitch/components/load_gap.jsx
+++ b/app/javascript/flavours/glitch/components/load_gap.jsx
@@ -7,7 +7,6 @@ const messages = defineMessages({
   load_more: { id: 'status.load_more', defaultMessage: 'Load more' },
 });
 
-export default @injectIntl
 class LoadGap extends React.PureComponent {
 
   static propTypes = {
@@ -32,3 +31,5 @@ class LoadGap extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(LoadGap);
diff --git a/app/javascript/flavours/glitch/components/media_gallery.jsx b/app/javascript/flavours/glitch/components/media_gallery.jsx
index 6ae510d08..b38f732f1 100644
--- a/app/javascript/flavours/glitch/components/media_gallery.jsx
+++ b/app/javascript/flavours/glitch/components/media_gallery.jsx
@@ -244,7 +244,6 @@ class Item extends React.PureComponent {
 
 }
 
-export default @injectIntl
 class MediaGallery extends React.PureComponent {
 
   static propTypes = {
@@ -406,3 +405,5 @@ class MediaGallery extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(MediaGallery);
diff --git a/app/javascript/flavours/glitch/components/navigation_portal.jsx b/app/javascript/flavours/glitch/components/navigation_portal.jsx
index 90afa1da0..9e8494179 100644
--- a/app/javascript/flavours/glitch/components/navigation_portal.jsx
+++ b/app/javascript/flavours/glitch/components/navigation_portal.jsx
@@ -15,7 +15,6 @@ const DefaultNavigation = () => (
   </>
 );
 
-export default @withRouter
 class NavigationPortal extends React.PureComponent {
 
   render () {
@@ -33,3 +32,5 @@ class NavigationPortal extends React.PureComponent {
   }
 
 }
+
+export default withRouter(NavigationPortal);
diff --git a/app/javascript/flavours/glitch/components/notification_purge_buttons.jsx b/app/javascript/flavours/glitch/components/notification_purge_buttons.jsx
index 3c7d67109..1d807bc23 100644
--- a/app/javascript/flavours/glitch/components/notification_purge_buttons.jsx
+++ b/app/javascript/flavours/glitch/components/notification_purge_buttons.jsx
@@ -19,7 +19,6 @@ const messages = defineMessages({
   btnApply : { id: 'notification_purge.btn_apply', defaultMessage: 'Clear\nselected' },
 });
 
-export default @injectIntl
 class NotificationPurgeButtons extends ImmutablePureComponent {
 
   static propTypes = {
@@ -57,3 +56,5 @@ class NotificationPurgeButtons extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(NotificationPurgeButtons);
diff --git a/app/javascript/flavours/glitch/components/picture_in_picture_placeholder.jsx b/app/javascript/flavours/glitch/components/picture_in_picture_placeholder.jsx
index 8bfdf343c..961d3dead 100644
--- a/app/javascript/flavours/glitch/components/picture_in_picture_placeholder.jsx
+++ b/app/javascript/flavours/glitch/components/picture_in_picture_placeholder.jsx
@@ -6,7 +6,6 @@ import { connect } from 'react-redux';
 import { debounce } from 'lodash';
 import { FormattedMessage } from 'react-intl';
 
-export default @connect()
 class PictureInPicturePlaceholder extends React.PureComponent {
 
   static propTypes = {
@@ -67,3 +66,5 @@ class PictureInPicturePlaceholder extends React.PureComponent {
   }
 
 }
+
+export default connect()(PictureInPicturePlaceholder);
diff --git a/app/javascript/flavours/glitch/components/poll.jsx b/app/javascript/flavours/glitch/components/poll.jsx
index 8b799309b..2ccc1761e 100644
--- a/app/javascript/flavours/glitch/components/poll.jsx
+++ b/app/javascript/flavours/glitch/components/poll.jsx
@@ -31,7 +31,6 @@ const makeEmojiMap = record => record.get('emojis').reduce((obj, emoji) => {
   return obj;
 }, {});
 
-export default @injectIntl
 class Poll extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -234,3 +233,5 @@ class Poll extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(Poll);
diff --git a/app/javascript/flavours/glitch/components/relative_timestamp.jsx b/app/javascript/flavours/glitch/components/relative_timestamp.jsx
index 512480339..e6c3e0880 100644
--- a/app/javascript/flavours/glitch/components/relative_timestamp.jsx
+++ b/app/javascript/flavours/glitch/components/relative_timestamp.jsx
@@ -121,7 +121,6 @@ const timeRemainingString = (intl, date, now, timeGiven = true) => {
   return relativeTime;
 };
 
-export default @injectIntl
 class RelativeTimestamp extends React.Component {
 
   static propTypes = {
@@ -197,3 +196,5 @@ class RelativeTimestamp extends React.Component {
   }
 
 }
+
+export default injectIntl(RelativeTimestamp);
diff --git a/app/javascript/flavours/glitch/components/scrollable_list.jsx b/app/javascript/flavours/glitch/components/scrollable_list.jsx
index ae1ba3037..fc7dc989d 100644
--- a/app/javascript/flavours/glitch/components/scrollable_list.jsx
+++ b/app/javascript/flavours/glitch/components/scrollable_list.jsx
@@ -20,7 +20,6 @@ const mapStateToProps = (state, { scrollKey }) => {
   };
 };
 
-export default @connect(mapStateToProps, null, null, { forwardRef: true })
 class ScrollableList extends PureComponent {
 
   static contextTypes = {
@@ -352,3 +351,5 @@ class ScrollableList extends PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, null, null, { forwardRef: true })(ScrollableList);
diff --git a/app/javascript/flavours/glitch/components/server_banner.jsx b/app/javascript/flavours/glitch/components/server_banner.jsx
index 36e0ff238..ba84064a8 100644
--- a/app/javascript/flavours/glitch/components/server_banner.jsx
+++ b/app/javascript/flavours/glitch/components/server_banner.jsx
@@ -18,8 +18,6 @@ const mapStateToProps = state => ({
   server: state.getIn(['server', 'server']),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class ServerBanner extends React.PureComponent {
 
   static propTypes = {
@@ -91,3 +89,5 @@ class ServerBanner extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(ServerBanner));
diff --git a/app/javascript/flavours/glitch/components/status.jsx b/app/javascript/flavours/glitch/components/status.jsx
index 2f919176c..fa90c98d0 100644
--- a/app/javascript/flavours/glitch/components/status.jsx
+++ b/app/javascript/flavours/glitch/components/status.jsx
@@ -56,7 +56,6 @@ export const defaultMediaVisibility = (status, settings) => {
   return (displayMedia !== 'hide_all' && !status.get('sensitive') || displayMedia === 'show_all');
 };
 
-export default @injectIntl
 class Status extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -830,3 +829,5 @@ class Status extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(Status);
diff --git a/app/javascript/flavours/glitch/components/status_action_bar.jsx b/app/javascript/flavours/glitch/components/status_action_bar.jsx
index 02c5442b5..091d0b24b 100644
--- a/app/javascript/flavours/glitch/components/status_action_bar.jsx
+++ b/app/javascript/flavours/glitch/components/status_action_bar.jsx
@@ -46,7 +46,6 @@ const messages = defineMessages({
   openOriginalPage: { id: 'account.open_original_page', defaultMessage: 'Open original page' },
 });
 
-export default @injectIntl
 class StatusActionBar extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -339,3 +338,5 @@ class StatusActionBar extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(StatusActionBar);
diff --git a/app/javascript/flavours/glitch/components/status_content.jsx b/app/javascript/flavours/glitch/components/status_content.jsx
index 6e1cc275e..34742c81b 100644
--- a/app/javascript/flavours/glitch/components/status_content.jsx
+++ b/app/javascript/flavours/glitch/components/status_content.jsx
@@ -104,8 +104,6 @@ const mapStateToProps = state => ({
   languages: state.getIn(['server', 'translationLanguages', 'items']),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class StatusContent extends React.PureComponent {
 
   static contextTypes = {
@@ -468,3 +466,5 @@ class StatusContent extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(StatusContent));
diff --git a/app/javascript/flavours/glitch/components/status_icons.jsx b/app/javascript/flavours/glitch/components/status_icons.jsx
index c4cb42741..3baff2206 100644
--- a/app/javascript/flavours/glitch/components/status_icons.jsx
+++ b/app/javascript/flavours/glitch/components/status_icons.jsx
@@ -40,7 +40,6 @@ LanguageIcon.propTypes = {
   language: PropTypes.string.isRequired,
 };
 
-export default @injectIntl
 class StatusIcons extends React.PureComponent {
 
   static propTypes = {
@@ -143,3 +142,5 @@ class StatusIcons extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(StatusIcons);
diff --git a/app/javascript/flavours/glitch/components/status_visibility_icon.jsx b/app/javascript/flavours/glitch/components/status_visibility_icon.jsx
index 07d56c7a8..fcedfbfd6 100644
--- a/app/javascript/flavours/glitch/components/status_visibility_icon.jsx
+++ b/app/javascript/flavours/glitch/components/status_visibility_icon.jsx
@@ -12,7 +12,6 @@ const messages = defineMessages({
   direct: { id: 'privacy.direct.short', defaultMessage: 'Mentioned people only' },
 });
 
-export default @injectIntl
 class VisibilityIcon extends ImmutablePureComponent {
 
   static propTypes = {
@@ -49,3 +48,5 @@ class VisibilityIcon extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(VisibilityIcon);
diff --git a/app/javascript/flavours/glitch/features/about/index.jsx b/app/javascript/flavours/glitch/features/about/index.jsx
index 1e0a8666a..f366f734d 100644
--- a/app/javascript/flavours/glitch/features/about/index.jsx
+++ b/app/javascript/flavours/glitch/features/about/index.jsx
@@ -80,8 +80,6 @@ class Section extends React.PureComponent {
 
 }
 
-export default @connect(mapStateToProps)
-@injectIntl
 class About extends React.PureComponent {
 
   static propTypes = {
@@ -218,3 +216,5 @@ class About extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(About));
diff --git a/app/javascript/flavours/glitch/features/account/components/account_note.jsx b/app/javascript/flavours/glitch/features/account/components/account_note.jsx
index b5c0c9205..5adca87d0 100644
--- a/app/javascript/flavours/glitch/features/account/components/account_note.jsx
+++ b/app/javascript/flavours/glitch/features/account/components/account_note.jsx
@@ -10,7 +10,6 @@ const messages = defineMessages({
   placeholder: { id: 'account_note.glitch_placeholder', defaultMessage: 'No comment provided' },
 });
 
-export default @injectIntl
 class Header extends ImmutablePureComponent {
 
   static propTypes = {
@@ -102,3 +101,5 @@ class Header extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(Header);
diff --git a/app/javascript/flavours/glitch/features/account/components/action_bar.jsx b/app/javascript/flavours/glitch/features/account/components/action_bar.jsx
index d53080d4f..e32bc0141 100644
--- a/app/javascript/flavours/glitch/features/account/components/action_bar.jsx
+++ b/app/javascript/flavours/glitch/features/account/components/action_bar.jsx
@@ -8,7 +8,6 @@ import { me, isStaff } from 'flavours/glitch/initial_state';
 import { profileLink, accountAdminLink } from 'flavours/glitch/utils/backend_links';
 import Icon from 'flavours/glitch/components/icon';
 
-export default @injectIntl
 class ActionBar extends React.PureComponent {
 
   static propTypes = {
@@ -83,3 +82,5 @@ class ActionBar extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(ActionBar);
diff --git a/app/javascript/flavours/glitch/features/account/components/featured_tags.jsx b/app/javascript/flavours/glitch/features/account/components/featured_tags.jsx
index d646b08b2..42e0a8d2f 100644
--- a/app/javascript/flavours/glitch/features/account/components/featured_tags.jsx
+++ b/app/javascript/flavours/glitch/features/account/components/featured_tags.jsx
@@ -10,7 +10,6 @@ const messages = defineMessages({
   empty: { id: 'account.featured_tags.last_status_never', defaultMessage: 'No posts' },
 });
 
-export default @injectIntl
 class FeaturedTags extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -51,3 +50,5 @@ class FeaturedTags extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(FeaturedTags);
diff --git a/app/javascript/flavours/glitch/features/account/components/header.jsx b/app/javascript/flavours/glitch/features/account/components/header.jsx
index c11a472e7..6f918abcf 100644
--- a/app/javascript/flavours/glitch/features/account/components/header.jsx
+++ b/app/javascript/flavours/glitch/features/account/components/header.jsx
@@ -76,7 +76,6 @@ const dateFormatOptions = {
   minute: '2-digit',
 };
 
-export default @injectIntl
 class Header extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -403,3 +402,5 @@ class Header extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(Header);
diff --git a/app/javascript/flavours/glitch/features/account/components/profile_column_header.jsx b/app/javascript/flavours/glitch/features/account/components/profile_column_header.jsx
index 17c08e375..62a459fff 100644
--- a/app/javascript/flavours/glitch/features/account/components/profile_column_header.jsx
+++ b/app/javascript/flavours/glitch/features/account/components/profile_column_header.jsx
@@ -7,7 +7,6 @@ const messages = defineMessages({
   profile: { id: 'column_header.profile', defaultMessage: 'Profile' },
 });
 
-export default @injectIntl
 class ProfileColumnHeader extends React.PureComponent {
 
   static propTypes = {
@@ -31,3 +30,5 @@ class ProfileColumnHeader extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(ProfileColumnHeader);
diff --git a/app/javascript/flavours/glitch/features/account/navigation.jsx b/app/javascript/flavours/glitch/features/account/navigation.jsx
index edae38ce5..b8b8e54de 100644
--- a/app/javascript/flavours/glitch/features/account/navigation.jsx
+++ b/app/javascript/flavours/glitch/features/account/navigation.jsx
@@ -19,7 +19,6 @@ const mapStateToProps = (state, { match: { params: { acct } } }) => {
   };
 };
 
-export default @connect(mapStateToProps)
 class AccountNavigation extends React.PureComponent {
 
   static propTypes = {
@@ -50,3 +49,5 @@ class AccountNavigation extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(AccountNavigation);
diff --git a/app/javascript/flavours/glitch/features/account_gallery/index.jsx b/app/javascript/flavours/glitch/features/account_gallery/index.jsx
index afd6e5161..6914bcba7 100644
--- a/app/javascript/flavours/glitch/features/account_gallery/index.jsx
+++ b/app/javascript/flavours/glitch/features/account_gallery/index.jsx
@@ -58,7 +58,6 @@ class LoadMoreMedia extends ImmutablePureComponent {
 
 }
 
-export default @connect(mapStateToProps)
 class AccountGallery extends ImmutablePureComponent {
 
   static propTypes = {
@@ -223,3 +222,5 @@ class AccountGallery extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(AccountGallery);
diff --git a/app/javascript/flavours/glitch/features/account_timeline/components/limited_account_hint.jsx b/app/javascript/flavours/glitch/features/account_timeline/components/limited_account_hint.jsx
index dc2b3e3e6..c622b7607 100644
--- a/app/javascript/flavours/glitch/features/account_timeline/components/limited_account_hint.jsx
+++ b/app/javascript/flavours/glitch/features/account_timeline/components/limited_account_hint.jsx
@@ -14,7 +14,6 @@ const mapDispatchToProps = (dispatch, { accountId }) => ({
 
 });
 
-export default @connect(() => {}, mapDispatchToProps)
 class LimitedAccountHint extends React.PureComponent {
 
   static propTypes = {
@@ -34,3 +33,5 @@ class LimitedAccountHint extends React.PureComponent {
   }
 
 }
+
+export default connect(() => {}, mapDispatchToProps)(LimitedAccountHint);
diff --git a/app/javascript/flavours/glitch/features/account_timeline/index.jsx b/app/javascript/flavours/glitch/features/account_timeline/index.jsx
index 9151c1990..38361b1ca 100644
--- a/app/javascript/flavours/glitch/features/account_timeline/index.jsx
+++ b/app/javascript/flavours/glitch/features/account_timeline/index.jsx
@@ -62,7 +62,6 @@ RemoteHint.propTypes = {
   url: PropTypes.string.isRequired,
 };
 
-export default @connect(mapStateToProps)
 class AccountTimeline extends ImmutablePureComponent {
 
   static propTypes = {
@@ -207,3 +206,5 @@ class AccountTimeline extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(AccountTimeline);
diff --git a/app/javascript/flavours/glitch/features/audio/index.jsx b/app/javascript/flavours/glitch/features/audio/index.jsx
index 05c3beef9..fd7229cc5 100644
--- a/app/javascript/flavours/glitch/features/audio/index.jsx
+++ b/app/javascript/flavours/glitch/features/audio/index.jsx
@@ -22,7 +22,6 @@ const messages = defineMessages({
 const TICK_SIZE = 10;
 const PADDING   = 180;
 
-export default @injectIntl
 class Audio extends React.PureComponent {
 
   static propTypes = {
@@ -575,3 +574,5 @@ class Audio extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(Audio);
diff --git a/app/javascript/flavours/glitch/features/blocks/index.jsx b/app/javascript/flavours/glitch/features/blocks/index.jsx
index 4461bd14d..461dac2ec 100644
--- a/app/javascript/flavours/glitch/features/blocks/index.jsx
+++ b/app/javascript/flavours/glitch/features/blocks/index.jsx
@@ -22,8 +22,6 @@ const mapStateToProps = state => ({
   isLoading: state.getIn(['user_lists', 'blocks', 'isLoading'], true),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class Blocks extends ImmutablePureComponent {
 
   static propTypes = {
@@ -77,3 +75,5 @@ class Blocks extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(Blocks));
diff --git a/app/javascript/flavours/glitch/features/bookmarked_statuses/index.jsx b/app/javascript/flavours/glitch/features/bookmarked_statuses/index.jsx
index 8e25bc6fd..90d8fd0ef 100644
--- a/app/javascript/flavours/glitch/features/bookmarked_statuses/index.jsx
+++ b/app/javascript/flavours/glitch/features/bookmarked_statuses/index.jsx
@@ -22,8 +22,6 @@ const mapStateToProps = state => ({
   hasMore: !!state.getIn(['status_lists', 'bookmarks', 'next']),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class Bookmarks extends ImmutablePureComponent {
 
   static propTypes = {
@@ -106,3 +104,5 @@ class Bookmarks extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(Bookmarks));
diff --git a/app/javascript/flavours/glitch/features/closed_registrations_modal/index.jsx b/app/javascript/flavours/glitch/features/closed_registrations_modal/index.jsx
index bdaa9885c..1f17ea9cf 100644
--- a/app/javascript/flavours/glitch/features/closed_registrations_modal/index.jsx
+++ b/app/javascript/flavours/glitch/features/closed_registrations_modal/index.jsx
@@ -9,7 +9,6 @@ const mapStateToProps = state => ({
   message: state.getIn(['server', 'server', 'registrations', 'message']),
 });
 
-export default @connect(mapStateToProps)
 class ClosedRegistrationsModal extends ImmutablePureComponent {
 
   componentDidMount () {
@@ -73,3 +72,5 @@ class ClosedRegistrationsModal extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(ClosedRegistrationsModal);
diff --git a/app/javascript/flavours/glitch/features/community_timeline/components/column_settings.jsx b/app/javascript/flavours/glitch/features/community_timeline/components/column_settings.jsx
index 69a4699ac..0ea874e95 100644
--- a/app/javascript/flavours/glitch/features/community_timeline/components/column_settings.jsx
+++ b/app/javascript/flavours/glitch/features/community_timeline/components/column_settings.jsx
@@ -10,7 +10,6 @@ const messages = defineMessages({
   settings: { id: 'home.settings', defaultMessage: 'Column settings' },
 });
 
-export default @injectIntl
 class ColumnSettings extends React.PureComponent {
 
   static propTypes = {
@@ -39,3 +38,5 @@ class ColumnSettings extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(ColumnSettings);
diff --git a/app/javascript/flavours/glitch/features/community_timeline/index.jsx b/app/javascript/flavours/glitch/features/community_timeline/index.jsx
index b9a59fdc7..8f3e10fe9 100644
--- a/app/javascript/flavours/glitch/features/community_timeline/index.jsx
+++ b/app/javascript/flavours/glitch/features/community_timeline/index.jsx
@@ -32,8 +32,6 @@ const mapStateToProps = (state, { columnId }) => {
   };
 };
 
-export default @connect(mapStateToProps)
-@injectIntl
 class CommunityTimeline extends React.PureComponent {
 
   static defaultProps = {
@@ -162,3 +160,5 @@ class CommunityTimeline extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(CommunityTimeline));
diff --git a/app/javascript/flavours/glitch/features/compose/components/action_bar.jsx b/app/javascript/flavours/glitch/features/compose/components/action_bar.jsx
index 1843fdacb..af1f02efc 100644
--- a/app/javascript/flavours/glitch/features/compose/components/action_bar.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/action_bar.jsx
@@ -21,7 +21,6 @@ const messages = defineMessages({
   bookmarks: { id: 'navigation_bar.bookmarks', defaultMessage: 'Bookmarks' },
 });
 
-export default @injectIntl
 class ActionBar extends React.PureComponent {
 
   static propTypes = {
@@ -66,3 +65,5 @@ class ActionBar extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(ActionBar);
diff --git a/app/javascript/flavours/glitch/features/compose/components/compose_form.jsx b/app/javascript/flavours/glitch/features/compose/components/compose_form.jsx
index 696188f31..973a17a1a 100644
--- a/app/javascript/flavours/glitch/features/compose/components/compose_form.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/compose_form.jsx
@@ -32,7 +32,6 @@ const messages = defineMessages({
   spoiler_placeholder: { id: 'compose_form.spoiler_placeholder', defaultMessage: 'Write your warning here' },
 });
 
-export default @injectIntl
 class ComposeForm extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -389,3 +388,5 @@ class ComposeForm extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(ComposeForm);
diff --git a/app/javascript/flavours/glitch/features/compose/components/emoji_picker_dropdown.jsx b/app/javascript/flavours/glitch/features/compose/components/emoji_picker_dropdown.jsx
index 66355e088..1b8991f00 100644
--- a/app/javascript/flavours/glitch/features/compose/components/emoji_picker_dropdown.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/emoji_picker_dropdown.jsx
@@ -145,8 +145,7 @@ class ModifierPicker extends React.PureComponent {
 
 }
 
-@injectIntl
-class EmojiPickerMenu extends React.PureComponent {
+class EmojiPickerMenuImpl extends React.PureComponent {
 
   static propTypes = {
     custom_emojis: ImmutablePropTypes.list,
@@ -307,7 +306,8 @@ class EmojiPickerMenu extends React.PureComponent {
 
 }
 
-export default @injectIntl
+const EmojiPickerMenu = injectIntl(EmojiPickerMenuImpl);
+
 class EmojiPickerDropdown extends React.PureComponent {
 
   static propTypes = {
@@ -411,3 +411,5 @@ class EmojiPickerDropdown extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(EmojiPickerDropdown);
diff --git a/app/javascript/flavours/glitch/features/compose/components/header.jsx b/app/javascript/flavours/glitch/features/compose/components/header.jsx
index dcbdafa57..764fcec5e 100644
--- a/app/javascript/flavours/glitch/features/compose/components/header.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/header.jsx
@@ -45,7 +45,6 @@ const messages = defineMessages({
   },
 });
 
-export default @injectIntl
 class Header extends ImmutablePureComponent {
 
   static propTypes = {
@@ -134,3 +133,5 @@ class Header extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(Header);
diff --git a/app/javascript/flavours/glitch/features/compose/components/language_dropdown.jsx b/app/javascript/flavours/glitch/features/compose/components/language_dropdown.jsx
index 03fb899f8..14f285c3d 100644
--- a/app/javascript/flavours/glitch/features/compose/components/language_dropdown.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/language_dropdown.jsx
@@ -237,7 +237,6 @@ class LanguageDropdownMenu extends React.PureComponent {
 
 }
 
-export default @injectIntl
 class LanguageDropdown extends React.PureComponent {
 
   static propTypes = {
@@ -325,3 +324,5 @@ class LanguageDropdown extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(LanguageDropdown);
diff --git a/app/javascript/flavours/glitch/features/compose/components/options.jsx b/app/javascript/flavours/glitch/features/compose/components/options.jsx
index e09e13bcb..19ead2f21 100644
--- a/app/javascript/flavours/glitch/features/compose/components/options.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/options.jsx
@@ -83,8 +83,11 @@ const messages = defineMessages({
   },
 });
 
-@connect((state, { name }) => ({ checked: state.getIn(['compose', 'advanced_options', name]) }))
-class ToggleOption extends ImmutablePureComponent {
+const mapStateToProps = (state, { name }) => ({
+  checked: state.getIn(['compose', 'advanced_options', name]),
+});
+
+class ToggleOptionImpl extends ImmutablePureComponent {
 
   static propTypes = {
     name: PropTypes.string.isRequired,
@@ -113,7 +116,8 @@ class ToggleOption extends ImmutablePureComponent {
 
 }
 
-export default @injectIntl
+const ToggleOption = connect(mapStateToProps)(ToggleOptionImpl);
+
 class ComposerOptions extends ImmutablePureComponent {
 
   static propTypes = {
@@ -315,3 +319,5 @@ class ComposerOptions extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(ComposerOptions);
diff --git a/app/javascript/flavours/glitch/features/compose/components/poll_form.jsx b/app/javascript/flavours/glitch/features/compose/components/poll_form.jsx
index cb6b577bf..cbd53c4d5 100644
--- a/app/javascript/flavours/glitch/features/compose/components/poll_form.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/poll_form.jsx
@@ -21,8 +21,7 @@ const messages = defineMessages({
   days: { id: 'intervals.full.days', defaultMessage: '{number, plural, one {# day} other {# days}}' },
 });
 
-@injectIntl
-class Option extends React.PureComponent {
+class OptionIntl extends React.PureComponent {
 
   static propTypes = {
     title: PropTypes.string.isRequired,
@@ -92,8 +91,8 @@ class Option extends React.PureComponent {
 
 }
 
-export default
-@injectIntl
+const Option = injectIntl(OptionIntl);
+
 class PollForm extends ImmutablePureComponent {
 
   static propTypes = {
@@ -168,3 +167,5 @@ class PollForm extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(PollForm);
diff --git a/app/javascript/flavours/glitch/features/compose/components/privacy_dropdown.jsx b/app/javascript/flavours/glitch/features/compose/components/privacy_dropdown.jsx
index 02cf72289..4bfbb5b8c 100644
--- a/app/javascript/flavours/glitch/features/compose/components/privacy_dropdown.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/privacy_dropdown.jsx
@@ -16,7 +16,6 @@ const messages = defineMessages({
   change_privacy: { id: 'privacy.change', defaultMessage: 'Adjust status privacy' },
 });
 
-export default @injectIntl
 class PrivacyDropdown extends React.PureComponent {
 
   static propTypes = {
@@ -86,3 +85,5 @@ class PrivacyDropdown extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(PrivacyDropdown);
diff --git a/app/javascript/flavours/glitch/features/compose/components/publisher.jsx b/app/javascript/flavours/glitch/features/compose/components/publisher.jsx
index 59254990b..3128303c6 100644
--- a/app/javascript/flavours/glitch/features/compose/components/publisher.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/publisher.jsx
@@ -26,7 +26,6 @@ const messages = defineMessages({
   saveChanges: { id: 'compose_form.save_changes', defaultMessage: 'Save changes' },
 });
 
-export default @injectIntl
 class Publisher extends ImmutablePureComponent {
 
   static propTypes = {
@@ -97,3 +96,5 @@ class Publisher extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(Publisher);
diff --git a/app/javascript/flavours/glitch/features/compose/components/reply_indicator.jsx b/app/javascript/flavours/glitch/features/compose/components/reply_indicator.jsx
index ca167d114..179d85ac3 100644
--- a/app/javascript/flavours/glitch/features/compose/components/reply_indicator.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/reply_indicator.jsx
@@ -19,7 +19,6 @@ const messages = defineMessages({
 });
 
 
-export default @injectIntl
 class ReplyIndicator extends ImmutablePureComponent {
 
   static propTypes = {
@@ -80,3 +79,5 @@ class ReplyIndicator extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(ReplyIndicator);
diff --git a/app/javascript/flavours/glitch/features/compose/components/search.jsx b/app/javascript/flavours/glitch/features/compose/components/search.jsx
index 6241e2a0a..d2187b8ae 100644
--- a/app/javascript/flavours/glitch/features/compose/components/search.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/search.jsx
@@ -45,7 +45,6 @@ class SearchPopout extends React.PureComponent {
 }
 
 //  The component.
-export default @injectIntl
 class Search extends React.PureComponent {
 
   static contextTypes = {
@@ -166,3 +165,5 @@ class Search extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(Search);
diff --git a/app/javascript/flavours/glitch/features/compose/components/search_results.jsx b/app/javascript/flavours/glitch/features/compose/components/search_results.jsx
index 23ff60936..bf009d13a 100644
--- a/app/javascript/flavours/glitch/features/compose/components/search_results.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/search_results.jsx
@@ -14,7 +14,6 @@ const messages = defineMessages({
   dismissSuggestion: { id: 'suggestions.dismiss', defaultMessage: 'Dismiss suggestion' },
 });
 
-export default @injectIntl
 class SearchResults extends ImmutablePureComponent {
 
   static propTypes = {
@@ -139,3 +138,5 @@ class SearchResults extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(SearchResults);
diff --git a/app/javascript/flavours/glitch/features/compose/components/textarea_icons.jsx b/app/javascript/flavours/glitch/features/compose/components/textarea_icons.jsx
index d8ee5c81b..73281fc74 100644
--- a/app/javascript/flavours/glitch/features/compose/components/textarea_icons.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/textarea_icons.jsx
@@ -27,7 +27,6 @@ const iconMap = [
   ['threaded_mode', 'comments', messages.threadedMode],
 ];
 
-export default @injectIntl
 class TextareaIcons extends ImmutablePureComponent {
 
   static propTypes = {
@@ -58,3 +57,5 @@ class TextareaIcons extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(TextareaIcons);
diff --git a/app/javascript/flavours/glitch/features/compose/index.jsx b/app/javascript/flavours/glitch/features/compose/index.jsx
index 241caa03b..5547a1210 100644
--- a/app/javascript/flavours/glitch/features/compose/index.jsx
+++ b/app/javascript/flavours/glitch/features/compose/index.jsx
@@ -39,8 +39,6 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
   },
 });
 
-export default @connect(mapStateToProps, mapDispatchToProps)
-@injectIntl
 class Compose extends React.PureComponent {
 
   static propTypes = {
@@ -114,3 +112,5 @@ class Compose extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(Compose));
diff --git a/app/javascript/flavours/glitch/features/direct_timeline/components/column_settings.jsx b/app/javascript/flavours/glitch/features/direct_timeline/components/column_settings.jsx
index 18c3c7e21..79e98ec6f 100644
--- a/app/javascript/flavours/glitch/features/direct_timeline/components/column_settings.jsx
+++ b/app/javascript/flavours/glitch/features/direct_timeline/components/column_settings.jsx
@@ -10,7 +10,6 @@ const messages = defineMessages({
   settings: { id: 'home.settings', defaultMessage: 'Column settings' },
 });
 
-export default @injectIntl
 class ColumnSettings extends React.PureComponent {
 
   static propTypes = {
@@ -40,3 +39,5 @@ class ColumnSettings extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(ColumnSettings);
diff --git a/app/javascript/flavours/glitch/features/direct_timeline/components/conversation.jsx b/app/javascript/flavours/glitch/features/direct_timeline/components/conversation.jsx
index ad2a68ebd..05fd68707 100644
--- a/app/javascript/flavours/glitch/features/direct_timeline/components/conversation.jsx
+++ b/app/javascript/flavours/glitch/features/direct_timeline/components/conversation.jsx
@@ -24,7 +24,6 @@ const messages = defineMessages({
   unmuteConversation: { id: 'status.unmute_conversation', defaultMessage: 'Unmute conversation' },
 });
 
-export default @injectIntl
 class Conversation extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -230,3 +229,5 @@ class Conversation extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(Conversation);
diff --git a/app/javascript/flavours/glitch/features/direct_timeline/index.jsx b/app/javascript/flavours/glitch/features/direct_timeline/index.jsx
index afd348988..433574c3e 100644
--- a/app/javascript/flavours/glitch/features/direct_timeline/index.jsx
+++ b/app/javascript/flavours/glitch/features/direct_timeline/index.jsx
@@ -22,8 +22,6 @@ const mapStateToProps = state => ({
   conversationsMode: state.getIn(['settings', 'direct', 'conversations']),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class DirectTimeline extends React.PureComponent {
 
   static propTypes = {
@@ -154,3 +152,5 @@ class DirectTimeline extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(DirectTimeline));
diff --git a/app/javascript/flavours/glitch/features/directory/components/account_card.jsx b/app/javascript/flavours/glitch/features/directory/components/account_card.jsx
index 3fddb5b81..663710b06 100644
--- a/app/javascript/flavours/glitch/features/directory/components/account_card.jsx
+++ b/app/javascript/flavours/glitch/features/directory/components/account_card.jsx
@@ -93,9 +93,6 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
 
 });
 
-export default
-@injectIntl
-@connect(makeMapStateToProps, mapDispatchToProps)
 class AccountCard extends ImmutablePureComponent {
 
   static propTypes = {
@@ -246,3 +243,5 @@ class AccountCard extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(connect(makeMapStateToProps, mapDispatchToProps)(AccountCard));
diff --git a/app/javascript/flavours/glitch/features/directory/index.jsx b/app/javascript/flavours/glitch/features/directory/index.jsx
index 07875b3e1..4278a4e71 100644
--- a/app/javascript/flavours/glitch/features/directory/index.jsx
+++ b/app/javascript/flavours/glitch/features/directory/index.jsx
@@ -29,8 +29,6 @@ const mapStateToProps = state => ({
   domain: state.getIn(['meta', 'domain']),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class Directory extends React.PureComponent {
 
   static contextTypes = {
@@ -176,3 +174,5 @@ class Directory extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(Directory));
diff --git a/app/javascript/flavours/glitch/features/domain_blocks/index.jsx b/app/javascript/flavours/glitch/features/domain_blocks/index.jsx
index cb0b55c63..1ab7c3663 100644
--- a/app/javascript/flavours/glitch/features/domain_blocks/index.jsx
+++ b/app/javascript/flavours/glitch/features/domain_blocks/index.jsx
@@ -23,8 +23,6 @@ const mapStateToProps = state => ({
   hasMore: !!state.getIn(['domain_lists', 'blocks', 'next']),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class Blocks extends ImmutablePureComponent {
 
   static propTypes = {
@@ -81,3 +79,5 @@ class Blocks extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(Blocks));
diff --git a/app/javascript/flavours/glitch/features/explore/index.jsx b/app/javascript/flavours/glitch/features/explore/index.jsx
index 4cbc5294b..4f6730438 100644
--- a/app/javascript/flavours/glitch/features/explore/index.jsx
+++ b/app/javascript/flavours/glitch/features/explore/index.jsx
@@ -24,8 +24,6 @@ const mapStateToProps = state => ({
   isSearching: state.getIn(['search', 'submitted']) || !showTrends,
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class Explore extends React.PureComponent {
 
   static contextTypes = {
@@ -105,3 +103,5 @@ class Explore extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(Explore));
diff --git a/app/javascript/flavours/glitch/features/explore/links.jsx b/app/javascript/flavours/glitch/features/explore/links.jsx
index 092f86b29..425934c4a 100644
--- a/app/javascript/flavours/glitch/features/explore/links.jsx
+++ b/app/javascript/flavours/glitch/features/explore/links.jsx
@@ -13,7 +13,6 @@ const mapStateToProps = state => ({
   isLoading: state.getIn(['trends', 'links', 'isLoading']),
 });
 
-export default @connect(mapStateToProps)
 class Links extends React.PureComponent {
 
   static propTypes = {
@@ -68,3 +67,5 @@ class Links extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(Links);
diff --git a/app/javascript/flavours/glitch/features/explore/results.jsx b/app/javascript/flavours/glitch/features/explore/results.jsx
index 892980d95..0d6c0e8f1 100644
--- a/app/javascript/flavours/glitch/features/explore/results.jsx
+++ b/app/javascript/flavours/glitch/features/explore/results.jsx
@@ -42,8 +42,6 @@ const renderStatuses = (results, onLoadMore) => appendLoadMore('statuses', resul
   <Status key={`status-${item}`} id={item} />
 )), onLoadMore);
 
-export default @connect(mapStateToProps)
-@injectIntl
 class Results extends React.PureComponent {
 
   static propTypes = {
@@ -124,3 +122,5 @@ class Results extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(Results));
diff --git a/app/javascript/flavours/glitch/features/explore/statuses.jsx b/app/javascript/flavours/glitch/features/explore/statuses.jsx
index 21768dd24..381c50c5d 100644
--- a/app/javascript/flavours/glitch/features/explore/statuses.jsx
+++ b/app/javascript/flavours/glitch/features/explore/statuses.jsx
@@ -14,7 +14,6 @@ const mapStateToProps = state => ({
   hasMore: !!state.getIn(['status_lists', 'trending', 'next']),
 });
 
-export default @connect(mapStateToProps)
 class Statuses extends React.PureComponent {
 
   static propTypes = {
@@ -62,3 +61,5 @@ class Statuses extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(Statuses);
diff --git a/app/javascript/flavours/glitch/features/explore/suggestions.jsx b/app/javascript/flavours/glitch/features/explore/suggestions.jsx
index 1c9b99266..e1b84098a 100644
--- a/app/javascript/flavours/glitch/features/explore/suggestions.jsx
+++ b/app/javascript/flavours/glitch/features/explore/suggestions.jsx
@@ -12,7 +12,6 @@ const mapStateToProps = state => ({
   isLoading: state.getIn(['suggestions', 'isLoading']),
 });
 
-export default @connect(mapStateToProps)
 class Suggestions extends React.PureComponent {
 
   static propTypes = {
@@ -54,3 +53,5 @@ class Suggestions extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(Suggestions);
diff --git a/app/javascript/flavours/glitch/features/explore/tags.jsx b/app/javascript/flavours/glitch/features/explore/tags.jsx
index 938036b64..e0fdd1d91 100644
--- a/app/javascript/flavours/glitch/features/explore/tags.jsx
+++ b/app/javascript/flavours/glitch/features/explore/tags.jsx
@@ -13,7 +13,6 @@ const mapStateToProps = state => ({
   isLoadingHashtags: state.getIn(['trends', 'tags', 'isLoading']),
 });
 
-export default @connect(mapStateToProps)
 class Tags extends React.PureComponent {
 
   static propTypes = {
@@ -60,3 +59,5 @@ class Tags extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(Tags);
diff --git a/app/javascript/flavours/glitch/features/favourited_statuses/index.jsx b/app/javascript/flavours/glitch/features/favourited_statuses/index.jsx
index 0667c205b..60d281f97 100644
--- a/app/javascript/flavours/glitch/features/favourited_statuses/index.jsx
+++ b/app/javascript/flavours/glitch/features/favourited_statuses/index.jsx
@@ -22,8 +22,6 @@ const mapStateToProps = state => ({
   hasMore: !!state.getIn(['status_lists', 'favourites', 'next']),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class Favourites extends ImmutablePureComponent {
 
   static propTypes = {
@@ -106,3 +104,5 @@ class Favourites extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(Favourites));
diff --git a/app/javascript/flavours/glitch/features/favourites/index.jsx b/app/javascript/flavours/glitch/features/favourites/index.jsx
index ba58ed43b..21ce7fcc7 100644
--- a/app/javascript/flavours/glitch/features/favourites/index.jsx
+++ b/app/javascript/flavours/glitch/features/favourites/index.jsx
@@ -22,8 +22,6 @@ const mapStateToProps = (state, props) => ({
   accountIds: state.getIn(['user_lists', 'favourited_by', props.params.statusId]),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class Favourites extends ImmutablePureComponent {
 
   static propTypes = {
@@ -101,3 +99,5 @@ class Favourites extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(Favourites));
diff --git a/app/javascript/flavours/glitch/features/filters/added_to_filter.jsx b/app/javascript/flavours/glitch/features/filters/added_to_filter.jsx
index becb170cd..2f3f98c81 100644
--- a/app/javascript/flavours/glitch/features/filters/added_to_filter.jsx
+++ b/app/javascript/flavours/glitch/features/filters/added_to_filter.jsx
@@ -10,7 +10,6 @@ const mapStateToProps = (state, { filterId }) => ({
   filter: state.getIn(['filters', filterId]),
 });
 
-export default @connect(mapStateToProps)
 class AddedToFilter extends React.PureComponent {
 
   static propTypes = {
@@ -100,3 +99,5 @@ class AddedToFilter extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(AddedToFilter);
diff --git a/app/javascript/flavours/glitch/features/filters/select_filter.jsx b/app/javascript/flavours/glitch/features/filters/select_filter.jsx
index 57adb59cc..b3285bc91 100644
--- a/app/javascript/flavours/glitch/features/filters/select_filter.jsx
+++ b/app/javascript/flavours/glitch/features/filters/select_filter.jsx
@@ -22,8 +22,6 @@ const mapStateToProps = (state, { contextType }) => ({
   ]),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class SelectFilter extends React.PureComponent {
 
   static propTypes = {
@@ -190,3 +188,5 @@ class SelectFilter extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(SelectFilter));
diff --git a/app/javascript/flavours/glitch/features/follow_recommendations/components/account.jsx b/app/javascript/flavours/glitch/features/follow_recommendations/components/account.jsx
index 81d39bd49..e56af7364 100644
--- a/app/javascript/flavours/glitch/features/follow_recommendations/components/account.jsx
+++ b/app/javascript/flavours/glitch/features/follow_recommendations/components/account.jsx
@@ -32,8 +32,6 @@ const getFirstSentence = str => {
   return arr[0];
 };
 
-export default @connect(makeMapStateToProps)
-@injectIntl
 class Account extends ImmutablePureComponent {
 
   static propTypes = {
@@ -83,3 +81,5 @@ class Account extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(makeMapStateToProps)(injectIntl(Account));
diff --git a/app/javascript/flavours/glitch/features/follow_recommendations/index.jsx b/app/javascript/flavours/glitch/features/follow_recommendations/index.jsx
index 11396d2a3..70f2191f1 100644
--- a/app/javascript/flavours/glitch/features/follow_recommendations/index.jsx
+++ b/app/javascript/flavours/glitch/features/follow_recommendations/index.jsx
@@ -19,7 +19,6 @@ const mapStateToProps = state => ({
   isLoading: state.getIn(['suggestions', 'isLoading']),
 });
 
-export default @connect(mapStateToProps)
 class FollowRecommendations extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -114,3 +113,5 @@ class FollowRecommendations extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(FollowRecommendations);
diff --git a/app/javascript/flavours/glitch/features/follow_requests/components/account_authorize.jsx b/app/javascript/flavours/glitch/features/follow_requests/components/account_authorize.jsx
index cbe7a1032..af8a534fa 100644
--- a/app/javascript/flavours/glitch/features/follow_requests/components/account_authorize.jsx
+++ b/app/javascript/flavours/glitch/features/follow_requests/components/account_authorize.jsx
@@ -13,7 +13,6 @@ const messages = defineMessages({
   reject: { id: 'follow_request.reject', defaultMessage: 'Reject' },
 });
 
-export default @injectIntl
 class AccountAuthorize extends ImmutablePureComponent {
 
   static propTypes = {
@@ -47,3 +46,5 @@ class AccountAuthorize extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(AccountAuthorize);
diff --git a/app/javascript/flavours/glitch/features/follow_requests/index.jsx b/app/javascript/flavours/glitch/features/follow_requests/index.jsx
index aa60bd7b8..a9a35f54b 100644
--- a/app/javascript/flavours/glitch/features/follow_requests/index.jsx
+++ b/app/javascript/flavours/glitch/features/follow_requests/index.jsx
@@ -25,8 +25,6 @@ const mapStateToProps = state => ({
   domain: state.getIn(['meta', 'domain']),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class FollowRequests extends ImmutablePureComponent {
 
   static propTypes = {
@@ -90,3 +88,5 @@ class FollowRequests extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(FollowRequests));
diff --git a/app/javascript/flavours/glitch/features/followed_tags/index.jsx b/app/javascript/flavours/glitch/features/followed_tags/index.jsx
index 73203636c..a5abb151f 100644
--- a/app/javascript/flavours/glitch/features/followed_tags/index.jsx
+++ b/app/javascript/flavours/glitch/features/followed_tags/index.jsx
@@ -22,8 +22,6 @@ const mapStateToProps = state => ({
   hasMore: !!state.getIn(['followed_tags', 'next']),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class FollowedTags extends ImmutablePureComponent {
 
   static propTypes = {
@@ -87,3 +85,5 @@ class FollowedTags extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(FollowedTags));
diff --git a/app/javascript/flavours/glitch/features/followers/index.jsx b/app/javascript/flavours/glitch/features/followers/index.jsx
index 10fd76865..2565772d1 100644
--- a/app/javascript/flavours/glitch/features/followers/index.jsx
+++ b/app/javascript/flavours/glitch/features/followers/index.jsx
@@ -53,7 +53,6 @@ RemoteHint.propTypes = {
   url: PropTypes.string.isRequired,
 };
 
-export default @connect(mapStateToProps)
 class Followers extends ImmutablePureComponent {
 
   static propTypes = {
@@ -172,3 +171,5 @@ class Followers extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(Followers);
diff --git a/app/javascript/flavours/glitch/features/following/index.jsx b/app/javascript/flavours/glitch/features/following/index.jsx
index 5af4e60b6..2c05e3310 100644
--- a/app/javascript/flavours/glitch/features/following/index.jsx
+++ b/app/javascript/flavours/glitch/features/following/index.jsx
@@ -53,7 +53,6 @@ RemoteHint.propTypes = {
   url: PropTypes.string.isRequired,
 };
 
-export default @connect(mapStateToProps)
 class Following extends ImmutablePureComponent {
 
   static propTypes = {
@@ -172,3 +171,5 @@ class Following extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(Following);
diff --git a/app/javascript/flavours/glitch/features/getting_started/components/announcements.jsx b/app/javascript/flavours/glitch/features/getting_started/components/announcements.jsx
index fb9024447..5c3a27f93 100644
--- a/app/javascript/flavours/glitch/features/getting_started/components/announcements.jsx
+++ b/app/javascript/flavours/glitch/features/getting_started/components/announcements.jsx
@@ -355,7 +355,6 @@ class Announcement extends ImmutablePureComponent {
 
 }
 
-export default @injectIntl
 class Announcements extends ImmutablePureComponent {
 
   static propTypes = {
@@ -447,3 +446,5 @@ class Announcements extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(Announcements);
diff --git a/app/javascript/flavours/glitch/features/getting_started/index.jsx b/app/javascript/flavours/glitch/features/getting_started/index.jsx
index 91b33c1dd..4064a5451 100644
--- a/app/javascript/flavours/glitch/features/getting_started/index.jsx
+++ b/app/javascript/flavours/glitch/features/getting_started/index.jsx
@@ -79,8 +79,6 @@ const badgeDisplay = (number, limit) => {
 
 const NAVIGATION_PANEL_BREAKPOINT = 600 + (285 * 2) + (10 * 2);
 
-export default @connect(makeMapStateToProps, mapDispatchToProps)
- @injectIntl
 class GettingStarted extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -202,3 +200,5 @@ class GettingStarted extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(makeMapStateToProps, mapDispatchToProps)(injectIntl(GettingStarted));
diff --git a/app/javascript/flavours/glitch/features/getting_started_misc/index.jsx b/app/javascript/flavours/glitch/features/getting_started_misc/index.jsx
index f3779280f..fb4ec2fce 100644
--- a/app/javascript/flavours/glitch/features/getting_started_misc/index.jsx
+++ b/app/javascript/flavours/glitch/features/getting_started_misc/index.jsx
@@ -22,9 +22,7 @@ const messages = defineMessages({
   featured_users: { id: 'navigation_bar.featured_users', defaultMessage: 'Featured users' },
 });
 
-export default @connect()
-@injectIntl
-class gettingStartedMisc extends ImmutablePureComponent {
+class GettingStartedMisc extends ImmutablePureComponent {
 
   static contextTypes = {
     router: PropTypes.object.isRequired,
@@ -68,3 +66,5 @@ class gettingStartedMisc extends ImmutablePureComponent {
   }
 
 }
+
+export default connect()(injectIntl(GettingStartedMisc));
diff --git a/app/javascript/flavours/glitch/features/hashtag_timeline/components/column_settings.jsx b/app/javascript/flavours/glitch/features/hashtag_timeline/components/column_settings.jsx
index ac7863ed3..f140f2d01 100644
--- a/app/javascript/flavours/glitch/features/hashtag_timeline/components/column_settings.jsx
+++ b/app/javascript/flavours/glitch/features/hashtag_timeline/components/column_settings.jsx
@@ -12,7 +12,6 @@ const messages = defineMessages({
   noOptions: { id: 'hashtag.column_settings.select.no_options_message', defaultMessage: 'No suggestions found' },
 });
 
-export default @injectIntl
 class ColumnSettings extends React.PureComponent {
 
   static propTypes = {
@@ -131,3 +130,5 @@ class ColumnSettings extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(ColumnSettings);
diff --git a/app/javascript/flavours/glitch/features/hashtag_timeline/index.jsx b/app/javascript/flavours/glitch/features/hashtag_timeline/index.jsx
index 54a67804e..43b7f90d1 100644
--- a/app/javascript/flavours/glitch/features/hashtag_timeline/index.jsx
+++ b/app/javascript/flavours/glitch/features/hashtag_timeline/index.jsx
@@ -26,8 +26,6 @@ const mapStateToProps = (state, props) => ({
   tag: state.getIn(['tags', props.params.id]),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class HashtagTimeline extends React.PureComponent {
 
   disconnects = [];
@@ -235,3 +233,5 @@ class HashtagTimeline extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(HashtagTimeline));
diff --git a/app/javascript/flavours/glitch/features/home_timeline/components/column_settings.jsx b/app/javascript/flavours/glitch/features/home_timeline/components/column_settings.jsx
index df615db65..1eeeaa378 100644
--- a/app/javascript/flavours/glitch/features/home_timeline/components/column_settings.jsx
+++ b/app/javascript/flavours/glitch/features/home_timeline/components/column_settings.jsx
@@ -10,7 +10,6 @@ const messages = defineMessages({
   settings: { id: 'home.settings', defaultMessage: 'Column settings' },
 });
 
-export default @injectIntl
 class ColumnSettings extends React.PureComponent {
 
   static propTypes = {
@@ -48,3 +47,5 @@ class ColumnSettings extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(ColumnSettings);
diff --git a/app/javascript/flavours/glitch/features/home_timeline/index.jsx b/app/javascript/flavours/glitch/features/home_timeline/index.jsx
index b2bfd3f17..71619394b 100644
--- a/app/javascript/flavours/glitch/features/home_timeline/index.jsx
+++ b/app/javascript/flavours/glitch/features/home_timeline/index.jsx
@@ -31,8 +31,6 @@ const mapStateToProps = state => ({
   regex: state.getIn(['settings', 'home', 'regex', 'body']),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class HomeTimeline extends React.PureComponent {
 
   static contextTypes = {
@@ -176,3 +174,5 @@ class HomeTimeline extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(HomeTimeline));
diff --git a/app/javascript/flavours/glitch/features/interaction_modal/index.jsx b/app/javascript/flavours/glitch/features/interaction_modal/index.jsx
index 3a54105a3..20e4959e6 100644
--- a/app/javascript/flavours/glitch/features/interaction_modal/index.jsx
+++ b/app/javascript/flavours/glitch/features/interaction_modal/index.jsx
@@ -74,7 +74,6 @@ class Copypaste extends React.PureComponent {
 
 }
 
-export default @connect(mapStateToProps, mapDispatchToProps)
 class InteractionModal extends React.PureComponent {
 
   static propTypes = {
@@ -159,3 +158,5 @@ class InteractionModal extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(InteractionModal);
diff --git a/app/javascript/flavours/glitch/features/keyboard_shortcuts/index.jsx b/app/javascript/flavours/glitch/features/keyboard_shortcuts/index.jsx
index 2bc0116d4..7160e7efb 100644
--- a/app/javascript/flavours/glitch/features/keyboard_shortcuts/index.jsx
+++ b/app/javascript/flavours/glitch/features/keyboard_shortcuts/index.jsx
@@ -15,8 +15,6 @@ const mapStateToProps = state => ({
   collapseEnabled: state.getIn(['local_settings', 'collapsed', 'enabled']),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class KeyboardShortcuts extends ImmutablePureComponent {
 
   static propTypes = {
@@ -147,3 +145,5 @@ class KeyboardShortcuts extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(KeyboardShortcuts));
diff --git a/app/javascript/flavours/glitch/features/list_adder/components/account.jsx b/app/javascript/flavours/glitch/features/list_adder/components/account.jsx
index 1369aac07..034ed0edc 100644
--- a/app/javascript/flavours/glitch/features/list_adder/components/account.jsx
+++ b/app/javascript/flavours/glitch/features/list_adder/components/account.jsx
@@ -18,8 +18,6 @@ const makeMapStateToProps = () => {
 };
 
 
-export default @connect(makeMapStateToProps)
-@injectIntl
 class Account extends ImmutablePureComponent {
 
   static propTypes = {
@@ -41,3 +39,5 @@ class Account extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(makeMapStateToProps)(injectIntl(Account));
diff --git a/app/javascript/flavours/glitch/features/list_adder/components/list.jsx b/app/javascript/flavours/glitch/features/list_adder/components/list.jsx
index 4666ca47b..1957bbe42 100644
--- a/app/javascript/flavours/glitch/features/list_adder/components/list.jsx
+++ b/app/javascript/flavours/glitch/features/list_adder/components/list.jsx
@@ -13,7 +13,7 @@ const messages = defineMessages({
   add: { id: 'lists.account.add', defaultMessage: 'Add to list' },
 });
 
-const MapStateToProps = (state, { listId, added }) => ({
+const mapStateToProps = (state, { listId, added }) => ({
   list: state.get('lists').get(listId),
   added: typeof added === 'undefined' ? state.getIn(['listAdder', 'lists', 'items']).includes(listId) : added,
 });
@@ -23,8 +23,6 @@ const mapDispatchToProps = (dispatch, { listId }) => ({
   onAdd: () => dispatch(addToListAdder(listId)),
 });
 
-export default @connect(MapStateToProps, mapDispatchToProps)
-@injectIntl
 class List extends ImmutablePureComponent {
 
   static propTypes = {
@@ -67,3 +65,5 @@ class List extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(List));
diff --git a/app/javascript/flavours/glitch/features/list_adder/index.jsx b/app/javascript/flavours/glitch/features/list_adder/index.jsx
index cb8a15e8c..45d5589f9 100644
--- a/app/javascript/flavours/glitch/features/list_adder/index.jsx
+++ b/app/javascript/flavours/glitch/features/list_adder/index.jsx
@@ -28,8 +28,6 @@ const mapDispatchToProps = dispatch => ({
   onReset: () => dispatch(resetListAdder()),
 });
 
-export default @connect(mapStateToProps, mapDispatchToProps)
-@injectIntl
 class ListAdder extends ImmutablePureComponent {
 
   static propTypes = {
@@ -71,3 +69,5 @@ class ListAdder extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(ListAdder));
diff --git a/app/javascript/flavours/glitch/features/list_editor/components/edit_list_form.jsx b/app/javascript/flavours/glitch/features/list_editor/components/edit_list_form.jsx
index 418c2a3e7..b4886ef0e 100644
--- a/app/javascript/flavours/glitch/features/list_editor/components/edit_list_form.jsx
+++ b/app/javascript/flavours/glitch/features/list_editor/components/edit_list_form.jsx
@@ -19,8 +19,6 @@ const mapDispatchToProps = dispatch => ({
   onSubmit: () => dispatch(submitListEditor(false)),
 });
 
-export default @connect(mapStateToProps, mapDispatchToProps)
-@injectIntl
 class ListForm extends React.PureComponent {
 
   static propTypes = {
@@ -68,3 +66,5 @@ class ListForm extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(ListForm));
diff --git a/app/javascript/flavours/glitch/features/list_editor/index.jsx b/app/javascript/flavours/glitch/features/list_editor/index.jsx
index c2ca07053..8b8a0cf31 100644
--- a/app/javascript/flavours/glitch/features/list_editor/index.jsx
+++ b/app/javascript/flavours/glitch/features/list_editor/index.jsx
@@ -22,8 +22,6 @@ const mapDispatchToProps = dispatch => ({
   onReset: () => dispatch(resetListEditor()),
 });
 
-export default @connect(mapStateToProps, mapDispatchToProps)
-@injectIntl
 class ListEditor extends ImmutablePureComponent {
 
   static propTypes = {
@@ -77,3 +75,5 @@ class ListEditor extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(ListEditor));
diff --git a/app/javascript/flavours/glitch/features/list_timeline/index.jsx b/app/javascript/flavours/glitch/features/list_timeline/index.jsx
index 3f1503548..f885a751f 100644
--- a/app/javascript/flavours/glitch/features/list_timeline/index.jsx
+++ b/app/javascript/flavours/glitch/features/list_timeline/index.jsx
@@ -31,8 +31,6 @@ const mapStateToProps = (state, props) => ({
   hasUnread: state.getIn(['timelines', `list:${props.params.id}`, 'unread']) > 0,
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class ListTimeline extends React.PureComponent {
 
   static contextTypes = {
@@ -222,3 +220,5 @@ class ListTimeline extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(ListTimeline));
diff --git a/app/javascript/flavours/glitch/features/lists/components/new_list_form.jsx b/app/javascript/flavours/glitch/features/lists/components/new_list_form.jsx
index e78a6a3bc..be94ff559 100644
--- a/app/javascript/flavours/glitch/features/lists/components/new_list_form.jsx
+++ b/app/javascript/flavours/glitch/features/lists/components/new_list_form.jsx
@@ -20,8 +20,6 @@ const mapDispatchToProps = dispatch => ({
   onSubmit: () => dispatch(submitListEditor(true)),
 });
 
-export default @connect(mapStateToProps, mapDispatchToProps)
-@injectIntl
 class NewListForm extends React.PureComponent {
 
   static propTypes = {
@@ -76,3 +74,5 @@ class NewListForm extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(NewListForm));
diff --git a/app/javascript/flavours/glitch/features/lists/index.jsx b/app/javascript/flavours/glitch/features/lists/index.jsx
index 8773be5e6..dce0dcd8f 100644
--- a/app/javascript/flavours/glitch/features/lists/index.jsx
+++ b/app/javascript/flavours/glitch/features/lists/index.jsx
@@ -32,8 +32,6 @@ const mapStateToProps = state => ({
   lists: getOrderedLists(state),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class Lists extends ImmutablePureComponent {
 
   static propTypes = {
@@ -87,3 +85,5 @@ class Lists extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(Lists));
diff --git a/app/javascript/flavours/glitch/features/local_settings/navigation/index.jsx b/app/javascript/flavours/glitch/features/local_settings/navigation/index.jsx
index cc1f3df6d..fe08e5d7b 100644
--- a/app/javascript/flavours/glitch/features/local_settings/navigation/index.jsx
+++ b/app/javascript/flavours/glitch/features/local_settings/navigation/index.jsx
@@ -19,7 +19,6 @@ const messages = defineMessages({
   close: { id: 'settings.close', defaultMessage: 'Close' },
 });
 
-export default @injectIntl
 class LocalSettingsNavigation extends React.PureComponent {
 
   static propTypes = {
@@ -90,3 +89,5 @@ class LocalSettingsNavigation extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(LocalSettingsNavigation);
diff --git a/app/javascript/flavours/glitch/features/local_settings/page/index.jsx b/app/javascript/flavours/glitch/features/local_settings/page/index.jsx
index a8120663c..83b0c7960 100644
--- a/app/javascript/flavours/glitch/features/local_settings/page/index.jsx
+++ b/app/javascript/flavours/glitch/features/local_settings/page/index.jsx
@@ -31,7 +31,6 @@ const messages = defineMessages({
   pop_in_right: { id: 'settings.pop_in_right', defaultMessage:  'Right' },
 });
 
-export default @injectIntl
 class LocalSettingsPage extends React.PureComponent {
 
   static propTypes = {
@@ -513,3 +512,5 @@ class LocalSettingsPage extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(LocalSettingsPage);
diff --git a/app/javascript/flavours/glitch/features/mutes/index.jsx b/app/javascript/flavours/glitch/features/mutes/index.jsx
index 8da106e47..b699fdb27 100644
--- a/app/javascript/flavours/glitch/features/mutes/index.jsx
+++ b/app/javascript/flavours/glitch/features/mutes/index.jsx
@@ -23,8 +23,6 @@ const mapStateToProps = state => ({
   isLoading: state.getIn(['user_lists', 'mutes', 'isLoading'], true),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class Mutes extends ImmutablePureComponent {
 
   static propTypes = {
@@ -82,3 +80,5 @@ class Mutes extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(Mutes));
diff --git a/app/javascript/flavours/glitch/features/notifications/components/filter_bar.jsx b/app/javascript/flavours/glitch/features/notifications/components/filter_bar.jsx
index c1de0f90e..7f36fb813 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/filter_bar.jsx
+++ b/app/javascript/flavours/glitch/features/notifications/components/filter_bar.jsx
@@ -12,7 +12,6 @@ const tooltips = defineMessages({
   statuses: { id: 'notifications.filter.statuses', defaultMessage: 'Updates from people you follow' },
 });
 
-export default @injectIntl
 class FilterBar extends React.PureComponent {
 
   static propTypes = {
@@ -108,3 +107,5 @@ class FilterBar extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(FilterBar);
diff --git a/app/javascript/flavours/glitch/features/notifications/components/follow_request.jsx b/app/javascript/flavours/glitch/features/notifications/components/follow_request.jsx
index a3fdf8a61..01dec320e 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/follow_request.jsx
+++ b/app/javascript/flavours/glitch/features/notifications/components/follow_request.jsx
@@ -17,7 +17,6 @@ const messages = defineMessages({
   reject: { id: 'follow_request.reject', defaultMessage: 'Reject' },
 });
 
-export default @injectIntl
 class FollowRequest extends ImmutablePureComponent {
 
   static propTypes = {
@@ -130,3 +129,5 @@ class FollowRequest extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(FollowRequest);
diff --git a/app/javascript/flavours/glitch/features/notifications/components/notifications_permission_banner.jsx b/app/javascript/flavours/glitch/features/notifications/components/notifications_permission_banner.jsx
index 7b6ab0c7d..5a12191a5 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/notifications_permission_banner.jsx
+++ b/app/javascript/flavours/glitch/features/notifications/components/notifications_permission_banner.jsx
@@ -12,8 +12,6 @@ const messages = defineMessages({
   close: { id: 'lightbox.close', defaultMessage: 'Close' },
 });
 
-export default @connect()
-@injectIntl
 class NotificationsPermissionBanner extends React.PureComponent {
 
   static propTypes = {
@@ -46,3 +44,5 @@ class NotificationsPermissionBanner extends React.PureComponent {
   }
 
 }
+
+export default connect()(injectIntl(NotificationsPermissionBanner));
diff --git a/app/javascript/flavours/glitch/features/notifications/components/overlay.jsx b/app/javascript/flavours/glitch/features/notifications/components/overlay.jsx
index 21d3f8acf..554a7a668 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/overlay.jsx
+++ b/app/javascript/flavours/glitch/features/notifications/components/overlay.jsx
@@ -15,7 +15,6 @@ const messages = defineMessages({
   markForDeletion: { id: 'notification.markForDeletion', defaultMessage: 'Mark for deletion' },
 });
 
-export default @injectIntl
 class NotificationOverlay extends ImmutablePureComponent {
 
   static propTypes = {
@@ -56,3 +55,5 @@ class NotificationOverlay extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(NotificationOverlay);
diff --git a/app/javascript/flavours/glitch/features/notifications/components/report.jsx b/app/javascript/flavours/glitch/features/notifications/components/report.jsx
index 46a307250..9110735a1 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/report.jsx
+++ b/app/javascript/flavours/glitch/features/notifications/components/report.jsx
@@ -13,7 +13,6 @@ const messages = defineMessages({
   violation: { id: 'report_notification.categories.violation', defaultMessage: 'Rule violation' },
 });
 
-export default @injectIntl
 class Report extends ImmutablePureComponent {
 
   static propTypes = {
@@ -60,3 +59,5 @@ class Report extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(Report);
diff --git a/app/javascript/flavours/glitch/features/notifications/index.jsx b/app/javascript/flavours/glitch/features/notifications/index.jsx
index fff365617..2de073077 100644
--- a/app/javascript/flavours/glitch/features/notifications/index.jsx
+++ b/app/javascript/flavours/glitch/features/notifications/index.jsx
@@ -92,8 +92,6 @@ const mapDispatchToProps = dispatch => ({
   dispatch,
 });
 
-export default @connect(mapStateToProps, mapDispatchToProps)
-@injectIntl
 class Notifications extends React.PureComponent {
 
   static contextTypes = {
@@ -380,3 +378,5 @@ class Notifications extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(Notifications));
diff --git a/app/javascript/flavours/glitch/features/picture_in_picture/components/footer.jsx b/app/javascript/flavours/glitch/features/picture_in_picture/components/footer.jsx
index bc312d530..51fe023d3 100644
--- a/app/javascript/flavours/glitch/features/picture_in_picture/components/footer.jsx
+++ b/app/javascript/flavours/glitch/features/picture_in_picture/components/footer.jsx
@@ -38,8 +38,6 @@ const makeMapStateToProps = () => {
   return mapStateToProps;
 };
 
-export default @connect(makeMapStateToProps)
-@injectIntl
 class Footer extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -215,3 +213,5 @@ class Footer extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(makeMapStateToProps)(injectIntl(Footer));
diff --git a/app/javascript/flavours/glitch/features/picture_in_picture/components/header.jsx b/app/javascript/flavours/glitch/features/picture_in_picture/components/header.jsx
index 26f2da374..b9b90f1d8 100644
--- a/app/javascript/flavours/glitch/features/picture_in_picture/components/header.jsx
+++ b/app/javascript/flavours/glitch/features/picture_in_picture/components/header.jsx
@@ -17,8 +17,6 @@ const mapStateToProps = (state, { accountId }) => ({
   account: state.getIn(['accounts', accountId]),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class Header extends ImmutablePureComponent {
 
   static propTypes = {
@@ -45,3 +43,5 @@ class Header extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(Header));
diff --git a/app/javascript/flavours/glitch/features/picture_in_picture/index.jsx b/app/javascript/flavours/glitch/features/picture_in_picture/index.jsx
index d445b6d58..e6fb64ff9 100644
--- a/app/javascript/flavours/glitch/features/picture_in_picture/index.jsx
+++ b/app/javascript/flavours/glitch/features/picture_in_picture/index.jsx
@@ -13,7 +13,6 @@ const mapStateToProps = state => ({
   left: state.getIn(['local_settings', 'media', 'pop_in_position']) === 'left',
 });
 
-export default @connect(mapStateToProps)
 class PictureInPicture extends React.Component {
 
   static propTypes = {
@@ -86,3 +85,5 @@ class PictureInPicture extends React.Component {
   }
 
 }
+
+export default connect(mapStateToProps)(PictureInPicture);
diff --git a/app/javascript/flavours/glitch/features/pinned_accounts_editor/index.jsx b/app/javascript/flavours/glitch/features/pinned_accounts_editor/index.jsx
index 43ae0ec2f..de3fff8ec 100644
--- a/app/javascript/flavours/glitch/features/pinned_accounts_editor/index.jsx
+++ b/app/javascript/flavours/glitch/features/pinned_accounts_editor/index.jsx
@@ -21,8 +21,6 @@ const mapDispatchToProps = dispatch => ({
   onReset: () => dispatch(resetPinnedAccountsEditor()),
 });
 
-export default @connect(mapStateToProps, mapDispatchToProps)
-@injectIntl
 class PinnedAccountsEditor extends ImmutablePureComponent {
 
   static propTypes = {
@@ -76,3 +74,5 @@ class PinnedAccountsEditor extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(PinnedAccountsEditor));
diff --git a/app/javascript/flavours/glitch/features/pinned_statuses/index.jsx b/app/javascript/flavours/glitch/features/pinned_statuses/index.jsx
index b7bd46fbe..41be2f7f3 100644
--- a/app/javascript/flavours/glitch/features/pinned_statuses/index.jsx
+++ b/app/javascript/flavours/glitch/features/pinned_statuses/index.jsx
@@ -19,8 +19,6 @@ const mapStateToProps = state => ({
   hasMore: !!state.getIn(['status_lists', 'pins', 'next']),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class PinnedStatuses extends ImmutablePureComponent {
 
   static propTypes = {
@@ -63,3 +61,5 @@ class PinnedStatuses extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(PinnedStatuses));
diff --git a/app/javascript/flavours/glitch/features/privacy_policy/index.jsx b/app/javascript/flavours/glitch/features/privacy_policy/index.jsx
index 4618d9e32..a43befa73 100644
--- a/app/javascript/flavours/glitch/features/privacy_policy/index.jsx
+++ b/app/javascript/flavours/glitch/features/privacy_policy/index.jsx
@@ -10,7 +10,6 @@ const messages = defineMessages({
   title: { id: 'privacy_policy.title', defaultMessage: 'Privacy Policy' },
 });
 
-export default @injectIntl
 class PrivacyPolicy extends React.PureComponent {
 
   static propTypes = {
@@ -59,3 +58,5 @@ class PrivacyPolicy extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(PrivacyPolicy);
diff --git a/app/javascript/flavours/glitch/features/public_timeline/components/column_settings.jsx b/app/javascript/flavours/glitch/features/public_timeline/components/column_settings.jsx
index cfe821cfc..a44d5c784 100644
--- a/app/javascript/flavours/glitch/features/public_timeline/components/column_settings.jsx
+++ b/app/javascript/flavours/glitch/features/public_timeline/components/column_settings.jsx
@@ -9,7 +9,6 @@ const messages = defineMessages({
   filter_regex: { id: 'home.column_settings.filter_regex', defaultMessage: 'Filter out by regular expressions' },
 });
 
-export default @injectIntl
 class ColumnSettings extends React.PureComponent {
 
   static propTypes = {
@@ -40,3 +39,5 @@ class ColumnSettings extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(ColumnSettings);
diff --git a/app/javascript/flavours/glitch/features/public_timeline/index.jsx b/app/javascript/flavours/glitch/features/public_timeline/index.jsx
index 810643f97..737e5723f 100644
--- a/app/javascript/flavours/glitch/features/public_timeline/index.jsx
+++ b/app/javascript/flavours/glitch/features/public_timeline/index.jsx
@@ -35,8 +35,6 @@ const mapStateToProps = (state, { columnId }) => {
   };
 };
 
-export default @connect(mapStateToProps)
-@injectIntl
 class PublicTimeline extends React.PureComponent {
 
   static defaultProps = {
@@ -166,3 +164,5 @@ class PublicTimeline extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(PublicTimeline));
diff --git a/app/javascript/flavours/glitch/features/reblogs/index.jsx b/app/javascript/flavours/glitch/features/reblogs/index.jsx
index 46b1ed4e5..34fe24d3f 100644
--- a/app/javascript/flavours/glitch/features/reblogs/index.jsx
+++ b/app/javascript/flavours/glitch/features/reblogs/index.jsx
@@ -22,8 +22,6 @@ const mapStateToProps = (state, props) => ({
   accountIds: state.getIn(['user_lists', 'reblogged_by', props.params.statusId]),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class Reblogs extends ImmutablePureComponent {
 
   static propTypes = {
@@ -102,3 +100,5 @@ class Reblogs extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(Reblogs));
diff --git a/app/javascript/flavours/glitch/features/report/category.jsx b/app/javascript/flavours/glitch/features/report/category.jsx
index 55c43577b..43e311f3d 100644
--- a/app/javascript/flavours/glitch/features/report/category.jsx
+++ b/app/javascript/flavours/glitch/features/report/category.jsx
@@ -24,8 +24,6 @@ const mapStateToProps = state => ({
   rules: state.getIn(['server', 'server', 'rules'], ImmutableList()),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class Category extends React.PureComponent {
 
   static propTypes = {
@@ -102,3 +100,5 @@ class Category extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(Category));
diff --git a/app/javascript/flavours/glitch/features/report/comment.jsx b/app/javascript/flavours/glitch/features/report/comment.jsx
index ec261afcb..afcb7afa4 100644
--- a/app/javascript/flavours/glitch/features/report/comment.jsx
+++ b/app/javascript/flavours/glitch/features/report/comment.jsx
@@ -8,7 +8,6 @@ const messages = defineMessages({
   placeholder: { id: 'report.placeholder', defaultMessage: 'Type or paste additional comments' },
 });
 
-export default @injectIntl
 class Comment extends React.PureComponent {
 
   static propTypes = {
@@ -81,3 +80,5 @@ class Comment extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(Comment);
diff --git a/app/javascript/flavours/glitch/features/report/rules.jsx b/app/javascript/flavours/glitch/features/report/rules.jsx
index efcdf1fcf..72ba75b48 100644
--- a/app/javascript/flavours/glitch/features/report/rules.jsx
+++ b/app/javascript/flavours/glitch/features/report/rules.jsx
@@ -10,7 +10,6 @@ const mapStateToProps = state => ({
   rules: state.getIn(['server', 'server', 'rules']),
 });
 
-export default @connect(mapStateToProps)
 class Rules extends React.PureComponent {
 
   static propTypes = {
@@ -62,3 +61,5 @@ class Rules extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(Rules);
diff --git a/app/javascript/flavours/glitch/features/report/statuses.jsx b/app/javascript/flavours/glitch/features/report/statuses.jsx
index 47d5ee863..a687917ce 100644
--- a/app/javascript/flavours/glitch/features/report/statuses.jsx
+++ b/app/javascript/flavours/glitch/features/report/statuses.jsx
@@ -13,7 +13,6 @@ const mapStateToProps = (state, { accountId }) => ({
   isLoading: state.getIn(['timelines', `account:${accountId}:with_replies`, 'isLoading']),
 });
 
-export default @connect(mapStateToProps)
 class Statuses extends React.PureComponent {
 
   static propTypes = {
@@ -59,3 +58,5 @@ class Statuses extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(Statuses);
diff --git a/app/javascript/flavours/glitch/features/report/thanks.jsx b/app/javascript/flavours/glitch/features/report/thanks.jsx
index 454979f9f..30c88e2f2 100644
--- a/app/javascript/flavours/glitch/features/report/thanks.jsx
+++ b/app/javascript/flavours/glitch/features/report/thanks.jsx
@@ -12,7 +12,6 @@ import {
 
 const mapStateToProps = () => ({});
 
-export default @connect(mapStateToProps)
 class Thanks extends React.PureComponent {
 
   static propTypes = {
@@ -82,3 +81,5 @@ class Thanks extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(Thanks);
diff --git a/app/javascript/flavours/glitch/features/status/components/action_bar.jsx b/app/javascript/flavours/glitch/features/status/components/action_bar.jsx
index 4901fc4cc..d5ab730d6 100644
--- a/app/javascript/flavours/glitch/features/status/components/action_bar.jsx
+++ b/app/javascript/flavours/glitch/features/status/components/action_bar.jsx
@@ -39,7 +39,6 @@ const messages = defineMessages({
   openOriginalPage: { id: 'account.open_original_page', defaultMessage: 'Open original page' },
 });
 
-export default @injectIntl
 class ActionBar extends React.PureComponent {
 
   static contextTypes = {
@@ -228,3 +227,5 @@ class ActionBar extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(ActionBar);
diff --git a/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx b/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx
index a94572855..cfe6c965e 100644
--- a/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx
+++ b/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx
@@ -21,7 +21,6 @@ import AnimatedNumber from 'flavours/glitch/components/animated_number';
 import PictureInPicturePlaceholder from 'flavours/glitch/components/picture_in_picture_placeholder';
 import EditedTimestamp from 'flavours/glitch/components/edited_timestamp';
 
-export default @injectIntl
 class DetailedStatus extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -336,3 +335,5 @@ class DetailedStatus extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(DetailedStatus);
diff --git a/app/javascript/flavours/glitch/features/status/index.jsx b/app/javascript/flavours/glitch/features/status/index.jsx
index cbab90e81..a59da5e10 100644
--- a/app/javascript/flavours/glitch/features/status/index.jsx
+++ b/app/javascript/flavours/glitch/features/status/index.jsx
@@ -171,8 +171,6 @@ const titleFromStatus = status => {
   return `${prefix}: "${truncate(text, 30)}"`;
 };
 
-export default @injectIntl
-@connect(makeMapStateToProps)
 class Status extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -724,3 +722,5 @@ class Status extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(connect(makeMapStateToProps)(Status));
diff --git a/app/javascript/flavours/glitch/features/subscribed_languages_modal/index.jsx b/app/javascript/flavours/glitch/features/subscribed_languages_modal/index.jsx
index 35083503c..85144a191 100644
--- a/app/javascript/flavours/glitch/features/subscribed_languages_modal/index.jsx
+++ b/app/javascript/flavours/glitch/features/subscribed_languages_modal/index.jsx
@@ -36,8 +36,6 @@ const mapDispatchToProps = (dispatch, { accountId }) => ({
 
 });
 
-export default @connect(mapStateToProps, mapDispatchToProps)
-@injectIntl
 class SubscribedLanguagesModal extends ImmutablePureComponent {
 
   static propTypes = {
@@ -123,3 +121,5 @@ class SubscribedLanguagesModal extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(SubscribedLanguagesModal));
diff --git a/app/javascript/flavours/glitch/features/ui/components/audio_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/audio_modal.jsx
index ff7687c1e..0aeabd94c 100644
--- a/app/javascript/flavours/glitch/features/ui/components/audio_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/audio_modal.jsx
@@ -11,7 +11,6 @@ const mapStateToProps = (state, { statusId }) => ({
   accountStaticAvatar: state.getIn(['accounts', state.getIn(['statuses', statusId, 'account']), 'avatar_static']),
 });
 
-export default @connect(mapStateToProps, null, null, { forwardRef: true })
 class AudioModal extends ImmutablePureComponent {
 
   static propTypes = {
@@ -59,3 +58,5 @@ class AudioModal extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, null, null, { forwardRef: true })(AudioModal);
diff --git a/app/javascript/flavours/glitch/features/ui/components/block_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/block_modal.jsx
index 6c9d2043c..a9506aa69 100644
--- a/app/javascript/flavours/glitch/features/ui/components/block_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/block_modal.jsx
@@ -36,8 +36,6 @@ const mapDispatchToProps = dispatch => {
   };
 };
 
-export default @connect(makeMapStateToProps, mapDispatchToProps)
-@injectIntl
 class BlockModal extends React.PureComponent {
 
   static propTypes = {
@@ -101,3 +99,5 @@ class BlockModal extends React.PureComponent {
   }
 
 }
+
+export default connect(makeMapStateToProps, mapDispatchToProps)(injectIntl(BlockModal));
diff --git a/app/javascript/flavours/glitch/features/ui/components/boost_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/boost_modal.jsx
index a65b84e20..d9523a26e 100644
--- a/app/javascript/flavours/glitch/features/ui/components/boost_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/boost_modal.jsx
@@ -35,8 +35,6 @@ const mapDispatchToProps = dispatch => {
   };
 };
 
-export default @connect(mapStateToProps, mapDispatchToProps)
-@injectIntl
 class BoostModal extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -137,3 +135,5 @@ class BoostModal extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(BoostModal));
diff --git a/app/javascript/flavours/glitch/features/ui/components/bundle_column_error.jsx b/app/javascript/flavours/glitch/features/ui/components/bundle_column_error.jsx
index 88304dc36..eaabbc460 100644
--- a/app/javascript/flavours/glitch/features/ui/components/bundle_column_error.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/bundle_column_error.jsx
@@ -92,7 +92,6 @@ class CopyButton extends React.PureComponent {
 
 }
 
-export default @injectIntl
 class BundleColumnError extends React.PureComponent {
 
   static propTypes = {
@@ -160,3 +159,5 @@ class BundleColumnError extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(BundleColumnError);
diff --git a/app/javascript/flavours/glitch/features/ui/components/compare_history_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/compare_history_modal.jsx
index 4e74feb02..cc3a16d17 100644
--- a/app/javascript/flavours/glitch/features/ui/components/compare_history_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/compare_history_modal.jsx
@@ -24,7 +24,6 @@ const mapDispatchToProps = dispatch => ({
 
 });
 
-export default @connect(mapStateToProps, mapDispatchToProps)
 class CompareHistoryModal extends React.PureComponent {
 
   static propTypes = {
@@ -100,3 +99,5 @@ class CompareHistoryModal extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(CompareHistoryModal);
diff --git a/app/javascript/flavours/glitch/features/ui/components/compose_panel.jsx b/app/javascript/flavours/glitch/features/ui/components/compose_panel.jsx
index 34c194c99..1dedf92ca 100644
--- a/app/javascript/flavours/glitch/features/ui/components/compose_panel.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/compose_panel.jsx
@@ -8,7 +8,6 @@ import LinkFooter from './link_footer';
 import ServerBanner from 'flavours/glitch/components/server_banner';
 import { mountCompose, unmountCompose } from 'flavours/glitch/actions/compose';
 
-export default @connect()
 class ComposePanel extends React.PureComponent {
 
   static contextTypes = {
@@ -56,3 +55,5 @@ class ComposePanel extends React.PureComponent {
   }
 
 }
+
+export default connect()(ComposePanel);
diff --git a/app/javascript/flavours/glitch/features/ui/components/confirmation_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/confirmation_modal.jsx
index 94935de5d..08f55c125 100644
--- a/app/javascript/flavours/glitch/features/ui/components/confirmation_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/confirmation_modal.jsx
@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
 import { injectIntl, FormattedMessage } from 'react-intl';
 import Button from 'flavours/glitch/components/button';
 
-export default @injectIntl
 class ConfirmationModal extends React.PureComponent {
 
   static propTypes = {
@@ -86,3 +85,5 @@ class ConfirmationModal extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(ConfirmationModal);
diff --git a/app/javascript/flavours/glitch/features/ui/components/deprecated_settings_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/deprecated_settings_modal.jsx
index 37f52b014..5a1c1ee1b 100644
--- a/app/javascript/flavours/glitch/features/ui/components/deprecated_settings_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/deprecated_settings_modal.jsx
@@ -13,7 +13,6 @@ const messages = defineMessages({
   user_setting_disable_swiping: { id: 'settings.swipe_to_change_columns', defaultMessage: 'Allow swiping to change columns (Mobile only)' },
 });
 
-export default @injectIntl
 class DeprecatedSettingsModal extends React.PureComponent {
 
   static propTypes = {
@@ -84,3 +83,5 @@ class DeprecatedSettingsModal extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(DeprecatedSettingsModal);
diff --git a/app/javascript/flavours/glitch/features/ui/components/disabled_account_banner.jsx b/app/javascript/flavours/glitch/features/ui/components/disabled_account_banner.jsx
index 35933bedb..0ba79d648 100644
--- a/app/javascript/flavours/glitch/features/ui/components/disabled_account_banner.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/disabled_account_banner.jsx
@@ -28,8 +28,6 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
   },
 });
 
-export default @injectIntl
-@connect(mapStateToProps, mapDispatchToProps)
 class DisabledAccountBanner extends React.PureComponent {
 
   static propTypes = {
@@ -90,3 +88,5 @@ class DisabledAccountBanner extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(DisabledAccountBanner));
diff --git a/app/javascript/flavours/glitch/features/ui/components/doodle_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/doodle_modal.jsx
index c8ea33a0e..162957ad8 100644
--- a/app/javascript/flavours/glitch/features/ui/components/doodle_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/doodle_modal.jsx
@@ -145,7 +145,6 @@ const mapDispatchToProps = dispatch => ({
  * - Ctrl + left mouse button: pick background
  * - Right mouse button: pick background
  */
-export default @connect(mapStateToProps, mapDispatchToProps)
 class DoodleModal extends ImmutablePureComponent {
 
   static propTypes = {
@@ -612,3 +611,5 @@ class DoodleModal extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(DoodleModal);
diff --git a/app/javascript/flavours/glitch/features/ui/components/embed_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/embed_modal.jsx
index 92bfa79c4..4f1173fd5 100644
--- a/app/javascript/flavours/glitch/features/ui/components/embed_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/embed_modal.jsx
@@ -9,7 +9,6 @@ const messages = defineMessages({
   close: { id: 'lightbox.close', defaultMessage: 'Close' },
 });
 
-export default @injectIntl
 class EmbedModal extends ImmutablePureComponent {
 
   static propTypes = {
@@ -95,3 +94,5 @@ class EmbedModal extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(EmbedModal);
diff --git a/app/javascript/flavours/glitch/features/ui/components/favourite_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/favourite_modal.jsx
index 78cbfeb51..fa6f11792 100644
--- a/app/javascript/flavours/glitch/features/ui/components/favourite_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/favourite_modal.jsx
@@ -17,7 +17,6 @@ const messages = defineMessages({
   favourite: { id: 'status.favourite', defaultMessage: 'Favourite' },
 });
 
-export default @injectIntl
 class FavouriteModal extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -99,3 +98,5 @@ class FavouriteModal extends ImmutablePureComponent {
   }
 
 }
+
+export default injectIntl(FavouriteModal);
diff --git a/app/javascript/flavours/glitch/features/ui/components/filter_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/filter_modal.jsx
index d2482e733..2d49312e5 100644
--- a/app/javascript/flavours/glitch/features/ui/components/filter_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/filter_modal.jsx
@@ -13,8 +13,6 @@ const messages = defineMessages({
   close: { id: 'lightbox.close', defaultMessage: 'Close' },
 });
 
-export default @connect(undefined)
-@injectIntl
 class FilterModal extends ImmutablePureComponent {
 
   static propTypes = {
@@ -132,3 +130,5 @@ class FilterModal extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(injectIntl(FilterModal));
diff --git a/app/javascript/flavours/glitch/features/ui/components/focal_point_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/focal_point_modal.jsx
index 8e624adb3..a5637d31c 100644
--- a/app/javascript/flavours/glitch/features/ui/components/focal_point_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/focal_point_modal.jsx
@@ -99,8 +99,6 @@ class ImageLoader extends React.PureComponent {
 
 }
 
-export default @connect(mapStateToProps, mapDispatchToProps, null, { forwardRef: true })
-@(component => injectIntl(component, { withRef: true }))
 class FocalPointModal extends ImmutablePureComponent {
 
   static propTypes = {
@@ -416,3 +414,7 @@ class FocalPointModal extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps, null, {
+  forwardRef: true,
+})(injectIntl(FocalPointModal, { withRef: true }));
diff --git a/app/javascript/flavours/glitch/features/ui/components/follow_requests_column_link.jsx b/app/javascript/flavours/glitch/features/ui/components/follow_requests_column_link.jsx
index 301392a52..f3e3b78ed 100644
--- a/app/javascript/flavours/glitch/features/ui/components/follow_requests_column_link.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/follow_requests_column_link.jsx
@@ -15,8 +15,6 @@ const mapStateToProps = state => ({
   count: state.getIn(['user_lists', 'follow_requests', 'items'], ImmutableList()).size,
 });
 
-export default @injectIntl
-@connect(mapStateToProps)
 class FollowRequestsColumnLink extends React.Component {
 
   static propTypes = {
@@ -49,3 +47,5 @@ class FollowRequestsColumnLink extends React.Component {
   }
 
 }
+
+export default injectIntl(connect(mapStateToProps)(FollowRequestsColumnLink));
diff --git a/app/javascript/flavours/glitch/features/ui/components/header.jsx b/app/javascript/flavours/glitch/features/ui/components/header.jsx
index 5aa045fee..f7bab2487 100644
--- a/app/javascript/flavours/glitch/features/ui/components/header.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/header.jsx
@@ -23,8 +23,6 @@ const mapDispatchToProps = (dispatch) => ({
   },
 });
 
-export default @withRouter
-@connect(null, mapDispatchToProps)
 class Header extends React.PureComponent {
 
   static contextTypes = {
@@ -86,3 +84,5 @@ class Header extends React.PureComponent {
   }
 
 }
+
+export default withRouter(connect(null, mapDispatchToProps)(Header));
diff --git a/app/javascript/flavours/glitch/features/ui/components/image_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/image_modal.jsx
index a792b9be7..5198b8809 100644
--- a/app/javascript/flavours/glitch/features/ui/components/image_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/image_modal.jsx
@@ -9,7 +9,6 @@ const messages = defineMessages({
   close: { id: 'lightbox.close', defaultMessage: 'Close' },
 });
 
-export default @injectIntl
 class ImageModal extends React.PureComponent {
 
   static propTypes = {
@@ -57,3 +56,5 @@ class ImageModal extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(ImageModal);
diff --git a/app/javascript/flavours/glitch/features/ui/components/link_footer.jsx b/app/javascript/flavours/glitch/features/ui/components/link_footer.jsx
index 0d1d4040f..e813a72b0 100644
--- a/app/javascript/flavours/glitch/features/ui/components/link_footer.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/link_footer.jsx
@@ -24,8 +24,6 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
   },
 });
 
-export default @injectIntl
-@connect(null, mapDispatchToProps)
 class LinkFooter extends React.PureComponent {
 
   static contextTypes = {
@@ -100,3 +98,5 @@ class LinkFooter extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(connect(null, mapDispatchToProps)(LinkFooter));
diff --git a/app/javascript/flavours/glitch/features/ui/components/list_panel.jsx b/app/javascript/flavours/glitch/features/ui/components/list_panel.jsx
index dff830065..489f3a1b4 100644
--- a/app/javascript/flavours/glitch/features/ui/components/list_panel.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/list_panel.jsx
@@ -20,8 +20,6 @@ const mapStateToProps = state => ({
   lists: getOrderedLists(state),
 });
 
-export default @withRouter
-@connect(mapStateToProps)
 class ListPanel extends ImmutablePureComponent {
 
   static propTypes = {
@@ -53,3 +51,5 @@ class ListPanel extends ImmutablePureComponent {
   }
 
 }
+
+export default withRouter(connect(mapStateToProps)(ListPanel));
diff --git a/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx
index 9c67ed808..a3811e91d 100644
--- a/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx
@@ -25,8 +25,6 @@ const mapStateToProps = (state, { statusId }) => ({
   language: state.getIn(['statuses', statusId, 'language']),
 });
 
-export default @connect(mapStateToProps, null, null, { forwardRef: true })
-@injectIntl
 class MediaModal extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -259,3 +257,5 @@ class MediaModal extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, null, null, { forwardRef: true })(injectIntl(MediaModal));
diff --git a/app/javascript/flavours/glitch/features/ui/components/mute_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/mute_modal.jsx
index f8bb9a364..a74ebfb05 100644
--- a/app/javascript/flavours/glitch/features/ui/components/mute_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/mute_modal.jsx
@@ -43,8 +43,6 @@ const mapDispatchToProps = dispatch => {
   };
 };
 
-export default @connect(mapStateToProps, mapDispatchToProps)
-@injectIntl
 class MuteModal extends React.PureComponent {
 
   static propTypes = {
@@ -138,3 +136,5 @@ class MuteModal extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(MuteModal));
diff --git a/app/javascript/flavours/glitch/features/ui/components/navigation_panel.jsx b/app/javascript/flavours/glitch/features/ui/components/navigation_panel.jsx
index 5a296435f..6e8744ef0 100644
--- a/app/javascript/flavours/glitch/features/ui/components/navigation_panel.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/navigation_panel.jsx
@@ -29,7 +29,6 @@ const messages = defineMessages({
   app_settings: { id: 'navigation_bar.app_settings', defaultMessage: 'App settings' },
 });
 
-export default @injectIntl
 class NavigationPanel extends React.Component {
 
   static contextTypes = {
@@ -102,3 +101,5 @@ class NavigationPanel extends React.Component {
   }
 
 }
+
+export default injectIntl(NavigationPanel);
diff --git a/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.jsx
index d972fe3b5..df84a1571 100644
--- a/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.jsx
@@ -170,8 +170,6 @@ const mapStateToProps = state => ({
   domain: state.getIn(['meta', 'domain']),
 });
 
-export default @connect(mapStateToProps)
-@injectIntl
 class OnboardingModal extends React.PureComponent {
 
   static propTypes = {
@@ -319,3 +317,5 @@ class OnboardingModal extends React.PureComponent {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(OnboardingModal));
diff --git a/app/javascript/flavours/glitch/features/ui/components/report_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/report_modal.jsx
index 4d7f84bae..79b495877 100644
--- a/app/javascript/flavours/glitch/features/ui/components/report_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/report_modal.jsx
@@ -31,8 +31,6 @@ const makeMapStateToProps = () => {
   return mapStateToProps;
 };
 
-export default @connect(makeMapStateToProps)
-@injectIntl
 class ReportModal extends ImmutablePureComponent {
 
   static propTypes = {
@@ -219,3 +217,5 @@ class ReportModal extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(makeMapStateToProps)(injectIntl(ReportModal));
diff --git a/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx
index c1f837717..4cde0ebad 100644
--- a/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx
@@ -11,7 +11,6 @@ const mapStateToProps = (state, { statusId }) => ({
   language: state.getIn(['statuses', statusId, 'language']),
 });
 
-export default @connect(mapStateToProps, null, null, { forwardRef: true })
 class VideoModal extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -72,3 +71,5 @@ class VideoModal extends ImmutablePureComponent {
   }
 
 }
+
+export default connect(mapStateToProps, null, null, { forwardRef: true })(VideoModal);
diff --git a/app/javascript/flavours/glitch/features/ui/components/zoomable_image.jsx b/app/javascript/flavours/glitch/features/ui/components/zoomable_image.jsx
index 82ba6e692..47401cfe4 100644
--- a/app/javascript/flavours/glitch/features/ui/components/zoomable_image.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/zoomable_image.jsx
@@ -91,7 +91,6 @@ const normalizeWheel = event => {
   };
 };
 
-export default @injectIntl
 class ZoomableImage extends React.PureComponent {
 
   static propTypes = {
@@ -451,3 +450,5 @@ class ZoomableImage extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(ZoomableImage);
diff --git a/app/javascript/flavours/glitch/features/ui/index.jsx b/app/javascript/flavours/glitch/features/ui/index.jsx
index 488c1b919..fa35f689d 100644
--- a/app/javascript/flavours/glitch/features/ui/index.jsx
+++ b/app/javascript/flavours/glitch/features/ui/index.jsx
@@ -244,9 +244,6 @@ class SwitchingColumnsArea extends React.PureComponent {
 
 }
 
-export default @connect(mapStateToProps)
-@injectIntl
-@withRouter
 class UI extends React.Component {
 
   static contextTypes = {
@@ -683,3 +680,5 @@ class UI extends React.Component {
   }
 
 }
+
+export default connect(mapStateToProps)(injectIntl(withRouter(UI)));
diff --git a/app/javascript/flavours/glitch/features/video/index.jsx b/app/javascript/flavours/glitch/features/video/index.jsx
index 9ab56b439..80323770c 100644
--- a/app/javascript/flavours/glitch/features/video/index.jsx
+++ b/app/javascript/flavours/glitch/features/video/index.jsx
@@ -93,7 +93,6 @@ export const fileNameFromURL = str => {
   return pathname.slice(index + 1);
 };
 
-export default @injectIntl
 class Video extends React.PureComponent {
 
   static propTypes = {
@@ -673,3 +672,5 @@ class Video extends React.PureComponent {
   }
 
 }
+
+export default injectIntl(Video);
-- 
cgit 


From bfe46d08f97b4b19ab6f86c32be01cce945517d0 Mon Sep 17 00:00:00 2001
From: Nick Schonning <nschonni@gmail.com>
Date: Tue, 4 Apr 2023 10:33:44 -0400
Subject: [Glitch] Ensure tabIndex is number instead of string

Port ec0c104bf25f2689c31bb79f9f447be1a9b3da7f to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
---
 .../flavours/glitch/components/admin/ReportReasonSelector.jsx  |  4 ++--
 .../flavours/glitch/components/autosuggest_input.jsx           |  2 +-
 .../flavours/glitch/components/autosuggest_textarea.jsx        |  2 +-
 .../flavours/glitch/components/column_back_button_slim.jsx     |  2 +-
 app/javascript/flavours/glitch/components/dropdown_menu.jsx    |  2 +-
 app/javascript/flavours/glitch/components/error_boundary.jsx   |  2 +-
 app/javascript/flavours/glitch/components/gifv.jsx             |  4 ++--
 .../glitch/components/intersection_observer_article.jsx        |  2 +-
 .../glitch/components/picture_in_picture_placeholder.jsx       |  2 +-
 app/javascript/flavours/glitch/components/poll.jsx             |  2 +-
 app/javascript/flavours/glitch/components/spoilers.jsx         |  2 +-
 app/javascript/flavours/glitch/components/status.jsx           |  6 +++---
 app/javascript/flavours/glitch/components/status_content.jsx   | 10 +++++-----
 app/javascript/flavours/glitch/features/about/index.jsx        |  2 +-
 .../glitch/features/account/components/account_note.jsx        |  6 +++---
 app/javascript/flavours/glitch/features/audio/index.jsx        |  8 ++++----
 .../glitch/features/compose/components/dropdown_menu.jsx       |  2 +-
 .../glitch/features/compose/components/language_dropdown.jsx   |  2 +-
 .../flavours/glitch/features/compose/components/search.jsx     |  2 +-
 .../flavours/glitch/features/compose/components/upload.jsx     |  2 +-
 .../features/direct_timeline/components/conversation.jsx       |  2 +-
 .../flavours/glitch/features/filters/select_filter.jsx         |  4 ++--
 .../flavours/glitch/features/list_editor/components/search.jsx |  2 +-
 app/javascript/flavours/glitch/features/list_editor/index.jsx  |  2 +-
 .../flavours/glitch/features/list_timeline/index.jsx           |  4 ++--
 .../glitch/features/local_settings/navigation/item/index.jsx   |  2 +-
 .../glitch/features/notifications/components/admin_report.jsx  |  2 +-
 .../glitch/features/notifications/components/admin_signup.jsx  |  2 +-
 .../features/notifications/components/clear_column_button.jsx  |  2 +-
 .../glitch/features/notifications/components/follow.jsx        |  2 +-
 .../features/notifications/components/follow_request.jsx       |  2 +-
 .../notifications/components/grant_permission_button.jsx       |  2 +-
 .../flavours/glitch/features/pinned_accounts_editor/index.jsx  |  2 +-
 .../flavours/glitch/features/report/components/option.jsx      |  2 +-
 app/javascript/flavours/glitch/features/status/index.jsx       |  2 +-
 .../flavours/glitch/features/ui/components/actions_modal.jsx   |  2 +-
 .../flavours/glitch/features/ui/components/column_link.jsx     |  2 +-
 .../flavours/glitch/features/ui/components/media_modal.jsx     |  4 ++--
 .../glitch/features/ui/components/onboarding_modal.jsx         |  2 +-
 app/javascript/flavours/glitch/features/video/index.jsx        |  6 +++---
 40 files changed, 58 insertions(+), 58 deletions(-)

(limited to 'app/javascript/flavours/glitch/features/ui/components/media_modal.jsx')

diff --git a/app/javascript/flavours/glitch/components/admin/ReportReasonSelector.jsx b/app/javascript/flavours/glitch/components/admin/ReportReasonSelector.jsx
index 8478ba366..ecefe7a84 100644
--- a/app/javascript/flavours/glitch/components/admin/ReportReasonSelector.jsx
+++ b/app/javascript/flavours/glitch/components/admin/ReportReasonSelector.jsx
@@ -33,7 +33,7 @@ class Category extends React.PureComponent {
     const { id, text, disabled, selected, children } = this.props;
 
     return (
-      <div tabIndex='0' role='button' className={classNames('report-reason-selector__category', { selected, disabled })} onClick={this.handleClick}>
+      <div tabIndex={0} role='button' className={classNames('report-reason-selector__category', { selected, disabled })} onClick={this.handleClick}>
         {selected && <input type='hidden' name='report[category]' value={id} />}
 
         <div className='report-reason-selector__category__label'>
@@ -74,7 +74,7 @@ class Rule extends React.PureComponent {
     const { id, text, disabled, selected } = this.props;
 
     return (
-      <div tabIndex='0' role='button' className={classNames('report-reason-selector__rule', { selected, disabled })} onClick={this.handleClick}>
+      <div tabIndex={0} role='button' className={classNames('report-reason-selector__rule', { selected, disabled })} onClick={this.handleClick}>
         <span className={classNames('poll__input', { checkbox: true, active: selected, disabled })} />
         {selected && <input type='hidden' name='report[rule_ids][]' value={id} />}
         {text}
diff --git a/app/javascript/flavours/glitch/components/autosuggest_input.jsx b/app/javascript/flavours/glitch/components/autosuggest_input.jsx
index 90ff298c0..ea9fd0828 100644
--- a/app/javascript/flavours/glitch/components/autosuggest_input.jsx
+++ b/app/javascript/flavours/glitch/components/autosuggest_input.jsx
@@ -180,7 +180,7 @@ export default class AutosuggestInput extends ImmutablePureComponent {
     }
 
     return (
-      <div role='button' tabIndex='0' key={key} data-index={i} className={classNames('autosuggest-textarea__suggestions__item', { selected: i === selectedSuggestion })} onMouseDown={this.onSuggestionClick}>
+      <div role='button' tabIndex={0} key={key} data-index={i} className={classNames('autosuggest-textarea__suggestions__item', { selected: i === selectedSuggestion })} onMouseDown={this.onSuggestionClick}>
         {inner}
       </div>
     );
diff --git a/app/javascript/flavours/glitch/components/autosuggest_textarea.jsx b/app/javascript/flavours/glitch/components/autosuggest_textarea.jsx
index 6e6e567b9..a016e44b7 100644
--- a/app/javascript/flavours/glitch/components/autosuggest_textarea.jsx
+++ b/app/javascript/flavours/glitch/components/autosuggest_textarea.jsx
@@ -186,7 +186,7 @@ export default class AutosuggestTextarea extends ImmutablePureComponent {
     }
 
     return (
-      <div role='button' tabIndex='0' key={key} data-index={i} className={classNames('autosuggest-textarea__suggestions__item', { selected: i === selectedSuggestion })} onMouseDown={this.onSuggestionClick}>
+      <div role='button' tabIndex={0} key={key} data-index={i} className={classNames('autosuggest-textarea__suggestions__item', { selected: i === selectedSuggestion })} onMouseDown={this.onSuggestionClick}>
         {inner}
       </div>
     );
diff --git a/app/javascript/flavours/glitch/components/column_back_button_slim.jsx b/app/javascript/flavours/glitch/components/column_back_button_slim.jsx
index b43d85b3b..4df045b5f 100644
--- a/app/javascript/flavours/glitch/components/column_back_button_slim.jsx
+++ b/app/javascript/flavours/glitch/components/column_back_button_slim.jsx
@@ -26,7 +26,7 @@ export default class ColumnBackButtonSlim extends React.PureComponent {
   render () {
     return (
       <div className='column-back-button--slim'>
-        <div role='button' tabIndex='0' onClick={this.handleClick} className='column-back-button column-back-button--slim-button'>
+        <div role='button' tabIndex={0} onClick={this.handleClick} className='column-back-button column-back-button--slim-button'>
           <Icon id='chevron-left' className='column-back-button__icon' fixedWidth />
           <FormattedMessage id='column_back_button.label' defaultMessage='Back' />
         </div>
diff --git a/app/javascript/flavours/glitch/components/dropdown_menu.jsx b/app/javascript/flavours/glitch/components/dropdown_menu.jsx
index f4b6e059f..7fb75b59e 100644
--- a/app/javascript/flavours/glitch/components/dropdown_menu.jsx
+++ b/app/javascript/flavours/glitch/components/dropdown_menu.jsx
@@ -119,7 +119,7 @@ class DropdownMenu extends React.PureComponent {
 
     return (
       <li className='dropdown-menu__item' key={`${text}-${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}>
+        <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>
diff --git a/app/javascript/flavours/glitch/components/error_boundary.jsx b/app/javascript/flavours/glitch/components/error_boundary.jsx
index 8518dfc86..234a53417 100644
--- a/app/javascript/flavours/glitch/components/error_boundary.jsx
+++ b/app/javascript/flavours/glitch/components/error_boundary.jsx
@@ -72,7 +72,7 @@ export default class ErrorBoundary extends React.PureComponent {
     }
 
     return (
-      <div tabIndex='-1'>
+      <div tabIndex={-1}>
         <div className='error-boundary'>
           <h1><FormattedMessage id='web_app_crash.title' defaultMessage="We're sorry, but something went wrong with the Mastodon app." /></h1>
           <p>
diff --git a/app/javascript/flavours/glitch/components/gifv.jsx b/app/javascript/flavours/glitch/components/gifv.jsx
index 9ec201c6c..1ce7e7c29 100644
--- a/app/javascript/flavours/glitch/components/gifv.jsx
+++ b/app/javascript/flavours/glitch/components/gifv.jsx
@@ -46,7 +46,7 @@ export default class GIFV extends React.PureComponent {
             width={width}
             height={height}
             role='button'
-            tabIndex='0'
+            tabIndex={0}
             aria-label={alt}
             title={alt}
             lang={lang}
@@ -57,7 +57,7 @@ export default class GIFV extends React.PureComponent {
         <video
           src={src}
           role='button'
-          tabIndex='0'
+          tabIndex={0}
           aria-label={alt}
           title={alt}
           lang={lang}
diff --git a/app/javascript/flavours/glitch/components/intersection_observer_article.jsx b/app/javascript/flavours/glitch/components/intersection_observer_article.jsx
index 77cd66358..6c00e557d 100644
--- a/app/javascript/flavours/glitch/components/intersection_observer_article.jsx
+++ b/app/javascript/flavours/glitch/components/intersection_observer_article.jsx
@@ -120,7 +120,7 @@ export default class IntersectionObserverArticle extends React.Component {
         aria-posinset={index + 1}
         aria-setsize={listLength}
         data-id={id}
-        tabIndex='0'
+        tabIndex={0}
         style={style}
       >
         {children && React.cloneElement(children, { hidden: !isIntersecting && (isHidden || !!cachedHeight) })}
diff --git a/app/javascript/flavours/glitch/components/picture_in_picture_placeholder.jsx b/app/javascript/flavours/glitch/components/picture_in_picture_placeholder.jsx
index 961d3dead..9d1b7f55a 100644
--- a/app/javascript/flavours/glitch/components/picture_in_picture_placeholder.jsx
+++ b/app/javascript/flavours/glitch/components/picture_in_picture_placeholder.jsx
@@ -58,7 +58,7 @@ class PictureInPicturePlaceholder extends React.PureComponent {
     const { height } = this.state;
 
     return (
-      <div ref={this.setRef} className='picture-in-picture-placeholder' style={{ height }} role='button' tabIndex='0' onClick={this.handleClick}>
+      <div ref={this.setRef} className='picture-in-picture-placeholder' style={{ height }} role='button' tabIndex={0} onClick={this.handleClick}>
         <Icon id='window-restore' />
         <FormattedMessage id='picture_in_picture.restore' defaultMessage='Put it back' />
       </div>
diff --git a/app/javascript/flavours/glitch/components/poll.jsx b/app/javascript/flavours/glitch/components/poll.jsx
index 2ccc1761e..fb37612d9 100644
--- a/app/javascript/flavours/glitch/components/poll.jsx
+++ b/app/javascript/flavours/glitch/components/poll.jsx
@@ -154,7 +154,7 @@ class Poll extends ImmutablePureComponent {
           {!showResults && (
             <span
               className={classNames('poll__input', { checkbox: poll.get('multiple'), active })}
-              tabIndex='0'
+              tabIndex={0}
               role={poll.get('multiple') ? 'checkbox' : 'radio'}
               onKeyPress={this.handleOptionKeyPress}
               aria-checked={active}
diff --git a/app/javascript/flavours/glitch/components/spoilers.jsx b/app/javascript/flavours/glitch/components/spoilers.jsx
index 75e4ec3a1..d1d875807 100644
--- a/app/javascript/flavours/glitch/components/spoilers.jsx
+++ b/app/javascript/flavours/glitch/components/spoilers.jsx
@@ -38,7 +38,7 @@ class Spoilers extends React.PureComponent {
       <p className='spoiler__text'>
         {spoilerText}
         {' '}
-        <button tabIndex='0' className='status__content__spoiler-link' onClick={this.handleSpoilerClick}>
+        <button tabIndex={0} className='status__content__spoiler-link' onClick={this.handleSpoilerClick}>
           {toggleText}
         </button>
       </p>,
diff --git a/app/javascript/flavours/glitch/components/status.jsx b/app/javascript/flavours/glitch/components/status.jsx
index fa90c98d0..fbb610823 100644
--- a/app/javascript/flavours/glitch/components/status.jsx
+++ b/app/javascript/flavours/glitch/components/status.jsx
@@ -564,7 +564,7 @@ class Status extends ImmutablePureComponent {
     if (hidden) {
       return (
         <HotKeys handlers={handlers}>
-          <div ref={this.handleRef} className='status focusable' tabIndex='0'>
+          <div ref={this.handleRef} className='status focusable' tabIndex={0}>
             <span>{status.getIn(['account', 'display_name']) || status.getIn(['account', 'username'])}</span>
             <span>{status.get('content')}</span>
           </div>
@@ -581,7 +581,7 @@ class Status extends ImmutablePureComponent {
 
       return (
         <HotKeys handlers={minHandlers}>
-          <div className='status__wrapper status__wrapper--filtered focusable' tabIndex='0' ref={this.handleRef}>
+          <div className='status__wrapper status__wrapper--filtered focusable' tabIndex={0} ref={this.handleRef}>
             <FormattedMessage id='status.filtered' defaultMessage='Filtered' />: {matchedFilters.join(', ')}.
             {' '}
             <button className='status__wrapper--filtered__button' onClick={this.handleUnfilterClick}>
@@ -769,7 +769,7 @@ class Status extends ImmutablePureComponent {
           style={isCollapsed && background ? { backgroundImage: `url(${background})` } : null}
           {...selectorAttribs}
           ref={handleRef}
-          tabIndex='0'
+          tabIndex={0}
           data-featured={featured ? 'true' : null}
           aria-label={textForScreenReader(intl, status, rebloggedByText, !status.get('hidden'))}
         >
diff --git a/app/javascript/flavours/glitch/components/status_content.jsx b/app/javascript/flavours/glitch/components/status_content.jsx
index 34742c81b..e66df588a 100644
--- a/app/javascript/flavours/glitch/components/status_content.jsx
+++ b/app/javascript/flavours/glitch/components/status_content.jsx
@@ -387,7 +387,7 @@ class StatusContent extends React.PureComponent {
       }
 
       return (
-        <div className={classNames} tabIndex='0' onMouseDown={this.handleMouseDown} onMouseUp={this.handleMouseUp}>
+        <div className={classNames} tabIndex={0} onMouseDown={this.handleMouseDown} onMouseUp={this.handleMouseUp}>
           <p
             style={{ marginBottom: hidden && status.get('mentions').isEmpty() ? '0px' : null }}
           >
@@ -424,14 +424,14 @@ class StatusContent extends React.PureComponent {
           className={classNames}
           onMouseDown={this.handleMouseDown}
           onMouseUp={this.handleMouseUp}
-          tabIndex='0'
+          tabIndex={0}
         >
           <div
             ref={this.setContentsRef}
             key={`contents-${tagLinks}-${rewriteMentions}`}
             dangerouslySetInnerHTML={content}
             className='status__content__text translate'
-            tabIndex='0'
+            tabIndex={0}
             onMouseEnter={this.handleMouseEnter}
             onMouseLeave={this.handleMouseLeave}
             lang={lang}
@@ -445,14 +445,14 @@ class StatusContent extends React.PureComponent {
       return (
         <div
           className='status__content'
-          tabIndex='0'
+          tabIndex={0}
         >
           <div
             ref={this.setContentsRef}
             key={`contents-${tagLinks}`}
             className='status__content__text translate'
             dangerouslySetInnerHTML={content}
-            tabIndex='0'
+            tabIndex={0}
             onMouseEnter={this.handleMouseEnter}
             onMouseLeave={this.handleMouseLeave}
             lang={lang}
diff --git a/app/javascript/flavours/glitch/features/about/index.jsx b/app/javascript/flavours/glitch/features/about/index.jsx
index f366f734d..67d5afbdd 100644
--- a/app/javascript/flavours/glitch/features/about/index.jsx
+++ b/app/javascript/flavours/glitch/features/about/index.jsx
@@ -67,7 +67,7 @@ class Section extends React.PureComponent {
 
     return (
       <div className={classNames('about__section', { active: !collapsed })}>
-        <div className='about__section__title' role='button' tabIndex='0' onClick={this.handleClick}>
+        <div className='about__section__title' role='button' tabIndex={0} onClick={this.handleClick}>
           <Icon id={collapsed ? 'chevron-right' : 'chevron-down'} fixedWidth /> {title}
         </div>
 
diff --git a/app/javascript/flavours/glitch/features/account/components/account_note.jsx b/app/javascript/flavours/glitch/features/account/components/account_note.jsx
index 5adca87d0..8ab00f6d4 100644
--- a/app/javascript/flavours/glitch/features/account/components/account_note.jsx
+++ b/app/javascript/flavours/glitch/features/account/components/account_note.jsx
@@ -53,11 +53,11 @@ class Header extends ImmutablePureComponent {
     if (isEditing) {
       action_buttons = (
         <div className='account__header__account-note__buttons'>
-          <button className='icon-button' tabIndex='0' onClick={this.props.onCancelAccountNote} disabled={isSubmitting}>
+          <button className='icon-button' tabIndex={0} onClick={this.props.onCancelAccountNote} disabled={isSubmitting}>
             <Icon id='times' size={15} /> <FormattedMessage id='account_note.cancel' defaultMessage='Cancel' />
           </button>
           <div className='flex-spacer' />
-          <button className='icon-button' tabIndex='0' onClick={this.props.onSaveAccountNote} disabled={isSubmitting}>
+          <button className='icon-button' tabIndex={0} onClick={this.props.onSaveAccountNote} disabled={isSubmitting}>
             <Icon id='check' size={15} /> <FormattedMessage id='account_note.save' defaultMessage='Save' />
           </button>
         </div>
@@ -65,7 +65,7 @@ class Header extends ImmutablePureComponent {
     } else {
       action_buttons = (
         <div className='account__header__account-note__buttons'>
-          <button className='icon-button' tabIndex='0' onClick={this.props.onEditAccountNote} disabled={isSubmitting}>
+          <button className='icon-button' tabIndex={0} onClick={this.props.onEditAccountNote} disabled={isSubmitting}>
             <Icon id='pencil' size={15} /> <FormattedMessage id='account_note.edit' defaultMessage='Edit' />
           </button>
         </div>
diff --git a/app/javascript/flavours/glitch/features/audio/index.jsx b/app/javascript/flavours/glitch/features/audio/index.jsx
index fd7229cc5..556a74ac4 100644
--- a/app/javascript/flavours/glitch/features/audio/index.jsx
+++ b/app/javascript/flavours/glitch/features/audio/index.jsx
@@ -476,7 +476,7 @@ class Audio extends React.PureComponent {
     }
 
     return (
-      <div className={classNames('audio-player', { editable, inactive: !revealed })} ref={this.setPlayerRef} style={{ backgroundColor: this._getBackgroundColor(), color: this._getForegroundColor(), width: '100%', height: this.props.fullscreen ? '100%' : (this.state.height || this.props.height) }} onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave} tabIndex='0' onKeyDown={this.handleKeyDown}>
+      <div className={classNames('audio-player', { editable, inactive: !revealed })} ref={this.setPlayerRef} style={{ backgroundColor: this._getBackgroundColor(), color: this._getForegroundColor(), width: '100%', height: this.props.fullscreen ? '100%' : (this.state.height || this.props.height) }} onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave} tabIndex={0} onKeyDown={this.handleKeyDown}>
 
         <Blurhash
           hash={blurhash}
@@ -499,7 +499,7 @@ class Audio extends React.PureComponent {
 
         <canvas
           role='button'
-          tabIndex='0'
+          tabIndex={0}
           className='audio-player__canvas'
           width={this.state.width}
           height={this.state.height}
@@ -532,7 +532,7 @@ class Audio extends React.PureComponent {
 
           <span
             className={classNames('video-player__seek__handle', { active: dragging })}
-            tabIndex='0'
+            tabIndex={0}
             style={{ left: `${progress}%`, backgroundColor: this._getAccentColor() }}
             onKeyDown={this.handleAudioKeyDown}
           />
@@ -549,7 +549,7 @@ class Audio extends React.PureComponent {
 
                 <span
                   className='video-player__volume__handle'
-                  tabIndex='0'
+                  tabIndex={0}
                   style={{ left: `${volume * 100}%`, backgroundColor: this._getAccentColor() }}
                 />
               </div>
diff --git a/app/javascript/flavours/glitch/features/compose/components/dropdown_menu.jsx b/app/javascript/flavours/glitch/features/compose/components/dropdown_menu.jsx
index 1ea0df536..1ccccad31 100644
--- a/app/javascript/flavours/glitch/features/compose/components/dropdown_menu.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/dropdown_menu.jsx
@@ -169,7 +169,7 @@ export default class ComposerOptionsDropdownContent extends React.PureComponent
         onClick={this.handleClick}
         onKeyDown={this.handleKeyDown}
         role='option'
-        tabIndex='0'
+        tabIndex={0}
         key={name}
         data-index={i}
         ref={active ? this.setFocusRef : null}
diff --git a/app/javascript/flavours/glitch/features/compose/components/language_dropdown.jsx b/app/javascript/flavours/glitch/features/compose/components/language_dropdown.jsx
index 14f285c3d..05614de01 100644
--- a/app/javascript/flavours/glitch/features/compose/components/language_dropdown.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/language_dropdown.jsx
@@ -209,7 +209,7 @@ class LanguageDropdownMenu extends React.PureComponent {
     const { value } = this.props;
 
     return (
-      <div key={lang[0]} role='option' tabIndex='0' data-index={lang[0]} className={classNames('language-dropdown__dropdown__results__item', { active: lang[0] === value })} aria-selected={lang[0] === value} onClick={this.handleClick} onKeyDown={this.handleKeyDown}>
+      <div key={lang[0]} role='option' tabIndex={0} data-index={lang[0]} className={classNames('language-dropdown__dropdown__results__item', { active: lang[0] === value })} aria-selected={lang[0] === value} onClick={this.handleClick} onKeyDown={this.handleKeyDown}>
         <span className='language-dropdown__dropdown__results__item__native-name' lang={lang[0]}>{lang[2]}</span> <span className='language-dropdown__dropdown__results__item__common-name'>({lang[1]})</span>
       </div>
     );
diff --git a/app/javascript/flavours/glitch/features/compose/components/search.jsx b/app/javascript/flavours/glitch/features/compose/components/search.jsx
index d2187b8ae..cb6afca8d 100644
--- a/app/javascript/flavours/glitch/features/compose/components/search.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/search.jsx
@@ -147,7 +147,7 @@ class Search extends React.PureComponent {
           onBlur={this.handleBlur}
         />
 
-        <div role='button' tabIndex='0' className='search__icon' onClick={this.handleClear}>
+        <div role='button' tabIndex={0} className='search__icon' onClick={this.handleClear}>
           <Icon id='search' className={hasValue ? '' : 'active'} />
           <Icon id='times-circle' className={hasValue ? 'active' : ''} />
         </div>
diff --git a/app/javascript/flavours/glitch/features/compose/components/upload.jsx b/app/javascript/flavours/glitch/features/compose/components/upload.jsx
index 63582c636..7d5784561 100644
--- a/app/javascript/flavours/glitch/features/compose/components/upload.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/upload.jsx
@@ -43,7 +43,7 @@ export default class Upload extends ImmutablePureComponent {
     const y = ((focusY / -2) + .5) * 100;
 
     return (
-      <div className='compose-form__upload' tabIndex='0' role='button'>
+      <div className='compose-form__upload' tabIndex={0} role='button'>
         <Motion defaultStyle={{ scale: 0.8 }} style={{ scale: spring(1, { stiffness: 180, damping: 12 }) }}>
           {({ scale }) => (
             <div className='compose-form__upload-thumbnail' style={{ transform: `scale(${scale})`, backgroundImage: `url(${media.get('preview_url')})`, backgroundPosition: `${x}% ${y}%` }}>
diff --git a/app/javascript/flavours/glitch/features/direct_timeline/components/conversation.jsx b/app/javascript/flavours/glitch/features/direct_timeline/components/conversation.jsx
index 05fd68707..63a331086 100644
--- a/app/javascript/flavours/glitch/features/direct_timeline/components/conversation.jsx
+++ b/app/javascript/flavours/glitch/features/direct_timeline/components/conversation.jsx
@@ -182,7 +182,7 @@ class Conversation extends ImmutablePureComponent {
 
     return (
       <HotKeys handlers={handlers}>
-        <div className={classNames('conversation focusable muted', { 'conversation--unread': unread })} tabIndex='0'>
+        <div className={classNames('conversation focusable muted', { 'conversation--unread': unread })} tabIndex={0}>
           <div className='conversation__avatar' onClick={this.handleClick} role='presentation'>
             <AvatarComposite accounts={accounts} size={48} />
           </div>
diff --git a/app/javascript/flavours/glitch/features/filters/select_filter.jsx b/app/javascript/flavours/glitch/features/filters/select_filter.jsx
index b3285bc91..a33892f83 100644
--- a/app/javascript/flavours/glitch/features/filters/select_filter.jsx
+++ b/app/javascript/flavours/glitch/features/filters/select_filter.jsx
@@ -65,7 +65,7 @@ class SelectFilter extends React.PureComponent {
     }
 
     return (
-      <div key={filter[0]} role='button' tabIndex='0' data-index={filter[0]} className='language-dropdown__dropdown__results__item' onClick={this.handleItemClick} onKeyDown={this.handleKeyDown}>
+      <div key={filter[0]} role='button' tabIndex={0} data-index={filter[0]} className='language-dropdown__dropdown__results__item' onClick={this.handleItemClick} onKeyDown={this.handleKeyDown}>
         <span className='language-dropdown__dropdown__results__item__native-name'>{filter[1]}</span> {warning}
       </div>
     );
@@ -73,7 +73,7 @@ class SelectFilter extends React.PureComponent {
 
   renderCreateNew (name) {
     return (
-      <div key='add-new-filter' role='button' tabIndex='0' className='language-dropdown__dropdown__results__item' onClick={this.handleNewFilterClick} onKeyDown={this.handleKeyDown}>
+      <div key='add-new-filter' role='button' tabIndex={0} className='language-dropdown__dropdown__results__item' onClick={this.handleNewFilterClick} onKeyDown={this.handleKeyDown}>
         <Icon id='plus' fixedWidth /> <FormattedMessage id='filter_modal.select_filter.prompt_new' defaultMessage='New category: {name}' values={{ name }} />
       </div>
     );
diff --git a/app/javascript/flavours/glitch/features/list_editor/components/search.jsx b/app/javascript/flavours/glitch/features/list_editor/components/search.jsx
index 94782ba69..3b66bc325 100644
--- a/app/javascript/flavours/glitch/features/list_editor/components/search.jsx
+++ b/app/javascript/flavours/glitch/features/list_editor/components/search.jsx
@@ -51,7 +51,7 @@ export default class Search extends React.PureComponent {
           />
         </label>
 
-        <div role='button' tabIndex='0' className='search__icon' onClick={this.handleClear}>
+        <div role='button' tabIndex={0} className='search__icon' onClick={this.handleClear}>
           <Icon id='search' className={classNames({ active: !hasValue })} />
           <Icon id='times-circle' aria-label={intl.formatMessage(messages.search)} className={classNames({ active: hasValue })} />
         </div>
diff --git a/app/javascript/flavours/glitch/features/list_editor/index.jsx b/app/javascript/flavours/glitch/features/list_editor/index.jsx
index 8b8a0cf31..44951d1c6 100644
--- a/app/javascript/flavours/glitch/features/list_editor/index.jsx
+++ b/app/javascript/flavours/glitch/features/list_editor/index.jsx
@@ -60,7 +60,7 @@ class ListEditor extends ImmutablePureComponent {
             {accountIds.map(accountId => <AccountContainer key={accountId} accountId={accountId} added />)}
           </div>
 
-          {showSearch && <div role='button' tabIndex='-1' className='drawer__backdrop' onClick={onClear} />}
+          {showSearch && <div role='button' tabIndex={-1} className='drawer__backdrop' onClick={onClear} />}
 
           <Motion defaultStyle={{ x: -100 }} style={{ x: spring(showSearch ? 0 : -100, { stiffness: 210, damping: 20 }) }}>
             {({ x }) =>
diff --git a/app/javascript/flavours/glitch/features/list_timeline/index.jsx b/app/javascript/flavours/glitch/features/list_timeline/index.jsx
index f885a751f..a32383b13 100644
--- a/app/javascript/flavours/glitch/features/list_timeline/index.jsx
+++ b/app/javascript/flavours/glitch/features/list_timeline/index.jsx
@@ -177,11 +177,11 @@ class ListTimeline extends React.PureComponent {
           multiColumn={multiColumn}
         >
           <div className='column-settings__row column-header__links'>
-            <button className='text-btn column-header__setting-btn' tabIndex='0' onClick={this.handleEditClick}>
+            <button className='text-btn column-header__setting-btn' tabIndex={0} onClick={this.handleEditClick}>
               <Icon id='pencil' /> <FormattedMessage id='lists.edit' defaultMessage='Edit list' />
             </button>
 
-            <button className='text-btn column-header__setting-btn' tabIndex='0' onClick={this.handleDeleteClick}>
+            <button className='text-btn column-header__setting-btn' tabIndex={0} onClick={this.handleDeleteClick}>
               <Icon id='trash' /> <FormattedMessage id='lists.delete' defaultMessage='Delete list' />
             </button>
           </div>
diff --git a/app/javascript/flavours/glitch/features/local_settings/navigation/item/index.jsx b/app/javascript/flavours/glitch/features/local_settings/navigation/item/index.jsx
index a4d1b40fa..9ac6d9b73 100644
--- a/app/javascript/flavours/glitch/features/local_settings/navigation/item/index.jsx
+++ b/app/javascript/flavours/glitch/features/local_settings/navigation/item/index.jsx
@@ -60,7 +60,7 @@ export default class LocalSettingsPage extends React.PureComponent {
       <a
         onClick={handleClick}
         role='button'
-        tabIndex='0'
+        tabIndex={0}
         className={finalClassName}
         title={title}
         aria-label={title}
diff --git a/app/javascript/flavours/glitch/features/notifications/components/admin_report.jsx b/app/javascript/flavours/glitch/features/notifications/components/admin_report.jsx
index 556df8f66..9b55fe4e9 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/admin_report.jsx
+++ b/app/javascript/flavours/glitch/features/notifications/components/admin_report.jsx
@@ -91,7 +91,7 @@ export default class AdminReport extends ImmutablePureComponent {
 
     return (
       <HotKeys handlers={this.getHandlers()}>
-        <div className={classNames('notification notification-admin-report focusable', { unread })} tabIndex='0'>
+        <div className={classNames('notification notification-admin-report focusable', { unread })} tabIndex={0}>
           <div className='notification__message'>
             <div className='notification__favourite-icon-wrapper'>
               <Icon id='flag' fixedWidth />
diff --git a/app/javascript/flavours/glitch/features/notifications/components/admin_signup.jsx b/app/javascript/flavours/glitch/features/notifications/components/admin_signup.jsx
index ead2a9701..d982108e9 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/admin_signup.jsx
+++ b/app/javascript/flavours/glitch/features/notifications/components/admin_signup.jsx
@@ -78,7 +78,7 @@ export default class NotificationFollow extends ImmutablePureComponent {
     //  Renders.
     return (
       <HotKeys handlers={this.getHandlers()}>
-        <div className={classNames('notification notification-admin-sign-up focusable', { unread })} tabIndex='0'>
+        <div className={classNames('notification notification-admin-sign-up focusable', { unread })} tabIndex={0}>
           <div className='notification__message'>
             <div className='notification__favourite-icon-wrapper'>
               <Icon fixedWidth id='user-plus' />
diff --git a/app/javascript/flavours/glitch/features/notifications/components/clear_column_button.jsx b/app/javascript/flavours/glitch/features/notifications/components/clear_column_button.jsx
index ee77cfb8e..cd150314b 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/clear_column_button.jsx
+++ b/app/javascript/flavours/glitch/features/notifications/components/clear_column_button.jsx
@@ -11,7 +11,7 @@ export default class ClearColumnButton extends React.Component {
 
   render () {
     return (
-      <button className='text-btn column-header__setting-btn' tabIndex='0' onClick={this.props.onClick}><Icon id='eraser' /> <FormattedMessage id='notifications.clear' defaultMessage='Clear notifications' /></button>
+      <button className='text-btn column-header__setting-btn' tabIndex={0} onClick={this.props.onClick}><Icon id='eraser' /> <FormattedMessage id='notifications.clear' defaultMessage='Clear notifications' /></button>
     );
   }
 
diff --git a/app/javascript/flavours/glitch/features/notifications/components/follow.jsx b/app/javascript/flavours/glitch/features/notifications/components/follow.jsx
index 434d6609d..e9ef70911 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/follow.jsx
+++ b/app/javascript/flavours/glitch/features/notifications/components/follow.jsx
@@ -78,7 +78,7 @@ export default class NotificationFollow extends ImmutablePureComponent {
     //  Renders.
     return (
       <HotKeys handlers={this.getHandlers()}>
-        <div className={classNames('notification notification-follow focusable', { unread })} tabIndex='0'>
+        <div className={classNames('notification notification-follow focusable', { unread })} tabIndex={0}>
           <div className='notification__message'>
             <div className='notification__favourite-icon-wrapper'>
               <Icon fixedWidth id='user-plus' />
diff --git a/app/javascript/flavours/glitch/features/notifications/components/follow_request.jsx b/app/javascript/flavours/glitch/features/notifications/components/follow_request.jsx
index 01dec320e..2b985bc08 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/follow_request.jsx
+++ b/app/javascript/flavours/glitch/features/notifications/components/follow_request.jsx
@@ -95,7 +95,7 @@ class FollowRequest extends ImmutablePureComponent {
 
     return (
       <HotKeys handlers={this.getHandlers()}>
-        <div className={classNames('notification notification-follow-request focusable', { unread })} tabIndex='0'>
+        <div className={classNames('notification notification-follow-request focusable', { unread })} tabIndex={0}>
           <div className='notification__message'>
             <div className='notification__favourite-icon-wrapper'>
               <Icon id='user' fixedWidth />
diff --git a/app/javascript/flavours/glitch/features/notifications/components/grant_permission_button.jsx b/app/javascript/flavours/glitch/features/notifications/components/grant_permission_button.jsx
index 798e4c787..5b2db48fd 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/grant_permission_button.jsx
+++ b/app/javascript/flavours/glitch/features/notifications/components/grant_permission_button.jsx
@@ -10,7 +10,7 @@ export default class GrantPermissionButton extends React.PureComponent {
 
   render () {
     return (
-      <button className='text-btn column-header__permission-btn' tabIndex='0' onClick={this.props.onClick}>
+      <button className='text-btn column-header__permission-btn' tabIndex={0} onClick={this.props.onClick}>
         <FormattedMessage id='notifications.grant_permission' defaultMessage='Grant permission.' />
       </button>
     );
diff --git a/app/javascript/flavours/glitch/features/pinned_accounts_editor/index.jsx b/app/javascript/flavours/glitch/features/pinned_accounts_editor/index.jsx
index de3fff8ec..834de652f 100644
--- a/app/javascript/flavours/glitch/features/pinned_accounts_editor/index.jsx
+++ b/app/javascript/flavours/glitch/features/pinned_accounts_editor/index.jsx
@@ -59,7 +59,7 @@ class PinnedAccountsEditor extends ImmutablePureComponent {
             {accountIds.map(accountId => <AccountContainer key={accountId} accountId={accountId} added />)}
           </div>
 
-          {showSearch && <div role='button' tabIndex='-1' className='drawer__backdrop' onClick={onClear} />}
+          {showSearch && <div role='button' tabIndex={-1} className='drawer__backdrop' onClick={onClear} />}
 
           <Motion defaultStyle={{ x: -100 }} style={{ x: spring(showSearch ? 0 : -100, { stiffness: 210, damping: 20 }) }}>
             {({ x }) =>
diff --git a/app/javascript/flavours/glitch/features/report/components/option.jsx b/app/javascript/flavours/glitch/features/report/components/option.jsx
index 6ecfc7a24..7827a6b3b 100644
--- a/app/javascript/flavours/glitch/features/report/components/option.jsx
+++ b/app/javascript/flavours/glitch/features/report/components/option.jsx
@@ -40,7 +40,7 @@ export default class Option extends React.PureComponent {
 
         <span
           className={classNames('poll__input', { active: checked, checkbox: multiple })}
-          tabIndex='0'
+          tabIndex={0}
           role='radio'
           onKeyPress={this.handleKeyPress}
           aria-checked={checked}
diff --git a/app/javascript/flavours/glitch/features/status/index.jsx b/app/javascript/flavours/glitch/features/status/index.jsx
index a59da5e10..f01ad2dbe 100644
--- a/app/javascript/flavours/glitch/features/status/index.jsx
+++ b/app/javascript/flavours/glitch/features/status/index.jsx
@@ -672,7 +672,7 @@ class Status extends ImmutablePureComponent {
             {ancestors}
 
             <HotKeys handlers={handlers}>
-              <div className='focusable' tabIndex='0' aria-label={textForScreenReader(intl, status, false, isExpanded)}>
+              <div className='focusable' tabIndex={0} aria-label={textForScreenReader(intl, status, false, isExpanded)}>
                 <DetailedStatus
                   key={`details-${status.get('id')}`}
                   status={status}
diff --git a/app/javascript/flavours/glitch/features/ui/components/actions_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/actions_modal.jsx
index c6e3ee37c..9a9b1a3f1 100644
--- a/app/javascript/flavours/glitch/features/ui/components/actions_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/actions_modal.jsx
@@ -36,7 +36,7 @@ export default class ActionsModal extends ImmutablePureComponent {
     if (!contents) {
       contents = (
         <React.Fragment>
-          {icon && <IconButton title={text} icon={icon} role='presentation' tabIndex='-1' inverted />}
+          {icon && <IconButton title={text} icon={icon} role='presentation' tabIndex={-1} inverted />}
           <div>
             <div className={classNames({ 'actions-modal__item-label': !!meta })}>{text}</div>
             <div>{meta}</div>
diff --git a/app/javascript/flavours/glitch/features/ui/components/column_link.jsx b/app/javascript/flavours/glitch/features/ui/components/column_link.jsx
index dcdac077f..4fffa54f4 100644
--- a/app/javascript/flavours/glitch/features/ui/components/column_link.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/column_link.jsx
@@ -32,7 +32,7 @@ const ColumnLink = ({ icon, text, to, onClick, href, method, badge, transparent,
       return onClick(e);
     };
     return (
-      <a href='#' onClick={onClick && handleOnClick} className={className} title={text} {...other} tabIndex='0'>
+      <a href='#' onClick={onClick && handleOnClick} className={className} title={text} {...other} tabIndex={0}>
         {iconElement}
         <span>{text}</span>
         {badgeElement}
diff --git a/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx
index a3811e91d..fd2bd43cf 100644
--- a/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx
@@ -140,8 +140,8 @@ class MediaModal extends ImmutablePureComponent {
 
     const index = this.getIndex();
 
-    const leftNav  = media.size > 1 && <button tabIndex='0' className='media-modal__nav media-modal__nav--left' onClick={this.handlePrevClick} aria-label={intl.formatMessage(messages.previous)}><Icon id='chevron-left' fixedWidth /></button>;
-    const rightNav = media.size > 1 && <button tabIndex='0' className='media-modal__nav  media-modal__nav--right' onClick={this.handleNextClick} aria-label={intl.formatMessage(messages.next)}><Icon id='chevron-right' fixedWidth /></button>;
+    const leftNav  = media.size > 1 && <button tabIndex={0} className='media-modal__nav media-modal__nav--left' onClick={this.handlePrevClick} aria-label={intl.formatMessage(messages.previous)}><Icon id='chevron-left' fixedWidth /></button>;
+    const rightNav = media.size > 1 && <button tabIndex={0} className='media-modal__nav  media-modal__nav--right' onClick={this.handleNextClick} aria-label={intl.formatMessage(messages.next)}><Icon id='chevron-right' fixedWidth /></button>;
 
     const content = media.map((image) => {
       const width  = image.getIn(['meta', 'original', 'width']) || null;
diff --git a/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.jsx
index df84a1571..29eb91a6b 100644
--- a/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.jsx
@@ -299,7 +299,7 @@ class OnboardingModal extends React.PureComponent {
                 <div
                   key={`dot-${i}`}
                   role='button'
-                  tabIndex='0'
+                  tabIndex={0}
                   data-index={i}
                   onClick={this.handleDot}
                   className={className}
diff --git a/app/javascript/flavours/glitch/features/video/index.jsx b/app/javascript/flavours/glitch/features/video/index.jsx
index 80323770c..28a8bb1fd 100644
--- a/app/javascript/flavours/glitch/features/video/index.jsx
+++ b/app/javascript/flavours/glitch/features/video/index.jsx
@@ -600,7 +600,7 @@ class Video extends React.PureComponent {
           preload={preload}
           loop
           role='button'
-          tabIndex='0'
+          tabIndex={0}
           aria-label={alt}
           title={alt}
           lang={lang}
@@ -629,7 +629,7 @@ class Video extends React.PureComponent {
 
             <span
               className={classNames('video-player__seek__handle', { active: dragging })}
-              tabIndex='0'
+              tabIndex={0}
               style={{ left: `${progress}%` }}
               onKeyDown={this.handleVideoKeyDown}
             />
@@ -645,7 +645,7 @@ class Video extends React.PureComponent {
 
                 <span
                   className={classNames('video-player__volume__handle')}
-                  tabIndex='0'
+                  tabIndex={0}
                   style={{ left: `${volume * 100}%` }}
                 />
               </div>
-- 
cgit 

