update emoji reactions support

app/javascript/flavours/glitch/actions/accounts.js

@@ -106,7 +106,6 @@ export function fetchAccount(id) {
 
     api(getState).get(`/api/v1/accounts/${id}`).then(response => {
       dispatch(importFetchedAccount(response.data));
-    }).then(() => {
       dispatch(fetchAccountSuccess());
     }).catch(error => {
       dispatch(fetchAccountFail(id, error));

app/javascript/flavours/glitch/actions/identity_proofs.js

@@ -1,31 +0,0 @@
-import api from '../api';
-
-export const IDENTITY_PROOFS_ACCOUNT_FETCH_REQUEST = 'IDENTITY_PROOFS_ACCOUNT_FETCH_REQUEST';
-export const IDENTITY_PROOFS_ACCOUNT_FETCH_SUCCESS = 'IDENTITY_PROOFS_ACCOUNT_FETCH_SUCCESS';
-export const IDENTITY_PROOFS_ACCOUNT_FETCH_FAIL    = 'IDENTITY_PROOFS_ACCOUNT_FETCH_FAIL';
-
-export const fetchAccountIdentityProofs = accountId => (dispatch, getState) => {
-  dispatch(fetchAccountIdentityProofsRequest(accountId));
-
-  api(getState).get(`/api/v1/accounts/${accountId}/identity_proofs`)
-    .then(({ data }) => dispatch(fetchAccountIdentityProofsSuccess(accountId, data)))
-    .catch(err => dispatch(fetchAccountIdentityProofsFail(accountId, err)));
-};
-
-export const fetchAccountIdentityProofsRequest = id => ({
-  type: IDENTITY_PROOFS_ACCOUNT_FETCH_REQUEST,
-  id,
-});
-
-export const fetchAccountIdentityProofsSuccess = (accountId, identity_proofs) => ({
-  type: IDENTITY_PROOFS_ACCOUNT_FETCH_SUCCESS,
-  accountId,
-  identity_proofs,
-});
-
-export const fetchAccountIdentityProofsFail = (accountId, err) => ({
-  type: IDENTITY_PROOFS_ACCOUNT_FETCH_FAIL,
-  accountId,
-  err,
-  skipNotFound: true,
-});

app/javascript/flavours/glitch/actions/importer/normalizer.js

@@ -1,8 +1,8 @@
 import escapeTextContentForBrowser from 'escape-html';
 
-import emojify from 'flavours/glitch/features/emoji/emoji';
+import emojify from '../../features/emoji/emoji';
-import { autoHideCW } from 'flavours/glitch/utils/content_warning';
+import { autoHideCW } from '../../utils/content_warning';
-import { unescapeHTML } from 'flavours/glitch/utils/html';
+import { unescapeHTML } from '../../utils/html';
 
 const domParser = new DOMParser();
 

app/javascript/flavours/glitch/actions/interactions.js

@@ -93,6 +93,7 @@ export function reblogRequest(status) {
   return {
     type: REBLOG_REQUEST,
     status: status,
+    skipLoading: true,
   };
 }
 
@@ -100,6 +101,7 @@ export function reblogSuccess(status) {
   return {
     type: REBLOG_SUCCESS,
     status: status,
+    skipLoading: true,
   };
 }
 
@@ -108,6 +110,7 @@ export function reblogFail(status, error) {
     type: REBLOG_FAIL,
     status: status,
     error: error,
+    skipLoading: true,
   };
 }
 
@@ -115,6 +118,7 @@ export function unreblogRequest(status) {
   return {
     type: UNREBLOG_REQUEST,
     status: status,
+    skipLoading: true,
   };
 }
 
@@ -122,6 +126,7 @@ export function unreblogSuccess(status) {
   return {
     type: UNREBLOG_SUCCESS,
     status: status,
+    skipLoading: true,
   };
 }
 
@@ -130,6 +135,7 @@ export function unreblogFail(status, error) {
     type: UNREBLOG_FAIL,
     status: status,
     error: error,
+    skipLoading: true,
   };
 }
 
@@ -163,6 +169,7 @@ export function favouriteRequest(status) {
   return {
     type: FAVOURITE_REQUEST,
     status: status,
+    skipLoading: true,
   };
 }
 
@@ -170,6 +177,7 @@ export function favouriteSuccess(status) {
   return {
     type: FAVOURITE_SUCCESS,
     status: status,
+    skipLoading: true,
   };
 }
 
@@ -178,6 +186,7 @@ export function favouriteFail(status, error) {
     type: FAVOURITE_FAIL,
     status: status,
     error: error,
+    skipLoading: true,
   };
 }
 
@@ -185,6 +194,7 @@ export function unfavouriteRequest(status) {
   return {
     type: UNFAVOURITE_REQUEST,
     status: status,
+    skipLoading: true,
   };
 }
 
@@ -192,6 +202,7 @@ export function unfavouriteSuccess(status) {
   return {
     type: UNFAVOURITE_SUCCESS,
     status: status,
+    skipLoading: true,
   };
 }
 
@@ -200,6 +211,7 @@ export function unfavouriteFail(status, error) {
     type: UNFAVOURITE_FAIL,
     status: status,
     error: error,
+    skipLoading: true,
   };
 }
 
@@ -209,7 +221,7 @@ export function bookmark(status) {
 
     api(getState).post(`/api/v1/statuses/${status.get('id')}/bookmark`).then(function (response) {
       dispatch(importFetchedStatus(response.data));
-      dispatch(bookmarkSuccess(status));
+      dispatch(bookmarkSuccess(status, response.data));
     }).catch(function (error) {
       dispatch(bookmarkFail(status, error));
     });
@@ -222,7 +234,7 @@ export function unbookmark(status) {
 
     api(getState).post(`/api/v1/statuses/${status.get('id')}/unbookmark`).then(response => {
       dispatch(importFetchedStatus(response.data));
-      dispatch(unbookmarkSuccess(status));
+      dispatch(unbookmarkSuccess(status, response.data));
     }).catch(error => {
       dispatch(unbookmarkFail(status, error));
     });
@@ -236,10 +248,11 @@ export function bookmarkRequest(status) {
   };
 }
 
-export function bookmarkSuccess(status) {
+export function bookmarkSuccess(status, response) {
   return {
     type: BOOKMARK_SUCCESS,
     status: status,
+    response: response,
   };
 }
 
@@ -258,10 +271,11 @@ export function unbookmarkRequest(status) {
   };
 }
 
-export function unbookmarkSuccess(status) {
+export function unbookmarkSuccess(status, response) {
   return {
     type: UNBOOKMARK_SUCCESS,
     status: status,
+    response: response,
   };
 }
 
@@ -454,6 +468,7 @@ export function pinRequest(status) {
   return {
     type: PIN_REQUEST,
     status,
+    skipLoading: true,
   };
 }
 
@@ -461,6 +476,7 @@ export function pinSuccess(status) {
   return {
     type: PIN_SUCCESS,
     status,
+    skipLoading: true,
   };
 }
 
@@ -469,6 +485,7 @@ export function pinFail(status, error) {
     type: PIN_FAIL,
     status,
     error,
+    skipLoading: true,
   };
 }
 
@@ -489,6 +506,7 @@ export function unpinRequest(status) {
   return {
     type: UNPIN_REQUEST,
     status,
+    skipLoading: true,
   };
 }
 
@@ -496,6 +514,7 @@ export function unpinSuccess(status) {
   return {
     type: UNPIN_SUCCESS,
     status,
+    skipLoading: true,
   };
 }
 
@@ -504,6 +523,7 @@ export function unpinFail(status, error) {
     type: UNPIN_FAIL,
     status,
     error,
+    skipLoading: true,
   };
 }
 

app/javascript/flavours/glitch/actions/mutes.js

@@ -1,9 +1,8 @@
-import { openModal } from 'flavours/glitch/actions/modal';
-
 import api, { getLinks } from '../api';
 
 import { fetchRelationships } from './accounts';
 import { importFetchedAccounts } from './importer';
+import { openModal } from './modal';
 
 export const MUTES_FETCH_REQUEST = 'MUTES_FETCH_REQUEST';
 export const MUTES_FETCH_SUCCESS = 'MUTES_FETCH_SUCCESS';

app/javascript/flavours/glitch/actions/notifications.js

@@ -5,10 +5,10 @@ import { List as ImmutableList } from 'immutable';
 
 import { compareId } from 'flavours/glitch/compare_id';
 import { usePendingItems as preferPendingItems } from 'flavours/glitch/initial_state';
-import { unescapeHTML } from 'flavours/glitch/utils/html';
-import { requestNotificationPermission } from 'flavours/glitch/utils/notifications';
 
 import api, { getLinks } from '../api';
+import { unescapeHTML } from '../utils/html';
+import { requestNotificationPermission } from '../utils/notifications';
 
 import { fetchFollowRequests, fetchRelationships } from './accounts';
 import {
@@ -21,9 +21,6 @@ import { submitMarkers } from './markers';
 import { register as registerPushNotifications } from './push_notifications';
 import { saveSettings } from './settings';
 
-
-
-
 export const NOTIFICATIONS_UPDATE      = 'NOTIFICATIONS_UPDATE';
 export const NOTIFICATIONS_UPDATE_NOOP = 'NOTIFICATIONS_UPDATE_NOOP';
 
@@ -65,7 +62,7 @@ defineMessages({
 const fetchRelatedRelationships = (dispatch, notifications) => {
   const accountIds = notifications.filter(item => ['follow', 'follow_request', 'admin.sign_up'].indexOf(item.type) !== -1).map(item => item.account.id);
 
-  if (accountIds > 0) {
+  if (accountIds.length > 0) {
     dispatch(fetchRelationships(accountIds));
   }
 };
@@ -131,6 +128,7 @@ export function updateNotifications(notification, intlMessages, intlLocale) {
       const body  = (notification.status && notification.status.spoiler_text.length > 0) ? notification.status.spoiler_text : unescapeHTML(notification.status ? notification.status.content : '');
 
       const notify = new Notification(title, { body, icon: notification.account.avatar, tag: notification.id });
+
       notify.addEventListener('click', () => {
         window.focus();
         notify.close();
@@ -141,7 +139,6 @@ export function updateNotifications(notification, intlMessages, intlLocale) {
 
 const excludeTypesFromSettings = state => state.getIn(['settings', 'notifications', 'shows']).filter(enabled => !enabled).keySeq().toJS();
 
-
 const excludeTypesFromFilter = filter => {
   const allTypes = ImmutableList([
     'follow',

app/javascript/flavours/glitch/actions/pin_statuses.js

@@ -1,10 +1,8 @@
-import { me } from 'flavours/glitch/initial_state';
-
 import api from '../api';
+import { me } from '../initial_state';
 
 import { importFetchedStatuses } from './importer';
 
-
 export const PINNED_STATUSES_FETCH_REQUEST = 'PINNED_STATUSES_FETCH_REQUEST';
 export const PINNED_STATUSES_FETCH_SUCCESS = 'PINNED_STATUSES_FETCH_SUCCESS';
 export const PINNED_STATUSES_FETCH_FAIL = 'PINNED_STATUSES_FETCH_FAIL';

app/javascript/flavours/glitch/actions/push_notifications/registerer.js

@@ -1,5 +1,7 @@
 import api from '../../api';
+import { me } from '../../initial_state';
 import { pushNotificationsSetting } from '../../settings';
+import { decode as decodeBase64 } from '../../utils/base64';
 
 import { setBrowserSupport, setSubscription, clearSubscription } from './setter';
 
@@ -10,13 +12,7 @@ const urlBase64ToUint8Array = (base64String) => {
     .replace(/-/g, '+')
     .replace(/_/g, '/');
 
-  const rawData = window.atob(base64);
+  return decodeBase64(base64);
-  const outputArray = new Uint8Array(rawData.length);
-
-  for (let i = 0; i < rawData.length; ++i) {
-    outputArray[i] = rawData.charCodeAt(i);
-  }
-  return outputArray;
 };
 
 const getApplicationServerKey = () => document.querySelector('[name="applicationServerKey"]').getAttribute('content');
@@ -36,7 +32,7 @@ const subscribe = (registration) =>
 const unsubscribe = ({ registration, subscription }) =>
   subscription ? subscription.unsubscribe().then(() => registration) : registration;
 
-const sendSubscriptionToBackend = (getState, subscription, me) => {
+const sendSubscriptionToBackend = (subscription) => {
   const params = { subscription };
 
   if (me) {
@@ -46,7 +42,7 @@ const sendSubscriptionToBackend = (getState, subscription, me) => {
     }
   }
 
-  return api(getState).post('/api/web/push_subscriptions', params).then(response => response.data);
+  return api().post('/api/web/push_subscriptions', params).then(response => response.data);
 };
 
 // Last one checks for payload support: https://web-push-book.gauntface.com/chapter-06/01-non-standards-browsers/#no-payload
@@ -55,7 +51,6 @@ const supportsPushNotifications = ('serviceWorker' in navigator && 'PushManager'
 export function register () {
   return (dispatch, getState) => {
     dispatch(setBrowserSupport(supportsPushNotifications));
-    const me = getState().getIn(['meta', 'me']);
 
     if (supportsPushNotifications) {
       if (!getApplicationServerKey()) {
@@ -79,13 +74,13 @@ export function register () {
             } else {
               // Something went wrong, try to subscribe again
               return unsubscribe({ registration, subscription }).then(subscribe).then(
-                subscription => sendSubscriptionToBackend(getState, subscription, me));
+                subscription => sendSubscriptionToBackend(subscription));
             }
           }
 
           // No subscription, try to subscribe
           return subscribe(registration).then(
-            subscription => sendSubscriptionToBackend(getState, subscription, me));
+            subscription => sendSubscriptionToBackend(subscription));
         })
         .then(subscription => {
           // If we got a PushSubscription (and not a subscription object from the backend)
@@ -128,10 +123,9 @@ export function saveSettings() {
     const alerts = state.get('alerts');
     const data = { alerts };
 
-    api(getState).put(`/api/web/push_subscriptions/${subscription.get('id')}`, {
+    api().put(`/api/web/push_subscriptions/${subscription.get('id')}`, {
       data,
     }).then(() => {
-      const me = getState().getIn(['meta', 'me']);
       if (me) {
         pushNotificationsSetting.set(me, data);
       }

app/javascript/flavours/glitch/actions/settings.js

@@ -26,7 +26,7 @@ const debouncedSave = debounce((dispatch, getState) => {
 
   const data = getState().get('settings').filter((_, path) => path !== 'saved').toJS();
 
-  api(getState).put('/api/web/settings', { data })
+  api().put('/api/web/settings', { data })
     .then(() => dispatch({ type: SETTING_SAVE }))
     .catch(error => dispatch(showAlertForError(error)));
 }, 5000, { trailing: true });

app/javascript/flavours/glitch/actions/streaming.js

@@ -1,7 +1,6 @@
 // @ts-check
 
-import { getLocale } from 'flavours/glitch/locales';
+import { getLocale } from '../locales';
-
 import { connectStream } from '../stream';
 
 import {
@@ -68,8 +67,8 @@ export const connectTimelineStream = (timelineId, channelName, params = {}, opti
 
         // @ts-expect-error
         if (pollingId) {
-          clearTimeout(pollingId);
+          // @ts-ignore
-          pollingId = null;
+          clearTimeout(pollingId); pollingId = null;
         }
 
         if (options.fillGaps) {

app/javascript/flavours/glitch/components/__tests__/hashtag_bar.tsx

@@ -0,0 +1,214 @@
+import { fromJS } from 'immutable';
+
+import type { StatusLike } from '../hashtag_bar';
+import { computeHashtagBarForStatus } from '../hashtag_bar';
+
+function createStatus(
+  content: string,
+  hashtags: string[],
+  hasMedia = false,
+  spoilerText?: string,
+) {
+  return fromJS({
+    tags: hashtags.map((name) => ({ name })),
+    contentHtml: content,
+    media_attachments: hasMedia ? ['fakeMedia'] : [],
+    spoiler_text: spoilerText,
+  }) as unknown as StatusLike; // need to force the type here, as it is not properly defined
+}
+
+describe('computeHashtagBarForStatus', () => {
+  it('does nothing when there are no tags', () => {
+    const status = createStatus('<p>Simple text</p>', []);
+
+    const { hashtagsInBar, statusContentProps } =
+      computeHashtagBarForStatus(status);
+
+    expect(hashtagsInBar).toEqual([]);
+    expect(statusContentProps.statusContent).toMatchInlineSnapshot(
+      `"<p>Simple text</p>"`,
+    );
+  });
+
+  it('displays out of band hashtags in the bar', () => {
+    const status = createStatus(
+      '<p>Simple text <a href="test">#hashtag</a></p>',
+      ['hashtag', 'test'],
+    );
+
+    const { hashtagsInBar, statusContentProps } =
+      computeHashtagBarForStatus(status);
+
+    expect(hashtagsInBar).toEqual(['test']);
+    expect(statusContentProps.statusContent).toMatchInlineSnapshot(
+      `"<p>Simple text <a href="test">#hashtag</a></p>"`,
+    );
+  });
+
+  it('does not truncate the contents when the last child is a text node', () => {
+    const status = createStatus(
+      'this is a #<a class="zrl" href="https://example.com/search?tag=test">test</a>. Some more text',
+      ['test'],
+    );
+
+    const { hashtagsInBar, statusContentProps } =
+      computeHashtagBarForStatus(status);
+
+    expect(hashtagsInBar).toEqual([]);
+    expect(statusContentProps.statusContent).toMatchInlineSnapshot(
+      `"this is a #<a class="zrl" href="https://example.com/search?tag=test">test</a>. Some more text"`,
+    );
+  });
+
+  it('extract tags from the last line', () => {
+    const status = createStatus(
+      '<p>Simple text</p><p><a href="test">#hashtag</a></p>',
+      ['hashtag'],
+    );
+
+    const { hashtagsInBar, statusContentProps } =
+      computeHashtagBarForStatus(status);
+
+    expect(hashtagsInBar).toEqual(['hashtag']);
+    expect(statusContentProps.statusContent).toMatchInlineSnapshot(
+      `"<p>Simple text</p>"`,
+    );
+  });
+
+  it('does not include tags from content', () => {
+    const status = createStatus(
+      '<p>Simple text with a <a href="test">#hashtag</a></p><p><a href="test">#hashtag</a></p>',
+      ['hashtag'],
+    );
+
+    const { hashtagsInBar, statusContentProps } =
+      computeHashtagBarForStatus(status);
+
+    expect(hashtagsInBar).toEqual([]);
+    expect(statusContentProps.statusContent).toMatchInlineSnapshot(
+      `"<p>Simple text with a <a href="test">#hashtag</a></p>"`,
+    );
+  });
+
+  it('works with one line status and hashtags', () => {
+    const status = createStatus(
+      '<p><a href="test">#test</a>. And another <a href="test">#hashtag</a></p>',
+      ['hashtag', 'test'],
+    );
+
+    const { hashtagsInBar, statusContentProps } =
+      computeHashtagBarForStatus(status);
+
+    expect(hashtagsInBar).toEqual([]);
+    expect(statusContentProps.statusContent).toMatchInlineSnapshot(
+      `"<p><a href="test">#test</a>. And another <a href="test">#hashtag</a></p>"`,
+    );
+  });
+
+  it('de-duplicate accentuated characters with case differences', () => {
+    const status = createStatus(
+      '<p>Text</p><p><a href="test">#éaa</a> <a href="test">#Éaa</a></p>',
+      ['éaa'],
+    );
+
+    const { hashtagsInBar, statusContentProps } =
+      computeHashtagBarForStatus(status);
+
+    expect(hashtagsInBar).toEqual(['Éaa']);
+    expect(statusContentProps.statusContent).toMatchInlineSnapshot(
+      `"<p>Text</p>"`,
+    );
+  });
+
+  it('handles server-side normalized tags with accentuated characters', () => {
+    const status = createStatus(
+      '<p>Text</p><p><a href="test">#éaa</a> <a href="test">#Éaa</a></p>',
+      ['eaa'], // The server may normalize the hashtags in the `tags` attribute
+    );
+
+    const { hashtagsInBar, statusContentProps } =
+      computeHashtagBarForStatus(status);
+
+    expect(hashtagsInBar).toEqual(['Éaa']);
+    expect(statusContentProps.statusContent).toMatchInlineSnapshot(
+      `"<p>Text</p>"`,
+    );
+  });
+
+  it('does not display in bar a hashtag in content with a case difference', () => {
+    const status = createStatus(
+      '<p>Text <a href="test">#Éaa</a></p><p><a href="test">#éaa</a></p>',
+      ['éaa'],
+    );
+
+    const { hashtagsInBar, statusContentProps } =
+      computeHashtagBarForStatus(status);
+
+    expect(hashtagsInBar).toEqual([]);
+    expect(statusContentProps.statusContent).toMatchInlineSnapshot(
+      `"<p>Text <a href="test">#Éaa</a></p>"`,
+    );
+  });
+
+  it('does not modify a status with a line of hashtags only', () => {
+    const status = createStatus(
+      '<p><a href="test">#test</a>  <a href="test">#hashtag</a></p>',
+      ['test', 'hashtag'],
+    );
+
+    const { hashtagsInBar, statusContentProps } =
+      computeHashtagBarForStatus(status);
+
+    expect(hashtagsInBar).toEqual([]);
+    expect(statusContentProps.statusContent).toMatchInlineSnapshot(
+      `"<p><a href="test">#test</a>  <a href="test">#hashtag</a></p>"`,
+    );
+  });
+
+  it('puts the hashtags in the bar if a status content has hashtags in the only line and has a media', () => {
+    const status = createStatus(
+      '<p>This is my content! <a href="test">#hashtag</a></p>',
+      ['hashtag'],
+      true,
+    );
+
+    const { hashtagsInBar, statusContentProps } =
+      computeHashtagBarForStatus(status);
+
+    expect(hashtagsInBar).toEqual([]);
+    expect(statusContentProps.statusContent).toMatchInlineSnapshot(
+      `"<p>This is my content! <a href="test">#hashtag</a></p>"`,
+    );
+  });
+
+  it('puts the hashtags in the bar if a status content is only hashtags and has a media', () => {
+    const status = createStatus(
+      '<p><a href="test">#test</a>  <a href="test">#hashtag</a></p>',
+      ['test', 'hashtag'],
+      true,
+    );
+
+    const { hashtagsInBar, statusContentProps } =
+      computeHashtagBarForStatus(status);
+
+    expect(hashtagsInBar).toEqual(['test', 'hashtag']);
+    expect(statusContentProps.statusContent).toMatchInlineSnapshot(`""`);
+  });
+
+  it('does not use the hashtag bar if the status content is only hashtags, has a CW and a media', () => {
+    const status = createStatus(
+      '<p><a href="test">#test</a>  <a href="test">#hashtag</a></p>',
+      ['test', 'hashtag'],
+      true,
+      'My CW text',
+    );
+
+    const { hashtagsInBar, statusContentProps } =
+      computeHashtagBarForStatus(status);
+
+    expect(hashtagsInBar).toEqual([]);
+    expect(statusContentProps.statusContent).toMatchInlineSnapshot(
+      `"<p><a href="test">#test</a>  <a href="test">#hashtag</a></p>"`,
+    );
+  });
+});

app/javascript/flavours/glitch/components/account.jsx

@@ -6,7 +6,8 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 
 import { Skeleton } from 'flavours/glitch/components/skeleton';
-import { me } from 'flavours/glitch/initial_state';
+
+import { me } from '../initial_state';
 
 import { Avatar } from './avatar';
 import { DisplayName } from './display_name';
@@ -14,7 +15,6 @@ import { IconButton } from './icon_button';
 import Permalink from './permalink';
 import { RelativeTimestamp } from './relative_timestamp';
 
-
 const messages = defineMessages({
   follow: { id: 'account.follow', defaultMessage: 'Follow' },
   unfollow: { id: 'account.unfollow', defaultMessage: 'Unfollow' },

app/javascript/flavours/glitch/components/animated_number.tsx

@@ -1,5 +1,4 @@
 import { useCallback, useState } from 'react';
-import * as React from 'react';
 
 import { TransitionMotion, spring } from 'react-motion';
 

app/javascript/flavours/glitch/components/autosuggest_emoji.jsx

@@ -1,9 +1,10 @@
 import PropTypes from 'prop-types';
 import { PureComponent } from 'react';
 
-import { unicodeMapping } from 'flavours/glitch/features/emoji/emoji_unicode_mapping_light';
 import { assetHost } from 'flavours/glitch/utils/config';
 
+import { unicodeMapping } from '../features/emoji/emoji_unicode_mapping_light';
+
 export default class AutosuggestEmoji extends PureComponent {
 
   static propTypes = {
@@ -27,7 +28,7 @@ export default class AutosuggestEmoji extends PureComponent {
     }
 
     return (
-      <div className='emoji'>
+      <div className='autosuggest-emoji'>
         <img
           className='emojione'
           src={url}

app/javascript/flavours/glitch/components/autosuggest_input.jsx

@@ -5,7 +5,7 @@ import classNames from 'classnames';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 
-import AutosuggestAccountContainer from 'flavours/glitch/features/compose/containers/autosuggest_account_container';
+import AutosuggestAccountContainer from '../features/compose/containers/autosuggest_account_container';
 
 import AutosuggestEmoji from './autosuggest_emoji';
 import { AutosuggestHashtag } from './autosuggest_hashtag';

app/javascript/flavours/glitch/components/autosuggest_textarea.jsx

@@ -7,7 +7,7 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
 
 import Textarea from 'react-textarea-autosize';
 
-import AutosuggestAccountContainer from 'flavours/glitch/features/compose/containers/autosuggest_account_container';
+import AutosuggestAccountContainer from '../features/compose/containers/autosuggest_account_container';
 
 import AutosuggestEmoji from './autosuggest_emoji';
 import { AutosuggestHashtag } from './autosuggest_hashtag';

app/javascript/flavours/glitch/components/avatar.tsx

@@ -1,10 +1,8 @@
-import * as React from 'react';
-
 import classNames from 'classnames';
 
-import { useHovering } from 'flavours/glitch/hooks/useHovering';
+import { useHovering } from '../hooks/useHovering';
-import { autoPlayGif } from 'flavours/glitch/initial_state';
+import { autoPlayGif } from '../initial_state';
-import type { Account } from 'flavours/glitch/types/resources';
+import type { Account } from '../types/resources';
 
 interface Props {
   account: Account | undefined;

app/javascript/flavours/glitch/components/avatar_composite.jsx

@@ -3,7 +3,7 @@ import { PureComponent } from 'react';
 
 import ImmutablePropTypes from 'react-immutable-proptypes';
 
-import { autoPlayGif } from 'flavours/glitch/initial_state';
+import { autoPlayGif } from '../initial_state';
 
 export default class AvatarComposite extends PureComponent {
 

app/javascript/flavours/glitch/components/blurhash.tsx

@@ -1,5 +1,4 @@
-import { useRef, useEffect } from 'react';
+import { memo, useRef, useEffect } from 'react';
-import * as React from 'react';
 
 import { decode } from 'blurhash';
 
@@ -44,6 +43,6 @@ const Blurhash: React.FC<Props> = ({
   );
 };
 
-const MemoizedBlurhash = React.memo(Blurhash);
+const MemoizedBlurhash = memo(Blurhash);
 
 export { MemoizedBlurhash as Blurhash };

app/javascript/flavours/glitch/components/display_name.tsx

@@ -4,9 +4,8 @@ import classNames from 'classnames';
 
 import type { List } from 'immutable';
 
-import type { Account } from 'flavours/glitch/types/resources';
-
 import { autoPlayGif } from '../initial_state';
+import type { Account } from '../types/resources';
 
 import { Skeleton } from './skeleton';
 

app/javascript/flavours/glitch/components/domain.tsx

@@ -1,5 +1,4 @@
 import { useCallback } from 'react';
-import * as React from 'react';
 
 import { defineMessages, useIntl } from 'react-intl';
 

app/javascript/flavours/glitch/components/gifv.tsx

@@ -1,5 +1,4 @@
 import { useCallback, useState } from 'react';
-import * as React from 'react';
 
 interface Props {
   src: string;

app/javascript/flavours/glitch/components/icon.tsx

@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 import classNames from 'classnames';
 
 interface Props extends React.HTMLAttributes<HTMLImageElement> {

app/javascript/flavours/glitch/components/icon_button.tsx

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { PureComponent } from 'react';
 
 import classNames from 'classnames';
 
@@ -33,7 +33,7 @@ interface States {
   activate: boolean;
   deactivate: boolean;
 }
-export class IconButton extends React.PureComponent<Props, States> {
+export class IconButton extends PureComponent<Props, States> {
   static defaultProps = {
     size: 18,
     active: false,

app/javascript/flavours/glitch/components/icon_with_badge.tsx

@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 import { Icon } from './icon';
 
 const formatNumber = (num: number): number | string => (num > 40 ? '40+' : num);

app/javascript/flavours/glitch/components/intersection_observer_article.jsx

@@ -3,6 +3,7 @@ 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'];
 
@@ -38,7 +39,6 @@ export default class IntersectionObserverArticle extends Component {
     return true;
   }
 
-
   componentDidMount () {
     const { intersectionObserverWrapper, id } = this.props;
 
@@ -106,24 +106,24 @@ export default class IntersectionObserverArticle extends Component {
     const { children, id, index, listLength, cachedHeight } = this.props;
     const { isIntersecting, isHidden } = this.state;
 
-    const style = {};
-
     if (!isIntersecting && (isHidden || cachedHeight)) {
-      style.height = `${this.height || cachedHeight || 150}px`;
-      style.opacity = 0;
-      style.overflow = 'hidden';
-    }
-
       return (
         <article
           ref={this.handleRef}
           aria-posinset={index + 1}
           aria-setsize={listLength}
+          style={{ height: `${this.height || cachedHeight}px`, opacity: 0, overflow: 'hidden' }}
           data-id={id}
-        tabIndex={0}
+          tabIndex={-1}
-        style={style}
         >
-        {children && cloneElement(children, { hidden: !isIntersecting && (isHidden || !!cachedHeight) })}
+          {children && cloneElement(children, { hidden: true })}
+        </article>
+      );
+    }
+
+    return (
+      <article ref={this.handleRef} aria-posinset={index + 1} aria-setsize={listLength} data-id={id} tabIndex={-1}>
+        {children && cloneElement(children, { hidden: false })}
       </article>
     );
   }

app/javascript/flavours/glitch/components/media_gallery.jsx

@@ -11,7 +11,8 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import { debounce } from 'lodash';
 
 import { Blurhash } from 'flavours/glitch/components/blurhash';
-import { autoPlayGif, displayMedia, useBlurhash } from 'flavours/glitch/initial_state';
+
+import { autoPlayGif, displayMedia, useBlurhash } from '../initial_state';
 
 import { IconButton } from './icon_button';
 

app/javascript/flavours/glitch/components/modal_root.jsx

@@ -110,8 +110,9 @@ class ModalRoot extends PureComponent {
   }
 
   _handleModalClose () {
+    if (this.unlistenHistory) {
       this.unlistenHistory();
-
+    }
     const { state } = this.history.location;
     if (state && state.mastodonModalKey === this._modalHistoryKey) {
       this.history.goBack();

app/javascript/flavours/glitch/components/not_signed_in_indicator.tsx

@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 import { FormattedMessage } from 'react-intl';
 
 export const NotSignedInIndicator: React.FC = () => (

app/javascript/flavours/glitch/components/poll.jsx

@@ -16,7 +16,6 @@ import Motion from 'flavours/glitch/features/ui/util/optional_motion';
 
 import { RelativeTimestamp } from './relative_timestamp';
 
-
 const messages = defineMessages({
   closed: {
     id: 'poll.closed',

app/javascript/flavours/glitch/components/radio_button.tsx

@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 import classNames from 'classnames';
 
 interface Props {

app/javascript/flavours/glitch/components/scrollable_list.jsx

@@ -10,11 +10,11 @@ import { connect } from 'react-redux';
 import { supportsPassiveEvents } from 'detect-passive-events';
 import { throttle } from 'lodash';
 
-import IntersectionObserverArticleContainer from 'flavours/glitch/containers/intersection_observer_article_container';
 import ScrollContainer from 'flavours/glitch/containers/scroll_container';
-import IntersectionObserverWrapper from 'flavours/glitch/features/ui/util/intersection_observer_wrapper';
 
+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';

app/javascript/flavours/glitch/components/server_hero_image.tsx

@@ -1,5 +1,4 @@
 import { useCallback, useState } from 'react';
-import * as React from 'react';
 
 import classNames from 'classnames';
 

app/javascript/flavours/glitch/components/skeleton.tsx

@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 interface Props {
   width?: number | string;
   height?: number | string;

app/javascript/flavours/glitch/components/status.jsx

@@ -12,13 +12,15 @@ import { HotKeys } from 'react-hotkeys';
 import PictureInPicturePlaceholder from 'flavours/glitch/components/picture_in_picture_placeholder';
 import PollContainer from 'flavours/glitch/containers/poll_container';
 import NotificationOverlayContainer from 'flavours/glitch/features/notifications/containers/overlay_container';
-import { displayMedia, visibleReactions } from 'flavours/glitch/initial_state';
 import { autoUnfoldCW } from 'flavours/glitch/utils/content_warning';
 import { withOptionalRouter, WithOptionalRouterPropTypes } from 'flavours/glitch/utils/react_router';
 
 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, visibleReactions } from '../initial_state';
 
 import AttachmentList from './attachment_list';
 import { getHashtagBarForStatus } from './hashtag_bar';

app/javascript/flavours/glitch/components/status_action_bar.jsx

@@ -8,13 +8,14 @@ import { withRouter } from 'react-router-dom';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 
-import DropdownMenuContainer from 'flavours/glitch/containers/dropdown_menu_container';
-import EmojiPickerDropdown from 'flavours/glitch/features/compose/containers/emoji_picker_dropdown_container';
-import { me, maxReactions } from 'flavours/glitch/initial_state';
 import { PERMISSION_MANAGE_USERS, PERMISSION_MANAGE_FEDERATION } from 'flavours/glitch/permissions';
 import { accountAdminLink, statusAdminLink } from 'flavours/glitch/utils/backend_links';
 import { WithRouterPropTypes } from 'flavours/glitch/utils/react_router';
 
+import DropdownMenuContainer from '../containers/dropdown_menu_container';
+import EmojiPickerDropdown from '../features/compose/containers/emoji_picker_dropdown_container';
+import { me, maxReactions } from '../initial_state';
+
 import { IconButton } from './icon_button';
 import { RelativeTimestamp } from './relative_timestamp';
 
@@ -209,7 +210,6 @@ class StatusActionBar extends ImmutablePureComponent {
     const { permissions, signedIn } = this.context.identity;
 // =======
 //  const { permissions } = this.context.identity;
-    const anonymousAccess    = !me;
 // >>>>>>> emoji-reactions
     const mutingConversation = status.get('muted');
     const publicStatus       = ['public', 'unlisted'].includes(status.get('visibility'));

app/javascript/flavours/glitch/components/status_list.jsx

@@ -6,7 +6,8 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
 import { debounce } from 'lodash';
 
 import RegenerationIndicator from 'flavours/glitch/components/regeneration_indicator';
-import StatusContainer from 'flavours/glitch/containers/status_container';
+
+import StatusContainer from '../containers/status_container';
 
 import { LoadGap } from './load_gap';
 import ScrollableList from './scrollable_list';

app/javascript/flavours/glitch/components/timeline_hint.tsx

@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 import { FormattedMessage } from 'react-intl';
 
 interface Props {

app/javascript/flavours/glitch/containers/account_container.jsx

@@ -9,12 +9,12 @@ import {
   unblockAccount,
   muteAccount,
   unmuteAccount,
-} from 'flavours/glitch/actions/accounts';
+} from '../actions/accounts';
-import { openModal } from 'flavours/glitch/actions/modal';
+import { openModal } from '../actions/modal';
-import { initMuteModal } from 'flavours/glitch/actions/mutes';
+import { initMuteModal } from '../actions/mutes';
-import Account from 'flavours/glitch/components/account';
+import Account from '../components/account';
-import { unfollowModal } from 'flavours/glitch/initial_state';
+import { unfollowModal } from '../initial_state';
-import { makeGetAccount } from 'flavours/glitch/selectors';
+import { makeGetAccount } from '../selectors';
 
 const messages = defineMessages({
   unfollowConfirm: { id: 'confirmations.unfollow.confirm', defaultMessage: 'Unfollow' },

app/javascript/flavours/glitch/containers/compose_container.jsx

@@ -2,12 +2,13 @@ import { PureComponent } from 'react';
 
 import { Provider } from 'react-redux';
 
-import { fetchCustomEmojis } from 'flavours/glitch/actions/custom_emojis';
+import { fetchCustomEmojis } from '../actions/custom_emojis';
-import { hydrateStore } from 'flavours/glitch/actions/store';
+import { hydrateStore } from '../actions/store';
-import Compose from 'flavours/glitch/features/standalone/compose';
+import Compose from '../features/standalone/compose';
-import initialState from 'flavours/glitch/initial_state';
+import initialState from '../initial_state';
-import { IntlProvider } from 'flavours/glitch/locales';
+import { IntlProvider } from '../locales';
-import { store } from 'flavours/glitch/store';
+import { store } from '../store';
+
 
 if (initialState) {
   store.dispatch(hydrateStore(initialState));

app/javascript/flavours/glitch/containers/dropdown_menu_container.js

@@ -1,9 +1,8 @@
 import { connect } from 'react-redux';
 
-import { openDropdownMenu, closeDropdownMenu } from 'flavours/glitch/actions/dropdown_menu';
+import { openDropdownMenu, closeDropdownMenu } from '../actions/dropdown_menu';
-import { openModal, closeModal } from 'flavours/glitch/actions/modal';
+import { openModal, closeModal } from '../actions/modal';
-import DropdownMenu from 'flavours/glitch/components/dropdown_menu';
+import DropdownMenu from '../components/dropdown_menu';
-
 import { isUserTouching } from '../is_mobile';
 
 /**

app/javascript/flavours/glitch/containers/intersection_observer_article_container.js

@@ -1,7 +1,7 @@
 import { connect } from 'react-redux';
 
-import { setHeight } from 'flavours/glitch/actions/height_cache';
+import { setHeight } from '../actions/height_cache';
-import IntersectionObserverArticle from 'flavours/glitch/components/intersection_observer_article';
+import IntersectionObserverArticle from '../components/intersection_observer_article';
 
 const makeMapStateToProps = (state, props) => ({
   cachedHeight: state.getIn(['height_cache', props.saveHeightKey, props.id]),

app/javascript/flavours/glitch/features/account_gallery/components/media_item.jsx

@@ -9,8 +9,6 @@ import { Blurhash } from 'flavours/glitch/components/blurhash';
 import { Icon }  from 'flavours/glitch/components/icon';
 import { autoPlayGif, displayMedia, useBlurhash } from 'flavours/glitch/initial_state';
 
-
-
 export default class MediaItem extends ImmutablePureComponent {
 
   static propTypes = {

app/javascript/flavours/glitch/features/account_gallery/index.jsx

@@ -8,17 +8,18 @@ import { connect } from 'react-redux';
 
 import { lookupAccount, fetchAccount } from 'flavours/glitch/actions/accounts';
 import { openModal } from 'flavours/glitch/actions/modal';
-import { expandAccountMediaTimeline } from 'flavours/glitch/actions/timelines';
 import { LoadMore } from 'flavours/glitch/components/load_more';
 import { LoadingIndicator } from 'flavours/glitch/components/loading_indicator';
 import ScrollContainer from 'flavours/glitch/containers/scroll_container';
 import ProfileColumnHeader from 'flavours/glitch/features/account/components/profile_column_header';
-import HeaderContainer from 'flavours/glitch/features/account_timeline/containers/header_container';
 import BundleColumnError from 'flavours/glitch/features/ui/components/bundle_column_error';
-import Column from 'flavours/glitch/features/ui/components/column';
 import { normalizeForLookup } from 'flavours/glitch/reducers/accounts_map';
 import { getAccountGallery } from 'flavours/glitch/selectors';
 
+import { expandAccountMediaTimeline } from '../../actions/timelines';
+import HeaderContainer from '../account_timeline/containers/header_container';
+import Column from '../ui/components/column';
+
 import MediaItem from './components/media_item';
 
 const mapStateToProps = (state, { params: { acct, id } }) => {

app/javascript/flavours/glitch/features/account_timeline/components/header.jsx

@@ -7,10 +7,11 @@ import { NavLink, withRouter } from 'react-router-dom';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 
-import ActionBar from 'flavours/glitch/features/account/components/action_bar';
-import InnerHeader from 'flavours/glitch/features/account/components/header';
 import { WithRouterPropTypes } from 'flavours/glitch/utils/react_router';
 
+import ActionBar from '../../account/components/action_bar';
+import InnerHeader from '../../account/components/header';
+
 import MemorialNote from './memorial_note';
 import MovedNote from './moved_note';
 

app/javascript/flavours/glitch/features/account_timeline/containers/header_container.jsx

@@ -2,7 +2,7 @@ import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 
 import { connect } from 'react-redux';
 
-import { initEditAccountNote } from 'flavours/glitch/actions/account_notes';
+import { initEditAccountNote } from '../../../actions/account_notes';
 import {
   followAccount,
   unfollowAccount,
@@ -10,19 +10,18 @@ import {
   unmuteAccount,
   pinAccount,
   unpinAccount,
-} from 'flavours/glitch/actions/accounts';
+} from '../../../actions/accounts';
-import { initBlockModal } from 'flavours/glitch/actions/blocks';
+import { initBlockModal } from '../../../actions/blocks';
 import {
   mentionCompose,
   directCompose,
-} from 'flavours/glitch/actions/compose';
+} from '../../../actions/compose';
-import { blockDomain, unblockDomain } from 'flavours/glitch/actions/domain_blocks';
+import { blockDomain, unblockDomain } from '../../../actions/domain_blocks';
-import { openModal } from 'flavours/glitch/actions/modal';
+import { openModal } from '../../../actions/modal';
-import { initMuteModal } from 'flavours/glitch/actions/mutes';
+import { initMuteModal } from '../../../actions/mutes';
-import { initReport } from 'flavours/glitch/actions/reports';
+import { initReport } from '../../../actions/reports';
-import { unfollowModal } from 'flavours/glitch/initial_state';
+import { unfollowModal } from '../../../initial_state';
-import { makeGetAccount, getAccountHidden } from 'flavours/glitch/selectors';
+import { makeGetAccount, getAccountHidden } from '../../../selectors';
-
 import Header from '../components/header';
 
 const messages = defineMessages({

app/javascript/flavours/glitch/features/account_timeline/index.jsx

@@ -7,13 +7,13 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import { connect } from 'react-redux';
 
-import { lookupAccount, fetchAccount } from 'flavours/glitch/actions/accounts';
 import { TimelineHint } from 'flavours/glitch/components/timeline_hint';
 import ProfileColumnHeader from 'flavours/glitch/features/account/components/profile_column_header';
 import BundleColumnError from 'flavours/glitch/features/ui/components/bundle_column_error';
 import { normalizeForLookup } from 'flavours/glitch/reducers/accounts_map';
 import { getAccountHidden } from 'flavours/glitch/selectors';
 
+import { lookupAccount, fetchAccount } from '../../actions/accounts';
 import { fetchFeaturedTags } from '../../actions/featured_tags';
 import { expandAccountFeaturedTimeline, expandAccountTimeline } from '../../actions/timelines';
 import { LoadingIndicator } from '../../components/loading_indicator';
@@ -23,13 +23,6 @@ import Column from '../ui/components/column';
 import LimitedAccountHint from './components/limited_account_hint';
 import HeaderContainer from './containers/header_container';
 
-
-
-
-
-
-
-
 const emptyList = ImmutableList();
 
 const mapStateToProps = (state, { params: { acct, id, tagged }, withReplies = false }) => {

app/javascript/flavours/glitch/features/audio/index.jsx

@@ -9,15 +9,14 @@ import { is } from 'immutable';
 
 import { throttle, debounce } from 'lodash';
 
-import { Blurhash } from 'flavours/glitch/components/blurhash';
 import { Icon } from 'flavours/glitch/components/icon';
 import { formatTime, getPointerPosition, fileNameFromURL } from 'flavours/glitch/features/video';
-import { displayMedia, useBlurhash } from 'flavours/glitch/initial_state';
+
+import { Blurhash } from '../../components/blurhash';
+import { displayMedia, useBlurhash } from '../../initial_state';
 
 import Visualizer from './visualizer';
 
-
-
 const messages = defineMessages({
   play: { id: 'video.play', defaultMessage: 'Play' },
   pause: { id: 'video.pause', defaultMessage: 'Pause' },

app/javascript/flavours/glitch/features/blocks/index.jsx

@@ -8,13 +8,12 @@ import { connect } from 'react-redux';
 
 import { debounce } from 'lodash';
 
-import { fetchBlocks, expandBlocks } from 'flavours/glitch/actions/blocks';
+import { fetchBlocks, expandBlocks } from '../../actions/blocks';
-import ColumnBackButtonSlim from 'flavours/glitch/components/column_back_button_slim';
+import ColumnBackButtonSlim from '../../components/column_back_button_slim';
-import { LoadingIndicator } from 'flavours/glitch/components/loading_indicator';
+import { LoadingIndicator } from '../../components/loading_indicator';
-import AccountContainer from 'flavours/glitch/containers/account_container';
-import Column from 'flavours/glitch/features/ui/components/column';
-
 import ScrollableList from '../../components/scrollable_list';
+import AccountContainer from '../../containers/account_container';
+import Column from '../ui/components/column';
 
 const messages = defineMessages({
   heading: { id: 'column.blocks', defaultMessage: 'Blocked users' },

app/javascript/flavours/glitch/features/community_timeline/containers/column_settings_container.js

@@ -1,8 +1,7 @@
 import { connect } from 'react-redux';
 
-import { changeColumnParams } from 'flavours/glitch/actions/columns';
+import { changeColumnParams } from '../../../actions/columns';
-import { changeSetting } from 'flavours/glitch/actions/settings';
+import { changeSetting } from '../../../actions/settings';
-
 import ColumnSettings from '../components/column_settings';
 
 const mapStateToProps = (state, { columnId }) => {

app/javascript/flavours/glitch/features/community_timeline/index.jsx

@@ -7,15 +7,16 @@ import { Helmet } from 'react-helmet';
 
 import { connect } from 'react-redux';
 
-import { addColumn, removeColumn, moveColumn } from 'flavours/glitch/actions/columns';
-import { connectCommunityStream } from 'flavours/glitch/actions/streaming';
-import { expandCommunityTimeline } from 'flavours/glitch/actions/timelines';
-import Column from 'flavours/glitch/components/column';
-import ColumnHeader from 'flavours/glitch/components/column_header';
 import { DismissableBanner } from 'flavours/glitch/components/dismissable_banner';
-import StatusListContainer from 'flavours/glitch/features/ui/containers/status_list_container';
 import { domain } from 'flavours/glitch/initial_state';
 
+import { addColumn, removeColumn, moveColumn } from '../../actions/columns';
+import { connectCommunityStream } from '../../actions/streaming';
+import { expandCommunityTimeline } from '../../actions/timelines';
+import Column from '../../components/column';
+import ColumnHeader from '../../components/column_header';
+import StatusListContainer from '../ui/containers/status_list_container';
+
 import ColumnSettingsContainer from './containers/column_settings_container';
 
 const messages = defineMessages({

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

@@ -1,8 +1,8 @@
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 
-import { Avatar } from 'flavours/glitch/components/avatar';
+import { Avatar } from '../../../components/avatar';
-import { DisplayName } from 'flavours/glitch/components/display_name';
+import { DisplayName } from '../../../components/display_name';
 
 export default class AutosuggestAccount extends ImmutablePureComponent {
 
@@ -14,8 +14,8 @@ export default class AutosuggestAccount extends ImmutablePureComponent {
     const { account } = this.props;
 
     return (
-      <div className='account small' title={account.get('acct')}>
+      <div className='autosuggest-account' title={account.get('acct')}>
-        <div className='account__avatar-wrapper'><Avatar account={account} size={24} /></div>
+        <div className='autosuggest-account-icon'><Avatar account={account} size={24} /></div>
         <DisplayName account={account} inline />
       </div>
     );

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

@@ -103,12 +103,12 @@ class ModifierPickerMenu extends PureComponent {
 
     return (
       <div className='emoji-picker-dropdown__modifiers__menu' style={{ display: active ? 'block' : 'none' }} ref={this.setRef}>
-        <button onClick={this.handleClick} data-index={1}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={1} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>
+        <button type='button' onClick={this.handleClick} data-index={1}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={1} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>
-        <button onClick={this.handleClick} data-index={2}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={2} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>
+        <button type='button' onClick={this.handleClick} data-index={2}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={2} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>
-        <button onClick={this.handleClick} data-index={3}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={3} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>
+        <button type='button' onClick={this.handleClick} data-index={3}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={3} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>
-        <button onClick={this.handleClick} data-index={4}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={4} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>
+        <button type='button' onClick={this.handleClick} data-index={4}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={4} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>
-        <button onClick={this.handleClick} data-index={5}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={5} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>
+        <button type='button' onClick={this.handleClick} data-index={5}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={5} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>
-        <button onClick={this.handleClick} data-index={6}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={6} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>
+        <button type='button' onClick={this.handleClick} data-index={6}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={6} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>
       </div>
     );
   }

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

@@ -5,10 +5,11 @@ import { FormattedMessage } from 'react-intl';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 
-import { Avatar } from 'flavours/glitch/components/avatar';
 import Permalink from 'flavours/glitch/components/permalink';
 import { profileLink } from 'flavours/glitch/utils/backend_links';
 
+import { Avatar } from '../../../components/avatar';
+
 import ActionBar from './action_bar';
 
 export default class NavigationBar extends ImmutablePureComponent {

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

@@ -1,7 +1,7 @@
 import PropTypes from 'prop-types';
 import { PureComponent } from 'react';
 
-import { defineMessages, injectIntl } from 'react-intl';
+import { injectIntl, defineMessages } from 'react-intl';
 
 import Dropdown from './dropdown';
 

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

@@ -28,7 +28,6 @@ class ReplyIndicator extends ImmutablePureComponent {
     }
   };
 
-  //  Rendering.
   render () {
     const { status, intl } = this.props;
 
@@ -40,7 +39,6 @@ class ReplyIndicator extends ImmutablePureComponent {
     const content     = status.get('content');
     const attachments = status.get('media_attachments');
 
-    //  The result.
     return (
       <article className='reply-indicator'>
         <header className='reply-indicator__header'>

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

@@ -82,13 +82,9 @@ class Search extends PureComponent {
   };
 
   handleClear = e => {
-    const {
+    const { value, submitted, onClear } = this.props;
-      onClear,
-      submitted,
-      value,
-    } = this.props;
 
-    e.preventDefault();  //  Prevents focus change ??
+    e.preventDefault();
 
     if (value.length > 0 || submitted) {
       onClear();
@@ -160,6 +156,7 @@ class Search extends PureComponent {
           search.forget(e);
         }
       }
+
       break;
     }
   };
@@ -342,6 +339,7 @@ class Search extends PureComponent {
           <Icon id='search' className={hasValue ? '' : 'active'} />
           <Icon id='times-circle' className={hasValue ? 'active' : ''} />
         </div>
+
         <div className='search__popout'>
           {options.length === 0 && (
             <>
@@ -361,6 +359,7 @@ class Search extends PureComponent {
               </div>
             </>
           )}
+
           {options.length > 0 && (
             <>
               <h4><FormattedMessage id='search_popout.quick_actions' defaultMessage='Quick actions' /></h4>

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

@@ -5,13 +5,14 @@ import { FormattedMessage } from 'react-intl';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 
-import { ImmutableHashtag as Hashtag } from 'flavours/glitch/components/hashtag';
 import { Icon } from 'flavours/glitch/components/icon';
 import { LoadMore } from 'flavours/glitch/components/load_more';
-import AccountContainer from 'flavours/glitch/containers/account_container';
-import StatusContainer from 'flavours/glitch/containers/status_container';
 import { SearchSection } from 'flavours/glitch/features/explore/components/search_section';
 
+import { ImmutableHashtag as Hashtag } from '../../../components/hashtag';
+import AccountContainer from '../../../containers/account_container';
+import StatusContainer from '../../../containers/status_container';
+
 const INITIAL_PAGE_LIMIT = 10;
 
 const withoutLastResult = list => {

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

@@ -22,13 +22,13 @@ export default class TextIconButton extends PureComponent {
 
     return (
       <button
+        type='button'
         title={title}
         aria-label={title}
         className={`text-icon-button ${active ? 'active' : ''}`}
         aria-expanded={active}
         onClick={this.props.onClick}
-        aria-controls={ariaControls}
+        aria-controls={ariaControls} style={iconStyle}
-        style={iconStyle}
       >
         {label}
       </button>

app/javascript/flavours/glitch/features/compose/containers/autosuggest_account_container.js

@@ -1,7 +1,6 @@
 import { connect } from 'react-redux';
 
-import { makeGetAccount } from 'flavours/glitch/selectors';
+import { makeGetAccount } from '../../../selectors';
-
 import AutosuggestAccount from '../components/autosuggest_account';
 
 const makeMapStateToProps = () => {

app/javascript/flavours/glitch/features/compose/containers/compose_form_container.js

@@ -2,24 +2,24 @@ import { defineMessages, injectIntl } from 'react-intl';
 
 import { connect } from 'react-redux';
 
+import { privacyPreference } from 'flavours/glitch/utils/privacy_preference';
+
 import {
   changeCompose,
+  submitCompose,
+  clearComposeSuggestions,
+  fetchComposeSuggestions,
+  selectComposeSuggestion,
   changeComposeSpoilerText,
   changeComposeSpoilerness,
   changeComposeVisibility,
-  clearComposeSuggestions,
-  fetchComposeSuggestions,
   insertEmojiCompose,
-  selectComposeSuggestion,
-  submitCompose,
   uploadCompose,
-} from 'flavours/glitch/actions/compose';
+} from '../../../actions/compose';
-import { changeLocalSetting } from 'flavours/glitch/actions/local_settings';
+import { changeLocalSetting } from '../../../actions/local_settings';
 import {
   openModal,
-} from 'flavours/glitch/actions/modal';
+} from '../../../actions/modal';
-import { privacyPreference } from 'flavours/glitch/utils/privacy_preference';
-
 import ComposeForm from '../components/compose_form';
 
 const messages = defineMessages({

app/javascript/flavours/glitch/features/compose/containers/emoji_picker_dropdown_container.js

@@ -2,9 +2,8 @@ import { Map as ImmutableMap } from 'immutable';
 import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
 
-import { useEmoji } from 'flavours/glitch/actions/emojis';
+import { useEmoji } from '../../../actions/emojis';
-import { changeSetting } from 'flavours/glitch/actions/settings';
+import { changeSetting } from '../../../actions/settings';
-
 import EmojiPickerDropdown from '../components/emoji_picker_dropdown';
 
 const perLine = 8;

app/javascript/flavours/glitch/features/compose/containers/navigation_container.js

@@ -3,9 +3,9 @@ import { defineMessages, injectIntl } from 'react-intl';
 import { connect }   from 'react-redux';
 
 import { openModal } from 'flavours/glitch/actions/modal';
-import { me } from 'flavours/glitch/initial_state';
 import { logOut } from 'flavours/glitch/utils/log_out';
 
+import { me } from '../../../initial_state';
 import NavigationBar from '../components/navigation_bar';
 
 const messages = defineMessages({

app/javascript/flavours/glitch/features/compose/containers/poll_form_container.js

@@ -8,8 +8,7 @@ import {
   clearComposeSuggestions,
   fetchComposeSuggestions,
   selectComposeSuggestion,
-} from 'flavours/glitch/actions/compose';
+} from '../../../actions/compose';
-
 import PollForm from '../components/poll_form';
 
 const mapStateToProps = state => ({

app/javascript/flavours/glitch/features/compose/containers/privacy_dropdown_container.js

@@ -1,9 +1,8 @@
 import { connect } from 'react-redux';
 
-import { changeComposeVisibility } from 'flavours/glitch/actions/compose';
+import { changeComposeVisibility } from '../../../actions/compose';
-import { openModal, closeModal } from 'flavours/glitch/actions/modal';
+import { openModal, closeModal } from '../../../actions/modal';
-import { isUserTouching } from 'flavours/glitch/is_mobile';
+import { isUserTouching } from '../../../is_mobile';
-
 import PrivacyDropdown from '../components/privacy_dropdown';
 
 const mapStateToProps = state => ({

app/javascript/flavours/glitch/features/compose/containers/reply_indicator_container.js

@@ -1,7 +1,6 @@
 import { connect } from 'react-redux';
 
-import { cancelReplyCompose } from 'flavours/glitch/actions/compose';
+import { cancelReplyCompose } from '../../../actions/compose';
-
 import ReplyIndicator from '../components/reply_indicator';
 
 const makeMapStateToProps = () => {

app/javascript/flavours/glitch/features/compose/containers/sensitive_button_container.jsx

@@ -62,8 +62,6 @@ class SensitiveButton extends PureComponent {
             disabled={disabled}
           />
 
-          <span className={classNames('checkbox', { active })} />
-
           <FormattedMessage
             id='compose_form.sensitive.hide'
             defaultMessage='{count, plural, one {Mark media as sensitive} other {Mark media as sensitive}}'

app/javascript/flavours/glitch/features/compose/containers/upload_container.js

@@ -1,7 +1,6 @@
 import { connect } from 'react-redux';
 
-import { undoUploadCompose, initMediaEditModal, submitCompose } from 'flavours/glitch/actions/compose';
+import { undoUploadCompose, initMediaEditModal, submitCompose } from '../../../actions/compose';
-
 import Upload from '../components/upload';
 
 const mapStateToProps = (state, { id }) => ({

app/javascript/flavours/glitch/features/compose/containers/warning_container.jsx

@@ -10,7 +10,6 @@ import { HASHTAG_PATTERN_REGEX } from 'flavours/glitch/utils/hashtags';
 
 import Warning from '../components/warning';
 
-
 const mapStateToProps = state => ({
   needsLockWarning: state.getIn(['compose', 'privacy']) === 'private' && !state.getIn(['accounts', me, 'locked']),
   hashtagWarning: state.getIn(['compose', 'privacy']) !== 'public' && HASHTAG_PATTERN_REGEX.test(state.getIn(['compose', 'text'])),

app/javascript/flavours/glitch/features/compose/index.jsx

@@ -12,8 +12,8 @@ import spring from 'react-motion/lib/spring';
 
 import { mountCompose, unmountCompose, cycleElefriendCompose } from 'flavours/glitch/actions/compose';
 import Column from 'flavours/glitch/components/column';
-import { mascot } from 'flavours/glitch/initial_state';
 
+import { mascot } from '../../initial_state';
 import Motion from '../ui/util/optional_motion';
 
 import ComposeFormContainer from './containers/compose_form_container';

app/javascript/flavours/glitch/features/direct_timeline/components/conversations_list.jsx

@@ -5,8 +5,7 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
 
 import { debounce } from 'lodash';
 
-import ScrollableList from 'flavours/glitch/components/scrollable_list';
+import ScrollableList from '../../../components/scrollable_list';
-
 import ConversationContainer from '../containers/conversation_container';
 
 export default class ConversationsList extends ImmutablePureComponent {

app/javascript/flavours/glitch/features/direct_timeline/containers/conversations_list_container.js

@@ -1,7 +1,6 @@
 import { connect } from 'react-redux';
 
-import { expandConversations } from 'flavours/glitch/actions/conversations';
+import { expandConversations } from '../../../actions/conversations';
-
 import ConversationsList from '../components/conversations_list';
 
 const mapStateToProps = state => ({

app/javascript/flavours/glitch/features/domain_blocks/index.jsx

@@ -10,18 +10,13 @@ import { connect } from 'react-redux';
 
 import { debounce } from 'lodash';
 
-import ScrollableList from 'flavours/glitch/components/scrollable_list';
-
 import { fetchDomainBlocks, expandDomainBlocks } from '../../actions/domain_blocks';
 import ColumnBackButtonSlim from '../../components/column_back_button_slim';
 import { LoadingIndicator } from '../../components/loading_indicator';
+import ScrollableList from '../../components/scrollable_list';
 import DomainContainer from '../../containers/domain_container';
 import Column from '../ui/components/column';
 
-
-
-
-
 const messages = defineMessages({
   heading: { id: 'column.domain_blocks', defaultMessage: 'Blocked domains' },
   unblockDomain: { id: 'account.unblock_domain', defaultMessage: 'Unblock domain {domain}' },
@@ -38,7 +33,7 @@ class Blocks extends ImmutablePureComponent {
     params: PropTypes.object.isRequired,
     dispatch: PropTypes.func.isRequired,
     hasMore: PropTypes.bool,
-    domains: ImmutablePropTypes.list,
+    domains: ImmutablePropTypes.orderedSet,
     intl: PropTypes.object.isRequired,
     multiColumn: PropTypes.bool,
   };

app/javascript/flavours/glitch/features/emoji/emoji.js

@@ -1,8 +1,9 @@
 import Trie from 'substring-trie';
 
-import { autoPlayGif, useSystemEmojiFont } from 'flavours/glitch/initial_state';
 import { assetHost } from 'flavours/glitch/utils/config';
 
+import { autoPlayGif, useSystemEmojiFont } from '../../initial_state';
+
 import { unicodeMapping } from './emoji_unicode_mapping_light';
 
 const trie = new Trie(Object.keys(unicodeMapping));
@@ -137,7 +138,6 @@ const emojify = (str, customEmojis = {}) => {
 };
 
 export default emojify;
-export { unicodeMapping };
 
 export const buildCustomEmojis = (customEmojis) => {
   const emojis = [];

app/javascript/flavours/glitch/features/emoji/emoji_compressed.js

@@ -93,7 +93,7 @@ Object.keys(emojiIndex.emojis).forEach(key => {
   let { short_names, search, unified } = emojiMartData.emojis[key];
 
   if (short_names[0] !== key) {
-    throw new Error('The compresser expects the first short_code to be the ' +
+    throw new Error('The compressor expects the first short_code to be the ' +
       'key. It may need to be rewritten if the emoji change such that this ' +
       'is no longer the case.');
   }

app/javascript/flavours/glitch/features/explore/components/story.jsx

@@ -11,7 +11,6 @@ import { RelativeTimestamp } from 'flavours/glitch/components/relative_timestamp
 import { ShortNumber } from 'flavours/glitch/components/short_number';
 import { Skeleton } from 'flavours/glitch/components/skeleton';
 
-
 export default class Story extends PureComponent {
 
   static propTypes = {

app/javascript/flavours/glitch/features/explore/index.jsx

@@ -19,8 +19,6 @@ import Statuses from './statuses';
 import Suggestions from './suggestions';
 import Tags from './tags';
 
-
-
 const messages = defineMessages({
   title: { id: 'explore.title', defaultMessage: 'Explore' },
   searchResults: { id: 'explore.search_results', defaultMessage: 'Search results' },

app/javascript/flavours/glitch/features/explore/tags.jsx

@@ -14,8 +14,6 @@ import { ImmutableHashtag as Hashtag } from 'flavours/glitch/components/hashtag'
 import { LoadingIndicator } from 'flavours/glitch/components/loading_indicator';
 import { WithRouterPropTypes } from 'flavours/glitch/utils/react_router';
 
-
-
 const mapStateToProps = state => ({
   hashtags: state.getIn(['trends', 'tags', 'items']),
   isLoadingHashtags: state.getIn(['trends', 'tags', 'isLoading']),

app/javascript/flavours/glitch/features/favourites/index.jsx

@@ -18,7 +18,6 @@ import ScrollableList from 'flavours/glitch/components/scrollable_list';
 import AccountContainer from 'flavours/glitch/containers/account_container';
 import Column from 'flavours/glitch/features/ui/components/column';
 
-
 const messages = defineMessages({
   heading: { id: 'column.favourited_by', defaultMessage: 'Favourited by' },
   refresh: { id: 'refresh', defaultMessage: 'Refresh' },

app/javascript/flavours/glitch/features/follow_requests/components/account_authorize.jsx

@@ -5,10 +5,10 @@ import { defineMessages, injectIntl } from 'react-intl';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 
-import { Avatar } from 'flavours/glitch/components/avatar';
+import { Avatar } from '../../../components/avatar';
-import { DisplayName } from 'flavours/glitch/components/display_name';
+import { DisplayName } from '../../../components/display_name';
-import { IconButton } from 'flavours/glitch/components/icon_button';
+import { IconButton } from '../../../components/icon_button';
-import Permalink from 'flavours/glitch/components/permalink';
+import Permalink from '../../../components/permalink';
 
 const messages = defineMessages({
   authorize: { id: 'follow_request.authorize', defaultMessage: 'Authorize' },

app/javascript/flavours/glitch/features/follow_requests/containers/account_authorize_container.js

@@ -1,8 +1,7 @@
 import { connect } from 'react-redux';
 
-import { authorizeFollowRequest, rejectFollowRequest } from 'flavours/glitch/actions/accounts';
+import { authorizeFollowRequest, rejectFollowRequest } from '../../../actions/accounts';
-import { makeGetAccount } from 'flavours/glitch/selectors';
+import { makeGetAccount } from '../../../selectors';
-
 import AccountAuthorize from '../components/account_authorize';
 
 const makeMapStateToProps = () => {

app/javascript/flavours/glitch/features/follow_requests/index.jsx

@@ -10,19 +10,14 @@ import { connect } from 'react-redux';
 
 import { debounce } from 'lodash';
 
-import { fetchFollowRequests, expandFollowRequests } from 'flavours/glitch/actions/accounts';
+import { fetchFollowRequests, expandFollowRequests } from '../../actions/accounts';
-import ColumnBackButtonSlim from 'flavours/glitch/components/column_back_button_slim';
+import ColumnBackButtonSlim from '../../components/column_back_button_slim';
-import ScrollableList from 'flavours/glitch/components/scrollable_list';
+import ScrollableList from '../../components/scrollable_list';
-import Column from 'flavours/glitch/features/ui/components/column';
+import { me } from '../../initial_state';
-import { me } from 'flavours/glitch/initial_state';
+import Column from '../ui/components/column';
 
 import AccountAuthorizeContainer from './containers/account_authorize_container';
 
-
-
-
-
-
 const messages = defineMessages({
   heading: { id: 'column.follow_requests', defaultMessage: 'Follow requests' },
 });
@@ -74,7 +69,6 @@ class FollowRequests extends ImmutablePureComponent {
     return (
       <Column bindToDocument={!multiColumn} name='follow-requests' icon='user-plus' heading={intl.formatMessage(messages.heading)}>
         <ColumnBackButtonSlim />
-
         <ScrollableList
           scrollKey='follow_requests'
           onLoadMore={this.handleLoadMore}

app/javascript/flavours/glitch/features/followers/index.jsx

@@ -8,24 +8,24 @@ import { connect } from 'react-redux';
 
 import { debounce } from 'lodash';
 
+import { TimelineHint } from 'flavours/glitch/components/timeline_hint';
+import BundleColumnError from 'flavours/glitch/features/ui/components/bundle_column_error';
+import { normalizeForLookup } from 'flavours/glitch/reducers/accounts_map';
+import { getAccountHidden } from 'flavours/glitch/selectors';
+
 import {
   lookupAccount,
   fetchAccount,
   fetchFollowers,
   expandFollowers,
-} from 'flavours/glitch/actions/accounts';
+} from '../../actions/accounts';
-import { LoadingIndicator } from 'flavours/glitch/components/loading_indicator';
+import { LoadingIndicator } from '../../components/loading_indicator';
-import ScrollableList from 'flavours/glitch/components/scrollable_list';
+import ScrollableList from '../../components/scrollable_list';
-import { TimelineHint } from 'flavours/glitch/components/timeline_hint';
+import AccountContainer from '../../containers/account_container';
-import AccountContainer from 'flavours/glitch/containers/account_container';
+import ProfileColumnHeader from '../account/components/profile_column_header';
-import ProfileColumnHeader from 'flavours/glitch/features/account/components/profile_column_header';
-import HeaderContainer from 'flavours/glitch/features/account_timeline/containers/header_container';
-import BundleColumnError from 'flavours/glitch/features/ui/components/bundle_column_error';
-import Column from 'flavours/glitch/features/ui/components/column';
-import { normalizeForLookup } from 'flavours/glitch/reducers/accounts_map';
-import { getAccountHidden } from 'flavours/glitch/selectors';
-
 import LimitedAccountHint from '../account_timeline/components/limited_account_hint';
+import HeaderContainer from '../account_timeline/containers/header_container';
+import Column from '../ui/components/column';
 
 const mapStateToProps = (state, { params: { acct, id } }) => {
   const accountId = id || state.getIn(['accounts_map', normalizeForLookup(acct)]);

app/javascript/flavours/glitch/features/following/index.jsx

@@ -8,24 +8,24 @@ import { connect } from 'react-redux';
 
 import { debounce } from 'lodash';
 
+import { TimelineHint } from 'flavours/glitch/components/timeline_hint';
+import BundleColumnError from 'flavours/glitch/features/ui/components/bundle_column_error';
+import { normalizeForLookup } from 'flavours/glitch/reducers/accounts_map';
+import { getAccountHidden } from 'flavours/glitch/selectors';
+
 import {
   lookupAccount,
   fetchAccount,
   fetchFollowing,
   expandFollowing,
-} from 'flavours/glitch/actions/accounts';
+} from '../../actions/accounts';
-import { LoadingIndicator } from 'flavours/glitch/components/loading_indicator';
+import { LoadingIndicator } from '../../components/loading_indicator';
-import ScrollableList from 'flavours/glitch/components/scrollable_list';
+import ScrollableList from '../../components/scrollable_list';
-import { TimelineHint } from 'flavours/glitch/components/timeline_hint';
+import AccountContainer from '../../containers/account_container';
-import AccountContainer from 'flavours/glitch/containers/account_container';
+import ProfileColumnHeader from '../account/components/profile_column_header';
-import ProfileColumnHeader from 'flavours/glitch/features/account/components/profile_column_header';
-import HeaderContainer from 'flavours/glitch/features/account_timeline/containers/header_container';
-import BundleColumnError from 'flavours/glitch/features/ui/components/bundle_column_error';
-import Column from 'flavours/glitch/features/ui/components/column';
-import { normalizeForLookup } from 'flavours/glitch/reducers/accounts_map';
-import { getAccountHidden } from 'flavours/glitch/selectors';
-
 import LimitedAccountHint from '../account_timeline/components/limited_account_hint';
+import HeaderContainer from '../account_timeline/containers/header_container';
+import Column from '../ui/components/column';
 
 const mapStateToProps = (state, { params: { acct, id } }) => {
   const accountId = id || state.getIn(['accounts_map', normalizeForLookup(acct)]);

app/javascript/flavours/glitch/features/getting_started/index.jsx

@@ -14,17 +14,16 @@ import { fetchFollowRequests } from 'flavours/glitch/actions/accounts';
 import { fetchLists } from 'flavours/glitch/actions/lists';
 import { openModal } from 'flavours/glitch/actions/modal';
 import Column from 'flavours/glitch/features/ui/components/column';
-import ColumnLink from 'flavours/glitch/features/ui/components/column_link';
-import ColumnSubheading from 'flavours/glitch/features/ui/components/column_subheading';
 import LinkFooter from 'flavours/glitch/features/ui/components/link_footer';
-import { me, showTrends } from 'flavours/glitch/initial_state';
 import { preferencesLink } from 'flavours/glitch/utils/backend_links';
 
+import { me, showTrends } from '../../initial_state';
 import NavigationBar from '../compose/components/navigation_bar';
+import ColumnLink from '../ui/components/column_link';
+import ColumnSubheading from '../ui/components/column_subheading';
 
 import TrendsContainer from './containers/trends_container';
 
-
 const messages = defineMessages({
   heading: { id: 'getting_started.heading', defaultMessage: 'Getting started' },
   home_timeline: { id: 'tabs_bar.home', defaultMessage: 'Home' },

app/javascript/flavours/glitch/features/hashtag_timeline/containers/column_settings_container.js

@@ -1,8 +1,7 @@
 import { connect } from 'react-redux';
 
-import { changeColumnParams } from 'flavours/glitch/actions/columns';
+import { changeColumnParams } from '../../../actions/columns';
-import api from 'flavours/glitch/api';
+import api from '../../../api';
-
 import ColumnSettings from '../components/column_settings';
 
 const mapStateToProps = (state, { columnId }) => {

app/javascript/flavours/glitch/features/hashtag_timeline/index.jsx

@@ -16,7 +16,8 @@ import { fetchHashtag, followHashtag, unfollowHashtag } from 'flavours/glitch/ac
 import { expandHashtagTimeline, clearTimeline } from 'flavours/glitch/actions/timelines';
 import Column from 'flavours/glitch/components/column';
 import ColumnHeader from 'flavours/glitch/components/column_header';
-import StatusListContainer from 'flavours/glitch/features/ui/containers/status_list_container';
+
+import StatusListContainer from '../ui/containers/status_list_container';
 
 import { HashtagHeader } from './components/hashtag_header';
 import ColumnSettingsContainer from './containers/column_settings_container';

app/javascript/flavours/glitch/features/interaction_modal/index.jsx

@@ -34,7 +34,7 @@ const mapDispatchToProps = (dispatch) => ({
   },
 });
 
-const PERSISTENCE_KEY = 'flavours/glitch_home';
+const PERSISTENCE_KEY = 'mastodon_home';
 
 const isValidDomain = value => {
   const url = new URL('https:///path');

app/javascript/flavours/glitch/features/keyboard_shortcuts/index.jsx

@@ -10,7 +10,6 @@ import { connect } from 'react-redux';
 import Column from 'flavours/glitch/components/column';
 import ColumnHeader from 'flavours/glitch/components/column_header';
 
-
 const messages = defineMessages({
   heading: { id: 'keyboard_shortcuts.heading', defaultMessage: 'Keyboard Shortcuts' },
 });

app/javascript/flavours/glitch/features/list_adder/components/account.jsx

@@ -8,7 +8,6 @@ import { Avatar } from '../../../components/avatar';
 import { DisplayName } from '../../../components/display_name';
 import { makeGetAccount } from '../../../selectors';
 
-
 const makeMapStateToProps = () => {
   const getAccount = makeGetAccount();
 
@@ -19,7 +18,6 @@ const makeMapStateToProps = () => {
   return mapStateToProps;
 };
 
-
 class Account extends ImmutablePureComponent {
 
   static propTypes = {

app/javascript/flavours/glitch/features/list_editor/components/account.jsx

@@ -5,10 +5,9 @@ import { defineMessages } from 'react-intl';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 
-import { Avatar } from 'flavours/glitch/components/avatar';
+import { Avatar } from '../../../components/avatar';
-import { DisplayName } from 'flavours/glitch/components/display_name';
+import { DisplayName } from '../../../components/display_name';
-import { IconButton } from 'flavours/glitch/components/icon_button';
+import { IconButton } from '../../../components/icon_button';
-
 
 const messages = defineMessages({
   remove: { id: 'lists.account.remove', defaultMessage: 'Remove from list' },

app/javascript/flavours/glitch/features/list_editor/components/edit_list_form.jsx

@@ -5,8 +5,8 @@ import { defineMessages, injectIntl } from 'react-intl';
 
 import { connect } from 'react-redux';
 
-import { changeListEditorTitle, submitListEditor } from 'flavours/glitch/actions/lists';
+import { changeListEditorTitle, submitListEditor } from '../../../actions/lists';
-import { IconButton } from 'flavours/glitch/components/icon_button';
+import { IconButton } from '../../../components/icon_button';
 
 const messages = defineMessages({
   title: { id: 'lists.edit.submit', defaultMessage: 'Change title' },

app/javascript/flavours/glitch/features/list_editor/index.jsx

@@ -8,8 +8,7 @@ import { connect } from 'react-redux';
 
 import spring from 'react-motion/lib/spring';
 
-import { setupListEditor, clearListSuggestions, resetListEditor } from 'flavours/glitch/actions/lists';
+import { setupListEditor, clearListSuggestions, resetListEditor } from '../../actions/lists';
-
 import Motion from '../ui/util/optional_motion';
 
 import EditListForm from './components/edit_list_form';

app/javascript/flavours/glitch/features/mutes/index.jsx

@@ -10,15 +10,12 @@ import { connect } from 'react-redux';
 
 import { debounce } from 'lodash';
 
-import { fetchMutes, expandMutes } from 'flavours/glitch/actions/mutes';
+import { fetchMutes, expandMutes } from '../../actions/mutes';
-import ColumnBackButtonSlim from 'flavours/glitch/components/column_back_button_slim';
+import ColumnBackButtonSlim from '../../components/column_back_button_slim';
-import { LoadingIndicator } from 'flavours/glitch/components/loading_indicator';
+import { LoadingIndicator } from '../../components/loading_indicator';
-import ScrollableList from 'flavours/glitch/components/scrollable_list';
+import ScrollableList from '../../components/scrollable_list';
-import AccountContainer from 'flavours/glitch/containers/account_container';
+import AccountContainer from '../../containers/account_container';
-import Column from 'flavours/glitch/features/ui/components/column';
+import Column from '../ui/components/column';
-
-
-
 
 const messages = defineMessages({
   heading: { id: 'column.mutes', defaultMessage: 'Muted users' },
@@ -51,7 +48,7 @@ class Mutes extends ImmutablePureComponent {
   }, 300, { leading: true });
 
   render () {
-    const { intl, accountIds, hasMore, multiColumn, isLoading } = this.props;
+    const { intl, hasMore, accountIds, multiColumn, isLoading } = this.props;
 
     if (!accountIds) {
       return (

app/javascript/flavours/glitch/features/notifications/components/notifications_permission_banner.jsx

@@ -11,8 +11,6 @@ import { Button } from 'flavours/glitch/components/button';
 import { Icon }  from 'flavours/glitch/components/icon';
 import { IconButton } from 'flavours/glitch/components/icon_button';
 
-
-
 const messages = defineMessages({
   close: { id: 'lightbox.close', defaultMessage: 'Close' },
 });

app/javascript/flavours/glitch/features/notifications/containers/column_settings_container.js

@@ -2,12 +2,11 @@ import { defineMessages, injectIntl } from 'react-intl';
 
 import { connect } from 'react-redux';
 
-import { showAlert } from 'flavours/glitch/actions/alerts';
+import { showAlert } from '../../../actions/alerts';
-import { openModal } from 'flavours/glitch/actions/modal';
+import { openModal } from '../../../actions/modal';
-import { setFilter, clearNotifications, requestBrowserPermission } from 'flavours/glitch/actions/notifications';
+import { setFilter, clearNotifications, requestBrowserPermission } from '../../../actions/notifications';
-import { changeAlerts as changePushNotifications } from 'flavours/glitch/actions/push_notifications';
+import { changeAlerts as changePushNotifications } from '../../../actions/push_notifications';
-import { changeSetting } from 'flavours/glitch/actions/settings';
+import { changeSetting } from '../../../actions/settings';
-
 import ColumnSettings from '../components/column_settings';
 
 const messages = defineMessages({

app/javascript/flavours/glitch/features/notifications/index.jsx

@@ -13,8 +13,12 @@ import { createSelector } from 'reselect';
 
 import { debounce } from 'lodash';
 
-import { addColumn, removeColumn, moveColumn } from 'flavours/glitch/actions/columns';
+import { compareId } from 'flavours/glitch/compare_id';
-import { submitMarkers } from 'flavours/glitch/actions/markers';
+import { Icon }  from 'flavours/glitch/components/icon';
+import { NotSignedInIndicator } from 'flavours/glitch/components/not_signed_in_indicator';
+
+import { addColumn, removeColumn, moveColumn } from '../../actions/columns';
+import { submitMarkers } from '../../actions/markers';
 import {
   enterNotificationClearingMode,
   expandNotifications,
@@ -23,26 +27,18 @@ import {
   mountNotifications,
   unmountNotifications,
   markNotificationsAsRead,
-} from 'flavours/glitch/actions/notifications';
+} from '../../actions/notifications';
-import { compareId } from 'flavours/glitch/compare_id';
+import Column from '../../components/column';
-import Column from 'flavours/glitch/components/column';
+import ColumnHeader from '../../components/column_header';
-import ColumnHeader from 'flavours/glitch/components/column_header';
+import { LoadGap } from '../../components/load_gap';
-import { Icon } from 'flavours/glitch/components/icon';
+import ScrollableList from '../../components/scrollable_list';
-import { LoadGap } from 'flavours/glitch/components/load_gap';
+import NotificationPurgeButtonsContainer from '../../containers/notification_purge_buttons_container';
-import { NotSignedInIndicator } from 'flavours/glitch/components/not_signed_in_indicator';
-import ScrollableList from 'flavours/glitch/components/scrollable_list';
-import NotificationPurgeButtonsContainer from 'flavours/glitch/containers/notification_purge_buttons_container';
 
 import NotificationsPermissionBanner from './components/notifications_permission_banner';
 import ColumnSettingsContainer from './containers/column_settings_container';
 import FilterBarContainer from './containers/filter_bar_container';
 import NotificationContainer from './containers/notification_container';
 
-
-
-
-
-
 const messages = defineMessages({
   title: { id: 'column.notifications', defaultMessage: 'Notifications' },
   enterNotifCleaning : { id: 'notification_purge.start', defaultMessage: 'Enter notification cleaning mode' },

app/javascript/flavours/glitch/features/picture_in_picture/components/header.jsx

@@ -12,8 +12,6 @@ import { Avatar } from 'flavours/glitch/components/avatar';
 import { DisplayName } from 'flavours/glitch/components/display_name';
 import { IconButton } from 'flavours/glitch/components/icon_button';
 
-
-
 const messages = defineMessages({
   close: { id: 'lightbox.close', defaultMessage: 'Close' },
 });

app/javascript/flavours/glitch/features/public_timeline/components/column_settings.jsx

@@ -5,8 +5,8 @@ import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 
 import ImmutablePropTypes from 'react-immutable-proptypes';
 
-import SettingText from 'flavours/glitch/components/setting_text';
+import SettingText from '../../../components/setting_text';
-import SettingToggle from 'flavours/glitch/features/notifications/components/setting_toggle';
+import SettingToggle from '../../notifications/components/setting_toggle';
 
 const messages = defineMessages({
   filter_regex: { id: 'home.column_settings.filter_regex', defaultMessage: 'Filter out by regular expressions' },

app/javascript/flavours/glitch/features/public_timeline/containers/column_settings_container.js

@@ -1,8 +1,7 @@
 import { connect } from 'react-redux';
 
-import { changeColumnParams } from 'flavours/glitch/actions/columns';
+import { changeColumnParams } from '../../../actions/columns';
-import { changeSetting } from 'flavours/glitch/actions/settings';
+import { changeSetting } from '../../../actions/settings';
-
 import ColumnSettings from '../components/column_settings';
 
 const mapStateToProps = (state, { columnId }) => {