Merge commit 'e58c36d308' into kb_migration

app/javascript/mastodon/components/__tests__/autosuggest_emoji-test.jsx

@@ -1,4 +1,5 @@
 import renderer from 'react-test-renderer';
+
 import AutosuggestEmoji from '../autosuggest_emoji';
 
 describe('<AutosuggestEmoji />', () => {

app/javascript/mastodon/components/__tests__/avatar-test.jsx

@@ -1,5 +1,7 @@
-import renderer from 'react-test-renderer';
 import { fromJS } from 'immutable';
+
+import renderer from 'react-test-renderer';
+
 import { Avatar } from '../avatar';
 
 describe('<Avatar />', () => {

app/javascript/mastodon/components/__tests__/avatar_overlay-test.jsx

@@ -1,5 +1,7 @@
-import renderer from 'react-test-renderer';
 import { fromJS } from 'immutable';
+
+import renderer from 'react-test-renderer';
+
 import { AvatarOverlay } from '../avatar_overlay';
 
 describe('<AvatarOverlay', () => {

app/javascript/mastodon/components/__tests__/button-test.jsx

@@ -1,5 +1,6 @@
 import { render, fireEvent, screen } from '@testing-library/react';
 import renderer from 'react-test-renderer';
+
 import Button from '../button';
 
 describe('<Button />', () => {

app/javascript/mastodon/components/__tests__/display_name-test.jsx

@@ -1,5 +1,7 @@
-import renderer from 'react-test-renderer';
 import { fromJS }  from 'immutable';
+
+import renderer from 'react-test-renderer';
+
 import { DisplayName } from '../display_name';
 
 describe('<DisplayName />', () => {

app/javascript/mastodon/components/account.jsx

@@ -1,23 +1,29 @@
-import ImmutablePropTypes from 'react-immutable-proptypes';
 import PropTypes from 'prop-types';
+
+import { defineMessages, injectIntl } from 'react-intl';
+
+import classNames from 'classnames';
+import { Link } from 'react-router-dom';
+
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+
+import { counterRenderer } from 'mastodon/components/common_counter';
+import { EmptyAccount } from 'mastodon/components/empty_account';
+import ShortNumber from 'mastodon/components/short_number';
+import { VerifiedBadge } from 'mastodon/components/verified_badge';
+
+import { me } from '../initial_state';
+
 import { Avatar } from './avatar';
 import { DisplayName } from './display_name';
 import { IconButton } from './icon_button';
-import { defineMessages, injectIntl } from 'react-intl';
-import ImmutablePureComponent from 'react-immutable-pure-component';
-import { me } from '../initial_state';
 import { RelativeTimestamp } from './relative_timestamp';
-import { Link } from 'react-router-dom';
-import { counterRenderer } from 'mastodon/components/common_counter';
-import ShortNumber from 'mastodon/components/short_number';
-import classNames from 'classnames';
-import { VerifiedBadge } from 'mastodon/components/verified_badge';
-import { EmptyAccount } from 'mastodon/components/empty_account';
 
 const messages = defineMessages({
   follow: { id: 'account.follow', defaultMessage: 'Follow' },
   unfollow: { id: 'account.unfollow', defaultMessage: 'Unfollow' },
-  requested: { id: 'account.requested', defaultMessage: 'Awaiting approval' },
+  requested: { id: 'account.requested', defaultMessage: 'Awaiting approval. Click to cancel follow request' },
   unblock: { id: 'account.unblock', defaultMessage: 'Unblock @{name}' },
   unmute: { id: 'account.unmute', defaultMessage: 'Unmute @{name}' },
   mute_notifications: { id: 'account.mute_notifications', defaultMessage: 'Mute notifications from @{name}' },

app/javascript/mastodon/components/admin/Counter.jsx

@@ -1,9 +1,13 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
-import api from 'mastodon/api';
+import { PureComponent } from 'react';
+
 import { FormattedNumber } from 'react-intl';
-import { Sparklines, SparklinesCurve } from 'react-sparklines';
+
 import classNames from 'classnames';
+
+import { Sparklines, SparklinesCurve } from 'react-sparklines';
+
+import api from 'mastodon/api';
 import { Skeleton } from 'mastodon/components/skeleton';
 
 const percIncrease = (a, b) => {

app/javascript/mastodon/components/admin/Dimension.jsx

@@ -1,9 +1,11 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
-import api from 'mastodon/api';
+import { PureComponent } from 'react';
+
 import { FormattedNumber } from 'react-intl';
-import { roundTo10 } from 'mastodon/utils/numbers';
+
+import api from 'mastodon/api';
 import { Skeleton } from 'mastodon/components/skeleton';
+import { roundTo10 } from 'mastodon/utils/numbers';
 
 export default class Dimension extends PureComponent {
 

app/javascript/mastodon/components/admin/ReportReasonSelector.jsx

@@ -1,9 +1,12 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
-import api from 'mastodon/api';
+import { PureComponent } from 'react';
+
 import { injectIntl, defineMessages } from 'react-intl';
+
 import classNames from 'classnames';
 
+import api from 'mastodon/api';
+
 const messages = defineMessages({
   other: { id: 'report.categories.other', defaultMessage: 'Other' },
   spam: { id: 'report.categories.spam', defaultMessage: 'Spam' },

app/javascript/mastodon/components/admin/Retention.jsx

@@ -1,8 +1,11 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
-import api from 'mastodon/api';
+import { PureComponent } from 'react';
+
 import { FormattedMessage, FormattedNumber, FormattedDate } from 'react-intl';
+
 import classNames from 'classnames';
+
+import api from 'mastodon/api';
 import { roundTo10 } from 'mastodon/utils/numbers';
 
 const dateForCohort = cohort => {

app/javascript/mastodon/components/admin/Trends.jsx

@@ -1,8 +1,11 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
-import api from 'mastodon/api';
+import { PureComponent } from 'react';
+
 import { FormattedMessage } from 'react-intl';
+
 import classNames from 'classnames';
+
+import api from 'mastodon/api';
 import Hashtag from 'mastodon/components/hashtag';
 
 export default class Trends extends PureComponent {

app/javascript/mastodon/components/attachment_list.jsx

@@ -1,8 +1,12 @@
-import ImmutablePropTypes from 'react-immutable-proptypes';
 import PropTypes from 'prop-types';
-import ImmutablePureComponent from 'react-immutable-pure-component';
+
 import { FormattedMessage } from 'react-intl';
+
 import classNames from 'classnames';
+
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+
 import { Icon }  from 'mastodon/components/icon';
 
 const filename = url => url.split('/').pop().split('#')[0].split('?')[0];

app/javascript/mastodon/components/autosuggest_emoji.jsx

@@ -1,8 +1,10 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
-import unicodeMapping from '../features/emoji/emoji_unicode_mapping_light';
+import { PureComponent } from 'react';
+
 import { assetHost } from 'mastodon/utils/config';
 
+import unicodeMapping from '../features/emoji/emoji_unicode_mapping_light';
+
 export default class AutosuggestEmoji extends PureComponent {
 
   static propTypes = {

app/javascript/mastodon/components/autosuggest_hashtag.jsx

@@ -1,8 +1,10 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
-import ShortNumber from 'mastodon/components/short_number';
+import { PureComponent } from 'react';
+
 import { FormattedMessage } from 'react-intl';
 
+import ShortNumber from 'mastodon/components/short_number';
+
 export default class AutosuggestHashtag extends PureComponent {
 
   static propTypes = {

app/javascript/mastodon/components/autosuggest_input.jsx

@@ -1,10 +1,14 @@
+import PropTypes from 'prop-types';
+
+import classNames from 'classnames';
+
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+
 import AutosuggestAccountContainer from '../features/compose/containers/autosuggest_account_container';
+
 import AutosuggestEmoji from './autosuggest_emoji';
 import AutosuggestHashtag from './autosuggest_hashtag';
-import ImmutablePropTypes from 'react-immutable-proptypes';
-import PropTypes from 'prop-types';
-import ImmutablePureComponent from 'react-immutable-pure-component';
-import classNames from 'classnames';
 
 const textAtCursorMatchesToken = (str, caretPosition, searchTokens) => {
   let word;

app/javascript/mastodon/components/autosuggest_textarea.jsx

@@ -1,11 +1,16 @@
+import PropTypes from 'prop-types';
+
+import classNames from 'classnames';
+
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+
+import Textarea from 'react-textarea-autosize';
+
 import AutosuggestAccountContainer from '../features/compose/containers/autosuggest_account_container';
+
 import AutosuggestEmoji from './autosuggest_emoji';
 import AutosuggestHashtag from './autosuggest_hashtag';
-import ImmutablePropTypes from 'react-immutable-proptypes';
-import PropTypes from 'prop-types';
-import ImmutablePureComponent from 'react-immutable-pure-component';
-import Textarea from 'react-textarea-autosize';
-import classNames from 'classnames';
 
 const textAtCursorMatchesToken = (str, caretPosition) => {
   let word;

app/javascript/mastodon/components/avatar_composite.jsx

@@ -1,7 +1,10 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
+import { PureComponent } from 'react';
+
 import ImmutablePropTypes from 'react-immutable-proptypes';
+
 import { autoPlayGif } from '../initial_state';
+
 import { Avatar } from './avatar';
 
 export default class AvatarComposite extends PureComponent {

app/javascript/mastodon/components/button.jsx

@@ -1,5 +1,6 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
+import { PureComponent } from 'react';
+
 import classNames from 'classnames';
 
 export default class Button extends PureComponent {

app/javascript/mastodon/components/column.jsx

@@ -1,6 +1,8 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
+import { PureComponent } from 'react';
+
 import { supportsPassiveEvents } from 'detect-passive-events';
+
 import { scrollTop } from '../scroll';
 
 const listenerOptions = supportsPassiveEvents ? { passive: true } : false;

app/javascript/mastodon/components/column_back_button.jsx

@@ -1,9 +1,11 @@
-import { PureComponent } from 'react';
-import { FormattedMessage } from 'react-intl';
 import PropTypes from 'prop-types';
-import { Icon }  from 'mastodon/components/icon';
+import { PureComponent } from 'react';
 import { createPortal } from 'react-dom';
 
+import { FormattedMessage } from 'react-intl';
+
+import { Icon }  from 'mastodon/components/icon';
+
 export default class ColumnBackButton extends PureComponent {
 
   static contextTypes = {

app/javascript/mastodon/components/column_back_button_slim.jsx

@@ -1,7 +1,9 @@
 import { FormattedMessage } from 'react-intl';
-import ColumnBackButton from './column_back_button';
+
 import { Icon }  from 'mastodon/components/icon';
 
+import ColumnBackButton from './column_back_button';
+
 export default class ColumnBackButtonSlim extends ColumnBackButton {
 
   render () {

app/javascript/mastodon/components/column_header.jsx

@@ -1,8 +1,11 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
+import { PureComponent } from 'react';
 import { createPortal } from 'react-dom';
-import classNames from 'classnames';
+
 import { FormattedMessage, injectIntl, defineMessages } from 'react-intl';
+
+import classNames from 'classnames';
+
 import { Icon }  from 'mastodon/components/icon';
 
 const messages = defineMessages({

app/javascript/mastodon/components/dismissable_banner.jsx

@@ -1,9 +1,12 @@
-import { PureComponent } from 'react';
-import { IconButton } from './icon_button';
 import PropTypes from 'prop-types';
+import { PureComponent } from 'react';
+
 import { injectIntl, defineMessages } from 'react-intl';
+
 import { bannerSettings } from 'mastodon/settings';
 
+import { IconButton } from './icon_button';
+
 const messages = defineMessages({
   dismiss: { id: 'dismissable_banner.dismiss', defaultMessage: 'Dismiss' },
 });

app/javascript/mastodon/components/dropdown_menu.jsx

@@ -1,12 +1,17 @@
-import { PureComponent, cloneElement, Children } from 'react';
 import PropTypes from 'prop-types';
-import ImmutablePropTypes from 'react-immutable-proptypes';
-import { IconButton } from './icon_button';
-import Overlay from 'react-overlays/Overlay';
-import { supportsPassiveEvents } from 'detect-passive-events';
+import { PureComponent, cloneElement, Children } from 'react';
+
 import classNames from 'classnames';
+
+import ImmutablePropTypes from 'react-immutable-proptypes';
+
+import { supportsPassiveEvents } from 'detect-passive-events';
+import Overlay from 'react-overlays/Overlay';
+
 import { CircularProgress } from 'mastodon/components/loading_indicator';
 
+import { IconButton } from './icon_button';
+
 const listenerOptions = supportsPassiveEvents ? { passive: true, capture: true } : true;
 let id = 0;
 

app/javascript/mastodon/components/edited_timestamp/containers/dropdown_menu_container.js

@@ -1,4 +1,5 @@
 import { connect } from 'react-redux';
+
 import { openDropdownMenu, closeDropdownMenu } from 'mastodon/actions/dropdown_menu';
 import { fetchHistory } from 'mastodon/actions/history';
 import DropdownMenu from 'mastodon/components/dropdown_menu';

app/javascript/mastodon/components/edited_timestamp/index.jsx

@@ -1,12 +1,16 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
+import { PureComponent } from 'react';
+
 import { FormattedMessage, injectIntl } from 'react-intl';
-import { Icon }  from 'mastodon/components/icon';
-import DropdownMenu from './containers/dropdown_menu_container';
+
 import { connect } from 'react-redux';
+
 import { openModal } from 'mastodon/actions/modal';
-import { RelativeTimestamp } from 'mastodon/components/relative_timestamp';
+import { Icon }  from 'mastodon/components/icon';
 import InlineAccount from 'mastodon/components/inline_account';
+import { RelativeTimestamp } from 'mastodon/components/relative_timestamp';
+
+import DropdownMenu from './containers/dropdown_menu_container';
 
 const mapDispatchToProps = (dispatch, { statusId }) => ({
 

app/javascript/mastodon/components/error_boundary.jsx

@@ -1,10 +1,14 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
+import { PureComponent } from 'react';
+
 import { FormattedMessage } from 'react-intl';
-import { version, source_url } from 'mastodon/initial_state';
-import StackTrace from 'stacktrace-js';
+
 import { Helmet } from 'react-helmet';
 
+import StackTrace from 'stacktrace-js';
+
+import { version, source_url } from 'mastodon/initial_state';
+
 export default class ErrorBoundary extends PureComponent {
 
   static propTypes = {

app/javascript/mastodon/components/hashtag.jsx

@@ -1,13 +1,18 @@
 // @ts-check
-import { Component } from 'react';
-import { Sparklines, SparklinesCurve } from 'react-sparklines';
-import { FormattedMessage } from 'react-intl';
 import PropTypes from 'prop-types';
-import ImmutablePropTypes from 'react-immutable-proptypes';
+import { Component } from 'react';
+
+import { FormattedMessage } from 'react-intl';
+
+import classNames from 'classnames';
 import { Link } from 'react-router-dom';
+
+import ImmutablePropTypes from 'react-immutable-proptypes';
+
+import { Sparklines, SparklinesCurve } from 'react-sparklines';
+
 import ShortNumber from 'mastodon/components/short_number';
 import { Skeleton } from 'mastodon/components/skeleton';
-import classNames from 'classnames';
 
 class SilentErrorBoundary extends Component {
 

app/javascript/mastodon/components/inline_account.jsx

@@ -1,8 +1,10 @@
 import { PureComponent } from 'react';
+
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import { connect } from 'react-redux';
-import { makeGetAccount } from 'mastodon/selectors';
+
 import { Avatar } from 'mastodon/components/avatar';
+import { makeGetAccount } from 'mastodon/selectors';
 
 const makeMapStateToProps = () => {
   const getAccount = makeGetAccount();

app/javascript/mastodon/components/intersection_observer_article.jsx

@@ -1,7 +1,8 @@
-import { cloneElement, Component } from 'react';
 import PropTypes from 'prop-types';
-import scheduleIdleTask from '../features/ui/util/schedule_idle_task';
+import { cloneElement, Component } from 'react';
+
 import getRectFromEntry from '../features/ui/util/get_rect_from_entry';
+import scheduleIdleTask from '../features/ui/util/schedule_idle_task';
 
 // Diff these props in the "unrendered" state
 const updateOnPropsForUnrendered = ['id', 'index', 'listLength', 'cachedHeight'];

app/javascript/mastodon/components/load_gap.jsx

@@ -1,35 +0,0 @@
-import { PureComponent } from 'react';
-import PropTypes from 'prop-types';
-import { injectIntl, defineMessages } from 'react-intl';
-import { Icon }  from 'mastodon/components/icon';
-
-const messages = defineMessages({
-  load_more: { id: 'status.load_more', defaultMessage: 'Load more' },
-});
-
-class LoadGap extends PureComponent {
-
-  static propTypes = {
-    disabled: PropTypes.bool,
-    maxId: PropTypes.string,
-    onClick: PropTypes.func.isRequired,
-    intl: PropTypes.object.isRequired,
-  };
-
-  handleClick = () => {
-    this.props.onClick(this.props.maxId);
-  };
-
-  render () {
-    const { disabled, intl } = this.props;
-
-    return (
-      <button className='load-more load-gap' disabled={disabled} onClick={this.handleClick} aria-label={intl.formatMessage(messages.load_more)}>
-        <Icon id='ellipsis-h' />
-      </button>
-    );
-  }
-
-}
-
-export default injectIntl(LoadGap);

app/javascript/mastodon/components/load_gap.tsx

@@ -0,0 +1,36 @@
+import { useCallback } from 'react';
+
+import type { InjectedIntl } from 'react-intl';
+import { injectIntl, defineMessages } from 'react-intl';
+
+import { Icon } from 'mastodon/components/icon';
+
+const messages = defineMessages({
+  load_more: { id: 'status.load_more', defaultMessage: 'Load more' },
+});
+
+interface Props {
+  disabled: boolean;
+  maxId: string;
+  onClick: (maxId: string) => void;
+  intl: InjectedIntl;
+}
+
+export const LoadGap = injectIntl<Props>(
+  ({ disabled, maxId, onClick, intl }) => {
+    const handleClick = useCallback(() => {
+      onClick(maxId);
+    }, [maxId, onClick]);
+
+    return (
+      <button
+        className='load-more load-gap'
+        disabled={disabled}
+        onClick={handleClick}
+        aria-label={intl.formatMessage(messages.load_more)}
+      >
+        <Icon id='ellipsis-h' />
+      </button>
+    );
+  }
+);

app/javascript/mastodon/components/load_more.jsx

@@ -1,6 +1,7 @@
-import { PureComponent } from 'react';
-import { FormattedMessage } from 'react-intl';
 import PropTypes from 'prop-types';
+import { PureComponent } from 'react';
+
+import { FormattedMessage } from 'react-intl';
 
 export default class LoadMore extends PureComponent {
 

app/javascript/mastodon/components/load_pending.jsx

@@ -1,6 +1,7 @@
-import { PureComponent } from 'react';
-import { FormattedMessage } from 'react-intl';
 import PropTypes from 'prop-types';
+import { PureComponent } from 'react';
+
+import { FormattedMessage } from 'react-intl';
 
 export default class LoadPending extends PureComponent {
 

app/javascript/mastodon/components/media_attachments.jsx

@@ -1,10 +1,13 @@
 import PropTypes from 'prop-types';
+
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
-import { MediaGallery, Video, Audio } from 'mastodon/features/ui/util/async-components';
-import Bundle from 'mastodon/features/ui/components/bundle';
+
 import noop from 'lodash/noop';
 
+import Bundle from 'mastodon/features/ui/components/bundle';
+import { MediaGallery, Video, Audio } from 'mastodon/features/ui/util/async-components';
+
 export default class MediaAttachments extends ImmutablePureComponent {
 
   static propTypes = {

app/javascript/mastodon/components/media_gallery.jsx

@@ -1,14 +1,21 @@
-import { PureComponent } from 'react';
-import ImmutablePropTypes from 'react-immutable-proptypes';
 import PropTypes from 'prop-types';
-import { is } from 'immutable';
-import { IconButton } from './icon_button';
+import { PureComponent } from 'react';
+
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
+
 import classNames from 'classnames';
-import { autoPlayGif, cropImages, displayMedia, displayMediaExpand, useBlurhash } from '../initial_state';
+
+import { is } from 'immutable';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+
 import { debounce } from 'lodash';
+
 import { Blurhash } from 'mastodon/components/blurhash';
 
+import { autoPlayGif, cropImages, displayMedia, displayMediaExpand, useBlurhash } from '../initial_state';
+
+import { IconButton } from './icon_button';
+
 const messages = defineMessages({
   toggle_visible: { id: 'media_gallery.toggle_visible', defaultMessage: '{number, plural, one {Hide image} other {Hide images}}' },
 });

app/javascript/mastodon/components/modal_root.jsx

@@ -1,8 +1,9 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
+import { PureComponent } from 'react';
+
 import 'wicg-inert';
-import { createBrowserHistory } from 'history';
 import { multiply } from 'color-blend';
+import { createBrowserHistory } from 'history';
 
 export default class ModalRoot extends PureComponent {
 

app/javascript/mastodon/components/navigation_portal.jsx

@@ -1,8 +1,10 @@
 import { PureComponent } from 'react';
+
 import { Switch, Route, withRouter } from 'react-router-dom';
-import { showTrends } from 'mastodon/initial_state';
-import Trends from 'mastodon/features/getting_started/containers/trends_container';
+
 import AccountNavigation from 'mastodon/features/account/navigation';
+import Trends from 'mastodon/features/getting_started/containers/trends_container';
+import { showTrends } from 'mastodon/initial_state';
 
 const DefaultNavigation = () => (
   showTrends ? (

app/javascript/mastodon/components/picture_in_picture_placeholder.jsx

@@ -1,10 +1,13 @@
-import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
-import { Icon }  from 'mastodon/components/icon';
-import { removePictureInPicture } from 'mastodon/actions/picture_in_picture';
-import { connect } from 'react-redux';
+import { PureComponent } from 'react';
+
 import { FormattedMessage } from 'react-intl';
 
+import { connect } from 'react-redux';
+
+import { removePictureInPicture } from 'mastodon/actions/picture_in_picture';
+import { Icon }  from 'mastodon/components/icon';
+
 class PictureInPicturePlaceholder extends PureComponent {
 
   static propTypes = {

app/javascript/mastodon/components/poll.jsx

@@ -1,14 +1,20 @@
 import PropTypes from 'prop-types';
+
+import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
+
+import classNames from 'classnames';
+
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
-import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
-import classNames from 'classnames';
-import Motion from 'mastodon/features/ui/util/optional_motion';
-import spring from 'react-motion/lib/spring';
+
 import escapeTextContentForBrowser from 'escape-html';
-import emojify from 'mastodon/features/emoji/emoji';
-import { RelativeTimestamp } from './relative_timestamp';
+import spring from 'react-motion/lib/spring';
+
 import { Icon }  from 'mastodon/components/icon';
+import emojify from 'mastodon/features/emoji/emoji';
+import Motion from 'mastodon/features/ui/util/optional_motion';
+
+import { RelativeTimestamp } from './relative_timestamp';
 
 const messages = defineMessages({
   closed: {

app/javascript/mastodon/components/regeneration_indicator.jsx

@@ -1,4 +1,5 @@
 import { FormattedMessage } from 'react-intl';
+
 import illustration from 'mastodon/../images/elephant_ui_working.svg';
 
 const RegenerationIndicator = () => (

app/javascript/mastodon/components/scrollable_list.jsx

@@ -1,17 +1,23 @@
-import { Children, cloneElement, PureComponent } from 'react';
-import ScrollContainer from 'mastodon/containers/scroll_container';
 import PropTypes from 'prop-types';
+import { Children, cloneElement, PureComponent } from 'react';
+
+import classNames from 'classnames';
+
+import { List as ImmutableList } from 'immutable';
+import { connect } from 'react-redux';
+
+import { supportsPassiveEvents } from 'detect-passive-events';
+import { throttle } from 'lodash';
+
+import ScrollContainer from 'mastodon/containers/scroll_container';
+
 import IntersectionObserverArticleContainer from '../containers/intersection_observer_article_container';
+import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from '../features/ui/util/fullscreen';
+import IntersectionObserverWrapper from '../features/ui/util/intersection_observer_wrapper';
+
 import LoadMore from './load_more';
 import LoadPending from './load_pending';
-import IntersectionObserverWrapper from '../features/ui/util/intersection_observer_wrapper';
-import { throttle } from 'lodash';
-import { List as ImmutableList } from 'immutable';
-import classNames from 'classnames';
-import { supportsPassiveEvents } from 'detect-passive-events';
-import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from '../features/ui/util/fullscreen';
 import LoadingIndicator from './loading_indicator';
-import { connect } from 'react-redux';
 
 const MOUSE_IDLE_DELAY = 300;
 

app/javascript/mastodon/components/server_banner.jsx

@@ -1,14 +1,18 @@
 import PropTypes from 'prop-types';
 import { PureComponent } from 'react';
+
 import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
+
+import { Link } from 'react-router-dom';
+
 import { connect } from 'react-redux';
+
 import { fetchServer } from 'mastodon/actions/server';
+import { ServerHeroImage } from 'mastodon/components/server_hero_image';
 import ShortNumber from 'mastodon/components/short_number';
 import { Skeleton } from 'mastodon/components/skeleton';
 import Account from 'mastodon/containers/account_container';
 import { domain } from 'mastodon/initial_state';
-import { ServerHeroImage } from 'mastodon/components/server_hero_image';
-import { Link } from 'react-router-dom';
 
 const messages = defineMessages({
   aboutActiveUsers: { id: 'server_banner.about_active_users', defaultMessage: 'People using this server during the last 30 days (Monthly Active Users)' },

app/javascript/mastodon/components/short_number.jsx

@@ -1,7 +1,10 @@
-import { memo } from 'react';
 import PropTypes from 'prop-types';
-import { toShortNumber, pluralReady, DECIMAL_UNITS } from '../utils/numbers';
+import { memo } from 'react';
+
 import { FormattedMessage, FormattedNumber } from 'react-intl';
+
+import { toShortNumber, pluralReady, DECIMAL_UNITS } from '../utils/numbers';
+
 // @ts-check
 
 /**

app/javascript/mastodon/components/status.jsx

@@ -1,26 +1,32 @@
-import ImmutablePropTypes from 'react-immutable-proptypes';
 import PropTypes from 'prop-types';
-import { Avatar } from './avatar';
-import { AvatarOverlay } from './avatar_overlay';
-import { RelativeTimestamp } from './relative_timestamp';
-import { DisplayName } from './display_name';
-import StatusContent from './status_content';
-import StatusActionBar from './status_action_bar';
-import StatusEmojiReactionsBar from './status_emoji_reactions_bar';
-import AttachmentList from './attachment_list';
-import Card from '../features/status/components/card';
+
 import { injectIntl, defineMessages, FormattedMessage } from 'react-intl';
-import ImmutablePureComponent from 'react-immutable-pure-component';
-import { MediaGallery, Video, Audio } from '../features/ui/util/async-components';
-import { HotKeys } from 'react-hotkeys';
+
 import classNames from 'classnames';
+
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+
+import { HotKeys } from 'react-hotkeys';
+
 import { Icon }  from 'mastodon/components/icon';
-import { displayMedia } from '../initial_state';
 import PictureInPicturePlaceholder from 'mastodon/components/picture_in_picture_placeholder';
 
+import Card from '../features/status/components/card';
 // We use the component (and not the container) since we do not want
 // to use the progress bar to show download progress
 import Bundle from '../features/ui/components/bundle';
+import { MediaGallery, Video, Audio } from '../features/ui/util/async-components';
+import { displayMedia } from '../initial_state';
+
+import AttachmentList from './attachment_list';
+import { Avatar } from './avatar';
+import { AvatarOverlay } from './avatar_overlay';
+import { DisplayName } from './display_name';
+import { RelativeTimestamp } from './relative_timestamp';
+import StatusActionBar from './status_action_bar';
+import StatusContent from './status_content';
+import StatusEmojiReactionsBar from './status_emoji_reactions_bar';
 
 export const textForScreenReader = (intl, status, rebloggedByText = false) => {
   const displayName = status.getIn(['account', 'display_name']);
@@ -55,7 +61,7 @@ const messages = defineMessages({
   public_short: { id: 'privacy.public.short', defaultMessage: 'Public' },
   unlisted_short: { id: 'privacy.unlisted.short', defaultMessage: 'Unlisted' },
   public_unlisted_short: { id: 'privacy.public_unlisted.short', defaultMessage: 'Public unlisted' },
-  private_short: { id: 'privacy.private.short', defaultMessage: 'Followers-only' },
+  private_short: { id: 'privacy.private.short', defaultMessage: 'Followers only' },
   direct_short: { id: 'privacy.direct.short', defaultMessage: 'Mentioned people only' },
   edited: { id: 'status.edited', defaultMessage: 'Edited {date}' },
 });

app/javascript/mastodon/components/status_action_bar.jsx

@@ -1,14 +1,21 @@
-import ImmutablePropTypes from 'react-immutable-proptypes';
-import { connect } from 'react-redux';
 import PropTypes from 'prop-types';
-import { IconButton } from './icon_button';
+
+import { defineMessages, injectIntl } from 'react-intl';
+
+import classNames from 'classnames';
+
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import { connect } from 'react-redux';
+
+import { PERMISSION_MANAGE_USERS, PERMISSION_MANAGE_FEDERATION } from 'mastodon/permissions';
+
 import DropdownMenuContainer from '../containers/dropdown_menu_container';
 import EmojiPickerDropdown from '../features/compose/containers/emoji_picker_dropdown_container';
-import { defineMessages, injectIntl } from 'react-intl';
-import ImmutablePureComponent from 'react-immutable-pure-component';
 import { me } from '../initial_state';
-import classNames from 'classnames';
-import { PERMISSION_MANAGE_USERS, PERMISSION_MANAGE_FEDERATION } from 'mastodon/permissions';
+
+import { IconButton } from './icon_button';
+
 
 const messages = defineMessages({
   delete: { id: 'status.delete', defaultMessage: 'Delete' },
@@ -113,7 +120,6 @@ class StatusActionBar extends ImmutablePureComponent {
 
   handleShareClick = () => {
     navigator.share({
-      text: this.props.status.get('search_index'),
       url: this.props.status.get('url'),
     }).catch((e) => {
       if (e.name !== 'AbortError') console.error(e);
@@ -271,6 +277,10 @@ class StatusActionBar extends ImmutablePureComponent {
 
     menu.push({ text: intl.formatMessage(messages.copy), action: this.handleCopy });
 
+    if (publicStatus && 'share' in navigator) {
+      menu.push({ text: intl.formatMessage(messages.share), action: this.handleShareClick });
+    }
+
     if (publicStatus) {
       menu.push({ text: intl.formatMessage(messages.embed), action: this.handleEmbed });
     }
@@ -368,10 +378,6 @@ class StatusActionBar extends ImmutablePureComponent {
       reblogTitle = intl.formatMessage(messages.cannot_reblog);
     }
 
-    const shareButton = ('share' in navigator) && publicStatus && (
-      <IconButton className='status__action-bar__button' title={intl.formatMessage(messages.share)} icon='share-alt' onClick={this.handleShareClick} />
-    );
-
     const filterButton = this.props.onFilter && (
       <IconButton className='status__action-bar__button' title={intl.formatMessage(messages.hide)} icon='eye' onClick={this.handleHideClick} />
     );
@@ -388,8 +394,6 @@ class StatusActionBar extends ImmutablePureComponent {
         <IconButton className='status__action-bar__button bookmark-icon' disabled={!signedIn} active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} />
         <EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={emojiPickerButton} />
 
-        {shareButton}
-
         {filterButton}
 
         <div className='status__action-bar__dropdown'>

app/javascript/mastodon/components/status_content.jsx

@@ -1,12 +1,16 @@
-import { PureComponent } from 'react';
-import ImmutablePropTypes from 'react-immutable-proptypes';
 import PropTypes from 'prop-types';
+import { PureComponent } from 'react';
+
 import { FormattedMessage, injectIntl } from 'react-intl';
-import { Link } from 'react-router-dom';
-import { connect } from 'react-redux';
+
 import classnames from 'classnames';
-import PollContainer from 'mastodon/containers/poll_container';
+import { Link } from 'react-router-dom';
+
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import { connect } from 'react-redux';
+
 import { Icon }  from 'mastodon/components/icon';
+import PollContainer from 'mastodon/containers/poll_container';
 import { autoPlayGif, languages as preloadedLanguages } from 'mastodon/initial_state';
 
 const MAX_HEIGHT = 706; // 22px * 32 (+ 2px padding at the top)

app/javascript/mastodon/components/status_list.jsx

@@ -1,12 +1,17 @@
-import { debounce } from 'lodash';
-import ImmutablePropTypes from 'react-immutable-proptypes';
 import PropTypes from 'prop-types';
-import StatusContainer from '../containers/status_container';
+
+import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
-import LoadGap from './load_gap';
-import ScrollableList from './scrollable_list';
+
+import { debounce } from 'lodash';
+
 import RegenerationIndicator from 'mastodon/components/regeneration_indicator';
 
+import StatusContainer from '../containers/status_container';
+
+import { LoadGap } from './load_gap';
+import ScrollableList from './scrollable_list';
+
 export default class StatusList extends ImmutablePureComponent {
 
   static propTypes = {