Merge pull request #1862 from ClearlyClaire/glitch-soc/refactor/upstream-discrepancies

Refactor glitch-soc front-end to limit discrepancies with upstream

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 
 export const ACCOUNT_NOTE_SUBMIT_REQUEST = 'ACCOUNT_NOTE_SUBMIT_REQUEST';
 export const ACCOUNT_NOTE_SUBMIT_SUCCESS = 'ACCOUNT_NOTE_SUBMIT_SUCCESS';

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

@@ -1,4 +1,4 @@
-import api, { getLinks } from 'flavours/glitch/util/api';
+import api, { getLinks } from '../api';
 import { importAccount, importFetchedAccount, importFetchedAccounts } from './importer';
 
 export const ACCOUNT_FETCH_REQUEST = 'ACCOUNT_FETCH_REQUEST';

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 import { normalizeAnnouncement } from './importer/normalizer';
 
 export const ANNOUNCEMENTS_FETCH_REQUEST = 'ANNOUNCEMENTS_FETCH_REQUEST';

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

@@ -1,4 +1,4 @@
-import api, { getLinks } from 'flavours/glitch/util/api';
+import api, { getLinks } from '../api';
 import { fetchRelationships } from './accounts';
 import { importFetchedAccounts } from './importer';
 import { openModal } from './modal';

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

@@ -1,4 +1,4 @@
-import api, { getLinks } from 'flavours/glitch/util/api';
+import api, { getLinks } from '../api';
 import { importFetchedStatuses } from './importer';
 
 export const BOOKMARKED_STATUSES_FETCH_REQUEST = 'BOOKMARKED_STATUSES_FETCH_REQUEST';

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

@@ -1,11 +1,11 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 import { CancelToken, isCancel } from 'axios';
 import { throttle } from 'lodash';
-import { search as emojiSearch } from 'flavours/glitch/util/emoji/emoji_mart_search_light';
+import { search as emojiSearch } from 'flavours/glitch/features/emoji/emoji_mart_search_light';
 import { useEmoji } from './emojis';
-import { tagHistory } from 'flavours/glitch/util/settings';
-import { recoverHashtags } from 'flavours/glitch/util/hashtag';
-import resizeImage from 'flavours/glitch/util/resize_image';
+import { tagHistory } from '../settings';
+import { recoverHashtags } from 'flavours/glitch/utils/hashtag';
+import resizeImage from 'flavours/glitch/utils/resize_image';
 import { importFetchedAccounts } from './importer';
 import { updateTimeline } from './timelines';
 import { showAlertForError } from './alerts';

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

@@ -1,4 +1,4 @@
-import api, { getLinks } from 'flavours/glitch/util/api';
+import api, { getLinks } from '../api';
 import {
   importFetchedAccounts,
   importFetchedStatuses,

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 
 export const CUSTOM_EMOJIS_FETCH_REQUEST = 'CUSTOM_EMOJIS_FETCH_REQUEST';
 export const CUSTOM_EMOJIS_FETCH_SUCCESS = 'CUSTOM_EMOJIS_FETCH_SUCCESS';

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 import { importFetchedAccounts } from './importer';
 import { fetchRelationships } from './accounts';
 

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

@@ -1,4 +1,4 @@
-import api, { getLinks } from 'flavours/glitch/util/api';
+import api, { getLinks } from '../api';
 
 export const DOMAIN_BLOCK_REQUEST = 'DOMAIN_BLOCK_REQUEST';
 export const DOMAIN_BLOCK_SUCCESS = 'DOMAIN_BLOCK_SUCCESS';

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

@@ -1,4 +1,4 @@
-import api, { getLinks } from 'flavours/glitch/util/api';
+import api, { getLinks } from '../api';
 import { importFetchedStatuses } from './importer';
 
 export const FAVOURITED_STATUSES_FETCH_REQUEST = 'FAVOURITED_STATUSES_FETCH_REQUEST';

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 import { openModal } from './modal';
 
 export const FILTERS_FETCH_REQUEST = 'FILTERS_FETCH_REQUEST';

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 import { importFetchedAccounts } from './importer';
 
 export const HISTORY_FETCH_REQUEST = 'HISTORY_FETCH_REQUEST';

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+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';

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

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

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 import { importFetchedAccounts, importFetchedStatus } from './importer';
 
 export const REBLOG_REQUEST = 'REBLOG_REQUEST';

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 import { importFetchedAccounts } from './importer';
 import { showAlertForError } from './alerts';
 

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

@@ -1,4 +1,4 @@
-import { expandSpoilers, disableSwiping } from 'flavours/glitch/util/initial_state';
+import { expandSpoilers, disableSwiping } from 'flavours/glitch/initial_state';
 import { openModal } from './modal';
 
 export const LOCAL_SETTING_CHANGE = 'LOCAL_SETTING_CHANGE';

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

@@ -1,6 +1,6 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 import { debounce } from 'lodash';
-import compareId from 'flavours/glitch/util/compare_id';
+import compareId from '../compare_id';
 import { List as ImmutableList } from 'immutable';
 
 export const MARKERS_FETCH_REQUEST = 'MARKERS_FETCH_REQUEST';

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

@@ -1,4 +1,4 @@
-import api, { getLinks } from 'flavours/glitch/util/api';
+import api, { getLinks } from '../api';
 import { fetchRelationships } from './accounts';
 import { importFetchedAccounts } from './importer';
 import { openModal } from 'flavours/glitch/actions/modal';

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

@@ -1,4 +1,4 @@
-import api, { getLinks } from 'flavours/glitch/util/api';
+import api, { getLinks } from '../api';
 import IntlMessageFormat from 'intl-messageformat';
 import { fetchFollowRequests, fetchRelationships } from './accounts';
 import {
@@ -11,10 +11,10 @@ import { submitMarkers } from './markers';
 import { saveSettings } from './settings';
 import { defineMessages } from 'react-intl';
 import { List as ImmutableList } from 'immutable';
-import { unescapeHTML } from 'flavours/glitch/util/html';
-import { usePendingItems as preferPendingItems } from 'flavours/glitch/util/initial_state';
-import compareId from 'flavours/glitch/util/compare_id';
-import { requestNotificationPermission } from 'flavours/glitch/util/notifications';
+import { unescapeHTML } from 'flavours/glitch/utils/html';
+import { usePendingItems as preferPendingItems } from 'flavours/glitch/initial_state';
+import compareId from 'flavours/glitch/compare_id';
+import { requestNotificationPermission } from 'flavours/glitch/utils/notifications';
 
 export const NOTIFICATIONS_UPDATE = 'NOTIFICATIONS_UPDATE';
 export const NOTIFICATIONS_UPDATE_NOOP = 'NOTIFICATIONS_UPDATE_NOOP';

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

@@ -1,11 +1,11 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 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';
 
-import { me } from 'flavours/glitch/util/initial_state';
+import { me } from 'flavours/glitch/initial_state';
 
 export function fetchPinnedStatuses() {
   return (dispatch, getState) => {

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 import { importFetchedPoll } from './importer';
 
 export const POLL_VOTE_REQUEST = 'POLL_VOTE_REQUEST';

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

@@ -1,5 +1,5 @@
-import api from 'flavours/glitch/util/api';
-import { pushNotificationsSetting } from 'flavours/glitch/util/settings';
+import api from '../../api';
+import { pushNotificationsSetting } from '../../settings';
 import { setBrowserSupport, setSubscription, clearSubscription } from './setter';
 
 // Taken from https://www.npmjs.com/package/web-push

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 import { openModal } from './modal';
 
 export const REPORT_SUBMIT_REQUEST = 'REPORT_SUBMIT_REQUEST';

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 import { fetchRelationships } from './accounts';
 import { importFetchedAccounts, importFetchedStatuses } from './importer';
 

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 import { importFetchedAccount } from './importer';
 
 export const SERVER_FETCH_REQUEST = 'Server_FETCH_REQUEST';

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 import { debounce } from 'lodash';
 import { showAlertForError } from './alerts';
 

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 
 import { deleteFromTimelines } from './timelines';
 import { importFetchedStatus, importFetchedStatuses } from './importer';

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

@@ -1,6 +1,6 @@
 // @ts-check
 
-import { connectStream } from 'flavours/glitch/util/stream';
+import { connectStream } from '../stream';
 import {
   updateTimeline,
   deleteFromTimelines,

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 import { importFetchedAccounts } from './importer';
 import { fetchRelationships } from './accounts';
 

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

@@ -1,4 +1,4 @@
-import api from 'flavours/glitch/util/api';
+import api from '../api';
 
 export const HASHTAG_FETCH_REQUEST = 'HASHTAG_FETCH_REQUEST';
 export const HASHTAG_FETCH_SUCCESS = 'HASHTAG_FETCH_SUCCESS';

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

@@ -1,10 +1,10 @@
 import { importFetchedStatus, importFetchedStatuses } from './importer';
 import { submitMarkers } from './markers';
-import api, { getLinks } from 'flavours/glitch/util/api';
+import api, { getLinks } from 'flavours/glitch/api';
 import { Map as ImmutableMap, List as ImmutableList } from 'immutable';
-import compareId from 'flavours/glitch/util/compare_id';
-import { me, usePendingItems as preferPendingItems } from 'flavours/glitch/util/initial_state';
-import { toServerSideType } from 'flavours/glitch/util/filters';
+import compareId from 'flavours/glitch/compare_id';
+import { me, usePendingItems as preferPendingItems } from 'flavours/glitch/initial_state';
+import { toServerSideType } from 'flavours/glitch/utils/filters';
 
 export const TIMELINE_UPDATE  = 'TIMELINE_UPDATE';
 export const TIMELINE_DELETE  = 'TIMELINE_DELETE';

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

@@ -1,4 +1,4 @@
-import api, { getLinks } from 'flavours/glitch/util/api';
+import api, { getLinks } from '../api';
 import { importFetchedStatuses } from './importer';
 
 export const TRENDS_TAGS_FETCH_REQUEST = 'TRENDS_TAGS_FETCH_REQUEST';

app/javascript/flavours/glitch/api.js

@@ -1,6 +1,6 @@
 import axios from 'axios';
-import ready from './ready';
 import LinkHeader from 'http-link-header';
+import ready from './ready';
 
 export const getLinks = response => {
   const value = response.headers.link;

app/javascript/flavours/glitch/base_polyfills.js

@@ -5,7 +5,7 @@ import includes from 'array-includes';
 import assign from 'object-assign';
 import values from 'object.values';
 import isNaN from 'is-nan';
-import { decode as decodeBase64 } from './base64';
+import { decode as decodeBase64 } from './utils/base64';
 import promiseFinally from 'promise.prototype.finally';
 
 if (!Array.prototype.includes) {

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

@@ -7,7 +7,7 @@ import Permalink from './permalink';
 import IconButton from './icon_button';
 import { defineMessages, injectIntl } from 'react-intl';
 import ImmutablePureComponent from 'react-immutable-pure-component';
-import { me } from 'flavours/glitch/util/initial_state';
+import { me } from 'flavours/glitch/initial_state';
 import RelativeTimestamp from './relative_timestamp';
 import Skeleton from 'flavours/glitch/components/skeleton';
 

app/javascript/flavours/glitch/components/admin/Counter.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import api from 'flavours/glitch/util/api';
+import api from 'flavours/glitch/api';
 import { FormattedNumber } from 'react-intl';
 import { Sparklines, SparklinesCurve } from 'react-sparklines';
 import classNames from 'classnames';

app/javascript/flavours/glitch/components/admin/Dimension.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import api from 'flavours/glitch/util/api';
+import api from 'flavours/glitch/api';
 import { FormattedNumber } from 'react-intl';
-import { roundTo10 } from 'flavours/glitch/util/numbers';
+import { roundTo10 } from 'flavours/glitch/utils/numbers';
 import Skeleton from 'flavours/glitch/components/skeleton';
 
 export default class Dimension extends React.PureComponent {

app/javascript/flavours/glitch/components/admin/ReportReasonSelector.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import api from 'flavours/glitch/util/api';
+import api from 'flavours/glitch/api';
 import { injectIntl, defineMessages } from 'react-intl';
 import classNames from 'classnames';
 

app/javascript/flavours/glitch/components/admin/Retention.js

@@ -1,9 +1,9 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import api from 'flavours/glitch/util/api';
+import api from 'flavours/glitch/api';
 import { FormattedMessage, FormattedNumber, FormattedDate } from 'react-intl';
 import classNames from 'classnames';
-import { roundTo10 } from 'flavours/glitch/util/numbers';
+import { roundTo10 } from 'flavours/glitch/utils/numbers';
 
 const dateForCohort = cohort => {
   switch(cohort.frequency) {

app/javascript/flavours/glitch/components/admin/Trends.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import api from 'flavours/glitch/util/api';
+import api from 'flavours/glitch/api';
 import { FormattedMessage } from 'react-intl';
 import classNames from 'classnames';
 import Hashtag from 'flavours/glitch/components/hashtag';

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

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import { FormattedNumber } from 'react-intl';
 import TransitionMotion from 'react-motion/lib/TransitionMotion';
 import spring from 'react-motion/lib/spring';
-import { reduceMotion } from 'flavours/glitch/util/initial_state';
+import { reduceMotion } from 'flavours/glitch/initial_state';
 
 const obfuscatedCount = count => {
   if (count < 0) {

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

@@ -1,8 +1,8 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import unicodeMapping from 'flavours/glitch/util/emoji/emoji_unicode_mapping_light';
+import unicodeMapping from 'flavours/glitch/features/emoji/emoji_unicode_mapping_light';
 
-import { assetHost } from 'flavours/glitch/util/config';
+import { assetHost } from 'flavours/glitch/utils/config';
 
 export default class AutosuggestEmoji extends React.PureComponent {
 

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
-import { autoPlayGif } from 'flavours/glitch/util/initial_state';
+import { autoPlayGif } from 'flavours/glitch/initial_state';
 import classNames from 'classnames';
 
 export default class Avatar extends React.PureComponent {

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

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

app/javascript/flavours/glitch/components/avatar_overlay.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
-import { autoPlayGif } from 'flavours/glitch/util/initial_state';
+import { autoPlayGif } from 'flavours/glitch/initial_state';
 
 export default class AvatarOverlay extends React.PureComponent {
 

app/javascript/flavours/glitch/components/column.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { supportsPassiveEvents } from 'detect-passive-events';
-import { scrollTop } from 'flavours/glitch/util/scroll';
+import { scrollTop } from '../scroll';
 
 export default class Column extends React.PureComponent {
 

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

@@ -2,7 +2,7 @@ import React from 'react';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import { autoPlayGif } from 'flavours/glitch/util/initial_state';
+import { autoPlayGif } from 'flavours/glitch/initial_state';
 import Skeleton from 'flavours/glitch/components/skeleton';
 
 export default class DisplayName extends React.PureComponent {

app/javascript/flavours/glitch/components/dropdown_menu.js

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import IconButton from './icon_button';
 import Overlay from 'react-overlays/lib/Overlay';
-import Motion from 'flavours/glitch/util/optional_motion';
+import Motion from '../features/ui/util/optional_motion';
 import spring from 'react-motion/lib/spring';
 import { supportsPassiveEvents } from 'detect-passive-events';
 import classNames from 'classnames';

app/javascript/flavours/glitch/components/error_boundary.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
-import { source_url } from 'flavours/glitch/util/initial_state';
-import { preferencesLink } from 'flavours/glitch/util/backend_links';
+import { source_url } from 'flavours/glitch/initial_state';
+import { preferencesLink } from 'flavours/glitch/utils/backend_links';
 import StackTrace from 'stacktrace-js';
 
 export default class ErrorBoundary extends React.PureComponent {

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import Motion from 'flavours/glitch/util/optional_motion';
+import Motion from '../features/ui/util/optional_motion';
 import spring from 'react-motion/lib/spring';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';

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

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

app/javascript/flavours/glitch/components/link.js

@@ -7,7 +7,7 @@ import PropTypes from 'prop-types';
 import React from 'react';
 
 //  Utils.
-import { assignHandlers } from 'flavours/glitch/util/react_helpers';
+import { assignHandlers } from 'flavours/glitch/utils/react_helpers';
 
 //  Handlers.
 const handlers = {

app/javascript/flavours/glitch/components/media_attachments.js

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
-import { MediaGallery, Video, Audio } from 'flavours/glitch/util/async-components';
+import { MediaGallery, Video, Audio } from 'flavours/glitch/features/ui/util/async-components';
 import Bundle from 'flavours/glitch/features/ui/components/bundle';
 import noop from 'lodash/noop';
 

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

@@ -4,9 +4,9 @@ import PropTypes from 'prop-types';
 import { is } from 'immutable';
 import IconButton from './icon_button';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
-import { isIOS } from 'flavours/glitch/util/is_mobile';
+import { isIOS } from '../is_mobile';
 import classNames from 'classnames';
-import { autoPlayGif, displayMedia, useBlurhash } from 'flavours/glitch/util/initial_state';
+import { autoPlayGif, displayMedia, useBlurhash } from 'flavours/glitch/initial_state';
 import { debounce } from 'lodash';
 import Blurhash from 'flavours/glitch/components/blurhash';
 

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

@@ -4,10 +4,10 @@ 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 'flavours/glitch/util/optional_motion';
+import Motion from 'flavours/glitch/features/ui/util/optional_motion';
 import spring from 'react-motion/lib/spring';
 import escapeTextContentForBrowser from 'escape-html';
-import emojify from 'flavours/glitch/util/emoji';
+import emojify from 'flavours/glitch/features/emoji/emoji';
 import RelativeTimestamp from './relative_timestamp';
 import Icon from 'flavours/glitch/components/icon';
 

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

@@ -4,11 +4,11 @@ import PropTypes from 'prop-types';
 import IntersectionObserverArticleContainer from 'flavours/glitch/containers/intersection_observer_article_container';
 import LoadMore from './load_more';
 import LoadPending from './load_pending';
-import IntersectionObserverWrapper from 'flavours/glitch/util/intersection_observer_wrapper';
+import IntersectionObserverWrapper from 'flavours/glitch/features/ui/util/intersection_observer_wrapper';
 import { throttle } from 'lodash';
 import { List as ImmutableList } from 'immutable';
 import classNames from 'classnames';
-import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from 'flavours/glitch/util/fullscreen';
+import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from '../features/ui/util/fullscreen';
 import LoadingIndicator from './loading_indicator';
 import { connect } from 'react-redux';
 

app/javascript/flavours/glitch/components/server_banner.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { domain } from 'flavours/glitch/util/initial_state';
+import { domain } from 'flavours/glitch/initial_state';
 import { fetchServer } from 'flavours/glitch/actions/server';
 import { connect } from 'react-redux';
 import Account from 'flavours/glitch/containers/account_container';

app/javascript/flavours/glitch/components/short_number.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { toShortNumber, pluralReady, DECIMAL_UNITS } from '../util/numbers';
+import { toShortNumber, pluralReady, DECIMAL_UNITS } from '../utils/numbers';
 import { FormattedMessage, FormattedNumber } from 'react-intl';
 // @ts-check
 
@@ -56,7 +56,7 @@ ShortNumber.propTypes = {
 
 /**
  * @typedef {object} ShortNumberCounterProps
- * @property {import('../util/number').ShortNumber} value Short number
+ * @property {import('../utils/number').ShortNumber} value Short number
  */
 
 /**

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

@@ -10,13 +10,13 @@ import AttachmentList from './attachment_list';
 import Card from '../features/status/components/card';
 import { injectIntl, FormattedMessage } from 'react-intl';
 import ImmutablePureComponent from 'react-immutable-pure-component';
-import { MediaGallery, Video, Audio } from 'flavours/glitch/util/async-components';
+import { MediaGallery, Video, Audio } from '../features/ui/util/async-components';
 import { HotKeys } from 'react-hotkeys';
 import NotificationOverlayContainer from 'flavours/glitch/features/notifications/containers/overlay_container';
 import classNames from 'classnames';
-import { autoUnfoldCW } from 'flavours/glitch/util/content_warning';
+import { autoUnfoldCW } from 'flavours/glitch/utils/content_warning';
 import PollContainer from 'flavours/glitch/containers/poll_container';
-import { displayMedia } from 'flavours/glitch/util/initial_state';
+import { displayMedia } from 'flavours/glitch/initial_state';
 import PictureInPicturePlaceholder from 'flavours/glitch/components/picture_in_picture_placeholder';
 
 // We use the component (and not the container) since we do not want

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

@@ -5,9 +5,9 @@ import IconButton from './icon_button';
 import DropdownMenuContainer from 'flavours/glitch/containers/dropdown_menu_container';
 import { defineMessages, injectIntl } from 'react-intl';
 import ImmutablePureComponent from 'react-immutable-pure-component';
-import { me } from 'flavours/glitch/util/initial_state';
+import { me } from 'flavours/glitch/initial_state';
 import RelativeTimestamp from './relative_timestamp';
-import { accountAdminLink, statusAdminLink } from 'flavours/glitch/util/backend_links';
+import { accountAdminLink, statusAdminLink } from 'flavours/glitch/utils/backend_links';
 import classNames from 'classnames';
 import { PERMISSION_MANAGE_USERS } from 'flavours/glitch/permissions';
 

app/javascript/flavours/glitch/components/status_content.js

@@ -5,8 +5,8 @@ import { FormattedMessage } from 'react-intl';
 import Permalink from './permalink';
 import classnames from 'classnames';
 import Icon from 'flavours/glitch/components/icon';
-import { autoPlayGif } from 'flavours/glitch/util/initial_state';
-import { decode as decodeIDNA } from 'flavours/glitch/util/idna';
+import { autoPlayGif } from 'flavours/glitch/initial_state';
+import { decode as decodeIDNA } from 'flavours/glitch/utils/idna';
 
 const textMatchesTarget = (text, origin, host) => {
   return (text === origin || text === host

app/javascript/flavours/glitch/components/status_icons.js

@@ -8,7 +8,7 @@ import { defineMessages, injectIntl } from 'react-intl';
 import IconButton from './icon_button';
 import VisibilityIcon from './status_visibility_icon';
 import Icon from 'flavours/glitch/components/icon';
-import { languages } from 'flavours/glitch/util/initial_state';
+import { languages } from 'flavours/glitch/initial_state';
 
 //  Messages for use with internationalization stuff.
 const messages = defineMessages({

app/javascript/flavours/glitch/components/status_prepend.js

@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import { FormattedMessage } from 'react-intl';
 import Icon from 'flavours/glitch/components/icon';
-import { me } from 'flavours/glitch/util/initial_state';
+import { me } from 'flavours/glitch/initial_state';
 
 export default class StatusPrepend extends React.PureComponent {
 

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

@@ -13,7 +13,7 @@ import {
 } from 'flavours/glitch/actions/accounts';
 import { openModal } from 'flavours/glitch/actions/modal';
 import { initMuteModal } from 'flavours/glitch/actions/mutes';
-import { unfollowModal } from 'flavours/glitch/util/initial_state';
+import { unfollowModal } from 'flavours/glitch/initial_state';
 
 const messages = defineMessages({
   unfollowConfirm: { id: 'confirmations.unfollow.confirm', defaultMessage: 'Unfollow' },

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

@@ -6,7 +6,7 @@ import { hydrateStore } from 'flavours/glitch/actions/store';
 import { IntlProvider, addLocaleData } from 'react-intl';
 import { getLocale } from 'mastodon/locales';
 import Compose from 'flavours/glitch/features/standalone/compose';
-import initialState from 'flavours/glitch/util/initial_state';
+import initialState from 'flavours/glitch/initial_state';
 import { fetchCustomEmojis } from 'flavours/glitch/actions/custom_emojis';
 
 const { localeData, messages } = getLocale();

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

@@ -2,7 +2,7 @@ import { openDropdownMenu, closeDropdownMenu } from 'flavours/glitch/actions/dro
 import { openModal, closeModal } from 'flavours/glitch/actions/modal';
 import { connect } from 'react-redux';
 import DropdownMenu from 'flavours/glitch/components/dropdown_menu';
-import { isUserTouching } from 'flavours/glitch/util/is_mobile';
+import { isUserTouching } from '../is_mobile';
 
 const mapStateToProps = state => ({
   dropdownPlacement: state.getIn(['dropdown_menu', 'placement']),

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

@@ -11,7 +11,7 @@ import { connectUserStream } from 'flavours/glitch/actions/streaming';
 import { checkDeprecatedLocalSettings } from 'flavours/glitch/actions/local_settings';
 import { IntlProvider, addLocaleData } from 'react-intl';
 import { getLocale } from 'locales';
-import initialState from 'flavours/glitch/util/initial_state';
+import initialState from 'flavours/glitch/initial_state';
 import ErrorBoundary from 'flavours/glitch/components/error_boundary';
 
 const { localeData, messages } = getLocale();

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

@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
 import { IntlProvider, addLocaleData } from 'react-intl';
 import { fromJS } from 'immutable';
 import { getLocale } from 'mastodon/locales';
-import { getScrollbarWidth } from 'flavours/glitch/util/scrollbar';
+import { getScrollbarWidth } from 'flavours/glitch/utils/scrollbar';
 import MediaGallery from 'flavours/glitch/components/media_gallery';
 import Poll from 'flavours/glitch/components/poll';
 import { ImmutableHashtag as Hashtag } from 'flavours/glitch/components/hashtag';

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

@@ -36,8 +36,8 @@ import { openModal } from 'flavours/glitch/actions/modal';
 import { deployPictureInPicture } from 'flavours/glitch/actions/picture_in_picture';
 import { changeLocalSetting } from 'flavours/glitch/actions/local_settings';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
-import { boostModal, favouriteModal, deleteModal } from 'flavours/glitch/util/initial_state';
-import { filterEditLink } from 'flavours/glitch/util/backend_links';
+import { boostModal, favouriteModal, deleteModal } from 'flavours/glitch/initial_state';
+import { filterEditLink } from 'flavours/glitch/utils/backend_links';
 import { showAlertForError } from '../actions/alerts';
 import AccountContainer from 'flavours/glitch/containers/account_container';
 import Spoilers from '../components/spoilers';

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

@@ -9,7 +9,7 @@ import { getLocale } from 'mastodon/locales';
 import PublicTimeline from 'flavours/glitch/features/standalone/public_timeline';
 import HashtagTimeline from 'flavours/glitch/features/standalone/hashtag_timeline';
 import ModalContainer from 'flavours/glitch/features/ui/containers/modal_container';
-import initialState from 'flavours/glitch/util/initial_state';
+import initialState from 'flavours/glitch/initial_state';
 
 const { localeData, messages } = getLocale();
 addLocaleData(localeData);

app/javascript/flavours/glitch/features/account/components/action_bar.js

@@ -4,8 +4,8 @@ import PropTypes from 'prop-types';
 import DropdownMenuContainer from 'flavours/glitch/containers/dropdown_menu_container';
 import { NavLink } from 'react-router-dom';
 import { injectIntl, FormattedMessage, FormattedNumber } from 'react-intl';
-import { me, isStaff } from 'flavours/glitch/util/initial_state';
-import { profileLink, accountAdminLink } from 'flavours/glitch/util/backend_links';
+import { me, isStaff } from 'flavours/glitch/initial_state';
+import { profileLink, accountAdminLink } from 'flavours/glitch/utils/backend_links';
 import Icon from 'flavours/glitch/components/icon';
 
 export default @injectIntl

app/javascript/flavours/glitch/features/account/components/header.js

@@ -3,8 +3,8 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import PropTypes from 'prop-types';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 import ImmutablePureComponent from 'react-immutable-pure-component';
-import { autoPlayGif, me, title, domain } from 'flavours/glitch/util/initial_state';
-import { preferencesLink, profileLink, accountAdminLink } from 'flavours/glitch/util/backend_links';
+import { autoPlayGif, me, title, domain } from 'flavours/glitch/initial_state';
+import { preferencesLink, profileLink, accountAdminLink } from 'flavours/glitch/utils/backend_links';
 import classNames from 'classnames';
 import Icon from 'flavours/glitch/components/icon';
 import IconButton from 'flavours/glitch/components/icon_button';

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

@@ -1,8 +1,8 @@
 import Blurhash from 'flavours/glitch/components/blurhash';
 import classNames from 'classnames';
 import Icon from 'flavours/glitch/components/icon';
-import { autoPlayGif, displayMedia, useBlurhash } from 'flavours/glitch/util/initial_state';
-import { isIOS } from 'flavours/glitch/util/is_mobile';
+import { autoPlayGif, displayMedia, useBlurhash } from 'flavours/glitch/initial_state';
+import { isIOS } from 'flavours/glitch/is_mobile';
 import PropTypes from 'prop-types';
 import React from 'react';
 import ImmutablePropTypes from 'react-immutable-proptypes';

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

@@ -21,7 +21,7 @@ import { openModal } from 'flavours/glitch/actions/modal';
 import { blockDomain, unblockDomain } from 'flavours/glitch/actions/domain_blocks';
 import { initEditAccountNote } from 'flavours/glitch/actions/account_notes';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
-import { unfollowModal } from 'flavours/glitch/util/initial_state';
+import { unfollowModal } from 'flavours/glitch/initial_state';
 
 const messages = defineMessages({
   unfollowConfirm: { id: 'confirmations.unfollow.confirm', defaultMessage: 'Unfollow' },

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

@@ -8,7 +8,7 @@ import { throttle } from 'lodash';
 import { getPointerPosition, fileNameFromURL } from 'flavours/glitch/features/video';
 import { debounce } from 'lodash';
 import Visualizer from './visualizer';
-import { displayMedia, useBlurhash } from 'flavours/glitch/util/initial_state';
+import { displayMedia, useBlurhash } from 'flavours/glitch/initial_state';
 import Blurhash from 'flavours/glitch/components/blurhash';
 import { is } from 'immutable';
 

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

@@ -10,7 +10,7 @@ import { addColumn, removeColumn, moveColumn } from 'flavours/glitch/actions/col
 import ColumnSettingsContainer from './containers/column_settings_container';
 import { connectCommunityStream } from 'flavours/glitch/actions/streaming';
 import { Helmet } from 'react-helmet';
-import { title } from 'flavours/glitch/util/initial_state';
+import { title } from 'flavours/glitch/initial_state';
 
 const messages = defineMessages({
   title: { id: 'column.community', defaultMessage: 'Local timeline' },

app/javascript/flavours/glitch/features/compose/components/compose_form.js

@@ -5,17 +5,17 @@ import ReplyIndicatorContainer from '../containers/reply_indicator_container';
 import AutosuggestTextarea from '../../../components/autosuggest_textarea';
 import AutosuggestInput from '../../../components/autosuggest_input';
 import { defineMessages, injectIntl } from 'react-intl';
-import EmojiPicker from 'flavours/glitch/features/emoji_picker';
+import EmojiPickerDropdown from '../containers/emoji_picker_dropdown_container';
 import PollFormContainer from '../containers/poll_form_container';
 import UploadFormContainer from '../containers/upload_form_container';
 import WarningContainer from '../containers/warning_container';
-import { isMobile } from 'flavours/glitch/util/is_mobile';
+import { isMobile } from 'flavours/glitch/is_mobile';
 import ImmutablePureComponent from 'react-immutable-pure-component';
-import { countableText } from 'flavours/glitch/util/counter';
+import { countableText } from '../util/counter';
 import OptionsContainer from '../containers/options_container';
 import Publisher from './publisher';
 import TextareaIcons from './textarea_icons';
-import { maxChars } from 'flavours/glitch/util/initial_state';
+import { maxChars } from 'flavours/glitch/initial_state';
 import CharacterCounter from './character_counter';
 import { length } from 'stringz';
 
@@ -143,7 +143,7 @@ class ComposeForm extends ImmutablePureComponent {
   };
 
   //  Inserts an emoji at the caret.
-  handleEmoji = (data) => {
+  handleEmojiPick = (data) => {
     const { textarea: { selectionStart } } = this;
     const { onPickEmoji } = this.props;
     if (onPickEmoji) {
@@ -275,7 +275,7 @@ class ComposeForm extends ImmutablePureComponent {
 
   render () {
     const {
-      handleEmoji,
+      handleEmojiPick,
       handleSecondarySubmit,
       handleSelect,
       handleSubmit,
@@ -344,7 +344,7 @@ class ComposeForm extends ImmutablePureComponent {
           onPaste={onPaste}
           autoFocus={!showSearch && !isMobile(window.innerWidth, layout)}
         >
-          <EmojiPicker onPickEmoji={handleEmoji} />
+          <EmojiPickerDropdown onPickEmoji={handleEmojiPick} />
           <TextareaIcons advancedOptions={advancedOptions} />
           <div className='compose-form__modifiers'>
             <UploadFormContainer />

app/javascript/flavours/glitch/features/compose/components/dropdown.js

@@ -9,8 +9,8 @@ import IconButton from 'flavours/glitch/components/icon_button';
 import DropdownMenu from './dropdown_menu';
 
 //  Utils.
-import { isUserTouching } from 'flavours/glitch/util/is_mobile';
-import { assignHandlers } from 'flavours/glitch/util/react_helpers';
+import { isUserTouching } from 'flavours/glitch/is_mobile';
+import { assignHandlers } from 'flavours/glitch/utils/react_helpers';
 
 //  The component.
 export default class ComposerOptionsDropdown extends React.PureComponent {

app/javascript/flavours/glitch/features/compose/components/dropdown_menu.js

@@ -9,9 +9,9 @@ import classNames from 'classnames';
 import Icon from 'flavours/glitch/components/icon';
 
 //  Utils.
-import { withPassive } from 'flavours/glitch/util/dom_helpers';
-import Motion from 'flavours/glitch/util/optional_motion';
-import { assignHandlers } from 'flavours/glitch/util/react_helpers';
+import { withPassive } from 'flavours/glitch/utils/dom_helpers';
+import Motion from '../../ui/util/optional_motion';
+import { assignHandlers } from 'flavours/glitch/utils/react_helpers';
 
 //  The spring to use with our motion.
 const springMotion = spring(1, {

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

@@ -1,19 +1,14 @@
-import { connect } from 'react-redux';
-import { changeSetting } from 'flavours/glitch/actions/settings';
-import { createSelector } from 'reselect';
-import { Map as ImmutableMap } from 'immutable';
-import { useEmoji } from 'flavours/glitch/actions/emojis';
 import React from 'react';
 import PropTypes from 'prop-types';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
-import { EmojiPicker as EmojiPickerAsync } from 'flavours/glitch/util/async-components';
+import { EmojiPicker as EmojiPickerAsync } from '../../ui/util/async-components';
 import Overlay from 'react-overlays/lib/Overlay';
 import classNames from 'classnames';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import { supportsPassiveEvents } from 'detect-passive-events';
-import { buildCustomEmojis, categoriesFromEmojis } from 'flavours/glitch/util/emoji';
-import { useSystemEmojiFont } from 'flavours/glitch/util/initial_state';
-import { assetHost } from 'flavours/glitch/util/config';
+import { buildCustomEmojis, categoriesFromEmojis } from '../../emoji/emoji';
+import { useSystemEmojiFont } from 'flavours/glitch/initial_state';
+import { assetHost } from 'flavours/glitch/utils/config';
 
 const messages = defineMessages({
   emoji: { id: 'emoji_button.label', defaultMessage: 'Insert emoji' },
@@ -31,80 +26,6 @@ const messages = defineMessages({
   flags: { id: 'emoji_button.flags', defaultMessage: 'Flags' },
 });
 
-const perLine = 8;
-const lines   = 2;
-
-const DEFAULTS = [
-  '+1',
-  'grinning',
-  'kissing_heart',
-  'heart_eyes',
-  'laughing',
-  'stuck_out_tongue_winking_eye',
-  'sweat_smile',
-  'joy',
-  'yum',
-  'disappointed',
-  'thinking_face',
-  'weary',
-  'sob',
-  'sunglasses',
-  'heart',
-  'ok_hand',
-];
-
-const getFrequentlyUsedEmojis = createSelector([
-  state => state.getIn(['settings', 'frequentlyUsedEmojis'], ImmutableMap()),
-], emojiCounters => {
-  let emojis = emojiCounters
-    .keySeq()
-    .sort((a, b) => emojiCounters.get(a) - emojiCounters.get(b))
-    .reverse()
-    .slice(0, perLine * lines)
-    .toArray();
-
-  if (emojis.length < DEFAULTS.length) {
-    emojis = emojis.concat(DEFAULTS.slice(0, DEFAULTS.length - emojis.length));
-  }
-
-  return emojis;
-});
-
-const getCustomEmojis = createSelector([
-  state => state.get('custom_emojis'),
-], emojis => emojis.filter(e => e.get('visible_in_picker')).sort((a, b) => {
-  const aShort = a.get('shortcode').toLowerCase();
-  const bShort = b.get('shortcode').toLowerCase();
-
-  if (aShort < bShort) {
-    return -1;
-  } else if (aShort > bShort ) {
-    return 1;
-  } else {
-    return 0;
-  }
-}));
-
-const mapStateToProps = state => ({
-  custom_emojis: getCustomEmojis(state),
-  skinTone: state.getIn(['settings', 'skinTone']),
-  frequentlyUsedEmojis: getFrequentlyUsedEmojis(state),
-});
-
-const mapDispatchToProps = (dispatch, { onPickEmoji }) => ({
-  onSkinTone: skinTone => {
-    dispatch(changeSetting(['skinTone'], skinTone));
-  },
-
-  onPickEmoji: emoji => {
-    dispatch(useEmoji(emoji));
-
-    if (onPickEmoji) {
-      onPickEmoji(emoji);
-    }
-  },
-});
-
 let EmojiPicker, Emoji; // load asynchronously
 
 const listenerOptions = supportsPassiveEvents ? { passive: true } : false;
@@ -389,8 +310,7 @@ class EmojiPickerMenu extends React.PureComponent {
 
 }
 
-export default @connect(mapStateToProps, mapDispatchToProps)
-@injectIntl
+export default @injectIntl
 class EmojiPickerDropdown extends React.PureComponent {
 
   static propTypes = {

app/javascript/flavours/glitch/features/compose/components/header.js

@@ -10,8 +10,8 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
 import Icon from 'flavours/glitch/components/icon';
 
 //  Utils.
-import { conditionalRender } from 'flavours/glitch/util/react_helpers';
-import { signOutLink } from 'flavours/glitch/util/backend_links';
+import { conditionalRender } from 'flavours/glitch/utils/react_helpers';
+import { signOutLink } from 'flavours/glitch/utils/backend_links';
 
 //  Messages.
 const messages = defineMessages({

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

@@ -3,12 +3,12 @@ import PropTypes from 'prop-types';
 import { injectIntl, defineMessages } from 'react-intl';
 import TextIconButton from './text_icon_button';
 import Overlay from 'react-overlays/lib/Overlay';
-import Motion from 'flavours/glitch/util/optional_motion';
+import Motion from 'flavours/glitch/features/ui/util/optional_motion';
 import spring from 'react-motion/lib/spring';
 import { supportsPassiveEvents } from 'detect-passive-events';
 import classNames from 'classnames';
-import { languages as preloadedLanguages } from 'flavours/glitch/util/initial_state';
-import { loupeIcon, deleteIcon } from 'flavours/glitch/util/icons';
+import { languages as preloadedLanguages } from 'flavours/glitch/initial_state';
+import { loupeIcon, deleteIcon } from 'flavours/glitch/utils/icons';
 import fuzzysort from 'fuzzysort';
 
 const messages = defineMessages({

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

@@ -4,7 +4,7 @@ import Avatar from 'flavours/glitch/components/avatar';
 import Permalink from 'flavours/glitch/components/permalink';
 import { FormattedMessage } from 'react-intl';
 import ImmutablePureComponent from 'react-immutable-pure-component';
-import { profileLink } from 'flavours/glitch/util/backend_links';
+import { profileLink } from 'flavours/glitch/utils/backend_links';
 
 export default class NavigationBar extends ImmutablePureComponent {
 

app/javascript/flavours/glitch/features/compose/components/options.js

@@ -16,8 +16,8 @@ import LanguageDropdown from '../containers/language_dropdown_container';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 
 //  Utils.
-import Motion from 'flavours/glitch/util/optional_motion';
-import { pollLimits } from 'flavours/glitch/util/initial_state';
+import Motion from '../../ui/util/optional_motion';
+import { pollLimits } from 'flavours/glitch/initial_state';
 
 //  Messages.
 const messages = defineMessages({

app/javascript/flavours/glitch/features/compose/components/poll_form.js

@@ -7,7 +7,7 @@ import IconButton from 'flavours/glitch/components/icon_button';
 import Icon from 'flavours/glitch/components/icon';
 import AutosuggestInput from 'flavours/glitch/components/autosuggest_input';
 import classNames from 'classnames';
-import { pollLimits } from 'flavours/glitch/util/initial_state';
+import { pollLimits } from 'flavours/glitch/initial_state';
 
 const messages = defineMessages({
   option_placeholder: { id: 'compose_form.poll.option_placeholder', defaultMessage: 'Choice {number}' },

app/javascript/flavours/glitch/features/compose/components/publisher.js

@@ -11,7 +11,7 @@ import Button from 'flavours/glitch/components/button';
 import Icon from 'flavours/glitch/components/icon';
 
 //  Utils.
-import { maxChars } from 'flavours/glitch/util/initial_state';
+import { maxChars } from 'flavours/glitch/initial_state';
 
 //  Messages.
 const messages = defineMessages({

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

@@ -15,9 +15,9 @@ import Overlay from 'react-overlays/lib/Overlay';
 import Icon from 'flavours/glitch/components/icon';
 
 //  Utils.
-import { focusRoot } from 'flavours/glitch/util/dom_helpers';
-import { searchEnabled } from 'flavours/glitch/util/initial_state';
-import Motion from 'flavours/glitch/util/optional_motion';
+import { focusRoot } from 'flavours/glitch/utils/dom_helpers';
+import { searchEnabled } from 'flavours/glitch/initial_state';
+import Motion from '../../ui/util/optional_motion';
 
 const messages = defineMessages({
   placeholder: { id: 'search.placeholder', defaultMessage: 'Search' },

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

@@ -7,7 +7,7 @@ import StatusContainer from 'flavours/glitch/containers/status_container';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import { ImmutableHashtag as Hashtag } from 'flavours/glitch/components/hashtag';
 import Icon from 'flavours/glitch/components/icon';
-import { searchEnabled } from 'flavours/glitch/util/initial_state';
+import { searchEnabled } from 'flavours/glitch/initial_state';
 import LoadMore from 'flavours/glitch/components/load_more';
 
 const messages = defineMessages({

app/javascript/flavours/glitch/features/compose/components/upload.js

@@ -1,12 +1,12 @@
 import React from 'react';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import PropTypes from 'prop-types';
-import Motion from 'flavours/glitch/util/optional_motion';
+import Motion from '../../ui/util/optional_motion';
 import spring from 'react-motion/lib/spring';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import { FormattedMessage } from 'react-intl';
 import Icon from 'flavours/glitch/components/icon';
-import { isUserTouching } from 'flavours/glitch/util/is_mobile';
+import { isUserTouching } from 'flavours/glitch/is_mobile';
 
 export default class Upload extends ImmutablePureComponent {
 

app/javascript/flavours/glitch/features/compose/components/upload_progress.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import Motion from 'flavours/glitch/util/optional_motion';
+import Motion from '../../ui/util/optional_motion';
 import spring from 'react-motion/lib/spring';
 import Icon from 'flavours/glitch/components/icon';
 

app/javascript/flavours/glitch/features/compose/components/warning.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import Motion from 'flavours/glitch/util/optional_motion';
+import Motion from '../../ui/util/optional_motion';
 import spring from 'react-motion/lib/spring';
 
 export default class Warning extends React.PureComponent {

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

@@ -18,7 +18,7 @@ import {
 } from 'flavours/glitch/actions/modal';
 import { changeLocalSetting } from 'flavours/glitch/actions/local_settings';
 
-import { privacyPreference } from 'flavours/glitch/util/privacy_preference';
+import { privacyPreference } from 'flavours/glitch/utils/privacy_preference';
 
 const messages = defineMessages({
   missingDescriptionMessage: {  id: 'confirmations.missing_media_description.message',

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

@@ -0,0 +1,82 @@
+import { connect } from 'react-redux';
+import EmojiPickerDropdown from '../components/emoji_picker_dropdown';
+import { changeSetting } from 'flavours/glitch/actions/settings';
+import { createSelector } from 'reselect';
+import { Map as ImmutableMap } from 'immutable';
+import { useEmoji } from 'flavours/glitch/actions/emojis';
+
+const perLine = 8;
+const lines   = 2;
+
+const DEFAULTS = [
+  '+1',
+  'grinning',
+  'kissing_heart',
+  'heart_eyes',
+  'laughing',
+  'stuck_out_tongue_winking_eye',
+  'sweat_smile',
+  'joy',
+  'yum',
+  'disappointed',
+  'thinking_face',
+  'weary',
+  'sob',
+  'sunglasses',
+  'heart',
+  'ok_hand',
+];
+
+const getFrequentlyUsedEmojis = createSelector([
+  state => state.getIn(['settings', 'frequentlyUsedEmojis'], ImmutableMap()),
+], emojiCounters => {
+  let emojis = emojiCounters
+    .keySeq()
+    .sort((a, b) => emojiCounters.get(a) - emojiCounters.get(b))
+    .reverse()
+    .slice(0, perLine * lines)
+    .toArray();
+
+  if (emojis.length < DEFAULTS.length) {
+    emojis = emojis.concat(DEFAULTS.slice(0, DEFAULTS.length - emojis.length));
+  }
+
+  return emojis;
+});
+
+const getCustomEmojis = createSelector([
+  state => state.get('custom_emojis'),
+], emojis => emojis.filter(e => e.get('visible_in_picker')).sort((a, b) => {
+  const aShort = a.get('shortcode').toLowerCase();
+  const bShort = b.get('shortcode').toLowerCase();
+
+  if (aShort < bShort) {
+    return -1;
+  } else if (aShort > bShort ) {
+    return 1;
+  } else {
+    return 0;
+  }
+}));
+
+const mapStateToProps = state => ({
+  custom_emojis: getCustomEmojis(state),
+  skinTone: state.getIn(['settings', 'skinTone']),
+  frequentlyUsedEmojis: getFrequentlyUsedEmojis(state),
+});
+
+const mapDispatchToProps = (dispatch, { onPickEmoji }) => ({
+  onSkinTone: skinTone => {
+    dispatch(changeSetting(['skinTone'], skinTone));
+  },
+
+  onPickEmoji: emoji => {
+    dispatch(useEmoji(emoji));
+
+    if (onPickEmoji) {
+      onPickEmoji(emoji);
+    }
+  },
+});
+
+export default connect(mapStateToProps, mapDispatchToProps)(EmojiPickerDropdown);

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

@@ -2,7 +2,7 @@ import { openModal } from 'flavours/glitch/actions/modal';
 import { connect }   from 'react-redux';
 import { defineMessages, injectIntl } from 'react-intl';
 import Header from '../components/header';
-import { logOut } from 'flavours/glitch/util/log_out';
+import { logOut } from 'flavours/glitch/utils/log_out';
 
 const messages = defineMessages({
   logoutMessage: { id: 'confirmations.logout.message', defaultMessage: 'Are you sure you want to log out?' },

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

@@ -1,6 +1,6 @@
 import { connect }   from 'react-redux';
 import NavigationBar from '../components/navigation_bar';
-import { me } from 'flavours/glitch/util/initial_state';
+import { me } from 'flavours/glitch/initial_state';
 
 const mapStateToProps = state => {
   return {

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

@@ -3,8 +3,8 @@ import { connect } from 'react-redux';
 import Warning from '../components/warning';
 import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
-import { me } from 'flavours/glitch/util/initial_state';
-import { profileLink, termsLink } from 'flavours/glitch/util/backend_links';
+import { me } from 'flavours/glitch/initial_state';
+import { profileLink, termsLink } from 'flavours/glitch/utils/backend_links';
 
 const buildHashtagRE = () => {
   try {