Merge pull request #2339 from ClearlyClaire/glitch-soc/merge-upstream

* Cleanup unused portions of statuses/status partial (#26045)

* Wrong count in response when removing favourite/reblog (#24365)

Co-authored-by: Claire <claire.github-309c@sitedethib.com>

* Paperclip: add support for Azure blob storage (#23607)

* Fix a missing redirection on getting-started in multi column mode (#26070)

* Fix haml-lint Rubocop `Style/NumericPredicate` cop (#26040)

* Change casing for 'Server Settings' string (#26011)

* Move localized subject mailer shared example to separate file (#25889)

* Fix haml-lint Rubocop `Lint/UnusedBlockArguments` cop (#26039)

* Fix `Lint/Void` cop (#25922)

* Add stricter protocol fields validation for accounts (#25937)

* Improve the bug report templates (#25621)

* Fix the crossorigin attribute (#26096)

* Fix replica being used even if not explicitly defined (#26074)

* Clean up unused application records (#24871)

* Change thread view to scroll to the selected post rather than the post being replied to (#24685)

* Change default KeyGenerator digest to SHA1 to fix cookies in rolling upgrades (#26023)

* change focus ui for keyboard only input (#25935)

* Use username as display name for suspended users or users with blank display names (#25276)

* Fix CSP headers being unintendedly wide (#26105)

* Fix linting issue (#26106)

* Replace 'favourite' by 'favorite' for American English (#26009)

* Override default Action Mailer `preview_path` (#26110)

* Favourits -> Favorites (#26109)

* Bump version to v4.1.5 (#26108)

* Fix incorrect connect timeout in outgoing requests (#26116)

* Fix missing translation strings for importing lists (#26120)

* Use valid email address for first account (#26114)

* Update haml-lint 0.49.1 (#26118)

* Fix focus and hover styles in web UI (#26125)

* Remove back button from bookmarks, favourites and lists screens in web UI (#26126)

* Remove 16:9 cropping from web UI (#26132)

* Change design of link previews in web UI (#26136)

* change poll form element colors to fit with the rest of the ui (#26139)

* Add `lang` attribute to trending links (#26111)

* Update dependency rdf-normalize to v0.6.1 (#26130)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Update dependency brakeman to v6.0.1 (#26141)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Update dependency postcss to v8.4.27 (#26144)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Fix unexpected redirection to /explore after sign-in (#26143)

* Update dependency aws-sdk-s3 to v1.131.0 (#26145)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Add report.updated webhook (#24211)

* Fix LinkCrawlWorker crashing on `null` `created_at` (#26151)

* Fix UI Overlap with the loupe icon in the Explore Tab (#26113)

* Fix missing border on error screen in light theme in web UI (#26152)

* Fix missing action label on sensitive videos and embeds in web UI (#26135)

* Fix `lang` for UI texts in link preview (#26149)

* Add published date and author to news on the explore screen in web UI (#26155)

* Coverage for `Auth::OmniauthCallbacks` controller (#26147)

* fix poll input active style (#26162)

* Add `published_at` attribute to preview cards (#26153)

* Update dependency sass to v1.64.1 (#26146)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Revert poll colors to green outside of compose form (#26164)

* Preserve translation on status re-import (#26168)

* Fix missing GIF badge in account gallery (#26166)

* Reformat large text arg in `FetchLinkCardService` spec (#26183)

* Ignore long line in regex initializer (#26182)

* Reformat large key values in service specs (#26181)

* Reformat large hash in `ContextHelper` module (#26180)

* Use heredoc SQL blocks in `AddFromAccountIdToNotifications` migration (#26178)

* Extract private methods in `StatusCacheHydrator` (#26177)

* New Crowdin Translations (automated) (#26072)

Co-authored-by: GitHub Actions <noreply@github.com>
Co-authored-by: Claire <claire.github-309c@sitedethib.com>

* Remove the `sr` locale override .rb files (#25927)

* Use correct naming on controller concern specs (#26197)

* Migrate to request specs in `/api/v2/filters` (#25721)

* Fix wrong filters sometimes applying in streaming (#26159)

* Refactor streaming's filtering logic & improve documentation (#26213)

* Add role badges to the WebUI (#25649)

* Change interaction modal in web UI (#26075)

Co-authored-by: Eugen Rochko <eugen@zeonfederated.com>

* Fix crash when processing Flag activity with no status (#26189)

* Storage: add :azure to remaining callers (#26080)

* Remove queued_at value from pubsub payloads (#26173)

* Fix emoji picker button scrolling with textarea content in single-column view (#25304)

* Change the wording of the dismissable explore prompt (#25917)

* Update dependency haml_lint to v0.49.2 (#26222)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Fix: Streaming server memory leak in HTTP EventSource cleanup (#26228)

* Swap debug statements in streaming server (#26231)

* Fix missing return values in streaming (#26233)

* [Glitch] Wrong count in response when removing favourite/reblog

Port 4c18928a93 to glitch-soc

Co-authored-by: Claire <claire.github-309c@sitedethib.com>
Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* [Glitch] Fix a missing redirection on getting-started in multi column mode

Port 586b1c9dca to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* [Glitch] Change thread view to scroll to the selected post rather than the post being replied to

Port e4ea80d808 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* [Glitch] Replace 'favourite' by 'favorite' for American English

Port 217ef7f2af to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* [Glitch] change poll form element colors to fit with the rest of the ui

Port 80809ef33e to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* [Glitch] Add `lang` attribute to trending links

Port 76fce34ebb to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* [Glitch] Fix UI Overlap with the loupe icon in the Explore Tab

Port 9a567ec1d1 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* [Glitch] Fix missing border on error screen in light theme in web UI

Port d1a9f601c7 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* [Glitch] Fix missing action label on sensitive videos and embeds in web UI

Port 714a20697f to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* [Glitch] fix poll input active style

Port 49d2e8979f to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* [Glitch] Revert poll colors to green outside of compose form

Port ce1f35d7e2 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* [Glitch] Add published date and author to news on the explore screen in web UI

Port f826a95f6e to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* [Glitch] Preserve translation on status re-import

Port 6781dc6462 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* [Glitch] Fix missing GIF badge in account gallery

Port a4b69bec2e to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* Fix interaction modal being broken because of glitch-soc's theming system

* [Glitch] Change interaction modal in web UI

Port b4e739ff0f to glitch-soc

Co-authored-by: Eugen Rochko <eugen@zeonfederated.com>
Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* [Glitch] Change the wording of the dismissable explore prompt

Port a4ec187a20 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

* Fix CSP tests in glitch-soc

---------

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
Co-authored-by: Matt Jankowski <matt@jankowski.online>
Co-authored-by: Christian Schmidt <github@chsc.dk>
Co-authored-by: Misty De Méo <mistydemeo@gmail.com>
Co-authored-by: Stanislas Signoud <signez@stanisoft.net>
Co-authored-by: gunchleoc <fios@foramnagaidhlig.net>
Co-authored-by: Renaud Chaput <renchap@gmail.com>
Co-authored-by: Trevor Wolf <teeerevor@gmail.com>
Co-authored-by: наб <nabijaczleweli@nabijaczleweli.xyz>
Co-authored-by: mogaminsk <mgmnjp@icloud.com>
Co-authored-by: Nick Schonning <nschonni@gmail.com>
Co-authored-by: Eugen Rochko <eugen@zeonfederated.com>
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Vyr Cossont <VyrCossont@users.noreply.github.com>
Co-authored-by: gol-cha <info@mevo.xyz>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: GitHub Actions <noreply@github.com>
Co-authored-by: Daniel M Brasil <danielmbrasil@protonmail.com>
Co-authored-by: Emelia Smith <ThisIsMissEm@users.noreply.github.com>

app/javascript/core/remote_interaction_helper.ts

@@ -0,0 +1,172 @@
+/*
+
+This script is meant to to be used in an `iframe` with the sole purpose of doing webfinger queries
+client-side without being restricted by a strict `connect-src` Content-Security-Policy directive.
+
+It communicates with the parent window through message events that are authenticated by origin,
+and performs no other task.
+
+*/
+
+import 'packs/public-path';
+
+import axios from 'axios';
+
+interface JRDLink {
+  rel: string;
+  template?: string;
+  href?: string;
+}
+
+const isJRDLink = (link: unknown): link is JRDLink =>
+  typeof link === 'object' &&
+  link !== null &&
+  'rel' in link &&
+  typeof link.rel === 'string' &&
+  (!('template' in link) || typeof link.template === 'string') &&
+  (!('href' in link) || typeof link.href === 'string');
+
+const findLink = (rel: string, data: unknown): JRDLink | undefined => {
+  if (
+    typeof data === 'object' &&
+    data !== null &&
+    'links' in data &&
+    data.links instanceof Array
+  ) {
+    return data.links.find(
+      (link): link is JRDLink => isJRDLink(link) && link.rel === rel,
+    );
+  } else {
+    return undefined;
+  }
+};
+
+const findTemplateLink = (data: unknown) =>
+  findLink('http://ostatus.org/schema/1.0/subscribe', data)?.template;
+
+const fetchInteractionURLSuccess = (
+  uri_or_domain: string,
+  template: string,
+) => {
+  window.parent.postMessage(
+    {
+      type: 'fetchInteractionURL-success',
+      uri_or_domain,
+      template,
+    },
+    window.origin,
+  );
+};
+
+const fetchInteractionURLFailure = () => {
+  window.parent.postMessage(
+    {
+      type: 'fetchInteractionURL-failure',
+    },
+    window.origin,
+  );
+};
+
+const isValidDomain = (value: string) => {
+  const url = new URL('https:///path');
+  url.hostname = value;
+  return url.hostname === value;
+};
+
+// Attempt to find a remote interaction URL from a domain
+const fromDomain = (domain: string) => {
+  const fallbackTemplate = `https://${domain}/authorize_interaction?uri={uri}`;
+
+  axios
+    .get(`https://${domain}/.well-known/webfinger`, {
+      params: { resource: `https://${domain}` },
+    })
+    .then(({ data }) => {
+      const template = findTemplateLink(data);
+      fetchInteractionURLSuccess(domain, template ?? fallbackTemplate);
+      return;
+    })
+    .catch(() => {
+      fetchInteractionURLSuccess(domain, fallbackTemplate);
+    });
+};
+
+// Attempt to find a remote interaction URL from an arbitrary URL
+const fromURL = (url: string) => {
+  const domain = new URL(url).host;
+  const fallbackTemplate = `https://${domain}/authorize_interaction?uri={uri}`;
+
+  axios
+    .get(`https://${domain}/.well-known/webfinger`, {
+      params: { resource: url },
+    })
+    .then(({ data }) => {
+      const template = findTemplateLink(data);
+      fetchInteractionURLSuccess(url, template ?? fallbackTemplate);
+      return;
+    })
+    .catch(() => {
+      fromDomain(domain);
+    });
+};
+
+// Attempt to find a remote interaction URL from a `user@domain` string
+const fromAcct = (acct: string) => {
+  acct = acct.replace(/^@/, '');
+
+  const segments = acct.split('@');
+
+  if (segments.length !== 2 || !segments[0] || !isValidDomain(segments[1])) {
+    fetchInteractionURLFailure();
+    return;
+  }
+
+  const domain = segments[1];
+  const fallbackTemplate = `https://${domain}/authorize_interaction?uri={uri}`;
+
+  axios
+    .get(`https://${domain}/.well-known/webfinger`, {
+      params: { resource: `acct:${acct}` },
+    })
+    .then(({ data }) => {
+      const template = findTemplateLink(data);
+      fetchInteractionURLSuccess(acct, template ?? fallbackTemplate);
+      return;
+    })
+    .catch(() => {
+      // TODO: handle host-meta?
+      fromDomain(domain);
+    });
+};
+
+const fetchInteractionURL = (uri_or_domain: string) => {
+  if (/^https?:\/\//.test(uri_or_domain)) {
+    fromURL(uri_or_domain);
+  } else if (uri_or_domain.includes('@')) {
+    fromAcct(uri_or_domain);
+  } else {
+    fromDomain(uri_or_domain);
+  }
+};
+
+window.addEventListener('message', (event: MessageEvent<unknown>) => {
+  // Check message origin
+  if (
+    !window.origin ||
+    window.parent !== event.source ||
+    event.origin !== window.origin
+  ) {
+    return;
+  }
+
+  if (
+    event.data &&
+    typeof event.data === 'object' &&
+    'type' in event.data &&
+    event.data.type === 'fetchInteractionURL' &&
+    'uri_or_domain' in event.data &&
+    typeof event.data.uri_or_domain === 'string'
+  ) {
+    fetchInteractionURL(event.data.uri_or_domain);
+  }
+});

app/javascript/core/theme.yml

@@ -18,3 +18,4 @@ pack:
   settings: settings.js
   sign_up:
   share:
+  remote_interaction_helper: remote_interaction_helper.ts

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

@@ -81,7 +81,7 @@ export function importFetchedStatuses(statuses) {
       }
 
       if (status.poll && status.poll.id) {
-        pushUnique(polls, normalizePoll(status.poll));
+        pushUnique(polls, normalizePoll(status.poll, getState().getIn(['polls', status.poll.id])));
       }
     }
 
@@ -95,7 +95,7 @@ export function importFetchedStatuses(statuses) {
 }
 
 export function importFetchedPoll(poll) {
-  return dispatch => {
-    dispatch(importPolls([normalizePoll(poll)]));
+  return (dispatch, getState) => {
+    dispatch(importPolls([normalizePoll(poll, getState().getIn(['polls', poll.id]))]));
   };
 }

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

@@ -75,6 +75,7 @@ export function normalizeStatus(status, normalOldStatus, settings) {
     normalStatus.contentHtml = normalOldStatus.get('contentHtml');
     normalStatus.spoilerHtml = normalOldStatus.get('spoilerHtml');
     normalStatus.hidden = normalOldStatus.get('hidden');
+    normalStatus.translation = normalOldStatus.get('translation');
   } else {
     const spoilerText   = normalStatus.spoiler_text || '';
     const searchContent = ([spoilerText, status.content].concat((status.poll && status.poll.options) ? status.poll.options.map(option => option.title) : [])).concat(status.media_attachments.map(att => att.description)).join('\n\n').replace(/<br\s*\/?>/g, '\n').replace(/<\/p><p>/g, '\n\n');
@@ -86,6 +87,18 @@ export function normalizeStatus(status, normalOldStatus, settings) {
     normalStatus.hidden       = (spoilerText.length > 0 || normalStatus.sensitive) && autoHideCW(settings, spoilerText);
   }
 
+  if (normalOldStatus) {
+    const list = normalOldStatus.get('media_attachments');
+    if (normalStatus.media_attachments && list) {
+      normalStatus.media_attachments.forEach(item => {
+        const oldItem = list.find(i => i.get('id') === item.id);
+        if (oldItem && oldItem.get('description') === item.description) {
+          item.translation = oldItem.get('translation')
+        }
+      });
+    }
+  }
+
   return normalStatus;
 }
 
@@ -104,15 +117,23 @@ export function normalizeStatusTranslation(translation, status) {
   return normalTranslation;
 }
 
-export function normalizePoll(poll) {
+export function normalizePoll(poll, normalOldPoll) {
   const normalPoll = { ...poll };
   const emojiMap = makeEmojiMap(poll.emojis);
 
-  normalPoll.options = poll.options.map((option, index) => ({
-    ...option,
-    voted: poll.own_votes && poll.own_votes.includes(index),
-    titleHtml: emojify(escapeTextContentForBrowser(option.title), emojiMap),
-  }));
+  normalPoll.options = poll.options.map((option, index) => {
+    const normalOption = {
+      ...option,
+      voted: poll.own_votes && poll.own_votes.includes(index),
+      titleHtml: emojify(escapeTextContentForBrowser(option.title), emojiMap),
+    }
+
+    if (normalOldPoll && normalOldPoll.getIn(['options', index, 'title']) === option.title) {
+      normalOption.translation = normalOldPoll.getIn(['options', index, 'translation']);
+    }
+
+    return normalOption
+  });
 
   return normalPoll;
 }

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

@@ -31,7 +31,7 @@ const messages = defineMessages({
   reblog_private: { id: 'status.reblog_private', defaultMessage: 'Boost with original visibility' },
   cancel_reblog_private: { id: 'status.cancel_reblog_private', defaultMessage: 'Unboost' },
   cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' },
-  favourite: { id: 'status.favourite', defaultMessage: 'Favourite' },
+  favourite: { id: 'status.favourite', defaultMessage: 'Favorite' },
   bookmark: { id: 'status.bookmark', defaultMessage: 'Bookmark' },
   open: { id: 'status.open', defaultMessage: 'Expand this status' },
   report: { id: 'status.report', defaultMessage: 'Report @{name}' },

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

@@ -55,7 +55,7 @@ export default class StatusPrepend extends PureComponent {
       return (
         <FormattedMessage
           id='notification.favourite'
-          defaultMessage='{name} favourited your status'
+          defaultMessage='{name} favorited your status'
           values={{ name : link }}
         />
       );

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

@@ -47,7 +47,7 @@ const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
   deleteMessage: { id: 'confirmations.delete.message', defaultMessage: 'Are you sure you want to delete this status?' },
   redraftConfirm: { id: 'confirmations.redraft.confirm', defaultMessage: 'Delete & redraft' },
-  redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favourites and boosts will be lost, and replies to the original post will be orphaned.' },
+  redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favorites and boosts will be lost, and replies to the original post will be orphaned.' },
   replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' },
   replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
   editConfirm: { id: 'confirmations.edit.confirm', defaultMessage: 'Edit' },
@@ -293,7 +293,7 @@ const mapDispatchToProps = (dispatch, { intl, contextType }) => ({
       modalProps: {
         type,
         accountId: status.getIn(['account', 'id']),
-        url: status.get('url'),
+        url: status.get('uri'),
       },
     }));
   },

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

@@ -0,0 +1,303 @@
+import { defineMessages, injectIntl } from 'react-intl';
+
+import { connect } from 'react-redux';
+
+import { initBlockModal } from 'flavours/glitch/actions/blocks';
+import { initBoostModal } from 'flavours/glitch/actions/boosts';
+import {
+  replyCompose,
+  mentionCompose,
+  directCompose,
+} from 'flavours/glitch/actions/compose';
+import {
+  initAddFilter,
+} from 'flavours/glitch/actions/filters';
+import {
+  reblog,
+  favourite,
+  bookmark,
+  unreblog,
+  unfavourite,
+  unbookmark,
+  pin,
+  unpin,
+} from 'flavours/glitch/actions/interactions';
+import { changeLocalSetting } from 'flavours/glitch/actions/local_settings';
+import { openModal } from 'flavours/glitch/actions/modal';
+import { initMuteModal } from 'flavours/glitch/actions/mutes';
+import { deployPictureInPicture } from 'flavours/glitch/actions/picture_in_picture';
+import { initReport } from 'flavours/glitch/actions/reports';
+import {
+  muteStatus,
+  unmuteStatus,
+  deleteStatus,
+  hideStatus,
+  revealStatus,
+  editStatus,
+  translateStatus,
+  undoStatusTranslation,
+} from 'flavours/glitch/actions/statuses';
+import Status from 'flavours/glitch/components/status';
+import { boostModal, favouriteModal, deleteModal } from 'flavours/glitch/initial_state';
+import { makeGetStatus, makeGetPictureInPicture } from 'flavours/glitch/selectors';
+
+import { showAlertForError } from '../actions/alerts';
+
+const messages = defineMessages({
+  deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
+  deleteMessage: { id: 'confirmations.delete.message', defaultMessage: 'Are you sure you want to delete this status?' },
+  redraftConfirm: { id: 'confirmations.redraft.confirm', defaultMessage: 'Delete & redraft' },
+  redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favorites and boosts will be lost, and replies to the original post will be orphaned.' },
+  replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' },
+  replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
+  editConfirm: { id: 'confirmations.edit.confirm', defaultMessage: 'Edit' },
+  editMessage: { id: 'confirmations.edit.message', defaultMessage: 'Editing now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
+  unfilterConfirm: { id: 'confirmations.unfilter.confirm', defaultMessage: 'Show' },
+  author: { id: 'confirmations.unfilter.author', defaultMessage: 'Author' },
+  matchingFilters: { id: 'confirmations.unfilter.filters', defaultMessage: 'Matching {count, plural, one {filter} other {filters}}' },
+  editFilter: { id: 'confirmations.unfilter.edit_filter', defaultMessage: 'Edit filter' },
+});
+
+const makeMapStateToProps = () => {
+  const getStatus = makeGetStatus();
+  const getPictureInPicture = makeGetPictureInPicture();
+
+  const mapStateToProps = (state, props) => {
+
+    let status = getStatus(state, props);
+    let reblogStatus = status ? status.get('reblog', null) : null;
+    let account = undefined;
+    let prepend = undefined;
+
+    if (props.featured && status) {
+      account = status.get('account');
+      prepend = 'featured';
+    } else if (reblogStatus !== null && typeof reblogStatus === 'object') {
+      account = status.get('account');
+      status = reblogStatus;
+      prepend = 'reblogged_by';
+    }
+
+    return {
+      containerId: props.containerId || props.id,  //  Should match reblogStatus's id for reblogs
+      status: status,
+      nextInReplyToId: props.nextId ? state.getIn(['statuses', props.nextId, 'in_reply_to_id']) : null,
+      account: account || props.account,
+      settings: state.get('local_settings'),
+      prepend: prepend || props.prepend,
+      pictureInPicture: getPictureInPicture(state, props),
+    };
+  };
+
+  return mapStateToProps;
+};
+
+const mapDispatchToProps = (dispatch, { intl, contextType }) => ({
+
+  onReply (status, router) {
+    dispatch((_, getState) => {
+      let state = getState();
+
+      if (state.getIn(['local_settings', 'confirm_before_clearing_draft']) && state.getIn(['compose', 'text']).trim().length !== 0) {
+        dispatch(openModal({
+          modalType: 'CONFIRM',
+          modalProps: {
+            message: intl.formatMessage(messages.replyMessage),
+            confirm: intl.formatMessage(messages.replyConfirm),
+            onDoNotAsk: () => dispatch(changeLocalSetting(['confirm_before_clearing_draft'], false)),
+            onConfirm: () => dispatch(replyCompose(status, router)),
+          },
+        }));
+      } else {
+        dispatch(replyCompose(status, router));
+      }
+    });
+  },
+
+  onModalReblog (status, privacy) {
+    if (status.get('reblogged')) {
+      dispatch(unreblog(status));
+    } else {
+      dispatch(reblog(status, privacy));
+    }
+  },
+
+  onReblog (status, e) {
+    dispatch((_, getState) => {
+      let state = getState();
+      if (state.getIn(['local_settings', 'confirm_boost_missing_media_description']) && status.get('media_attachments').some(item => !item.get('description')) && !status.get('reblogged')) {
+        dispatch(initBoostModal({ status, onReblog: this.onModalReblog, missingMediaDescription: true }));
+      } else if (e.shiftKey || !boostModal) {
+        this.onModalReblog(status);
+      } else {
+        dispatch(initBoostModal({ status, onReblog: this.onModalReblog }));
+      }
+    });
+  },
+
+  onBookmark (status) {
+    if (status.get('bookmarked')) {
+      dispatch(unbookmark(status));
+    } else {
+      dispatch(bookmark(status));
+    }
+  },
+
+  onModalFavourite (status) {
+    dispatch(favourite(status));
+  },
+
+  onFavourite (status, e) {
+    if (status.get('favourited')) {
+      dispatch(unfavourite(status));
+    } else {
+      if (e.shiftKey || !favouriteModal) {
+        this.onModalFavourite(status);
+      } else {
+        dispatch(openModal({
+          modalType: 'FAVOURITE',
+          modalProps: {
+            status,
+            onFavourite: this.onModalFavourite,
+          },
+        }));
+      }
+    }
+  },
+
+  onPin (status) {
+    if (status.get('pinned')) {
+      dispatch(unpin(status));
+    } else {
+      dispatch(pin(status));
+    }
+  },
+
+  onEmbed (status) {
+    dispatch(openModal({
+      modalType: 'EMBED',
+      modalProps: {
+        id: status.get('id'),
+        onError: error => dispatch(showAlertForError(error)),
+      },
+    }));
+  },
+
+  onDelete (status, history, withRedraft = false) {
+    if (!deleteModal) {
+      dispatch(deleteStatus(status.get('id'), history, withRedraft));
+    } else {
+      dispatch(openModal({
+        modalType: 'CONFIRM',
+        modalProps: {
+          message: intl.formatMessage(withRedraft ? messages.redraftMessage : messages.deleteMessage),
+          confirm: intl.formatMessage(withRedraft ? messages.redraftConfirm : messages.deleteConfirm),
+          onConfirm: () => dispatch(deleteStatus(status.get('id'), history, withRedraft)),
+        },
+      }));
+    }
+  },
+
+  onEdit (status, history) {
+    dispatch((_, getState) => {
+      let state = getState();
+      if (state.getIn(['compose', 'text']).trim().length !== 0) {
+        dispatch(openModal({
+          modalType: 'CONFIRM',
+          modalProps: {
+            message: intl.formatMessage(messages.editMessage),
+            confirm: intl.formatMessage(messages.editConfirm),
+            onConfirm: () => dispatch(editStatus(status.get('id'), history)),
+          },
+        }));
+      } else {
+        dispatch(editStatus(status.get('id'), history));
+      }
+    });
+  },
+
+  onTranslate (status) {
+    if (status.get('translation')) {
+      dispatch(undoStatusTranslation(status.get('id'), status.get('poll')));
+    } else {
+      dispatch(translateStatus(status.get('id')));
+    }
+  },
+
+  onDirect (account, router) {
+    dispatch(directCompose(account, router));
+  },
+
+  onMention (account, router) {
+    dispatch(mentionCompose(account, router));
+  },
+
+  onOpenMedia (statusId, media, index, lang) {
+    dispatch(openModal({
+      modalType: 'MEDIA',
+      modalProps: { statusId, media, index, lang },
+    }));
+  },
+
+  onOpenVideo (statusId, media, lang, options) {
+    dispatch(openModal({
+      modalType: 'VIDEO',
+      modalProps: { statusId, media, lang, options },
+    }));
+  },
+
+  onBlock (status) {
+    const account = status.get('account');
+    dispatch(initBlockModal(account));
+  },
+
+  onReport (status) {
+    dispatch(initReport(status.get('account'), status));
+  },
+
+  onAddFilter (status) {
+    dispatch(initAddFilter(status, { contextType }));
+  },
+
+  onMute (account) {
+    dispatch(initMuteModal(account));
+  },
+
+  onMuteConversation (status) {
+    if (status.get('muted')) {
+      dispatch(unmuteStatus(status.get('id')));
+    } else {
+      dispatch(muteStatus(status.get('id')));
+    }
+  },
+
+  onToggleHidden (status) {
+    if (status.get('hidden')) {
+      dispatch(revealStatus(status.get('id')));
+    } else {
+      dispatch(hideStatus(status.get('id')));
+    }
+  },
+
+  deployPictureInPicture (status, type, mediaProps) {
+    dispatch((_, getState) => {
+      if (getState().getIn(['local_settings', 'media', 'pop_in_player'])) {
+        dispatch(deployPictureInPicture(status.get('id'), status.getIn(['account', 'id']), type, mediaProps));
+      }
+    });
+  },
+
+  onInteractionModal (type, status) {
+    dispatch(openModal({
+      modalType: 'INTERACTION',
+      modalProps: {
+        type,
+        accountId: status.getIn(['account', 'id']),
+        url: status.get('url'),
+      },
+    }));
+  },
+
+});
+
+export default injectIntl(connect(makeMapStateToProps, mapDispatchToProps)(Status));

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

@@ -46,7 +46,7 @@ const messages = defineMessages({
   pins: { id: 'navigation_bar.pins', defaultMessage: 'Pinned posts' },
   preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },
   follow_requests: { id: 'navigation_bar.follow_requests', defaultMessage: 'Follow requests' },
-  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favourites' },
+  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favorites' },
   lists: { id: 'navigation_bar.lists', defaultMessage: 'Lists' },
   followed_tags: { id: 'navigation_bar.followed_tags', defaultMessage: 'Followed hashtags' },
   blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },

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

@@ -130,7 +130,11 @@ export default class MediaItem extends ImmutablePureComponent {
         <div className='media-gallery__gifv'>
           {content}
 
-          {label && <span className='media-gallery__gifv__label'>{label}</span>}
+          {label && (
+            <div className='media-gallery__item__badges'>
+              <span className='media-gallery__gifv__label'>{label}</span>
+            </div>
+          )}
         </div>
       );
     }

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

@@ -83,7 +83,7 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
       modalProps: {
         type: 'follow',
         accountId: account.get('id'),
-        url: account.get('url'),
+        url: account.get('uri'),
       },
     }));
   },

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

@@ -477,6 +477,7 @@ class Audio extends PureComponent {
     const progress = Math.min((currentTime / duration) * 100, 100);
 
     let warning;
+
     if (sensitive) {
       warning = <FormattedMessage id='status.sensitive_warning' defaultMessage='Sensitive content' />;
     } else {
@@ -522,7 +523,10 @@ class Audio extends PureComponent {
 
         <div className={classNames('spoiler-button', { 'spoiler-button--hidden': revealed || editable })}>
           <button type='button' className='spoiler-button__overlay' onClick={this.toggleReveal}>
-            <span className='spoiler-button__overlay__label'>{warning}</span>
+            <span className='spoiler-button__overlay__label'>
+              {warning}
+              <span className='spoiler-button__overlay__action'><FormattedMessage id='status.media.show' defaultMessage='Click to show' /></span>
+            </span>
           </button>
         </div>
 

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

@@ -14,7 +14,7 @@ const messages = defineMessages({
   pins: { id: 'navigation_bar.pins', defaultMessage: 'Pinned posts' },
   preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },
   follow_requests: { id: 'navigation_bar.follow_requests', defaultMessage: 'Follow requests' },
-  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favourites' },
+  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favorites' },
   lists: { id: 'navigation_bar.lists', defaultMessage: 'Lists' },
   followed_tags: { id: 'navigation_bar.followed_tags', defaultMessage: 'Followed hashtags' },
   blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },

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

@@ -1,10 +1,13 @@
 import PropTypes from 'prop-types';
 import { PureComponent } from 'react';
 
+import { FormattedMessage } from 'react-intl';
+
 import classNames from 'classnames';
 
 import { Blurhash } from 'flavours/glitch/components/blurhash';
 import { accountsCountRenderer } from 'flavours/glitch/components/hashtag';
+import { RelativeTimestamp } from 'flavours/glitch/components/relative_timestamp';
 import { ShortNumber } from 'flavours/glitch/components/short_number';
 import { Skeleton } from 'flavours/glitch/components/skeleton';
 
@@ -14,10 +17,14 @@ export default class Story extends PureComponent {
   static propTypes = {
     url: PropTypes.string,
     title: PropTypes.string,
+    lang: PropTypes.string,
     publisher: PropTypes.string,
+    publishedAt: PropTypes.string,
+    author: PropTypes.string,
     sharedTimes: PropTypes.number,
     thumbnail: PropTypes.string,
     blurhash: PropTypes.string,
+    expanded: PropTypes.bool,
   };
 
   state = {
@@ -27,16 +34,16 @@ export default class Story extends PureComponent {
   handleImageLoad = () => this.setState({ thumbnailLoaded: true });
 
   render () {
-    const { url, title, publisher, sharedTimes, thumbnail, blurhash } = this.props;
+    const { expanded, url, title, lang, publisher, author, publishedAt, sharedTimes, thumbnail, blurhash } = this.props;
 
     const { thumbnailLoaded } = this.state;
 
     return (
-      <a className='story' href={url} target='blank' rel='noopener'>
+      <a className={classNames('story', { expanded })} href={url} target='blank' rel='noopener'>
         <div className='story__details'>
-          <div className='story__details__publisher'>{publisher ? publisher : <Skeleton width={50} />}</div>
-          <div className='story__details__title'>{title ? title : <Skeleton />}</div>
-          <div className='story__details__shared'>{typeof sharedTimes === 'number' ? <ShortNumber value={sharedTimes} renderer={accountsCountRenderer} /> : <Skeleton width={100} />}</div>
+          <div className='story__details__publisher'>{publisher ? <span lang={lang}>{publisher}</span> : <Skeleton width={50} />}{publishedAt && <> · <RelativeTimestamp timestamp={publishedAt} /></>}</div>
+          <div className='story__details__title' lang={lang}>{title ? title : <Skeleton />}</div>
+          <div className='story__details__shared'>{author && <><FormattedMessage id='link_preview.author' defaultMessage='By {name}' values={{ name: <strong>{author}</strong> }} /> · </>}{typeof sharedTimes === 'number' ? <ShortNumber value={sharedTimes} renderer={accountsCountRenderer} /> : <Skeleton width={100} />}</div>
         </div>
 
         <div className='story__thumbnail'>

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

@@ -55,12 +55,16 @@ class Links extends PureComponent {
       <div className='explore__links'>
         {banner}
 
-        {isLoading ? (<LoadingIndicator />) : links.map(link => (
+        {isLoading ? (<LoadingIndicator />) : links.map((link, i) => (
           <Story
             key={link.get('id')}
+            expanded={i === 0}
+            lang={link.get('language')}
             url={link.get('url')}
             title={link.get('title')}
             publisher={link.get('provider_name')}
+            publishedAt={link.get('published_at')}
+            author={link.get('author_name')}
             sharedTimes={link.getIn(['history', 0, 'accounts']) * 1 + link.getIn(['history', 1, 'accounts']) * 1}
             thumbnail={link.get('image')}
             blurhash={link.get('blurhash')}

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

@@ -47,7 +47,7 @@ class Statuses extends PureComponent {
     return (
       <>
         <DismissableBanner id='explore/statuses'>
-          <FormattedMessage id='dismissable_banner.explore_statuses' defaultMessage='These are posts from across the social web that are gaining traction today. Newer posts with more boosts and favourites are ranked higher.' />
+          <FormattedMessage id='dismissable_banner.explore_statuses' defaultMessage='These are posts from across the social web that are gaining traction today. Newer posts with more boosts and favorites are ranked higher.' />
         </DismissableBanner>
 
         <StatusList

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

@@ -18,7 +18,7 @@ import Column from 'flavours/glitch/features/ui/components/column';
 import { getStatusList } from 'flavours/glitch/selectors';
 
 const messages = defineMessages({
-  heading: { id: 'column.favourites', defaultMessage: 'Favourites' },
+  heading: { id: 'column.favourites', defaultMessage: 'Favorites' },
 });
 
 const mapStateToProps = state => ({
@@ -74,7 +74,7 @@ class Favourites extends ImmutablePureComponent {
     const { intl, statusIds, columnId, multiColumn, hasMore, isLoading } = this.props;
     const pinned = !!columnId;
 
-    const emptyMessage = <FormattedMessage id='empty_column.favourited_statuses' defaultMessage="You don't have any favourite posts yet. When you favourite one, it will show up here." />;
+    const emptyMessage = <FormattedMessage id='empty_column.favourited_statuses' defaultMessage="You don't have any favorite posts yet. When you favorite one, it will show up here." />;
 
     return (
       <Column bindToDocument={!multiColumn} ref={this.setRef} name='favourites' label={intl.formatMessage(messages.heading)}>

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

@@ -71,7 +71,7 @@ class Favourites extends ImmutablePureComponent {
       );
     }
 
-    const emptyMessage = <FormattedMessage id='empty_column.favourites' defaultMessage='No one has favourited this post yet. When someone does, they will show up here.' />;
+    const emptyMessage = <FormattedMessage id='empty_column.favourites' defaultMessage='No one has favorited this post yet. When someone does, they will show up here.' />;
 
     return (
       <Column ref={this.setRef}>

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

@@ -15,7 +15,7 @@ import ColumnSubheading from 'flavours/glitch/features/ui/components/column_subh
 const messages = defineMessages({
   heading: { id: 'column.heading', defaultMessage: 'Misc' },
   subheading: { id: 'column.subheading', defaultMessage: 'Miscellaneous options' },
-  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favourites' },
+  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favorites' },
   blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },
   domain_blocks: { id: 'navigation_bar.domain_blocks', defaultMessage: 'Blocked domains' },
   mutes: { id: 'navigation_bar.mutes', defaultMessage: 'Muted users' },

app/javascript/flavours/glitch/features/home_timeline/components/explore_prompt.tsx

@@ -22,7 +22,7 @@ export const ExplorePrompt = () => (
     <p>
       <FormattedMessage
         id='home.explore_prompt.body'
-        defaultMessage="Your home feed will have a mix of posts from the hashtags you've chosen to follow, the people you've chosen to follow, and the posts they boost. It's looking pretty quiet right now, so how about:"
+        defaultMessage="Your home feed will have a mix of posts from the hashtags you've chosen to follow, the people you've chosen to follow, and the posts they boost. If that feels too quiet, you may want to:"
       />
     </p>
 

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

@@ -1,95 +1,296 @@
 import PropTypes from 'prop-types';
-import { PureComponent } from 'react';
+import React from 'react';
 
-import { FormattedMessage } from 'react-intl';
+import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
 
 import classNames from 'classnames';
 
 import { connect } from 'react-redux';
 
+import { throttle, escapeRegExp } from 'lodash';
+
 import { openModal, closeModal } from 'flavours/glitch/actions/modal';
+import api from 'flavours/glitch/api';
+import Button from 'flavours/glitch/components/button';
 import { Icon } from 'flavours/glitch/components/icon';
 import { registrationsOpen } from 'flavours/glitch/initial_state';
 
+const messages = defineMessages({
+  loginPrompt: { id: 'interaction_modal.login.prompt', defaultMessage: 'Domain of your home server, e.g. mastodon.social' },
+});
+
 const mapStateToProps = (state, { accountId }) => ({
   displayNameHtml: state.getIn(['accounts', accountId, 'display_name_html']),
-  signupUrl: state.getIn(['server', 'server', 'registrations', 'url'], null) || '/auth/sign_up',
 });
 
 const mapDispatchToProps = (dispatch) => ({
   onSignupClick() {
-    dispatch(closeModal({
-      modalType: undefined,
-      ignoreFocus: false,
-    }));
-    dispatch(openModal({ modalType: 'CLOSED_REGISTRATIONS' }));
+    dispatch(closeModal());
+    dispatch(openModal('CLOSED_REGISTRATIONS'));
   },
 });
 
-class Copypaste extends PureComponent {
+const PERSISTENCE_KEY = 'flavours/glitch_home';
+
+const isValidDomain = value => {
+  const url = new URL('https:///path');
+  url.hostname = value;
+  return url.hostname === value;
+};
+
+const valueToDomain = value => {
+  // If the user starts typing an URL
+  if (/^https?:\/\//.test(value)) {
+    try {
+      const url = new URL(value);
+
+      // Consider that if there is a path, the URL is more meaningful than a bare domain
+      if (url.pathname.length > 1) {
+        return '';
+      }
+
+      return url.host;
+    } catch {
+      return undefined;
+    }
+  // If the user writes their full handle including username
+  } else if (value.includes('@')) {
+    if (value.replace(/^@/, '').split('@').length > 2) {
+      return undefined;
+    }
+    return '';
+  }
+
+  return value;
+};
+
+const addInputToOptions = (value, options) => {
+  value = value.trim();
+
+  if (value.includes('.') && isValidDomain(value)) {
+    return [value].concat(options.filter((x) => x !== value));
+  }
+
+  return options;
+};
+
+class LoginForm extends React.PureComponent {
 
   static propTypes = {
-    value: PropTypes.string,
+    resourceUrl: PropTypes.string,
+    intl: PropTypes.object.isRequired,
   };
 
   state = {
-    copied: false,
+    value: localStorage ? (localStorage.getItem(PERSISTENCE_KEY) || '') : '',
+    expanded: false,
+    selectedOption: -1,
+    isLoading: false,
+    isSubmitting: false,
+    error: false,
+    options: [],
+    networkOptions: [],
   };
 
   setRef = c => {
     this.input = c;
   };
 
-  handleInputClick = () => {
-    this.setState({ copied: false });
-    this.input.focus();
-    this.input.select();
-    this.input.setSelectionRange(0, this.input.value.length);
+  handleChange = ({ target }) => {
+    this.setState(state => ({ value: target.value, isLoading: true, error: false, options: addInputToOptions(target.value, state.networkOptions) }), () => this._loadOptions());
   };
 
-  handleButtonClick = () => {
-    const { value } = this.props;
-    navigator.clipboard.writeText(value);
-    this.input.blur();
-    this.setState({ copied: true });
-    this.timeout = setTimeout(() => this.setState({ copied: false }), 700);
+  handleMessage = (event) => {
+    const { resourceUrl } = this.props;
+
+    if (event.origin !== window.origin || event.source !== this.iframeRef.contentWindow) {
+      return;
+    }
+
+    if (event.data?.type === 'fetchInteractionURL-failure') {
+      this.setState({ isSubmitting: false, error: true });
+    } else if (event.data?.type === 'fetchInteractionURL-success') {
+      if (/^https?:\/\//.test(event.data.template)) {
+        if (localStorage) {
+          localStorage.setItem(PERSISTENCE_KEY, event.data.uri_or_domain);
+        }
+
+        window.location.href = event.data.template.replace('{uri}', encodeURIComponent(resourceUrl));
+      } else {
+        this.setState({ isSubmitting: false, error: true });
+      }
+    }
   };
 
-  componentWillUnmount () {
-    if (this.timeout) clearTimeout(this.timeout);
+  componentDidMount () {
+    window.addEventListener('message', this.handleMessage);
   }
 
+  componentWillUnmount () {
+    window.removeEventListener('message', this.handleMessage);
+  }
+
+  handleSubmit = () => {
+    const { value } = this.state;
+
+    this.setState({ isSubmitting: true });
+
+    this.iframeRef.contentWindow.postMessage({
+      type: 'fetchInteractionURL',
+      uri_or_domain: value.trim(),
+    }, window.origin);
+  };
+
+  setIFrameRef = (iframe) => {
+    this.iframeRef = iframe;
+  }
+
+  handleFocus = () => {
+    this.setState({ expanded: true });
+  };
+
+  handleBlur = () => {
+    this.setState({ expanded: false });
+  };
+
+  handleKeyDown = (e) => {
+    const { options, selectedOption } = this.state;
+
+    switch(e.key) {
+    case 'ArrowDown':
+      e.preventDefault();
+
+      if (options.length > 0) {
+        this.setState({ selectedOption: Math.min(selectedOption + 1, options.length - 1) });
+      }
+
+      break;
+    case 'ArrowUp':
+      e.preventDefault();
+
+      if (options.length > 0) {
+        this.setState({ selectedOption: Math.max(selectedOption - 1, -1) });
+      }
+
+      break;
+    case 'Enter':
+      e.preventDefault();
+
+      if (selectedOption === -1) {
+        this.handleSubmit();
+      } else if (options.length > 0) {
+        this.setState({ value: options[selectedOption], error: false }, () => this.handleSubmit());
+      }
+
+      break;
+    }
+  };
+
+  handleOptionClick = e => {
+    const index  = Number(e.currentTarget.getAttribute('data-index'));
+    const option = this.state.options[index];
+
+    e.preventDefault();
+    this.setState({ selectedOption: index, value: option, error: false }, () => this.handleSubmit());
+  };
+
+  _loadOptions = throttle(() => {
+    const { value } = this.state;
+
+    const domain = valueToDomain(value.trim());
+
+    if (typeof domain === 'undefined') {
+      this.setState({ options: [], networkOptions: [], isLoading: false, error: true });
+      return;
+    }
+
+    if (domain.length === 0) {
+      this.setState({ options: [], networkOptions: [], isLoading: false });
+      return;
+    }
+
+    api().get('/api/v1/peers/search', { params: { q: domain } }).then(({ data }) => {
+      if (!data) {
+        data = [];
+      }
+
+      this.setState((state) => ({ networkOptions: data, options: addInputToOptions(state.value, data), isLoading: false }));
+    }).catch(() => {
+      this.setState({ isLoading: false });
+    });
+  }, 200, { leading: true, trailing: true });
+
   render () {
-    const { value } = this.props;
-    const { copied } = this.state;
+    const { intl } = this.props;
+    const { value, expanded, options, selectedOption, error, isSubmitting } = this.state;
+    const domain = (valueToDomain(value) || '').trim();
+    const domainRegExp = new RegExp(`(${escapeRegExp(domain)})`, 'gi');
+    const hasPopOut = domain.length > 0 && options.length > 0;
 
     return (
-      <div className={classNames('copypaste', { copied })}>
-        <input
-          type='text'
-          ref={this.setRef}
-          value={value}
-          readOnly
-          onClick={this.handleInputClick}
+      <div className={classNames('interaction-modal__login', { focused: expanded, expanded: hasPopOut, invalid: error })}>
+
+        <iframe
+          ref={this.setIFrameRef}
+          style={{display: 'none'}}
+          src='/remote_interaction_helper'
+          sandbox='allow-scripts allow-same-origin'
+          title='remote interaction helper'
         />
 
-        <button className='button' onClick={this.handleButtonClick}>
-          {copied ? <FormattedMessage id='copypaste.copied' defaultMessage='Copied' /> : <FormattedMessage id='copypaste.copy' defaultMessage='Copy' />}
-        </button>
+        <div className='interaction-modal__login__input'>
+          <input
+            ref={this.setRef}
+            type='text'
+            value={value}
+            placeholder={intl.formatMessage(messages.loginPrompt)}
+            aria-label={intl.formatMessage(messages.loginPrompt)}
+            autoFocus
+            onChange={this.handleChange}
+            onFocus={this.handleFocus}
+            onBlur={this.handleBlur}
+            onKeyDown={this.handleKeyDown}
+          />
+
+          <Button onClick={this.handleSubmit} disabled={isSubmitting}><FormattedMessage id='interaction_modal.login.action' defaultMessage='Take me home' /></Button>
+        </div>
+
+        {hasPopOut && (
+          <div className='search__popout'>
+            <div className='search__popout__menu'>
+              {options.map((option, i) => (
+                <button key={option} onMouseDown={this.handleOptionClick} data-index={i} className={classNames('search__popout__menu__item', { selected: selectedOption === i })}>
+                  {option.split(domainRegExp).map((part, i) => (
+                    part.toLowerCase() === domain.toLowerCase() ? (
+                      <mark key={i}>
+                        {part}
+                      </mark>
+                    ) : (
+                      <span key={i}>
+                        {part}
+                      </span>
+                    )
+                  ))}
+                </button>
+              ))}
+            </div>
+          </div>
+        )}
       </div>
     );
   }
 
 }
 
-class InteractionModal extends PureComponent {
+const IntlLoginForm = injectIntl(LoginForm);
+
+class InteractionModal extends React.PureComponent {
 
   static propTypes = {
     displayNameHtml: PropTypes.string,
     url: PropTypes.string,
     type: PropTypes.oneOf(['reply', 'reblog', 'favourite', 'follow']),
     onSignupClick: PropTypes.func.isRequired,
-    signupUrl: PropTypes.string.isRequired,
   };
 
   handleSignupClick = () => {
@@ -97,7 +298,7 @@ class InteractionModal extends PureComponent {
   };
 
   render () {
-    const { url, type, displayNameHtml, signupUrl } = this.props;
+    const { url, type, displayNameHtml } = this.props;
 
     const name = <bdi dangerouslySetInnerHTML={{ __html: displayNameHtml }} />;
 
@@ -116,8 +317,8 @@ class InteractionModal extends PureComponent {
       break;
     case 'favourite':
       icon = <Icon id='star' />;
-      title = <FormattedMessage id='interaction_modal.title.favourite' defaultMessage="Favourite {name}'s post" values={{ name }} />;
-      actionDescription = <FormattedMessage id='interaction_modal.description.favourite' defaultMessage='With an account on Mastodon, you can favourite this post to let the author know you appreciate it and save it for later.' />;
+      title = <FormattedMessage id='interaction_modal.title.favourite' defaultMessage="Favorite {name}'s post" values={{ name }} />;
+      actionDescription = <FormattedMessage id='interaction_modal.description.favourite' defaultMessage='With an account on Mastodon, you can favorite this post to let the author know you appreciate it and save it for later.' />;
       break;
     case 'follow':
       icon = <Icon id='user-plus' />;
@@ -130,13 +331,13 @@ class InteractionModal extends PureComponent {
 
     if (registrationsOpen) {
       signupButton = (
-        <a href={signupUrl} className='button button--block button-tertiary'>
+        <a href='/auth/sign_up' className='link-button'>
           <FormattedMessage id='sign_in_banner.create_account' defaultMessage='Create account' />
         </a>
       );
     } else {
       signupButton = (
-        <button className='button button--block button-tertiary' onClick={this.handleSignupClick}>
+        <button className='link-button' onClick={this.handleSignupClick}>
           <FormattedMessage id='sign_in_banner.create_account' defaultMessage='Create account' />
         </button>
       );
@@ -146,22 +347,13 @@ class InteractionModal extends PureComponent {
       <div className='modal-root__modal interaction-modal'>
         <div className='interaction-modal__lead'>
           <h3><span className='interaction-modal__icon'>{icon}</span> {title}</h3>
-          <p>{actionDescription} <FormattedMessage id='interaction_modal.preamble' defaultMessage="Since Mastodon is decentralized, you can use your existing account hosted by another Mastodon server or compatible platform if you don't have an account on this one." /></p>
+          <p>{actionDescription} <strong><FormattedMessage id='interaction_modal.sign_in' defaultMessage='You are not logged in to this server. Where is your account hosted?' /></strong></p>
         </div>
 
-        <div className='interaction-modal__choices'>
-          <div className='interaction-modal__choices__choice'>
-            <h3><FormattedMessage id='interaction_modal.on_this_server' defaultMessage='On this server' /></h3>
-            <a href='/auth/sign_in' className='button button--block'><FormattedMessage id='sign_in_banner.sign_in' defaultMessage='Login' /></a>
-            {signupButton}
-          </div>
+        <IntlLoginForm resourceUrl={url} />
 
-          <div className='interaction-modal__choices__choice'>
-            <h3><FormattedMessage id='interaction_modal.on_another_server' defaultMessage='On a different server' /></h3>
-            <p><FormattedMessage id='interaction_modal.other_server_instructions' defaultMessage='Copy and paste this URL into the search field of your favourite Mastodon app or the web interface of your Mastodon server.' /></p>
-            <Copypaste value={url} />
-          </div>
-        </div>
+        <p className='hint'><FormattedMessage id='interaction_modal.sign_in_hint' defaultMessage="Tip: That's the website where you signed up. If you don't remember, look for the welcome e-mail in your inbox. You can also enter your full username! (e.g. @Mastodon@mastodon.social)" /></p>
+        <p><FormattedMessage id='interaction_modal.no_account_yet' defaultMessage='Not on Mastodon?' /> {signupButton}</p>
       </div>
     );
   }

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

@@ -61,7 +61,7 @@ class KeyboardShortcuts extends ImmutablePureComponent {
               </tr>
               <tr>
                 <td><kbd>f</kbd></td>
-                <td><FormattedMessage id='keyboard_shortcuts.favourite' defaultMessage='to favourite' /></td>
+                <td><FormattedMessage id='keyboard_shortcuts.favourite' defaultMessage='to favorite' /></td>
               </tr>
               <tr>
                 <td><kbd>b</kbd></td>

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

@@ -110,7 +110,7 @@ export default class ColumnSettings extends PureComponent {
         </div>
 
         <div role='group' aria-labelledby='notifications-favourite'>
-          <span id='notifications-favourite' className='column-settings__section'><FormattedMessage id='notifications.column_settings.favourite' defaultMessage='Favourites:' /></span>
+          <span id='notifications-favourite' className='column-settings__section'><FormattedMessage id='notifications.column_settings.favourite' defaultMessage='Favorites:' /></span>
 
           <div className='column-settings__pillbar'>
             <PillBarButton disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'favourite']} onChange={onChange} label={alertStr} />

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

@@ -7,7 +7,7 @@ import { Icon } from 'flavours/glitch/components/icon';
 
 const tooltips = defineMessages({
   mentions: { id: 'notifications.filter.mentions', defaultMessage: 'Mentions' },
-  favourites: { id: 'notifications.filter.favourites', defaultMessage: 'Favourites' },
+  favourites: { id: 'notifications.filter.favourites', defaultMessage: 'Favorites' },
   boosts: { id: 'notifications.filter.boosts', defaultMessage: 'Boosts' },
   polls: { id: 'notifications.filter.polls', defaultMessage: 'Poll results' },
   follows: { id: 'notifications.filter.follows', defaultMessage: 'Follows' },

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

@@ -23,7 +23,7 @@ const messages = defineMessages({
   reblog_private: { id: 'status.reblog_private', defaultMessage: 'Boost with original visibility' },
   cancel_reblog_private: { id: 'status.cancel_reblog_private', defaultMessage: 'Unboost' },
   cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' },
-  favourite: { id: 'status.favourite', defaultMessage: 'Favourite' },
+  favourite: { id: 'status.favourite', defaultMessage: 'Favorite' },
   replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' },
   replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
   open: { id: 'status.open', defaultMessage: 'Expand this status' },
@@ -93,7 +93,7 @@ class Footer extends ImmutablePureComponent {
         modalProps: {
           type: 'reply',
           accountId: status.getIn(['account', 'id']),
-          url: status.get('url'),
+          url: status.get('uri'),
         },
       }));
     }
@@ -115,7 +115,7 @@ class Footer extends ImmutablePureComponent {
         modalProps: {
           type: 'favourite',
           accountId: status.getIn(['account', 'id']),
-          url: status.get('url'),
+          url: status.get('uri'),
         },
       }));
     }
@@ -144,7 +144,7 @@ class Footer extends ImmutablePureComponent {
         modalProps: {
           type: 'reblog',
           accountId: status.getIn(['account', 'id']),
-          url: status.get('url'),
+          url: status.get('uri'),
         },
       }));
     }

app/javascript/flavours/glitch/features/picture_in_picture/components/footer.jsx.orig

@@ -0,0 +1,232 @@
+import PropTypes from 'prop-types';
+
+import { defineMessages, injectIntl } from 'react-intl';
+
+import classNames from 'classnames';
+
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import { connect } from 'react-redux';
+
+import { initBoostModal } from 'flavours/glitch/actions/boosts';
+import { replyCompose } from 'flavours/glitch/actions/compose';
+import { reblog, favourite, unreblog, unfavourite } from 'flavours/glitch/actions/interactions';
+import { openModal } from 'flavours/glitch/actions/modal';
+import { IconButton } from 'flavours/glitch/components/icon_button';
+import { me, boostModal } from 'flavours/glitch/initial_state';
+import { makeGetStatus } from 'flavours/glitch/selectors';
+
+const messages = defineMessages({
+  reply: { id: 'status.reply', defaultMessage: 'Reply' },
+  replyAll: { id: 'status.replyAll', defaultMessage: 'Reply to thread' },
+  reblog: { id: 'status.reblog', defaultMessage: 'Boost' },
+  reblog_private: { id: 'status.reblog_private', defaultMessage: 'Boost with original visibility' },
+  cancel_reblog_private: { id: 'status.cancel_reblog_private', defaultMessage: 'Unboost' },
+  cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' },
+  favourite: { id: 'status.favourite', defaultMessage: 'Favorite' },
+  replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' },
+  replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
+  open: { id: 'status.open', defaultMessage: 'Expand this status' },
+});
+
+const makeMapStateToProps = () => {
+  const getStatus = makeGetStatus();
+
+  const mapStateToProps = (state, { statusId }) => ({
+    status: getStatus(state, { id: statusId }),
+    askReplyConfirmation: state.getIn(['compose', 'text']).trim().length !== 0,
+    showReplyCount: state.getIn(['local_settings', 'show_reply_count']),
+  });
+
+  return mapStateToProps;
+};
+
+class Footer extends ImmutablePureComponent {
+
+  static contextTypes = {
+    router: PropTypes.object,
+    identity: PropTypes.object,
+  };
+
+  static propTypes = {
+    statusId: PropTypes.string.isRequired,
+    status: ImmutablePropTypes.map.isRequired,
+    intl: PropTypes.object.isRequired,
+    dispatch: PropTypes.func.isRequired,
+    askReplyConfirmation: PropTypes.bool,
+    showReplyCount: PropTypes.bool,
+    withOpenButton: PropTypes.bool,
+    onClose: PropTypes.func,
+  };
+
+  _performReply = () => {
+    const { dispatch, status, onClose } = this.props;
+    const { router } = this.context;
+
+    if (onClose) {
+      onClose(true);
+    }
+
+    dispatch(replyCompose(status, router.history));
+  };
+
+  handleReplyClick = () => {
+    const { dispatch, askReplyConfirmation, status, intl } = this.props;
+    const { signedIn } = this.context.identity;
+
+    if (signedIn) {
+      if (askReplyConfirmation) {
+        dispatch(openModal({
+          modalType: 'CONFIRM',
+          modalProps: {
+            message: intl.formatMessage(messages.replyMessage),
+            confirm: intl.formatMessage(messages.replyConfirm),
+            onConfirm: this._performReply,
+          },
+        }));
+      } else {
+        this._performReply();
+      }
+    } else {
+      dispatch(openModal({
+        modalType: 'INTERACTION',
+        modalProps: {
+          type: 'reply',
+          accountId: status.getIn(['account', 'id']),
+          url: status.get('url'),
+        },
+      }));
+    }
+  };
+
+  handleFavouriteClick = () => {
+    const { dispatch, status } = this.props;
+    const { signedIn } = this.context.identity;
+
+    if (signedIn) {
+      if (status.get('favourited')) {
+        dispatch(unfavourite(status));
+      } else {
+        dispatch(favourite(status));
+      }
+    } else {
+      dispatch(openModal({
+        modalType: 'INTERACTION',
+        modalProps: {
+          type: 'favourite',
+          accountId: status.getIn(['account', 'id']),
+          url: status.get('url'),
+        },
+      }));
+    }
+  };
+
+  _performReblog = (privacy) => {
+    const { dispatch, status } = this.props;
+    dispatch(reblog(status, privacy));
+  };
+
+  handleReblogClick = e => {
+    const { dispatch, status } = this.props;
+    const { signedIn } = this.context.identity;
+
+    if (signedIn) {
+      if (status.get('reblogged')) {
+        dispatch(unreblog(status));
+      } else if ((e && e.shiftKey) || !boostModal) {
+        this._performReblog();
+      } else {
+        dispatch(initBoostModal({ status, onReblog: this._performReblog }));
+      }
+    } else {
+      dispatch(openModal({
+        modalType: 'INTERACTION',
+        modalProps: {
+          type: 'reblog',
+          accountId: status.getIn(['account', 'id']),
+          url: status.get('url'),
+        },
+      }));
+    }
+  };
+
+  handleOpenClick = e => {
+    const { router } = this.context;
+
+    if (e.button !== 0 || !router) {
+      return;
+    }
+
+    const { status, onClose } = this.props;
+
+    if (onClose) {
+      onClose();
+    }
+
+    router.history.push(`/@${status.getIn(['account', 'acct'])}/${status.get('id')}`);
+  };
+
+  render () {
+    const { status, intl, showReplyCount, withOpenButton } = this.props;
+
+    const publicStatus  = ['public', 'unlisted'].includes(status.get('visibility'));
+    const reblogPrivate = status.getIn(['account', 'id']) === me && status.get('visibility') === 'private';
+
+    let replyIcon, replyTitle;
+
+    if (status.get('in_reply_to_id', null) === null) {
+      replyIcon = 'reply';
+      replyTitle = intl.formatMessage(messages.reply);
+    } else {
+      replyIcon = 'reply-all';
+      replyTitle = intl.formatMessage(messages.replyAll);
+    }
+
+    let reblogTitle = '';
+
+    if (status.get('reblogged')) {
+      reblogTitle = intl.formatMessage(messages.cancel_reblog_private);
+    } else if (publicStatus) {
+      reblogTitle = intl.formatMessage(messages.reblog);
+    } else if (reblogPrivate) {
+      reblogTitle = intl.formatMessage(messages.reblog_private);
+    } else {
+      reblogTitle = intl.formatMessage(messages.cannot_reblog);
+    }
+
+    let replyButton = null;
+    if (showReplyCount) {
+      replyButton = (
+        <IconButton
+          className='status__action-bar-button'
+          title={replyTitle}
+          icon={status.get('in_reply_to_account_id') === status.getIn(['account', 'id']) ? 'reply' : replyIcon}
+          onClick={this.handleReplyClick}
+          counter={status.get('replies_count')}
+          obfuscateCount
+        />
+      );
+    } else {
+      replyButton = (
+        <IconButton
+          className='status__action-bar-button'
+          title={replyTitle}
+          icon={status.get('in_reply_to_account_id') === status.getIn(['account', 'id']) ? 'reply' : replyIcon}
+          onClick={this.handleReplyClick}
+        />
+      );
+    }
+
+    return (
+      <div className='picture-in-picture__footer'>
+        {replyButton}
+        <IconButton className={classNames('status__action-bar-button', { reblogPrivate })} disabled={!publicStatus && !reblogPrivate}  active={status.get('reblogged')} title={reblogTitle} icon='retweet' onClick={this.handleReblogClick} counter={status.get('reblogs_count')} />
+        <IconButton className='status__action-bar-button star-icon' animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} counter={status.get('favourites_count')} />
+        {withOpenButton && <IconButton className='status__action-bar-button' title={intl.formatMessage(messages.open)} icon='external-link' onClick={this.handleOpenClick} href={status.get('url')} />}
+      </div>
+    );
+  }
+
+}
+
+export default connect(makeMapStateToProps)(injectIntl(Footer));

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

@@ -24,7 +24,7 @@ const messages = defineMessages({
   reblog_private: { id: 'status.reblog_private', defaultMessage: 'Boost with original visibility' },
   cancel_reblog_private: { id: 'status.cancel_reblog_private', defaultMessage: 'Unboost' },
   cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' },
-  favourite: { id: 'status.favourite', defaultMessage: 'Favourite' },
+  favourite: { id: 'status.favourite', defaultMessage: 'Favorite' },
   bookmark: { id: 'status.bookmark', defaultMessage: 'Bookmark' },
   more: { id: 'status.more', defaultMessage: 'More' },
   mute: { id: 'status.mute', defaultMessage: 'Mute @{name}' },

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

@@ -181,7 +181,10 @@ export default class Card extends PureComponent {
     let thumbnail = <img src={card.get('image')} alt='' style={thumbnailStyle} onLoad={this.handleImageLoad} className='status-card__image-image' />;
     let spoilerButton = (
       <button type='button' onClick={this.handleReveal} className='spoiler-button__overlay'>
-        <span className='spoiler-button__overlay__label'><FormattedMessage id='status.sensitive_warning' defaultMessage='Sensitive content' /></span>
+        <span className='spoiler-button__overlay__label'>
+          <FormattedMessage id='status.sensitive_warning' defaultMessage='Sensitive content' />
+          <span className='spoiler-button__overlay__action'><FormattedMessage id='status.media.show' defaultMessage='Click to show' /></span>
+        </span>
       </button>
     );
     spoilerButton = (

app/javascript/flavours/glitch/features/status/containers/detailed_status_container.js

@@ -35,7 +35,7 @@ const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
   deleteMessage: { id: 'confirmations.delete.message', defaultMessage: 'Are you sure you want to delete this status?' },
   redraftConfirm: { id: 'confirmations.redraft.confirm', defaultMessage: 'Delete & redraft' },
-  redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favourites and boosts will be lost, and replies to the original post will be orphaned.' },
+  redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favorites and boosts will be lost, and replies to the original post will be orphaned.' },
   replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' },
   replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
 });

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

@@ -66,7 +66,7 @@ const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
   deleteMessage: { id: 'confirmations.delete.message', defaultMessage: 'Are you sure you want to delete this status?' },
   redraftConfirm: { id: 'confirmations.redraft.confirm', defaultMessage: 'Delete & redraft' },
-  redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favourites and boosts will be lost, and replies to the original post will be orphaned.' },
+  redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favorites and boosts will be lost, and replies to the original post will be orphaned.' },
   revealAll: { id: 'status.show_more_all', defaultMessage: 'Show more for all' },
   hideAll: { id: 'status.show_less_all', defaultMessage: 'Show less for all' },
   statusTitleWithAttachments: { id: 'status.title.with_attachments', defaultMessage: '{user} posted {attachmentCount, plural, one {an attachment} other {# attachments}}' },
@@ -192,8 +192,8 @@ class Status extends ImmutablePureComponent {
     status: ImmutablePropTypes.map,
     isLoading: PropTypes.bool,
     settings: ImmutablePropTypes.map.isRequired,
-    ancestorsIds: ImmutablePropTypes.list,
-    descendantsIds: ImmutablePropTypes.list,
+    ancestorsIds: ImmutablePropTypes.list.isRequired,
+    descendantsIds: ImmutablePropTypes.list.isRequired,
     intl: PropTypes.object.isRequired,
     askReplyConfirmation: PropTypes.bool,
     multiColumn: PropTypes.bool,
@@ -217,16 +217,6 @@ class Status extends ImmutablePureComponent {
   componentDidMount () {
     attachFullscreenListener(this.onFullScreenChange);
     this.props.dispatch(fetchStatus(this.props.params.statusId));
-
-    const { status, ancestorsIds } = this.props;
-
-    if (status && ancestorsIds && ancestorsIds.size > 0) {
-      const element = this.node.querySelectorAll('.focusable')[ancestorsIds.size - 1];
-
-      window.requestAnimationFrame(() => {
-        element.scrollIntoView(true);
-      });
-    }
   }
 
   static getDerivedStateFromProps(props, state) {
@@ -305,7 +295,7 @@ class Status extends ImmutablePureComponent {
         modalProps: {
           type: 'favourite',
           accountId: status.getIn(['account', 'id']),
-          url: status.get('url'),
+          url: status.get('uri'),
         },
       }));
     }
@@ -343,7 +333,7 @@ class Status extends ImmutablePureComponent {
         modalProps: {
           type: 'reply',
           accountId: status.getIn(['account', 'id']),
-          url: status.get('url'),
+          url: status.get('uri'),
         },
       }));
     }
@@ -377,7 +367,7 @@ class Status extends ImmutablePureComponent {
         modalProps: {
           type: 'reblog',
           accountId: status.getIn(['account', 'id']),
-          url: status.get('url'),
+          url: status.get('uri'),
         },
       }));
     }
@@ -625,16 +615,22 @@ class Status extends ImmutablePureComponent {
   };
 
   componentDidUpdate (prevProps) {
-    if (this.props.params.statusId && (this.props.params.statusId !== prevProps.params.statusId || prevProps.ancestorsIds.size < this.props.ancestorsIds.size)) {
-      const { status, ancestorsIds } = this.props;
+    const { status, ancestorsIds, multiColumn } = this.props;
 
-      if (status && ancestorsIds && ancestorsIds.size > 0) {
-        const element = this.node.querySelectorAll('.focusable')[ancestorsIds.size - 1];
+    if (status && (ancestorsIds.size > prevProps.ancestorsIds.size || prevProps.status?.get('id') !== status.get('id'))) {
+      window.requestAnimationFrame(() => {
+        this.node?.querySelector('.detailed-status__wrapper')?.scrollIntoView(true);
 
-        window.requestAnimationFrame(() => {
-          element.scrollIntoView(true);
-        });
-      }
+        // In the single-column interface, `scrollIntoView` will put the post behind the header,
+        // so compensate for that.
+        if (!multiColumn) {
+          const offset = document.querySelector('.column-header__wrapper')?.getBoundingClientRect()?.bottom;
+          if (offset) {
+            const scrollingElement = document.scrollingElement || document.body;
+            scrollingElement.scrollBy(0, -offset);
+          }
+        }
+      });
     }
   }
 
@@ -701,16 +697,16 @@ class Status extends ImmutablePureComponent {
           showBackButton
           multiColumn={multiColumn}
           extraButton={(
-            <button className='column-header__button' title={intl.formatMessage(!isExpanded ? messages.revealAll : messages.hideAll)} aria-label={intl.formatMessage(!isExpanded ? messages.revealAll : messages.hideAll)} onClick={this.handleToggleAll}><Icon id={!isExpanded ? 'eye-slash' : 'eye'} /></button>
+            <button type='button' className='column-header__button' title={intl.formatMessage(!isExpanded ? messages.revealAll : messages.hideAll)} aria-label={intl.formatMessage(!isExpanded ? messages.revealAll : messages.hideAll)} onClick={this.handleToggleAll}><Icon id={!isExpanded ? 'eye-slash' : 'eye'} /></button>
           )}
         />
 
         <ScrollContainer scrollKey='thread'>
-          <div className={classNames('scrollable', 'detailed-status__wrapper', { fullscreen })} ref={this.setRef}>
+          <div className={classNames('scrollable', { fullscreen })} ref={this.setRef}>
             {ancestors}
 
             <HotKeys handlers={handlers}>
-              <div className='focusable' tabIndex={0} aria-label={textForScreenReader(intl, status, false, isExpanded)}>
+              <div className={classNames('focusable', 'detailed-status__wrapper', `detailed-status__wrapper-${status.get('visibility')}`)} tabIndex={0} aria-label={textForScreenReader(intl, status, false, isExpanded)}>
                 <DetailedStatus
                   key={`details-${status.get('id')}`}
                   status={status}

app/javascript/flavours/glitch/features/status/index.jsx.orig

@@ -0,0 +1,761 @@
+import PropTypes from 'prop-types';
+
+import { defineMessages, injectIntl } from 'react-intl';
+
+import classNames from 'classnames';
+import { Helmet } from 'react-helmet';
+
+import Immutable from 'immutable';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import { connect } from 'react-redux';
+import { createSelector } from 'reselect';
+
+import { HotKeys } from 'react-hotkeys';
+
+import { initBlockModal } from 'flavours/glitch/actions/blocks';
+import { initBoostModal } from 'flavours/glitch/actions/boosts';
+import {
+  replyCompose,
+  mentionCompose,
+  directCompose,
+} from 'flavours/glitch/actions/compose';
+import {
+  favourite,
+  unfavourite,
+  bookmark,
+  unbookmark,
+  reblog,
+  unreblog,
+  pin,
+  unpin,
+} from 'flavours/glitch/actions/interactions';
+import { changeLocalSetting } from 'flavours/glitch/actions/local_settings';
+import { openModal } from 'flavours/glitch/actions/modal';
+import { initMuteModal } from 'flavours/glitch/actions/mutes';
+import { initReport } from 'flavours/glitch/actions/reports';
+import {
+  fetchStatus,
+  muteStatus,
+  unmuteStatus,
+  deleteStatus,
+  editStatus,
+  hideStatus,
+  revealStatus,
+  translateStatus,
+  undoStatusTranslation,
+} from 'flavours/glitch/actions/statuses';
+import { Icon } from 'flavours/glitch/components/icon';
+import { LoadingIndicator } from 'flavours/glitch/components/loading_indicator';
+import { textForScreenReader, defaultMediaVisibility } from 'flavours/glitch/components/status';
+import ScrollContainer from 'flavours/glitch/containers/scroll_container';
+import StatusContainer from 'flavours/glitch/containers/status_container';
+import BundleColumnError from 'flavours/glitch/features/ui/components/bundle_column_error';
+import Column from 'flavours/glitch/features/ui/components/column';
+import { boostModal, favouriteModal, deleteModal } from 'flavours/glitch/initial_state';
+import { makeGetStatus, makeGetPictureInPicture } from 'flavours/glitch/selectors';
+import { autoUnfoldCW } from 'flavours/glitch/utils/content_warning';
+
+import ColumnHeader from '../../components/column_header';
+import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from '../ui/util/fullscreen';
+
+import ActionBar from './components/action_bar';
+import DetailedStatus from './components/detailed_status';
+
+const messages = defineMessages({
+  deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
+  deleteMessage: { id: 'confirmations.delete.message', defaultMessage: 'Are you sure you want to delete this status?' },
+  redraftConfirm: { id: 'confirmations.redraft.confirm', defaultMessage: 'Delete & redraft' },
+  redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favorites and boosts will be lost, and replies to the original post will be orphaned.' },
+  revealAll: { id: 'status.show_more_all', defaultMessage: 'Show more for all' },
+  hideAll: { id: 'status.show_less_all', defaultMessage: 'Show less for all' },
+  statusTitleWithAttachments: { id: 'status.title.with_attachments', defaultMessage: '{user} posted {attachmentCount, plural, one {an attachment} other {# attachments}}' },
+  detailedStatus: { id: 'status.detailed_status', defaultMessage: 'Detailed conversation view' },
+  replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' },
+  replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
+  tootHeading: { id: 'account.posts_with_replies', defaultMessage: 'Posts and replies' },
+});
+
+const makeMapStateToProps = () => {
+  const getStatus = makeGetStatus();
+  const getPictureInPicture = makeGetPictureInPicture();
+
+  const getAncestorsIds = createSelector([
+    (_, { id }) => id,
+    state => state.getIn(['contexts', 'inReplyTos']),
+  ], (statusId, inReplyTos) => {
+    let ancestorsIds = Immutable.List();
+    ancestorsIds = ancestorsIds.withMutations(mutable => {
+      let id = statusId;
+
+      while (id && !mutable.includes(id)) {
+        mutable.unshift(id);
+        id = inReplyTos.get(id);
+      }
+    });
+
+    return ancestorsIds;
+  });
+
+  const getDescendantsIds = createSelector([
+    (_, { id }) => id,
+    state => state.getIn(['contexts', 'replies']),
+    state => state.get('statuses'),
+  ], (statusId, contextReplies, statuses) => {
+    let descendantsIds = [];
+    const ids = [statusId];
+
+    while (ids.length > 0) {
+      let id        = ids.pop();
+      const replies = contextReplies.get(id);
+
+      if (statusId !== id) {
+        descendantsIds.push(id);
+      }
+
+      if (replies) {
+        replies.reverse().forEach(reply => {
+          if (!ids.includes(reply) && !descendantsIds.includes(reply) && statusId !== reply) ids.push(reply);
+        });
+      }
+    }
+
+    let insertAt = descendantsIds.findIndex((id) => statuses.get(id).get('in_reply_to_account_id') !== statuses.get(id).get('account'));
+    if (insertAt !== -1) {
+      descendantsIds.forEach((id, idx) => {
+        if (idx > insertAt && statuses.get(id).get('in_reply_to_account_id') === statuses.get(id).get('account')) {
+          descendantsIds.splice(idx, 1);
+          descendantsIds.splice(insertAt, 0, id);
+          insertAt += 1;
+        }
+      });
+    }
+
+    return Immutable.List(descendantsIds);
+  });
+
+  const mapStateToProps = (state, props) => {
+    const status = getStatus(state, { id: props.params.statusId });
+
+    let ancestorsIds   = Immutable.List();
+    let descendantsIds = Immutable.List();
+
+    if (status) {
+      ancestorsIds   = getAncestorsIds(state, { id: status.get('in_reply_to_id') });
+      descendantsIds = getDescendantsIds(state, { id: status.get('id') });
+    }
+
+    return {
+      isLoading: state.getIn(['statuses', props.params.statusId, 'isLoading']),
+      status,
+      ancestorsIds,
+      descendantsIds,
+      settings: state.get('local_settings'),
+      askReplyConfirmation: state.getIn(['local_settings', 'confirm_before_clearing_draft']) && state.getIn(['compose', 'text']).trim().length !== 0,
+      domain: state.getIn(['meta', 'domain']),
+      pictureInPicture: getPictureInPicture(state, { id: props.params.statusId }),
+    };
+  };
+
+  return mapStateToProps;
+};
+
+const truncate = (str, num) => {
+  const arr = Array.from(str);
+  if (arr.length > num) {
+    return arr.slice(0, num).join('') + '…';
+  } else {
+    return str;
+  }
+};
+
+const titleFromStatus = (intl, status) => {
+  const displayName = status.getIn(['account', 'display_name']);
+  const username = status.getIn(['account', 'username']);
+  const user = displayName.trim().length === 0 ? username : displayName;
+  const text = status.get('search_index');
+  const attachmentCount = status.get('media_attachments').size;
+
+  return text ? `${user}: "${truncate(text, 30)}"` : intl.formatMessage(messages.statusTitleWithAttachments, { user, attachmentCount });
+};
+
+class Status extends ImmutablePureComponent {
+
+  static contextTypes = {
+    router: PropTypes.object,
+    identity: PropTypes.object,
+  };
+
+  static propTypes = {
+    params: PropTypes.object.isRequired,
+    dispatch: PropTypes.func.isRequired,
+    status: ImmutablePropTypes.map,
+    isLoading: PropTypes.bool,
+    settings: ImmutablePropTypes.map.isRequired,
+    ancestorsIds: ImmutablePropTypes.list.isRequired,
+    descendantsIds: ImmutablePropTypes.list.isRequired,
+    intl: PropTypes.object.isRequired,
+    askReplyConfirmation: PropTypes.bool,
+    multiColumn: PropTypes.bool,
+    domain: PropTypes.string.isRequired,
+    pictureInPicture: ImmutablePropTypes.contains({
+      inUse: PropTypes.bool,
+      available: PropTypes.bool,
+    }),
+  };
+
+  state = {
+    fullscreen: false,
+    isExpanded: undefined,
+    threadExpanded: undefined,
+    statusId: undefined,
+    loadedStatusId: undefined,
+    showMedia: undefined,
+    revealBehindCW: undefined,
+  };
+
+  componentDidMount () {
+    attachFullscreenListener(this.onFullScreenChange);
+    this.props.dispatch(fetchStatus(this.props.params.statusId));
+  }
+
+  static getDerivedStateFromProps(props, state) {
+    let update = {};
+    let updated = false;
+
+    if (props.params.statusId && state.statusId !== props.params.statusId) {
+      props.dispatch(fetchStatus(props.params.statusId));
+      update.threadExpanded = undefined;
+      update.statusId = props.params.statusId;
+      updated = true;
+    }
+
+    const revealBehindCW = props.settings.getIn(['media', 'reveal_behind_cw']);
+    if (revealBehindCW !== state.revealBehindCW) {
+      update.revealBehindCW = revealBehindCW;
+      if (revealBehindCW) update.showMedia = defaultMediaVisibility(props.status, props.settings);
+      updated = true;
+    }
+
+    if (props.status && state.loadedStatusId !== props.status.get('id')) {
+      update.showMedia = defaultMediaVisibility(props.status, props.settings);
+      update.loadedStatusId = props.status.get('id');
+      update.isExpanded = autoUnfoldCW(props.settings, props.status);
+      updated = true;
+    }
+
+    return updated ? update : null;
+  }
+
+  handleToggleHidden = () => {
+    const { status } = this.props;
+
+    if (this.props.settings.getIn(['content_warnings', 'shared_state'])) {
+      if (status.get('hidden')) {
+        this.props.dispatch(revealStatus(status.get('id')));
+      } else {
+        this.props.dispatch(hideStatus(status.get('id')));
+      }
+    } else if (this.props.status.get('spoiler_text')) {
+      this.setExpansion(!this.state.isExpanded);
+    }
+  };
+
+  handleToggleMediaVisibility = () => {
+    this.setState({ showMedia: !this.state.showMedia });
+  };
+
+  handleModalFavourite = (status) => {
+    this.props.dispatch(favourite(status));
+  };
+
+  handleFavouriteClick = (status, e) => {
+    const { dispatch } = this.props;
+    const { signedIn } = this.context.identity;
+
+    if (signedIn) {
+      if (status.get('favourited')) {
+        dispatch(unfavourite(status));
+      } else {
+        if ((e && e.shiftKey) || !favouriteModal) {
+          this.handleModalFavourite(status);
+        } else {
+          dispatch(openModal({
+            modalType: 'FAVOURITE',
+            modalProps: {
+              status,
+              onFavourite: this.handleModalFavourite,
+            },
+          }));
+        }
+      }
+    } else {
+      dispatch(openModal({
+        modalType: 'INTERACTION',
+        modalProps: {
+          type: 'favourite',
+          accountId: status.getIn(['account', 'id']),
+          url: status.get('url'),
+        },
+      }));
+    }
+  };
+
+  handlePin = (status) => {
+    if (status.get('pinned')) {
+      this.props.dispatch(unpin(status));
+    } else {
+      this.props.dispatch(pin(status));
+    }
+  };
+
+  handleReplyClick = (status) => {
+    const { askReplyConfirmation, dispatch, intl } = this.props;
+    const { signedIn } = this.context.identity;
+
+    if (signedIn) {
+      if (askReplyConfirmation) {
+        dispatch(openModal({
+          modalType: 'CONFIRM',
+          modalProps: {
+            message: intl.formatMessage(messages.replyMessage),
+            confirm: intl.formatMessage(messages.replyConfirm),
+            onDoNotAsk: () => dispatch(changeLocalSetting(['confirm_before_clearing_draft'], false)),
+            onConfirm: () => dispatch(replyCompose(status, this.context.router.history)),
+          },
+        }));
+      } else {
+        dispatch(replyCompose(status, this.context.router.history));
+      }
+    } else {
+      dispatch(openModal({
+        modalType: 'INTERACTION',
+        modalProps: {
+          type: 'reply',
+          accountId: status.getIn(['account', 'id']),
+          url: status.get('url'),
+        },
+      }));
+    }
+  };
+
+  handleModalReblog = (status, privacy) => {
+    const { dispatch } = this.props;
+
+    if (status.get('reblogged')) {
+      dispatch(unreblog(status));
+    } else {
+      dispatch(reblog(status, privacy));
+    }
+  };
+
+  handleReblogClick = (status, e) => {
+    const { settings, dispatch } = this.props;
+    const { signedIn } = this.context.identity;
+
+    if (signedIn) {
+      if (settings.get('confirm_boost_missing_media_description') && status.get('media_attachments').some(item => !item.get('description')) && !status.get('reblogged')) {
+        dispatch(initBoostModal({ status, onReblog: this.handleModalReblog, missingMediaDescription: true }));
+      } else if ((e && e.shiftKey) || !boostModal) {
+        this.handleModalReblog(status);
+      } else {
+        dispatch(initBoostModal({ status, onReblog: this.handleModalReblog }));
+      }
+    } else {
+      dispatch(openModal({
+        modalType: 'INTERACTION',
+        modalProps: {
+          type: 'reblog',
+          accountId: status.getIn(['account', 'id']),
+          url: status.get('url'),
+        },
+      }));
+    }
+  };
+
+  handleBookmarkClick = (status) => {
+    if (status.get('bookmarked')) {
+      this.props.dispatch(unbookmark(status));
+    } else {
+      this.props.dispatch(bookmark(status));
+    }
+  };
+
+  handleDeleteClick = (status, history, withRedraft = false) => {
+    const { dispatch, intl } = this.props;
+
+    if (!deleteModal) {
+      dispatch(deleteStatus(status.get('id'), history, withRedraft));
+    } else {
+      dispatch(openModal({
+        modalType: 'CONFIRM',
+        modalProps: {
+          message: intl.formatMessage(withRedraft ? messages.redraftMessage : messages.deleteMessage),
+          confirm: intl.formatMessage(withRedraft ? messages.redraftConfirm : messages.deleteConfirm),
+          onConfirm: () => dispatch(deleteStatus(status.get('id'), history, withRedraft)),
+        },
+      }));
+    }
+  };
+
+  handleEditClick = (status, history) => {
+    this.props.dispatch(editStatus(status.get('id'), history));
+  };
+
+  handleDirectClick = (account, router) => {
+    this.props.dispatch(directCompose(account, router));
+  };
+
+  handleMentionClick = (account, router) => {
+    this.props.dispatch(mentionCompose(account, router));
+  };
+
+  handleOpenMedia = (media, index, lang) => {
+    this.props.dispatch(openModal({
+      modalType: 'MEDIA',
+      modalProps: { statusId: this.props.status.get('id'), media, index, lang },
+    }));
+  };
+
+  handleOpenVideo = (media, lang, options) => {
+    this.props.dispatch(openModal({
+      modalType: 'VIDEO',
+      modalProps: { statusId: this.props.status.get('id'), media, lang, options },
+    }));
+  };
+
+  handleHotkeyOpenMedia = e => {
+    const { status } = this.props;
+
+    e.preventDefault();
+
+    if (status.get('media_attachments').size > 0) {
+      if (status.getIn(['media_attachments', 0, 'type']) === 'video') {
+        this.handleOpenVideo(status.getIn(['media_attachments', 0]), { startTime: 0 });
+      } else {
+        this.handleOpenMedia(status.get('media_attachments'), 0);
+      }
+    }
+  };
+
+  handleMuteClick = (account) => {
+    this.props.dispatch(initMuteModal(account));
+  };
+
+  handleConversationMuteClick = (status) => {
+    if (status.get('muted')) {
+      this.props.dispatch(unmuteStatus(status.get('id')));
+    } else {
+      this.props.dispatch(muteStatus(status.get('id')));
+    }
+  };
+
+  handleToggleAll = () => {
+    const { status, ancestorsIds, descendantsIds, settings } = this.props;
+    const statusIds = [status.get('id')].concat(ancestorsIds.toJS(), descendantsIds.toJS());
+    let { isExpanded } = this.state;
+
+    if (settings.getIn(['content_warnings', 'shared_state']))
+      isExpanded = !status.get('hidden');
+
+    if (!isExpanded) {
+      this.props.dispatch(revealStatus(statusIds));
+    } else {
+      this.props.dispatch(hideStatus(statusIds));
+    }
+
+    this.setState({ isExpanded: !isExpanded, threadExpanded: !isExpanded });
+  };
+
+  handleTranslate = status => {
+    const { dispatch } = this.props;
+
+    if (status.get('translation')) {
+      dispatch(undoStatusTranslation(status.get('id'), status.get('poll')));
+    } else {
+      dispatch(translateStatus(status.get('id')));
+    }
+  };
+
+  handleBlockClick = (status) => {
+    const { dispatch } = this.props;
+    const account = status.get('account');
+    dispatch(initBlockModal(account));
+  };
+
+  handleReport = (status) => {
+    this.props.dispatch(initReport(status.get('account'), status));
+  };
+
+  handleEmbed = (status) => {
+    this.props.dispatch(openModal({
+      modalType: 'EMBED',
+      modalProps: { id: status.get('id') },
+    }));
+  };
+
+  handleHotkeyToggleSensitive = () => {
+    this.handleToggleMediaVisibility();
+  };
+
+  handleHotkeyMoveUp = () => {
+    this.handleMoveUp(this.props.status.get('id'));
+  };
+
+  handleHotkeyMoveDown = () => {
+    this.handleMoveDown(this.props.status.get('id'));
+  };
+
+  handleHotkeyReply = e => {
+    e.preventDefault();
+    this.handleReplyClick(this.props.status);
+  };
+
+  handleHotkeyFavourite = () => {
+    this.handleFavouriteClick(this.props.status);
+  };
+
+  handleHotkeyBoost = () => {
+    this.handleReblogClick(this.props.status);
+  };
+
+  handleHotkeyBookmark = () => {
+    this.handleBookmarkClick(this.props.status);
+  };
+
+  handleHotkeyMention = e => {
+    e.preventDefault();
+    this.handleMentionClick(this.props.status);
+  };
+
+  handleHotkeyOpenProfile = () => {
+    this.context.router.history.push(`/@${this.props.status.getIn(['account', 'acct'])}`);
+  };
+
+  handleMoveUp = id => {
+    const { status, ancestorsIds, descendantsIds } = this.props;
+
+    if (id === status.get('id')) {
+      this._selectChild(ancestorsIds.size - 1, true);
+    } else {
+      let index = ancestorsIds.indexOf(id);
+
+      if (index === -1) {
+        index = descendantsIds.indexOf(id);
+        this._selectChild(ancestorsIds.size + index, true);
+      } else {
+        this._selectChild(index - 1, true);
+      }
+    }
+  };
+
+  handleMoveDown = id => {
+    const { status, ancestorsIds, descendantsIds } = this.props;
+
+    if (id === status.get('id')) {
+      this._selectChild(ancestorsIds.size + 1, false);
+    } else {
+      let index = ancestorsIds.indexOf(id);
+
+      if (index === -1) {
+        index = descendantsIds.indexOf(id);
+        this._selectChild(ancestorsIds.size + index + 2, false);
+      } else {
+        this._selectChild(index + 1, false);
+      }
+    }
+  };
+
+  _selectChild (index, align_top) {
+    const container = this.node;
+    const element = container.querySelectorAll('.focusable')[index];
+
+    if (element) {
+      if (align_top && container.scrollTop > element.offsetTop) {
+        element.scrollIntoView(true);
+      } else if (!align_top && container.scrollTop + container.clientHeight < element.offsetTop + element.offsetHeight) {
+        element.scrollIntoView(false);
+      }
+      element.focus();
+    }
+  }
+
+  handleHeaderClick = () => {
+    this.column.scrollTop();
+  };
+
+  renderChildren (list, ancestors) {
+    const { params: { statusId } } = this.props;
+
+    return list.map((id, i) => (
+      <StatusContainer
+        key={id}
+        id={id}
+        expanded={this.state.threadExpanded}
+        onMoveUp={this.handleMoveUp}
+        onMoveDown={this.handleMoveDown}
+        contextType='thread'
+        previousId={i > 0 && list.get(i - 1)}
+        nextId={list.get(i + 1) || (ancestors && statusId)}
+        rootId={statusId}
+      />
+    ));
+  }
+
+  setExpansion = value => {
+    this.setState({ isExpanded: value });
+  };
+
+  setRef = c => {
+    this.node = c;
+  };
+
+  setColumnRef = c => {
+    this.column = c;
+  };
+
+  componentDidUpdate (prevProps) {
+    const { status, ancestorsIds, multiColumn } = this.props;
+
+    if (status && (ancestorsIds.size > prevProps.ancestorsIds.size || prevProps.status?.get('id') !== status.get('id'))) {
+      window.requestAnimationFrame(() => {
+        this.node?.querySelector('.detailed-status__wrapper')?.scrollIntoView(true);
+
+        // In the single-column interface, `scrollIntoView` will put the post behind the header,
+        // so compensate for that.
+        if (!multiColumn) {
+          const offset = document.querySelector('.column-header__wrapper')?.getBoundingClientRect()?.bottom;
+          if (offset) {
+            const scrollingElement = document.scrollingElement || document.body;
+            scrollingElement.scrollBy(0, -offset);
+          }
+        }
+      });
+    }
+  }
+
+  componentWillUnmount () {
+    detachFullscreenListener(this.onFullScreenChange);
+  }
+
+  onFullScreenChange = () => {
+    this.setState({ fullscreen: isFullscreen() });
+  };
+
+  render () {
+    let ancestors, descendants;
+    const { isLoading, status, settings, ancestorsIds, descendantsIds, intl, domain, multiColumn, pictureInPicture } = this.props;
+    const { fullscreen } = this.state;
+
+    if (isLoading) {
+      return (
+        <Column>
+          <LoadingIndicator />
+        </Column>
+      );
+    }
+
+    if (status === null) {
+      return (
+        <BundleColumnError multiColumn={multiColumn} errorType='routing' />
+      );
+    }
+
+    const isExpanded = settings.getIn(['content_warnings', 'shared_state']) ? !status.get('hidden') : this.state.isExpanded;
+
+    if (ancestorsIds && ancestorsIds.size > 0) {
+      ancestors = <>{this.renderChildren(ancestorsIds, true)}</>;
+    }
+
+    if (descendantsIds && descendantsIds.size > 0) {
+      descendants = <>{this.renderChildren(descendantsIds)}</>;
+    }
+
+    const isLocal = status.getIn(['account', 'acct'], '').indexOf('@') === -1;
+    const isIndexable = !status.getIn(['account', 'noindex']);
+
+    const handlers = {
+      moveUp: this.handleHotkeyMoveUp,
+      moveDown: this.handleHotkeyMoveDown,
+      reply: this.handleHotkeyReply,
+      favourite: this.handleHotkeyFavourite,
+      boost: this.handleHotkeyBoost,
+      bookmark: this.handleHotkeyBookmark,
+      mention: this.handleHotkeyMention,
+      openProfile: this.handleHotkeyOpenProfile,
+      toggleSpoiler: this.handleToggleHidden,
+      toggleSensitive: this.handleHotkeyToggleSensitive,
+      openMedia: this.handleHotkeyOpenMedia,
+    };
+
+    return (
+      <Column bindToDocument={!multiColumn} ref={this.setColumnRef} label={intl.formatMessage(messages.detailedStatus)}>
+        <ColumnHeader
+          icon='comment'
+          title={intl.formatMessage(messages.tootHeading)}
+          onClick={this.handleHeaderClick}
+          showBackButton
+          multiColumn={multiColumn}
+          extraButton={(
+            <button type='button' className='column-header__button' title={intl.formatMessage(!isExpanded ? messages.revealAll : messages.hideAll)} aria-label={intl.formatMessage(!isExpanded ? messages.revealAll : messages.hideAll)} onClick={this.handleToggleAll}><Icon id={!isExpanded ? 'eye-slash' : 'eye'} /></button>
+          )}
+        />
+
+        <ScrollContainer scrollKey='thread'>
+          <div className={classNames('scrollable', { fullscreen })} ref={this.setRef}>
+            {ancestors}
+
+            <HotKeys handlers={handlers}>
+              <div className={classNames('focusable', 'detailed-status__wrapper', `detailed-status__wrapper-${status.get('visibility')}`)} tabIndex={0} aria-label={textForScreenReader(intl, status, false, isExpanded)}>
+                <DetailedStatus
+                  key={`details-${status.get('id')}`}
+                  status={status}
+                  settings={settings}
+                  onOpenVideo={this.handleOpenVideo}
+                  onOpenMedia={this.handleOpenMedia}
+                  expanded={isExpanded}
+                  onToggleHidden={this.handleToggleHidden}
+                  onTranslate={this.handleTranslate}
+                  domain={domain}
+                  showMedia={this.state.showMedia}
+                  onToggleMediaVisibility={this.handleToggleMediaVisibility}
+                  pictureInPicture={pictureInPicture}
+                />
+
+                <ActionBar
+                  key={`action-bar-${status.get('id')}`}
+                  status={status}
+                  onReply={this.handleReplyClick}
+                  onFavourite={this.handleFavouriteClick}
+                  onReblog={this.handleReblogClick}
+                  onBookmark={this.handleBookmarkClick}
+                  onDelete={this.handleDeleteClick}
+                  onEdit={this.handleEditClick}
+                  onDirect={this.handleDirectClick}
+                  onMention={this.handleMentionClick}
+                  onMute={this.handleMuteClick}
+                  onMuteConversation={this.handleConversationMuteClick}
+                  onBlock={this.handleBlockClick}
+                  onReport={this.handleReport}
+                  onPin={this.handlePin}
+                  onEmbed={this.handleEmbed}
+                />
+              </div>
+            </HotKeys>
+
+            {descendants}
+          </div>
+        </ScrollContainer>
+
+        <Helmet>
+          <title>{titleFromStatus(intl, status)}</title>
+          <meta name='robots' content={(isLocal && isIndexable) ? 'all' : 'noindex'} />
+          <link rel='canonical' href={status.get('url')} />
+        </Helmet>
+      </Column>
+    );
+  }
+
+}
+
+export default injectIntl(connect(makeMapStateToProps)(Status));

app/javascript/flavours/glitch/features/ui/components/navigation_panel.jsx

@@ -21,7 +21,7 @@ const messages = defineMessages({
   explore: { id: 'explore.title', defaultMessage: 'Explore' },
   firehose: { id: 'column.firehose', defaultMessage: 'Live feeds' },
   direct: { id: 'navigation_bar.direct', defaultMessage: 'Private mentions' },
-  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favourites' },
+  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favorites' },
   bookmarks: { id: 'navigation_bar.bookmarks', defaultMessage: 'Bookmarks' },
   lists: { id: 'navigation_bar.lists', defaultMessage: 'Lists' },
   preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },

app/javascript/flavours/glitch/features/ui/components/sign_in_banner.jsx

@@ -34,7 +34,7 @@ const SignInBanner = () => {
 
   return (
     <div className='sign-in-banner'>
-      <p><FormattedMessage id='sign_in_banner.text' defaultMessage='Login to follow profiles or hashtags, favourite, share and reply to posts. You can also interact from your account on a different server.' /></p>
+      <p><FormattedMessage id='sign_in_banner.text' defaultMessage='Login to follow profiles or hashtags, favorite, share and reply to posts. You can also interact from your account on a different server.' /></p>
       {signupButton}
       <a href='/auth/sign_in' className='button button--block button-tertiary'><FormattedMessage id='sign_in_banner.sign_in' defaultMessage='Login' /></a>
     </div>

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

@@ -191,6 +191,7 @@ class SwitchingColumnsArea extends PureComponent {
 
           {singleColumn ? <Redirect from='/deck' to='/home' exact /> : null}
           {singleColumn && pathName.startsWith('/deck/') ? <Redirect from={pathName} to={pathName.slice(5)} /> : null}
+          {!singleColumn && pathName === '/getting-started' ? <Redirect from='/getting-started' to='/deck/getting-started' exact /> : null}
 
           <WrappedRoute path='/getting-started' component={GettingStarted} content={children} />
           <WrappedRoute path='/keyboard-shortcuts' component={KeyboardShortcuts} content={children} />

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

@@ -577,7 +577,10 @@ class Video extends PureComponent {
 
         <div className={classNames('spoiler-button', { 'spoiler-button--hidden': revealed || editable })}>
           <button type='button' className='spoiler-button__overlay' onClick={this.toggleReveal}>
-            <span className='spoiler-button__overlay__label'>{warning}</span>
+            <span className='spoiler-button__overlay__label'>
+              {warning}
+              <span className='spoiler-button__overlay__action'><FormattedMessage id='status.media.show' defaultMessage='Click to show' /></span>
+            </span>
           </button>
         </div>
 

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

@@ -3,11 +3,16 @@ import { Map as ImmutableMap, fromJS } from 'immutable';
 import {
   REBLOG_REQUEST,
   REBLOG_FAIL,
+  UNREBLOG_REQUEST,
+  UNREBLOG_FAIL,
   FAVOURITE_REQUEST,
   FAVOURITE_FAIL,
-  UNFAVOURITE_SUCCESS,
+  UNFAVOURITE_REQUEST,
+  UNFAVOURITE_FAIL,
   BOOKMARK_REQUEST,
   BOOKMARK_FAIL,
+  UNBOOKMARK_REQUEST,
+  UNBOOKMARK_FAIL,
 } from 'flavours/glitch/actions/interactions';
 import {
   STATUS_MUTE_SUCCESS,
@@ -75,18 +80,28 @@ export default function statuses(state = initialState, action) {
     return importStatuses(state, action.statuses);
   case FAVOURITE_REQUEST:
     return state.setIn([action.status.get('id'), 'favourited'], true);
-  case UNFAVOURITE_SUCCESS:
-    return state.updateIn([action.status.get('id'), 'favourites_count'], x => Math.max(0, x - 1));
   case FAVOURITE_FAIL:
     return state.get(action.status.get('id')) === undefined ? state : state.setIn([action.status.get('id'), 'favourited'], false);
+  case UNFAVOURITE_REQUEST:
+    return state.setIn([action.status.get('id'), 'favourited'], false);
+  case UNFAVOURITE_FAIL:
+    return state.get(action.status.get('id')) === undefined ? state : state.setIn([action.status.get('id'), 'favourited'], true);
   case BOOKMARK_REQUEST:
-    return state.setIn([action.status.get('id'), 'bookmarked'], true);
+    return state.get(action.status.get('id')) === undefined ? state : state.setIn([action.status.get('id'), 'bookmarked'], true);
   case BOOKMARK_FAIL:
     return state.get(action.status.get('id')) === undefined ? state : state.setIn([action.status.get('id'), 'bookmarked'], false);
+  case UNBOOKMARK_REQUEST:
+    return state.get(action.status.get('id')) === undefined ? state : state.setIn([action.status.get('id'), 'bookmarked'], false);
+  case UNBOOKMARK_FAIL:
+    return state.get(action.status.get('id')) === undefined ? state : state.setIn([action.status.get('id'), 'bookmarked'], true);
   case REBLOG_REQUEST:
     return state.setIn([action.status.get('id'), 'reblogged'], true);
   case REBLOG_FAIL:
     return state.get(action.status.get('id')) === undefined ? state : state.setIn([action.status.get('id'), 'reblogged'], false);
+  case UNREBLOG_REQUEST:
+    return state.setIn([action.status.get('id'), 'reblogged'], false);
+  case UNREBLOG_FAIL:
+    return state.get(action.status.get('id')) === undefined ? state : state.setIn([action.status.get('id'), 'reblogged'], true);
   case STATUS_MUTE_SUCCESS:
     return state.setIn([action.id, 'muted'], true);
   case STATUS_UNMUTE_SUCCESS:

app/javascript/flavours/glitch/styles/components/explore.scss

@@ -44,8 +44,9 @@
   align-items: center;
   color: $primary-text-color;
   text-decoration: none;
-  padding: 15px 0;
+  padding: 15px;
   border-bottom: 1px solid lighten($ui-base-color, 8%);
+  gap: 15px;
 
   &:last-child {
     border-bottom: 0;
@@ -54,33 +55,40 @@
   &:hover,
   &:active,
   &:focus {
-    background-color: lighten($ui-base-color, 4%);
+    color: $highlight-text-color;
+
+    .story__details__publisher,
+    .story__details__shared {
+      color: $highlight-text-color;
+    }
   }
 
   &__details {
-    padding: 0 15px;
     flex: 1 1 auto;
 
     &__publisher {
       color: $darker-text-color;
-      margin-bottom: 4px;
+      margin-bottom: 8px;
     }
 
     &__title {
       font-size: 19px;
       line-height: 24px;
       font-weight: 500;
-      margin-bottom: 4px;
+      margin-bottom: 8px;
     }
 
     &__shared {
       color: $darker-text-color;
     }
+
+    strong {
+      font-weight: 500;
+    }
   }
 
   &__thumbnail {
     flex: 0 0 auto;
-    margin: 0 15px;
     position: relative;
     width: 120px;
     height: 120px;
@@ -91,7 +99,7 @@
     }
 
     img {
-      border-radius: 4px;
+      border-radius: 8px;
       display: block;
       margin: 0;
       width: 100%;
@@ -100,7 +108,7 @@
     }
 
     &__preview {
-      border-radius: 4px;
+      border-radius: 8px;
       display: block;
       margin: 0;
       width: 100%;
@@ -116,4 +124,21 @@
       }
     }
   }
+
+  &.expanded {
+    flex-direction: column;
+
+    .story__thumbnail {
+      order: 1;
+      width: 100%;
+      height: auto;
+      aspect-ratio: 1.91 / 1;
+    }
+
+    .story__details {
+      order: 2;
+      width: 100%;
+      flex: 0 0 auto;
+    }
+  }
 }

app/javascript/flavours/glitch/styles/components/misc.scss

@@ -1351,6 +1351,8 @@ button.icon-button.active i.fa-retweet {
     padding: 0;
     margin: 0;
     border: 0;
+    border-radius: 4px;
+    color: $white;
 
     &__label {
       display: flex;
@@ -1358,7 +1360,6 @@ button.icon-button.active i.fa-retweet {
       justify-content: center;
       gap: 8px;
       flex-direction: column;
-      color: $primary-text-color;
       font-weight: 500;
       font-size: 14px;
     }

app/javascript/flavours/glitch/styles/components/modal.scss

@@ -1306,13 +1306,13 @@ img.modal-warning {
 .interaction-modal {
   max-width: 90vw;
   width: 600px;
-  background: $ui-base-color;
+  background: var(--modal-background-color);
+  border: 1px solid var(--modal-border-color);
   border-radius: 8px;
-  overflow-x: hidden;
-  overflow-y: auto;
+  overflow: visible;
   position: relative;
   display: block;
-  padding: 20px;
+  padding: 40px;
 
   h3 {
     font-size: 22px;
@@ -1321,63 +1321,100 @@ img.modal-warning {
     text-align: center;
   }
 
+  p {
+    font-size: 17px;
+    line-height: 22px;
+    color: $darker-text-color;
+
+    strong {
+      color: $primary-text-color;
+      font-weight: 700;
+    }
+  }
+
+  p.hint {
+    margin-bottom: 14px;
+    font-size: 14px;
+  }
+
   &__icon {
     color: $highlight-text-color;
     margin: 0 5px;
   }
 
   &__lead {
-    padding: 20px;
-    text-align: center;
+    margin-bottom: 20px;
 
     h3 {
       margin-bottom: 15px;
     }
-
-    p {
-      font-size: 17px;
-      line-height: 22px;
-      color: $darker-text-color;
-    }
   }
 
-  &__choices {
-    display: flex;
+  &__login {
+    position: relative;
+    margin-bottom: 20px;
 
-    &__choice {
-      flex: 0 0 auto;
-      width: 50%;
-      box-sizing: border-box;
-      padding: 20px;
+    &__input {
+      @include search-input;
 
-      h3 {
-        margin-bottom: 20px;
-      }
+      border: 1px solid lighten($ui-base-color, 8%);
+      padding: 4px 6px;
+      color: $primary-text-color;
+      font-size: 16px;
+      line-height: 18px;
+      display: flex;
+      align-items: center;
 
-      p {
-        color: $darker-text-color;
-        margin-bottom: 20px;
+      input {
+        background: transparent;
+        color: inherit;
+        font: inherit;
+        border: 0;
+        padding: 15px - 4px 15px - 6px;
+        flex: 1 1 auto;
+
+        &::placeholder {
+          color: lighten($darker-text-color, 4%);
+        }
+
+        &:focus {
+          outline: 0;
+        }
       }
 
       .button {
-        margin-bottom: 10px;
-
-        &:last-child {
-          margin-bottom: 0;
-        }
+        flex: 0 0 auto;
       }
     }
+
+    .search__popout {
+      margin-top: -1px;
+      padding-top: 5px;
+      padding-bottom: 5px;
+      border: 1px solid lighten($ui-base-color, 8%);
+    }
+
+    &.focused &__input {
+      border-color: $highlight-text-color;
+      background: lighten($ui-base-color, 4%);
+    }
+
+    &.invalid &__input {
+      border-color: $error-red;
+    }
+
+    &.expanded .search__popout {
+      display: block;
+    }
+
+    &.expanded &__input {
+      border-radius: 4px 4px 0 0;
+    }
   }
 
-  @media screen and (max-width: $no-gap-breakpoint - 1px) {
-    &__choices {
-      display: block;
-
-      &__choice {
-        width: auto;
-        margin-bottom: 20px;
-      }
-    }
+  .link-button {
+    font-size: inherit;
+    display: inline;
   }
 }
 

app/javascript/flavours/glitch/styles/components/search.scss

@@ -125,7 +125,6 @@
     position: absolute;
     top: 16px;
     inset-inline-end: 10px;
-    z-index: 2;
     display: inline-block;
     opacity: 0;
     transition: all 100ms linear;
@@ -321,5 +320,6 @@
 
   &--compact &__item {
     padding: 10px;
+    padding-inline-end: 28px;
   }
 }

app/javascript/flavours/glitch/styles/mastodon-light/diff.scss

@@ -24,13 +24,16 @@ html {
 .column > .scrollable,
 .getting-started,
 .column-inline-form,
-.error-column,
 .regeneration-indicator {
   background: $white;
   border: 1px solid lighten($ui-base-color, 8%);
   border-top: 0;
 }
 
+.error-column {
+  border: 1px solid lighten($ui-base-color, 8%);
+}
+
 .column > .scrollable.about {
   border-top: 1px solid lighten($ui-base-color, 8%);
 }

app/javascript/flavours/glitch/styles/polls.scss

@@ -127,11 +127,6 @@
       border-radius: 4px;
     }
 
-    &.active {
-      border-color: $valid-value-color;
-      background: $valid-value-color;
-    }
-
     &:active,
     &:focus,
     &:hover {
@@ -139,6 +134,11 @@
       border-width: 4px;
     }
 
+    &.active {
+      background-color: $valid-value-color;
+      border-color: $valid-value-color;
+    }
+
     &::-moz-focus-inner {
       outline: 0 !important;
       border: 0;
@@ -223,6 +223,14 @@
     padding: 10px;
   }
 
+  .poll__input {
+    &:active,
+    &:focus,
+    &:hover {
+      border-color: $ui-button-focus-background-color;
+    }
+  }
+
   .poll__footer {
     border-top: 1px solid darken($simple-background-color, 8%);
     padding: 10px;
@@ -249,6 +257,14 @@
     color: $action-button-color;
     border-color: $action-button-color;
     margin-inline-end: 5px;
+
+    &:hover,
+    &:focus,
+    &.active {
+      border-color: $action-button-color;
+      background-color: $action-button-color;
+      color: $ui-button-color;
+    }
   }
 
   li {

app/javascript/flavours/glitch/styles/variables.scss

@@ -98,4 +98,6 @@ $dismiss-overlay-width: 4rem;
   --dropdown-background-color: #{lighten($ui-base-color, 4%)};
   --dropdown-shadow: 0 20px 25px -5px #{rgba($base-shadow-color, 0.25)},
     0 8px 10px -6px #{rgba($base-shadow-color, 0.25)};
+  --modal-background-color: #{darken($ui-base-color, 4%)};
+  --modal-border-color: #{lighten($ui-base-color, 4%)};
 }

app/javascript/flavours/glitch/styles/variables.scss.orig

@@ -0,0 +1,101 @@
+// Commonly used web colors
+$black: #000000; // Black
+$white: #ffffff; // White
+$red-600: #b7253d !default; // Deep Carmine
+$red-500: #df405a !default; // Cerise
+$blurple-600: #563acc; // Iris
+$blurple-500: #6364ff; // Brand purple
+$blurple-300: #858afa; // Faded Blue
+$grey-600: #4e4c5a; // Trout
+$grey-100: #dadaf3; // Topaz
+
+$success-green: #79bd9a !default; // Padua
+$error-red: $red-500 !default; // Cerise
+$warning-red: #ff5050 !default; // Sunset Orange
+$gold-star: #ca8f04 !default; // Dark Goldenrod
+
+$red-bookmark: $warning-red;
+
+// Values from the classic Mastodon UI
+$classic-base-color: #282c37; // Midnight Express
+$classic-primary-color: #9baec8; // Echo Blue
+$classic-secondary-color: #d9e1e8; // Pattens Blue
+$classic-highlight-color: #6364ff; // Brand purple
+
+// Variables for defaults in UI
+$base-shadow-color: $black !default;
+$base-overlay-background: $black !default;
+$base-border-color: $white !default;
+$simple-background-color: $white !default;
+$valid-value-color: $success-green !default;
+$error-value-color: $error-red !default;
+
+// Tell UI to use selected colors
+$ui-base-color: $classic-base-color !default; // Darkest
+$ui-base-lighter-color: lighten(
+  $ui-base-color,
+  26%
+) !default; // Lighter darkest
+$ui-primary-color: $classic-primary-color !default; // Lighter
+$ui-secondary-color: $classic-secondary-color !default; // Lightest
+$ui-highlight-color: $classic-highlight-color !default;
+$ui-button-color: $white !default;
+$ui-button-background-color: $blurple-500 !default;
+$ui-button-focus-background-color: $blurple-600 !default;
+
+$ui-button-secondary-color: $grey-100 !default;
+$ui-button-secondary-border-color: $grey-100 !default;
+$ui-button-secondary-focus-background-color: $grey-600 !default;
+$ui-button-secondary-focus-color: $white !default;
+
+$ui-button-tertiary-color: $blurple-300 !default;
+$ui-button-tertiary-border-color: $blurple-300 !default;
+$ui-button-tertiary-focus-background-color: $blurple-600 !default;
+$ui-button-tertiary-focus-color: $white !default;
+
+$ui-button-destructive-background-color: $red-500 !default;
+$ui-button-destructive-focus-background-color: $red-600 !default;
+
+// Variables for texts
+$primary-text-color: $white !default;
+$darker-text-color: $ui-primary-color !default;
+$dark-text-color: $ui-base-lighter-color !default;
+$secondary-text-color: $ui-secondary-color !default;
+$highlight-text-color: lighten($ui-highlight-color, 8%) !default;
+$action-button-color: $ui-base-lighter-color !default;
+$action-button-focus-color: lighten($ui-base-lighter-color, 4%) !default;
+$passive-text-color: $gold-star !default;
+$active-passive-text-color: $success-green !default;
+
+// For texts on inverted backgrounds
+$inverted-text-color: $ui-base-color !default;
+$lighter-text-color: $ui-base-lighter-color !default;
+$light-text-color: $ui-primary-color !default;
+
+// Language codes that uses CJK fonts
+$cjk-langs: ja, ko, zh-CN, zh-HK, zh-TW;
+
+// Variables for components
+$media-modal-media-max-width: 100%;
+
+// put margins on top and bottom of image to avoid the screen covered by image.
+$media-modal-media-max-height: 80%;
+
+$no-gap-breakpoint: 1175px;
+
+$font-sans-serif: 'mastodon-font-sans-serif' !default;
+$font-display: 'mastodon-font-display' !default;
+$font-monospace: 'mastodon-font-monospace' !default;
+
+// Avatar border size (8% default, 100% for rounded avatars)
+$ui-avatar-border-size: 8%;
+
+// More variables
+$dismiss-overlay-width: 4rem;
+
+:root {
+  --dropdown-border-color: #{lighten($ui-base-color, 12%)};
+  --dropdown-background-color: #{lighten($ui-base-color, 4%)};
+  --dropdown-shadow: 0 20px 25px -5px #{rgba($base-shadow-color, 0.25)},
+    0 8px 10px -6px #{rgba($base-shadow-color, 0.25)};
+}

app/javascript/flavours/glitch/types/resources.ts

@@ -33,6 +33,7 @@ interface AccountApiResponseValues {
   note: string;
   statuses_count: number;
   url: string;
+  uri: string;
   username: string;
 }
 

app/javascript/mastodon/actions/importer/index.js

@@ -81,7 +81,7 @@ export function importFetchedStatuses(statuses) {
       }
 
       if (status.poll && status.poll.id) {
-        pushUnique(polls, normalizePoll(status.poll));
+        pushUnique(polls, normalizePoll(status.poll, getState().getIn(['polls', status.poll.id])));
       }
     }
 
@@ -95,7 +95,7 @@ export function importFetchedStatuses(statuses) {
 }
 
 export function importFetchedPoll(poll) {
-  return dispatch => {
-    dispatch(importPolls([normalizePoll(poll)]));
+  return (dispatch, getState) => {
+    dispatch(importPolls([normalizePoll(poll, getState().getIn(['polls', poll.id]))]));
   };
 }

app/javascript/mastodon/actions/importer/normalizer.js

@@ -76,6 +76,7 @@ export function normalizeStatus(status, normalOldStatus) {
     normalStatus.spoilerHtml = normalOldStatus.get('spoilerHtml');
     normalStatus.spoiler_text = normalOldStatus.get('spoiler_text');
     normalStatus.hidden = normalOldStatus.get('hidden');
+    normalStatus.translation = normalOldStatus.get('translation');
   } else {
     // If the status has a CW but no contents, treat the CW as if it were the
     // status' contents, to avoid having a CW toggle with seemingly no effect.
@@ -94,6 +95,18 @@ export function normalizeStatus(status, normalOldStatus) {
     normalStatus.hidden       = expandSpoilers ? false : spoilerText.length > 0 || normalStatus.sensitive;
   }
 
+  if (normalOldStatus) {
+    const list = normalOldStatus.get('media_attachments');
+    if (normalStatus.media_attachments && list) {
+      normalStatus.media_attachments.forEach(item => {
+        const oldItem = list.find(i => i.get('id') === item.id);
+        if (oldItem && oldItem.get('description') === item.description) {
+          item.translation = oldItem.get('translation')
+        }
+      });
+    }
+  }
+
   return normalStatus;
 }
 
@@ -112,15 +125,23 @@ export function normalizeStatusTranslation(translation, status) {
   return normalTranslation;
 }
 
-export function normalizePoll(poll) {
+export function normalizePoll(poll, normalOldPoll) {
   const normalPoll = { ...poll };
   const emojiMap = makeEmojiMap(poll.emojis);
 
-  normalPoll.options = poll.options.map((option, index) => ({
-    ...option,
-    voted: poll.own_votes && poll.own_votes.includes(index),
-    titleHtml: emojify(escapeTextContentForBrowser(option.title), emojiMap),
-  }));
+  normalPoll.options = poll.options.map((option, index) => {
+    const normalOption = {
+      ...option,
+      voted: poll.own_votes && poll.own_votes.includes(index),
+      titleHtml: emojify(escapeTextContentForBrowser(option.title), emojiMap),
+    }
+
+    if (normalOldPoll && normalOldPoll.getIn(['options', index, 'title']) === option.title) {
+      normalOption.translation = normalOldPoll.getIn(['options', index, 'translation']);
+    }
+
+    return normalOption
+  });
 
   return normalPoll;
 }

app/javascript/mastodon/components/dropdown_menu.jsx

@@ -297,7 +297,7 @@ export default class Dropdown extends PureComponent {
       onKeyPress: this.handleKeyPress,
     }) : (
       <IconButton
-        icon={icon}
+        icon={!open ? icon : 'close'}
         title={title}
         active={open}
         disabled={disabled}

app/javascript/mastodon/components/intersection_observer_article.jsx

@@ -114,7 +114,7 @@ export default class IntersectionObserverArticle extends Component {
           aria-setsize={listLength}
           style={{ height: `${this.height || cachedHeight}px`, opacity: 0, overflow: 'hidden' }}
           data-id={id}
-          tabIndex={0}
+          tabIndex={-1}
         >
           {children && cloneElement(children, { hidden: true })}
         </article>
@@ -122,7 +122,7 @@ export default class IntersectionObserverArticle extends Component {
     }
 
     return (
-      <article ref={this.handleRef} aria-posinset={index + 1} aria-setsize={listLength} data-id={id} tabIndex={0}>
+      <article ref={this.handleRef} aria-posinset={index + 1} aria-setsize={listLength} data-id={id} tabIndex={-1}>
         {children && cloneElement(children, { hidden: false })}
       </article>
     );

app/javascript/mastodon/components/media_gallery.jsx

@@ -12,7 +12,7 @@ import { debounce } from 'lodash';
 
 import { Blurhash } from 'mastodon/components/blurhash';
 
-import { autoPlayGif, cropImages, displayMedia, useBlurhash } from '../initial_state';
+import { autoPlayGif, displayMedia, useBlurhash } from '../initial_state';
 
 import { IconButton } from './icon_button';
 
@@ -209,7 +209,6 @@ class MediaGallery extends PureComponent {
 
   static propTypes = {
     sensitive: PropTypes.bool,
-    standalone: PropTypes.bool,
     media: ImmutablePropTypes.list.isRequired,
     lang: PropTypes.string,
     size: PropTypes.object,
@@ -223,10 +222,6 @@ class MediaGallery extends PureComponent {
     onToggleVisibility: PropTypes.func,
   };
 
-  static defaultProps = {
-    standalone: false,
-  };
-
   state = {
     visible: this.props.visible !== undefined ? this.props.visible : (displayMedia !== 'hide_all' && !this.props.sensitive || displayMedia === 'show_all'),
     width: this.props.defaultWidth,
@@ -295,7 +290,7 @@ class MediaGallery extends PureComponent {
   }
 
   render () {
-    const { media, lang, intl, sensitive, defaultWidth, standalone, autoplay } = this.props;
+    const { media, lang, intl, sensitive, defaultWidth, autoplay } = this.props;
     const { visible } = this.state;
     const width = this.state.width || defaultWidth;
 
@@ -303,16 +298,16 @@ class MediaGallery extends PureComponent {
 
     const style = {};
 
-    if (this.isFullSizeEligible() && (standalone || !cropImages)) {
+    if (this.isFullSizeEligible()) {
       style.aspectRatio = `${this.props.media.getIn([0, 'meta', 'small', 'aspect'])}`;
     } else {
-      style.aspectRatio = '16 / 9';
+      style.aspectRatio = '3 / 2';
     }
 
     const size     = media.take(4).size;
     const uncached = media.every(attachment => attachment.get('type') === 'unknown');
 
-    if (standalone && this.isFullSizeEligible()) {
+    if (this.isFullSizeEligible()) {
       children = <Item standalone autoplay={autoplay} onClick={this.handleClick} attachment={media.get(0)} lang={lang} displayWidth={width} visible={visible} />;
     } else {
       children = media.take(4).map((attachment, i) => <Item key={attachment.get('id')} autoplay={autoplay} onClick={this.handleClick} attachment={attachment} index={i} lang={lang} size={size} displayWidth={width} visible={visible || uncached} />);

app/javascript/mastodon/components/picture_in_picture_placeholder.jsx

@@ -12,6 +12,7 @@ class PictureInPicturePlaceholder extends PureComponent {
 
   static propTypes = {
     dispatch: PropTypes.func.isRequired,
+    aspectRatio: PropTypes.string,
   };
 
   handleClick = () => {
@@ -20,8 +21,10 @@ class PictureInPicturePlaceholder extends PureComponent {
   };
 
   render () {
+    const { aspectRatio } = this.props;
+
     return (
-      <div className='picture-in-picture-placeholder' role='button' tabIndex={0} onClick={this.handleClick}>
+      <div className='picture-in-picture-placeholder' style={{ aspectRatio }} role='button' tabIndex={0} onClick={this.handleClick}>
         <Icon id='window-restore' />
         <FormattedMessage id='picture_in_picture.restore' defaultMessage='Put it back' />
       </div>

app/javascript/mastodon/components/status.jsx

@@ -19,7 +19,6 @@ import Bundle from '../features/ui/components/bundle';
 import { MediaGallery, Video, Audio } from '../features/ui/util/async-components';
 import { displayMedia } from '../initial_state';
 
-import AttachmentList from './attachment_list';
 import { Avatar } from './avatar';
 import { AvatarOverlay } from './avatar_overlay';
 import { DisplayName } from './display_name';
@@ -191,17 +190,35 @@ class Status extends ImmutablePureComponent {
     this.props.onTranslate(this._properStatus());
   };
 
-  renderLoadingMediaGallery () {
-    return <div className='media-gallery' style={{ height: '110px' }} />;
+  getAttachmentAspectRatio () {
+    const attachments = this._properStatus().get('media_attachments');
+
+    if (attachments.getIn([0, 'type']) === 'video') {
+      return `${attachments.getIn([0, 'meta', 'original', 'width'])} / ${attachments.getIn([0, 'meta', 'original', 'height'])}`;
+    } else if (attachments.getIn([0, 'type']) === 'audio') {
+      return '16 / 9';
+    } else {
+      return (attachments.size === 1 && attachments.getIn([0, 'meta', 'small', 'aspect'])) ? attachments.getIn([0, 'meta', 'small', 'aspect']) : '3 / 2'
+    }
   }
 
-  renderLoadingVideoPlayer () {
-    return <div className='video-player' style={{ height: '110px' }} />;
-  }
+  renderLoadingMediaGallery = () => {
+    return (
+      <div className='media-gallery' style={{ aspectRatio: this.getAttachmentAspectRatio() }} />
+    );
+  };
 
-  renderLoadingAudioPlayer () {
-    return <div className='audio-player' style={{ height: '110px' }} />;
-  }
+  renderLoadingVideoPlayer = () => {
+    return (
+      <div className='video-player' style={{ aspectRatio: this.getAttachmentAspectRatio() }} />
+    );
+  };
+
+  renderLoadingAudioPlayer = () => {
+    return (
+      <div className='audio-player' style={{ aspectRatio: this.getAttachmentAspectRatio() }} />
+    );
+  };
 
   handleOpenVideo = (options) => {
     const status = this._properStatus();
@@ -426,18 +443,11 @@ class Status extends ImmutablePureComponent {
     }
 
     if (pictureInPicture.get('inUse')) {
-      media = <PictureInPicturePlaceholder />;
+      media = <PictureInPicturePlaceholder aspectRatio={this.getAttachmentAspectRatio()} />;
     } else if (status.get('media_attachments').size > 0) {
       const language = status.getIn(['translation', 'language']) || status.get('language');
 
-      if (this.props.muted) {
-        media = (
-          <AttachmentList
-            compact
-            media={status.get('media_attachments')}
-          />
-        );
-      } else if (status.getIn(['media_attachments', 0, 'type']) === 'audio') {
+      if (status.getIn(['media_attachments', 0, 'type']) === 'audio') {
         const attachment = status.getIn(['media_attachments', 0]);
         const description = attachment.getIn(['translation', 'description']) || attachment.get('description');
 
@@ -475,11 +485,11 @@ class Status extends ImmutablePureComponent {
               <Component
                 preview={attachment.get('preview_url')}
                 frameRate={attachment.getIn(['meta', 'original', 'frame_rate'])}
+                aspectRatio={`${attachment.getIn(['meta', 'original', 'width'])} / ${attachment.getIn(['meta', 'original', 'height'])}`}
                 blurhash={attachment.get('blurhash')}
                 src={attachment.get('url')}
                 alt={description}
                 lang={language}
-                inline
                 sensitive={status.get('sensitive')}
                 onOpenVideo={this.handleOpenVideo}
                 deployPictureInPicture={pictureInPicture.get('available') ? this.handleDeployPictureInPicture : undefined}
@@ -508,7 +518,7 @@ class Status extends ImmutablePureComponent {
           </Bundle>
         );
       }
-    } else if (status.get('spoiler_text').length === 0 && status.get('card') && !this.props.muted) {
+    } else if (status.get('spoiler_text').length === 0 && status.get('card')) {
       media = (
         <Card
           onOpenMedia={this.handleOpenMedia}

app/javascript/mastodon/components/status_action_bar.jsx

@@ -31,7 +31,7 @@ const messages = defineMessages({
   reblog_private: { id: 'status.reblog_private', defaultMessage: 'Boost with original visibility' },
   cancel_reblog_private: { id: 'status.cancel_reblog_private', defaultMessage: 'Unboost' },
   cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' },
-  favourite: { id: 'status.favourite', defaultMessage: 'Favourite' },
+  favourite: { id: 'status.favourite', defaultMessage: 'Favorite' },
   bookmark: { id: 'status.bookmark', defaultMessage: 'Bookmark' },
   removeBookmark: { id: 'status.remove_bookmark', defaultMessage: 'Remove bookmark' },
   open: { id: 'status.open', defaultMessage: 'Expand this status' },

app/javascript/mastodon/containers/status_container.jsx

@@ -54,7 +54,7 @@ const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
   deleteMessage: { id: 'confirmations.delete.message', defaultMessage: 'Are you sure you want to delete this status?' },
   redraftConfirm: { id: 'confirmations.redraft.confirm', defaultMessage: 'Delete & redraft' },
-  redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favourites and boosts will be lost, and replies to the original post will be orphaned.' },
+  redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favorites and boosts will be lost, and replies to the original post will be orphaned.' },
   replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' },
   replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
   editConfirm: { id: 'confirmations.edit.confirm', defaultMessage: 'Edit' },
@@ -278,7 +278,7 @@ const mapDispatchToProps = (dispatch, { intl, contextType }) => ({
       modalProps: {
         type,
         accountId: status.getIn(['account', 'id']),
-        url: status.get('url'),
+        url: status.get('uri'),
       },
     }));
   },

app/javascript/mastodon/features/account/components/header.jsx

@@ -48,7 +48,7 @@ const messages = defineMessages({
   pins: { id: 'navigation_bar.pins', defaultMessage: 'Pinned posts' },
   preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },
   follow_requests: { id: 'navigation_bar.follow_requests', defaultMessage: 'Follow requests' },
-  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favourites' },
+  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favorites' },
   lists: { id: 'navigation_bar.lists', defaultMessage: 'Lists' },
   followed_tags: { id: 'navigation_bar.followed_tags', defaultMessage: 'Followed hashtags' },
   blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },
@@ -370,16 +370,33 @@ class Header extends ImmutablePureComponent {
     const acct            = isLocal && domain ? `${account.get('acct')}@${domain}` : account.get('acct');
     const isIndexable     = !account.get('noindex');
 
-    let badge;
+    const badges = [];
 
     if (account.get('bot')) {
-      badge = (<div className='account-role bot'><FormattedMessage id='account.badges.bot' defaultMessage='Automated' /></div>);
+      badges.push(
+        <div key='bot-badge' className='account-role bot'>
+          <Icon id='cogs' /> { ' ' }
+          <FormattedMessage id='account.badges.bot' defaultMessage='Automated' />
+        </div>
+      );
     } else if (account.get('group')) {
-      badge = (<div className='account-role group'><FormattedMessage id='account.badges.group' defaultMessage='Group' /></div>);
-    } else {
-      badge = null;
+      badges.push(
+        <div key='group-badge' className='account-role group'>
+          <Icon id='users' /> { ' ' }
+          <FormattedMessage id='account.badges.group' defaultMessage='Group' />
+        </div>
+      );
     }
 
+    account.get('roles', []).forEach((role) => {
+      badges.push(
+        <div key={`role-badge-${role.get('id')}`} className={`account-role user-role-${account.getIn(['roles', 0, 'id'])}`}>
+          <Icon id='circle' /> { ' ' }
+          <span>{role.get('name')} ({domain})</span>
+        </div>
+      );
+    });
+
     return (
       <div className={classNames('account__header', { inactive: !!account.get('moved') })} onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave}>
         {!(suspended || hidden || account.get('moved')) && account.getIn(['relationship', 'requested_by']) && <FollowRequestNoteContainer account={account} />}
@@ -414,13 +431,19 @@ class Header extends ImmutablePureComponent {
 
           <div className='account__header__tabs__name'>
             <h1>
-              <span dangerouslySetInnerHTML={displayNameHtml} /> {badge}
+              <span dangerouslySetInnerHTML={displayNameHtml} />
               <small>
                 <span>@{acct}</span> {lockedIcon}
               </small>
             </h1>
           </div>
 
+          {badges.length > 0 && (
+            <div className='account__header__badges'>
+              {badges}
+            </div>
+          )}
+
           {!(suspended || hidden) && (
             <div className='account__header__extra'>
               <div className='account__header__bio' ref={this.setRef}>

app/javascript/mastodon/features/account_gallery/components/media_item.jsx

@@ -128,7 +128,11 @@ export default class MediaItem extends ImmutablePureComponent {
         <div className='media-gallery__gifv'>
           {content}
 
-          {label && <span className='media-gallery__gifv__label'>{label}</span>}
+          {label && (
+            <div className='media-gallery__item__badges'>
+              <span className='media-gallery__gifv__label'>{label}</span>
+            </div>
+          )}
         </div>
       );
     }

app/javascript/mastodon/features/account_timeline/containers/header_container.jsx

@@ -83,7 +83,7 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
       modalProps: {
         type: 'follow',
         accountId: account.get('id'),
-        url: account.get('url'),
+        url: account.get('uri'),
       },
     }));
   },

app/javascript/mastodon/features/audio/index.jsx

@@ -470,6 +470,7 @@ class Audio extends PureComponent {
     const progress = Math.min((currentTime / duration) * 100, 100);
 
     let warning;
+
     if (sensitive) {
       warning = <FormattedMessage id='status.sensitive_warning' defaultMessage='Sensitive content' />;
     } else {
@@ -515,7 +516,10 @@ class Audio extends PureComponent {
 
         <div className={classNames('spoiler-button', { 'spoiler-button--hidden': revealed || editable })}>
           <button type='button' className='spoiler-button__overlay' onClick={this.toggleReveal}>
-            <span className='spoiler-button__overlay__label'>{warning}</span>
+            <span className='spoiler-button__overlay__label'>
+              {warning}
+              <span className='spoiler-button__overlay__action'><FormattedMessage id='status.media.show' defaultMessage='Click to show' /></span>
+            </span>
           </button>
         </div>
 

app/javascript/mastodon/features/bookmarked_statuses/index.jsx

@@ -86,7 +86,6 @@ class Bookmarks extends ImmutablePureComponent {
           onClick={this.handleHeaderClick}
           pinned={pinned}
           multiColumn={multiColumn}
-          showBackButton
         />
 
         <StatusList

app/javascript/mastodon/features/compose/components/action_bar.jsx

@@ -12,7 +12,7 @@ const messages = defineMessages({
   pins: { id: 'navigation_bar.pins', defaultMessage: 'Pinned posts' },
   preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },
   follow_requests: { id: 'navigation_bar.follow_requests', defaultMessage: 'Follow requests' },
-  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favourites' },
+  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favorites' },
   lists: { id: 'navigation_bar.lists', defaultMessage: 'Lists' },
   followed_tags: { id: 'navigation_bar.followed_tags', defaultMessage: 'Followed hashtags' },
   blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },

app/javascript/mastodon/features/compose/components/compose_form.jsx

@@ -281,13 +281,12 @@ class ComposeForm extends ImmutablePureComponent {
             autoFocus={autoFocus}
             lang={this.props.lang}
           >
-            <EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} />
-
             <div className='compose-form__modifiers'>
               <UploadFormContainer />
               <PollFormContainer />
             </div>
           </AutosuggestTextarea>
+          <EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} />
 
           <div className='compose-form__buttons-wrapper'>
             <div className='compose-form__buttons'>

app/javascript/mastodon/features/compose/components/navigation_bar.jsx

@@ -8,7 +8,6 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 
 import { Avatar } from '../../../components/avatar';
-import { IconButton } from '../../../components/icon_button';
 
 import ActionBar from './action_bar';
 
@@ -21,23 +20,27 @@ export default class NavigationBar extends ImmutablePureComponent {
   };
 
   render () {
+    const username = this.props.account.get('acct')
     return (
       <div className='navigation-bar'>
-        <Link to={`/@${this.props.account.get('acct')}`}>
-          <span style={{ display: 'none' }}>{this.props.account.get('acct')}</span>
+        <Link to={`/@${username}`}>
+          <span style={{ display: 'none' }}>{username}</span>
           <Avatar account={this.props.account} size={46} />
         </Link>
 
         <div className='navigation-bar__profile'>
-          <Link to={`/@${this.props.account.get('acct')}`}>
-            <strong className='navigation-bar__profile-account'>@{this.props.account.get('acct')}</strong>
-          </Link>
+          <span>
+            <Link to={`/@${username}`}>
+              <strong className='navigation-bar__profile-account'>@{username}</strong>
+            </Link>
+          </span>
 
-          <a href='/settings/profile' className='navigation-bar__profile-edit'><FormattedMessage id='navigation_bar.edit_profile' defaultMessage='Edit profile' /></a>
+          <span>
+            <a href='/settings/profile' className='navigation-bar__profile-edit'><FormattedMessage id='navigation_bar.edit_profile' defaultMessage='Edit profile' /></a>
+          </span>
         </div>
 
         <div className='navigation-bar__actions'>
-          <IconButton className='close' title='' icon='close' onClick={this.props.onClose} />
           <ActionBar account={this.props.account} onLogout={this.props.onLogout} />
         </div>
       </div>

app/javascript/mastodon/features/compose/components/search.jsx

@@ -139,10 +139,6 @@ class Search extends PureComponent {
     this.setState({ expanded: false, selectedOption: -1 });
   };
 
-  findTarget = () => {
-    return this.searchForm;
-  };
-
   handleHashtagClick = () => {
     const { router } = this.context;
     const { value, onClickSearchResult } = this.props;

app/javascript/mastodon/features/explore/components/story.jsx

@@ -1,10 +1,13 @@
 import PropTypes from 'prop-types';
 import { PureComponent } from 'react';
 
+import { FormattedMessage } from 'react-intl';
+
 import classNames from 'classnames';
 
 import { Blurhash } from 'mastodon/components/blurhash';
 import { accountsCountRenderer } from 'mastodon/components/hashtag';
+import { RelativeTimestamp } from 'mastodon/components/relative_timestamp';
 import { ShortNumber } from 'mastodon/components/short_number';
 import { Skeleton } from 'mastodon/components/skeleton';
 
@@ -13,10 +16,14 @@ export default class Story extends PureComponent {
   static propTypes = {
     url: PropTypes.string,
     title: PropTypes.string,
+    lang: PropTypes.string,
     publisher: PropTypes.string,
+    publishedAt: PropTypes.string,
+    author: PropTypes.string,
     sharedTimes: PropTypes.number,
     thumbnail: PropTypes.string,
     blurhash: PropTypes.string,
+    expanded: PropTypes.bool,
   };
 
   state = {
@@ -26,16 +33,16 @@ export default class Story extends PureComponent {
   handleImageLoad = () => this.setState({ thumbnailLoaded: true });
 
   render () {
-    const { url, title, publisher, sharedTimes, thumbnail, blurhash } = this.props;
+    const { expanded, url, title, lang, publisher, author, publishedAt, sharedTimes, thumbnail, blurhash } = this.props;
 
     const { thumbnailLoaded } = this.state;
 
     return (
-      <a className='story' href={url} target='blank' rel='noopener'>
+      <a className={classNames('story', { expanded })} href={url} target='blank' rel='noopener'>
         <div className='story__details'>
-          <div className='story__details__publisher'>{publisher ? publisher : <Skeleton width={50} />}</div>
-          <div className='story__details__title'>{title ? title : <Skeleton />}</div>
-          <div className='story__details__shared'>{typeof sharedTimes === 'number' ? <ShortNumber value={sharedTimes} renderer={accountsCountRenderer} /> : <Skeleton width={100} />}</div>
+          <div className='story__details__publisher'>{publisher ? <span lang={lang}>{publisher}</span> : <Skeleton width={50} />}{publishedAt && <> · <RelativeTimestamp timestamp={publishedAt} /></>}</div>
+          <div className='story__details__title' lang={lang}>{title ? title : <Skeleton />}</div>
+          <div className='story__details__shared'>{author && <><FormattedMessage id='link_preview.author' defaultMessage='By {name}' values={{ name: <strong>{author}</strong> }} /> · </>}{typeof sharedTimes === 'number' ? <ShortNumber value={sharedTimes} renderer={accountsCountRenderer} /> : <Skeleton width={100} />}</div>
         </div>
 
         <div className='story__thumbnail'>

app/javascript/mastodon/features/explore/links.jsx

@@ -55,12 +55,16 @@ class Links extends PureComponent {
       <div className='explore__links'>
         {banner}
 
-        {isLoading ? (<LoadingIndicator />) : links.map(link => (
+        {isLoading ? (<LoadingIndicator />) : links.map((link, i) => (
           <Story
             key={link.get('id')}
+            expanded={i === 0}
+            lang={link.get('language')}
             url={link.get('url')}
             title={link.get('title')}
             publisher={link.get('provider_name')}
+            publishedAt={link.get('published_at')}
+            author={link.get('author_name')}
             sharedTimes={link.getIn(['history', 0, 'accounts']) * 1 + link.getIn(['history', 1, 'accounts']) * 1}
             thumbnail={link.get('image')}
             blurhash={link.get('blurhash')}

app/javascript/mastodon/features/explore/statuses.jsx

@@ -47,7 +47,7 @@ class Statuses extends PureComponent {
     return (
       <>
         <DismissableBanner id='explore/statuses'>
-          <FormattedMessage id='dismissable_banner.explore_statuses' defaultMessage='These are posts from across the social web that are gaining traction today. Newer posts with more boosts and favourites are ranked higher.' />
+          <FormattedMessage id='dismissable_banner.explore_statuses' defaultMessage='These are posts from across the social web that are gaining traction today. Newer posts with more boosts and favorites are ranked higher.' />
         </DismissableBanner>
 
         <StatusList

app/javascript/mastodon/features/favourited_statuses/index.jsx

@@ -18,7 +18,7 @@ import Column from 'mastodon/features/ui/components/column';
 import { getStatusList } from 'mastodon/selectors';
 
 const messages = defineMessages({
-  heading: { id: 'column.favourites', defaultMessage: 'Favourites' },
+  heading: { id: 'column.favourites', defaultMessage: 'Favorites' },
 });
 
 const mapStateToProps = state => ({
@@ -74,7 +74,7 @@ class Favourites extends ImmutablePureComponent {
     const { intl, statusIds, columnId, multiColumn, hasMore, isLoading } = this.props;
     const pinned = !!columnId;
 
-    const emptyMessage = <FormattedMessage id='empty_column.favourited_statuses' defaultMessage="You don't have any favourite posts yet. When you favourite one, it will show up here." />;
+    const emptyMessage = <FormattedMessage id='empty_column.favourited_statuses' defaultMessage="You don't have any favorite posts yet. When you favorite one, it will show up here." />;
 
     return (
       <Column bindToDocument={!multiColumn} ref={this.setRef} label={intl.formatMessage(messages.heading)}>
@@ -86,7 +86,6 @@ class Favourites extends ImmutablePureComponent {
           onClick={this.handleHeaderClick}
           pinned={pinned}
           multiColumn={multiColumn}
-          showBackButton
         />
 
         <StatusList

app/javascript/mastodon/features/favourites/index.jsx

@@ -61,7 +61,7 @@ class Favourites extends ImmutablePureComponent {
       );
     }
 
-    const emptyMessage = <FormattedMessage id='empty_column.favourites' defaultMessage='No one has favourited this post yet. When someone does, they will show up here.' />;
+    const emptyMessage = <FormattedMessage id='empty_column.favourites' defaultMessage='No one has favorited this post yet. When someone does, they will show up here.' />;
 
     return (
       <Column bindToDocument={!multiColumn}>

app/javascript/mastodon/features/getting_started/index.jsx

@@ -32,7 +32,7 @@ const messages = defineMessages({
   bookmarks: { id: 'navigation_bar.bookmarks', defaultMessage: 'Bookmarks' },
   preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },
   follow_requests: { id: 'navigation_bar.follow_requests', defaultMessage: 'Follow requests' },
-  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favourites' },
+  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favorites' },
   blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },
   domain_blocks: { id: 'navigation_bar.domain_blocks', defaultMessage: 'Blocked domains' },
   mutes: { id: 'navigation_bar.mutes', defaultMessage: 'Muted users' },

app/javascript/mastodon/features/home_timeline/components/explore_prompt.tsx

@@ -22,7 +22,7 @@ export const ExplorePrompt = () => (
     <p>
       <FormattedMessage
         id='home.explore_prompt.body'
-        defaultMessage="Your home feed will have a mix of posts from the hashtags you've chosen to follow, the people you've chosen to follow, and the posts they boost. It's looking pretty quiet right now, so how about:"
+        defaultMessage="Your home feed will have a mix of posts from the hashtags you've chosen to follow, the people you've chosen to follow, and the posts they boost. If that feels too quiet, you may want to:"
       />
     </p>
 

app/javascript/mastodon/features/interaction_modal/index.jsx

@@ -1,95 +1,296 @@
 import PropTypes from 'prop-types';
-import { PureComponent } from 'react';
+import React from 'react';
 
-import { FormattedMessage } from 'react-intl';
+import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
 
 import classNames from 'classnames';
 
 import { connect } from 'react-redux';
 
+import { throttle, escapeRegExp } from 'lodash';
+
 import { openModal, closeModal } from 'mastodon/actions/modal';
+import api from 'mastodon/api';
+import Button from 'mastodon/components/button';
 import { Icon }  from 'mastodon/components/icon';
 import { registrationsOpen } from 'mastodon/initial_state';
 
+const messages = defineMessages({
+  loginPrompt: { id: 'interaction_modal.login.prompt', defaultMessage: 'Domain of your home server, e.g. mastodon.social' },
+});
+
 const mapStateToProps = (state, { accountId }) => ({
   displayNameHtml: state.getIn(['accounts', accountId, 'display_name_html']),
-  signupUrl: state.getIn(['server', 'server', 'registrations', 'url'], null) || '/auth/sign_up',
 });
 
 const mapDispatchToProps = (dispatch) => ({
   onSignupClick() {
-    dispatch(closeModal({
-      modalType: undefined,
-      ignoreFocus: false,
-    }));
-    dispatch(openModal({ modalType: 'CLOSED_REGISTRATIONS' }));
+    dispatch(closeModal());
+    dispatch(openModal('CLOSED_REGISTRATIONS'));
   },
 });
 
-class Copypaste extends PureComponent {
+const PERSISTENCE_KEY = 'mastodon_home';
+
+const isValidDomain = value => {
+  const url = new URL('https:///path');
+  url.hostname = value;
+  return url.hostname === value;
+};
+
+const valueToDomain = value => {
+  // If the user starts typing an URL
+  if (/^https?:\/\//.test(value)) {
+    try {
+      const url = new URL(value);
+
+      // Consider that if there is a path, the URL is more meaningful than a bare domain
+      if (url.pathname.length > 1) {
+        return '';
+      }
+
+      return url.host;
+    } catch {
+      return undefined;
+    }
+  // If the user writes their full handle including username
+  } else if (value.includes('@')) {
+    if (value.replace(/^@/, '').split('@').length > 2) {
+      return undefined;
+    }
+    return '';
+  }
+
+  return value;
+};
+
+const addInputToOptions = (value, options) => {
+  value = value.trim();
+
+  if (value.includes('.') && isValidDomain(value)) {
+    return [value].concat(options.filter((x) => x !== value));
+  }
+
+  return options;
+};
+
+class LoginForm extends React.PureComponent {
 
   static propTypes = {
-    value: PropTypes.string,
+    resourceUrl: PropTypes.string,
+    intl: PropTypes.object.isRequired,
   };
 
   state = {
-    copied: false,
+    value: localStorage ? (localStorage.getItem(PERSISTENCE_KEY) || '') : '',
+    expanded: false,
+    selectedOption: -1,
+    isLoading: false,
+    isSubmitting: false,
+    error: false,
+    options: [],
+    networkOptions: [],
   };
 
   setRef = c => {
     this.input = c;
   };
 
-  handleInputClick = () => {
-    this.setState({ copied: false });
-    this.input.focus();
-    this.input.select();
-    this.input.setSelectionRange(0, this.input.value.length);
+  handleChange = ({ target }) => {
+    this.setState(state => ({ value: target.value, isLoading: true, error: false, options: addInputToOptions(target.value, state.networkOptions) }), () => this._loadOptions());
   };
 
-  handleButtonClick = () => {
-    const { value } = this.props;
-    navigator.clipboard.writeText(value);
-    this.input.blur();
-    this.setState({ copied: true });
-    this.timeout = setTimeout(() => this.setState({ copied: false }), 700);
+  handleMessage = (event) => {
+    const { resourceUrl } = this.props;
+
+    if (event.origin !== window.origin || event.source !== this.iframeRef.contentWindow) {
+      return;
+    }
+
+    if (event.data?.type === 'fetchInteractionURL-failure') {
+      this.setState({ isSubmitting: false, error: true });
+    } else if (event.data?.type === 'fetchInteractionURL-success') {
+      if (/^https?:\/\//.test(event.data.template)) {
+        if (localStorage) {
+          localStorage.setItem(PERSISTENCE_KEY, event.data.uri_or_domain);
+        }
+
+        window.location.href = event.data.template.replace('{uri}', encodeURIComponent(resourceUrl));
+      } else {
+        this.setState({ isSubmitting: false, error: true });
+      }
+    }
   };
 
-  componentWillUnmount () {
-    if (this.timeout) clearTimeout(this.timeout);
+  componentDidMount () {
+    window.addEventListener('message', this.handleMessage);
   }
 
+  componentWillUnmount () {
+    window.removeEventListener('message', this.handleMessage);
+  }
+
+  handleSubmit = () => {
+    const { value } = this.state;
+
+    this.setState({ isSubmitting: true });
+
+    this.iframeRef.contentWindow.postMessage({
+      type: 'fetchInteractionURL',
+      uri_or_domain: value.trim(),
+    }, window.origin);
+  };
+
+  setIFrameRef = (iframe) => {
+    this.iframeRef = iframe;
+  }
+
+  handleFocus = () => {
+    this.setState({ expanded: true });
+  };
+
+  handleBlur = () => {
+    this.setState({ expanded: false });
+  };
+
+  handleKeyDown = (e) => {
+    const { options, selectedOption } = this.state;
+
+    switch(e.key) {
+    case 'ArrowDown':
+      e.preventDefault();
+
+      if (options.length > 0) {
+        this.setState({ selectedOption: Math.min(selectedOption + 1, options.length - 1) });
+      }
+
+      break;
+    case 'ArrowUp':
+      e.preventDefault();
+
+      if (options.length > 0) {
+        this.setState({ selectedOption: Math.max(selectedOption - 1, -1) });
+      }
+
+      break;
+    case 'Enter':
+      e.preventDefault();
+
+      if (selectedOption === -1) {
+        this.handleSubmit();
+      } else if (options.length > 0) {
+        this.setState({ value: options[selectedOption], error: false }, () => this.handleSubmit());
+      }
+
+      break;
+    }
+  };
+
+  handleOptionClick = e => {
+    const index  = Number(e.currentTarget.getAttribute('data-index'));
+    const option = this.state.options[index];
+
+    e.preventDefault();
+    this.setState({ selectedOption: index, value: option, error: false }, () => this.handleSubmit());
+  };
+
+  _loadOptions = throttle(() => {
+    const { value } = this.state;
+
+    const domain = valueToDomain(value.trim());
+
+    if (typeof domain === 'undefined') {
+      this.setState({ options: [], networkOptions: [], isLoading: false, error: true });
+      return;
+    }
+
+    if (domain.length === 0) {
+      this.setState({ options: [], networkOptions: [], isLoading: false });
+      return;
+    }
+
+    api().get('/api/v1/peers/search', { params: { q: domain } }).then(({ data }) => {
+      if (!data) {
+        data = [];
+      }
+
+      this.setState((state) => ({ networkOptions: data, options: addInputToOptions(state.value, data), isLoading: false }));
+    }).catch(() => {
+      this.setState({ isLoading: false });
+    });
+  }, 200, { leading: true, trailing: true });
+
   render () {
-    const { value } = this.props;
-    const { copied } = this.state;
+    const { intl } = this.props;
+    const { value, expanded, options, selectedOption, error, isSubmitting } = this.state;
+    const domain = (valueToDomain(value) || '').trim();
+    const domainRegExp = new RegExp(`(${escapeRegExp(domain)})`, 'gi');
+    const hasPopOut = domain.length > 0 && options.length > 0;
 
     return (
-      <div className={classNames('copypaste', { copied })}>
-        <input
-          type='text'
-          ref={this.setRef}
-          value={value}
-          readOnly
-          onClick={this.handleInputClick}
+      <div className={classNames('interaction-modal__login', { focused: expanded, expanded: hasPopOut, invalid: error })}>
+
+        <iframe
+          ref={this.setIFrameRef}
+          style={{display: 'none'}}
+          src='/remote_interaction_helper'
+          sandbox='allow-scripts allow-same-origin'
+          title='remote interaction helper'
         />
 
-        <button className='button' onClick={this.handleButtonClick}>
-          {copied ? <FormattedMessage id='copypaste.copied' defaultMessage='Copied' /> : <FormattedMessage id='copypaste.copy' defaultMessage='Copy' />}
-        </button>
+        <div className='interaction-modal__login__input'>
+          <input
+            ref={this.setRef}
+            type='text'
+            value={value}
+            placeholder={intl.formatMessage(messages.loginPrompt)}
+            aria-label={intl.formatMessage(messages.loginPrompt)}
+            autoFocus
+            onChange={this.handleChange}
+            onFocus={this.handleFocus}
+            onBlur={this.handleBlur}
+            onKeyDown={this.handleKeyDown}
+          />
+
+          <Button onClick={this.handleSubmit} disabled={isSubmitting}><FormattedMessage id='interaction_modal.login.action' defaultMessage='Take me home' /></Button>
+        </div>
+
+        {hasPopOut && (
+          <div className='search__popout'>
+            <div className='search__popout__menu'>
+              {options.map((option, i) => (
+                <button key={option} onMouseDown={this.handleOptionClick} data-index={i} className={classNames('search__popout__menu__item', { selected: selectedOption === i })}>
+                  {option.split(domainRegExp).map((part, i) => (
+                    part.toLowerCase() === domain.toLowerCase() ? (
+                      <mark key={i}>
+                        {part}
+                      </mark>
+                    ) : (
+                      <span key={i}>
+                        {part}
+                      </span>
+                    )
+                  ))}
+                </button>
+              ))}
+            </div>
+          </div>
+        )}
       </div>
     );
   }
 
 }
 
-class InteractionModal extends PureComponent {
+const IntlLoginForm = injectIntl(LoginForm);
+
+class InteractionModal extends React.PureComponent {
 
   static propTypes = {
     displayNameHtml: PropTypes.string,
     url: PropTypes.string,
     type: PropTypes.oneOf(['reply', 'reblog', 'favourite', 'follow']),
     onSignupClick: PropTypes.func.isRequired,
-    signupUrl: PropTypes.string.isRequired,
   };
 
   handleSignupClick = () => {
@@ -97,7 +298,7 @@ class InteractionModal extends PureComponent {
   };
 
   render () {
-    const { url, type, displayNameHtml, signupUrl } = this.props;
+    const { url, type, displayNameHtml } = this.props;
 
     const name = <bdi dangerouslySetInnerHTML={{ __html: displayNameHtml }} />;
 
@@ -116,8 +317,8 @@ class InteractionModal extends PureComponent {
       break;
     case 'favourite':
       icon = <Icon id='star' />;
-      title = <FormattedMessage id='interaction_modal.title.favourite' defaultMessage="Favourite {name}'s post" values={{ name }} />;
-      actionDescription = <FormattedMessage id='interaction_modal.description.favourite' defaultMessage='With an account on Mastodon, you can favourite this post to let the author know you appreciate it and save it for later.' />;
+      title = <FormattedMessage id='interaction_modal.title.favourite' defaultMessage="Favorite {name}'s post" values={{ name }} />;
+      actionDescription = <FormattedMessage id='interaction_modal.description.favourite' defaultMessage='With an account on Mastodon, you can favorite this post to let the author know you appreciate it and save it for later.' />;
       break;
     case 'follow':
       icon = <Icon id='user-plus' />;
@@ -130,13 +331,13 @@ class InteractionModal extends PureComponent {
 
     if (registrationsOpen) {
       signupButton = (
-        <a href={signupUrl} className='button button--block button-tertiary'>
+        <a href='/auth/sign_up' className='link-button'>
           <FormattedMessage id='sign_in_banner.create_account' defaultMessage='Create account' />
         </a>
       );
     } else {
       signupButton = (
-        <button className='button button--block button-tertiary' onClick={this.handleSignupClick}>
+        <button className='link-button' onClick={this.handleSignupClick}>
           <FormattedMessage id='sign_in_banner.create_account' defaultMessage='Create account' />
         </button>
       );
@@ -146,22 +347,13 @@ class InteractionModal extends PureComponent {
       <div className='modal-root__modal interaction-modal'>
         <div className='interaction-modal__lead'>
           <h3><span className='interaction-modal__icon'>{icon}</span> {title}</h3>
-          <p>{actionDescription} <FormattedMessage id='interaction_modal.preamble' defaultMessage="Since Mastodon is decentralized, you can use your existing account hosted by another Mastodon server or compatible platform if you don't have an account on this one." /></p>
+          <p>{actionDescription} <strong><FormattedMessage id='interaction_modal.sign_in' defaultMessage='You are not logged in to this server. Where is your account hosted?' /></strong></p>
         </div>
 
-        <div className='interaction-modal__choices'>
-          <div className='interaction-modal__choices__choice'>
-            <h3><FormattedMessage id='interaction_modal.on_this_server' defaultMessage='On this server' /></h3>
-            <a href='/auth/sign_in' className='button button--block'><FormattedMessage id='sign_in_banner.sign_in' defaultMessage='Login' /></a>
-            {signupButton}
-          </div>
+        <IntlLoginForm resourceUrl={url} />
 
-          <div className='interaction-modal__choices__choice'>
-            <h3><FormattedMessage id='interaction_modal.on_another_server' defaultMessage='On a different server' /></h3>
-            <p><FormattedMessage id='interaction_modal.other_server_instructions' defaultMessage='Copy and paste this URL into the search field of your favourite Mastodon app or the web interface of your Mastodon server.' /></p>
-            <Copypaste value={url} />
-          </div>
-        </div>
+        <p className='hint'><FormattedMessage id='interaction_modal.sign_in_hint' defaultMessage="Tip: That's the website where you signed up. If you don't remember, look for the welcome e-mail in your inbox. You can also enter your full username! (e.g. @Mastodon@mastodon.social)" /></p>
+        <p><FormattedMessage id='interaction_modal.no_account_yet' defaultMessage='Not on Mastodon?' /> {signupButton}</p>
       </div>
     );
   }

app/javascript/mastodon/features/keyboard_shortcuts/index.jsx

@@ -54,7 +54,7 @@ class KeyboardShortcuts extends ImmutablePureComponent {
               </tr>
               <tr>
                 <td><kbd>f</kbd></td>
-                <td><FormattedMessage id='keyboard_shortcuts.favourite' defaultMessage='to favourite' /></td>
+                <td><FormattedMessage id='keyboard_shortcuts.favourite' defaultMessage='to favorite' /></td>
               </tr>
               <tr>
                 <td><kbd>b</kbd></td>
@@ -138,7 +138,7 @@ class KeyboardShortcuts extends ImmutablePureComponent {
               </tr>
               <tr>
                 <td><kbd>g</kbd>+<kbd>f</kbd></td>
-                <td><FormattedMessage id='keyboard_shortcuts.favourites' defaultMessage='to open favourites list' /></td>
+                <td><FormattedMessage id='keyboard_shortcuts.favourites' defaultMessage='to open favorites list' /></td>
               </tr>
               <tr>
                 <td><kbd>g</kbd>+<kbd>p</kbd></td>

app/javascript/mastodon/features/lists/index.jsx

@@ -65,7 +65,7 @@ class Lists extends ImmutablePureComponent {
 
     return (
       <Column bindToDocument={!multiColumn} label={intl.formatMessage(messages.heading)}>
-        <ColumnHeader title={intl.formatMessage(messages.heading)} icon='list-ul' multiColumn={multiColumn} showBackButton />
+        <ColumnHeader title={intl.formatMessage(messages.heading)} icon='list-ul' multiColumn={multiColumn} />
 
         <NewListForm />
 

app/javascript/mastodon/features/notifications/components/column_settings.jsx

@@ -109,7 +109,7 @@ export default class ColumnSettings extends PureComponent {
         </div>
 
         <div role='group' aria-labelledby='notifications-favourite'>
-          <span id='notifications-favourite' className='column-settings__section'><FormattedMessage id='notifications.column_settings.favourite' defaultMessage='Favourites:' /></span>
+          <span id='notifications-favourite' className='column-settings__section'><FormattedMessage id='notifications.column_settings.favourite' defaultMessage='Favorites:' /></span>
 
           <div className='column-settings__row'>
             <SettingToggle disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'favourite']} onChange={onChange} label={alertStr} />

app/javascript/mastodon/features/notifications/components/filter_bar.jsx

@@ -7,7 +7,7 @@ import { Icon }  from 'mastodon/components/icon';
 
 const tooltips = defineMessages({
   mentions: { id: 'notifications.filter.mentions', defaultMessage: 'Mentions' },
-  favourites: { id: 'notifications.filter.favourites', defaultMessage: 'Favourites' },
+  favourites: { id: 'notifications.filter.favourites', defaultMessage: 'Favorites' },
   boosts: { id: 'notifications.filter.boosts', defaultMessage: 'Boosts' },
   polls: { id: 'notifications.filter.polls', defaultMessage: 'Poll results' },
   follows: { id: 'notifications.filter.follows', defaultMessage: 'Follows' },

app/javascript/mastodon/features/notifications/components/notification.jsx

@@ -20,7 +20,7 @@ import FollowRequestContainer from '../containers/follow_request_container';
 import Report from './report';
 
 const messages = defineMessages({
-  favourite: { id: 'notification.favourite', defaultMessage: '{name} favourited your status' },
+  favourite: { id: 'notification.favourite', defaultMessage: '{name} favorited your status' },
   follow: { id: 'notification.follow', defaultMessage: '{name} followed you' },
   ownPoll: { id: 'notification.own_poll', defaultMessage: 'Your poll has ended' },
   poll: { id: 'notification.poll', defaultMessage: 'A poll you have voted in has ended' },
@@ -198,7 +198,7 @@ class Notification extends ImmutablePureComponent {
             </div>
 
             <span title={notification.get('created_at')}>
-              <FormattedMessage id='notification.favourite' defaultMessage='{name} favourited your status' values={{ name: link }} />
+              <FormattedMessage id='notification.favourite' defaultMessage='{name} favorited your status' values={{ name: link }} />
             </span>
           </div>
 

app/javascript/mastodon/features/picture_in_picture/components/footer.jsx

@@ -23,7 +23,7 @@ const messages = defineMessages({
   reblog_private: { id: 'status.reblog_private', defaultMessage: 'Boost with original visibility' },
   cancel_reblog_private: { id: 'status.cancel_reblog_private', defaultMessage: 'Unboost' },
   cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' },
-  favourite: { id: 'status.favourite', defaultMessage: 'Favourite' },
+  favourite: { id: 'status.favourite', defaultMessage: 'Favorite' },
   replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' },
   replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
   open: { id: 'status.open', defaultMessage: 'Expand this status' },
@@ -91,7 +91,7 @@ class Footer extends ImmutablePureComponent {
         modalProps: {
           type: 'reply',
           accountId: status.getIn(['account', 'id']),
-          url: status.get('url'),
+          url: status.get('uri'),
         },
       }));
     }
@@ -113,7 +113,7 @@ class Footer extends ImmutablePureComponent {
         modalProps: {
           type: 'favourite',
           accountId: status.getIn(['account', 'id']),
-          url: status.get('url'),
+          url: status.get('uri'),
         },
       }));
     }
@@ -142,7 +142,7 @@ class Footer extends ImmutablePureComponent {
         modalProps: {
           type: 'reblog',
           accountId: status.getIn(['account', 'id']),
-          url: status.get('url'),
+          url: status.get('uri'),
         },
       }));
     }

app/javascript/mastodon/features/status/components/action_bar.jsx

@@ -25,7 +25,7 @@ const messages = defineMessages({
   reblog_private: { id: 'status.reblog_private', defaultMessage: 'Boost with original visibility' },
   cancel_reblog_private: { id: 'status.cancel_reblog_private', defaultMessage: 'Unboost' },
   cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' },
-  favourite: { id: 'status.favourite', defaultMessage: 'Favourite' },
+  favourite: { id: 'status.favourite', defaultMessage: 'Favorite' },
   bookmark: { id: 'status.bookmark', defaultMessage: 'Bookmark' },
   more: { id: 'status.more', defaultMessage: 'More' },
   mute: { id: 'status.mute', defaultMessage: 'Mute @{name}' },

app/javascript/mastodon/features/status/components/card.jsx

@@ -12,6 +12,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 
 import { Blurhash } from 'mastodon/components/blurhash';
 import { Icon }  from 'mastodon/components/icon';
+import { RelativeTimestamp } from 'mastodon/components/relative_timestamp';
 import { useBlurhash } from 'mastodon/initial_state';
 
 const IDNA_PREFIX = 'xn--';
@@ -57,14 +58,9 @@ export default class Card extends PureComponent {
   static propTypes = {
     card: ImmutablePropTypes.map,
     onOpenMedia: PropTypes.func.isRequired,
-    compact: PropTypes.bool,
     sensitive: PropTypes.bool,
   };
 
-  static defaultProps = {
-    compact: false,
-  };
-
   state = {
     previewLoaded: false,
     embedded: false,
@@ -148,7 +144,7 @@ export default class Card extends PureComponent {
   }
 
   render () {
-    const { card, compact } = this.props;
+    const { card } = this.props;
     const { embedded, revealed } = this.state;
 
     if (card === null) {
@@ -156,29 +152,27 @@ export default class Card extends PureComponent {
     }
 
     const provider    = card.get('provider_name').length === 0 ? decodeIDNA(getHostname(card.get('url'))) : card.get('provider_name');
-    const horizontal  = (!compact && card.get('width') > card.get('height')) || card.get('type') !== 'link' || embedded;
     const interactive = card.get('type') !== 'link';
-    const className   = classnames('status-card', { horizontal, compact, interactive });
-    const title       = interactive ? <a className='status-card__title' href={card.get('url')} title={card.get('title')} rel='noopener noreferrer' target='_blank'><strong>{card.get('title')}</strong></a> : <strong className='status-card__title' title={card.get('title')}>{card.get('title')}</strong>;
     const language    = card.get('language') || '';
 
     const description = (
-      <div className='status-card__content' lang={language}>
-        {title}
-        {!(horizontal || compact) && <p className='status-card__description' title={card.get('description')}>{card.get('description')}</p>}
-        <span className='status-card__host'>{provider}</span>
+      <div className='status-card__content'>
+        <span className='status-card__host'>
+          <span lang={language}>{provider}</span>
+          {card.get('published_at') && <> · <RelativeTimestamp timestamp={card.get('published_at')} /></>}
+         </span>
+        <strong className='status-card__title' title={card.get('title')} lang={language}>{card.get('title')}</strong>
+        {card.get('author_name').length > 0 && <span className='status-card__author'><FormattedMessage id='link_preview.author' defaultMessage='By {name}' values={{ name: <strong>{card.get('author_name')}</strong> }} /></span>}
       </div>
     );
 
     const thumbnailStyle = {
-      visibility: revealed? null : 'hidden',
+      visibility: revealed ? null : 'hidden',
+      aspectRatio: `${card.get('width')} / ${card.get('height')}`
     };
 
-    if (horizontal) {
-      thumbnailStyle.aspectRatio = (compact && !embedded) ? '16 / 9' : `${card.get('width')} / ${card.get('height')}`;
-    }
+    let embed;
 
-    let embed     = '';
     let canvas = (
       <Blurhash
         className={classnames('status-card__image-preview', {
@@ -188,12 +182,18 @@ export default class Card extends PureComponent {
         dummy={!useBlurhash}
       />
     );
+
     let thumbnail = <img src={card.get('image')} alt='' style={thumbnailStyle} onLoad={this.handleImageLoad} className='status-card__image-image' />;
+
     let spoilerButton = (
       <button type='button' onClick={this.handleReveal} className='spoiler-button__overlay'>
-        <span className='spoiler-button__overlay__label'><FormattedMessage id='status.sensitive_warning' defaultMessage='Sensitive content' /></span>
+        <span className='spoiler-button__overlay__label'>
+          <FormattedMessage id='status.sensitive_warning' defaultMessage='Sensitive content' />
+          <span className='spoiler-button__overlay__action'><FormattedMessage id='status.media.show' defaultMessage='Click to show' /></span>
+        </span>
       </button>
     );
+
     spoilerButton = (
       <div className={classnames('spoiler-button', { 'spoiler-button--minified': revealed })}>
         {spoilerButton}
@@ -219,19 +219,20 @@ export default class Card extends PureComponent {
               <div className='status-card__actions'>
                 <div>
                   <button type='button' onClick={this.handleEmbedClick}><Icon id={iconVariant} /></button>
-                  {horizontal && <a href={card.get('url')} target='_blank' rel='noopener noreferrer'><Icon id='external-link' /></a>}
+                  <a href={card.get('url')} target='_blank' rel='noopener noreferrer'><Icon id='external-link' /></a>
                 </div>
               </div>
             )}
+
             {!revealed && spoilerButton}
           </div>
         );
       }
 
       return (
-        <div className={className} ref={this.setRef} onClick={revealed ? null : this.handleReveal} role={revealed ? 'button' : null}>
+        <div className='status-card' ref={this.setRef} onClick={revealed ? null : this.handleReveal} role={revealed ? 'button' : null}>
           {embed}
-          {!compact && description}
+          <a href={card.get('url')} target='_blank' rel='noopener noreferrer'>{description}</a>
         </div>
       );
     } else if (card.get('image')) {
@@ -243,14 +244,14 @@ export default class Card extends PureComponent {
       );
     } else {
       embed = (
-        <div className='status-card__image'>
+        <div className='status-card__image' style={{ aspectRatio: '1.9 / 1' }}>
           <Icon id='file-text' />
         </div>
       );
     }
 
     return (
-      <a href={card.get('url')} className={className} target='_blank' rel='noopener noreferrer' ref={this.setRef}>
+      <a href={card.get('url')} className='status-card' target='_blank' rel='noopener noreferrer' ref={this.setRef}>
         {embed}
         {description}
       </a>

app/javascript/mastodon/features/status/components/detailed_status.jsx

@@ -113,8 +113,30 @@ class DetailedStatus extends ImmutablePureComponent {
     onTranslate(status);
   };
 
+  _properStatus () {
+    const { status } = this.props;
+
+    if (status.get('reblog', null) !== null && typeof status.get('reblog') === 'object') {
+      return status.get('reblog');
+    } else {
+      return status;
+    }
+  }
+
+  getAttachmentAspectRatio () {
+    const attachments = this._properStatus().get('media_attachments');
+
+    if (attachments.getIn([0, 'type']) === 'video') {
+      return `${attachments.getIn([0, 'meta', 'original', 'width'])} / ${attachments.getIn([0, 'meta', 'original', 'height'])}`;
+    } else if (attachments.getIn([0, 'type']) === 'audio') {
+      return '16 / 9';
+    } else {
+      return (attachments.size === 1 && attachments.getIn([0, 'meta', 'small', 'aspect'])) ? attachments.getIn([0, 'meta', 'small', 'aspect']) : '3 / 2'
+    }
+  }
+
   render () {
-    const status = (this.props.status && this.props.status.get('reblog')) ? this.props.status.get('reblog') : this.props.status;
+    const status = this._properStatus();
     const outerStyle = { boxSizing: 'border-box' };
     const { intl, compact, pictureInPicture } = this.props;
 
@@ -136,7 +158,7 @@ class DetailedStatus extends ImmutablePureComponent {
     const language = status.getIn(['translation', 'language']) || status.get('language');
 
     if (pictureInPicture.get('inUse')) {
-      media = <PictureInPicturePlaceholder />;
+      media = <PictureInPicturePlaceholder aspectRatio={this.getAttachmentAspectRatio()} />;
     } else if (status.get('media_attachments').size > 0) {
       if (status.getIn(['media_attachments', 0, 'type']) === 'audio') {
         const attachment = status.getIn(['media_attachments', 0]);
@@ -167,13 +189,13 @@ class DetailedStatus extends ImmutablePureComponent {
           <Video
             preview={attachment.get('preview_url')}
             frameRate={attachment.getIn(['meta', 'original', 'frame_rate'])}
+            aspectRatio={`${attachment.getIn(['meta', 'original', 'width'])} / ${attachment.getIn(['meta', 'original', 'height'])}`}
             blurhash={attachment.get('blurhash')}
             src={attachment.get('url')}
             alt={description}
             lang={language}
             width={300}
             height={150}
-            inline
             onOpenVideo={this.handleOpenVideo}
             sensitive={status.get('sensitive')}
             visible={this.props.showMedia}

app/javascript/mastodon/features/status/containers/detailed_status_container.js

@@ -36,7 +36,7 @@ const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
   deleteMessage: { id: 'confirmations.delete.message', defaultMessage: 'Are you sure you want to delete this status?' },
   redraftConfirm: { id: 'confirmations.redraft.confirm', defaultMessage: 'Delete & redraft' },
-  redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favourites and boosts will be lost, and replies to the original post will be orphaned.' },
+  redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favorites and boosts will be lost, and replies to the original post will be orphaned.' },
   replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' },
   replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
 });

app/javascript/mastodon/features/status/index.jsx

@@ -72,7 +72,7 @@ const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
   deleteMessage: { id: 'confirmations.delete.message', defaultMessage: 'Are you sure you want to delete this status?' },
   redraftConfirm: { id: 'confirmations.redraft.confirm', defaultMessage: 'Delete & redraft' },
-  redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favourites and boosts will be lost, and replies to the original post will be orphaned.' },
+  redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favorites and boosts will be lost, and replies to the original post will be orphaned.' },
   revealAll: { id: 'status.show_more_all', defaultMessage: 'Show more for all' },
   hideAll: { id: 'status.show_less_all', defaultMessage: 'Show less for all' },
   statusTitleWithAttachments: { id: 'status.title.with_attachments', defaultMessage: '{user} posted {attachmentCount, plural, one {an attachment} other {# attachments}}' },
@@ -196,8 +196,8 @@ class Status extends ImmutablePureComponent {
     dispatch: PropTypes.func.isRequired,
     status: ImmutablePropTypes.map,
     isLoading: PropTypes.bool,
-    ancestorsIds: ImmutablePropTypes.list,
-    descendantsIds: ImmutablePropTypes.list,
+    ancestorsIds: ImmutablePropTypes.list.isRequired,
+    descendantsIds: ImmutablePropTypes.list.isRequired,
     intl: PropTypes.object.isRequired,
     askReplyConfirmation: PropTypes.bool,
     multiColumn: PropTypes.bool,
@@ -224,14 +224,9 @@ class Status extends ImmutablePureComponent {
 
   UNSAFE_componentWillReceiveProps (nextProps) {
     if (nextProps.params.statusId !== this.props.params.statusId && nextProps.params.statusId) {
-      this._scrolledIntoView = false;
       this.props.dispatch(fetchStatus(nextProps.params.statusId));
     }
 
-    if (nextProps.params.statusId && nextProps.ancestorsIds.size > this.props.ancestorsIds.size) {
-      this._scrolledIntoView = false;
-    }
-
     if (nextProps.status && nextProps.status.get('id') !== this.state.loadedStatusId) {
       this.setState({ showMedia: defaultMediaVisibility(nextProps.status), loadedStatusId: nextProps.status.get('id') });
     }
@@ -257,7 +252,7 @@ class Status extends ImmutablePureComponent {
         modalProps: {
           type: 'favourite',
           accountId: status.getIn(['account', 'id']),
-          url: status.get('url'),
+          url: status.get('uri'),
         },
       }));
     }
@@ -294,7 +289,7 @@ class Status extends ImmutablePureComponent {
         modalProps: {
           type: 'reply',
           accountId: status.getIn(['account', 'id']),
-          url: status.get('url'),
+          url: status.get('uri'),
         },
       }));
     }
@@ -324,7 +319,7 @@ class Status extends ImmutablePureComponent {
         modalProps: {
           type: 'reblog',
           accountId: status.getIn(['account', 'id']),
-          url: status.get('url'),
+          url: status.get('uri'),
         },
       }));
     }
@@ -584,20 +579,23 @@ class Status extends ImmutablePureComponent {
     this.node = c;
   };
 
-  componentDidUpdate () {
-    if (this._scrolledIntoView) {
-      return;
-    }
-
-    const { status, ancestorsIds } = this.props;
-
-    if (status && ancestorsIds && ancestorsIds.size > 0) {
-      const element = this.node.querySelectorAll('.focusable')[ancestorsIds.size - 1];
+  componentDidUpdate (prevProps) {
+    const { status, ancestorsIds, multiColumn } = this.props;
 
+    if (status && (ancestorsIds.size > prevProps.ancestorsIds.size || prevProps.status?.get('id') !== status.get('id'))) {
       window.requestAnimationFrame(() => {
-        element.scrollIntoView(true);
+        this.node?.querySelector('.detailed-status__wrapper')?.scrollIntoView(true);
+
+        // In the single-column interface, `scrollIntoView` will put the post behind the header,
+        // so compensate for that.
+        if (!multiColumn) {
+          const offset = document.querySelector('.column-header__wrapper')?.getBoundingClientRect()?.bottom;
+          if (offset) {
+            const scrollingElement = document.scrollingElement || document.body;
+            scrollingElement.scrollBy(0, -offset);
+          }
+        }
       });
-      this._scrolledIntoView = true;
     }
   }
 

app/javascript/mastodon/features/ui/components/media_modal.jsx

@@ -172,6 +172,7 @@ class MediaModal extends ImmutablePureComponent {
             width={image.get('width')}
             height={image.get('height')}
             frameRate={image.getIn(['meta', 'original', 'frame_rate'])}
+            aspectRatio={`${image.getIn(['meta', 'original', 'width'])} / ${image.getIn(['meta', 'original', 'height'])}`}
             currentTime={currentTime || 0}
             autoPlay={autoPlay || false}
             volume={volume || 1}

app/javascript/mastodon/features/ui/components/navigation_panel.jsx

@@ -23,7 +23,7 @@ const messages = defineMessages({
   explore: { id: 'explore.title', defaultMessage: 'Explore' },
   firehose: { id: 'column.firehose', defaultMessage: 'Live feeds' },
   direct: { id: 'navigation_bar.direct', defaultMessage: 'Private mentions' },
-  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favourites' },
+  favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favorites' },
   bookmarks: { id: 'navigation_bar.bookmarks', defaultMessage: 'Bookmarks' },
   lists: { id: 'navigation_bar.lists', defaultMessage: 'Lists' },
   preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },

app/javascript/mastodon/features/ui/components/sign_in_banner.jsx

@@ -35,7 +35,7 @@ const SignInBanner = () => {
 
   return (
     <div className='sign-in-banner'>
-      <p><FormattedMessage id='sign_in_banner.text' defaultMessage='Login to follow profiles or hashtags, favourite, share and reply to posts. You can also interact from your account on a different server.' /></p>
+      <p><FormattedMessage id='sign_in_banner.text' defaultMessage='Login to follow profiles or hashtags, favorite, share and reply to posts. You can also interact from your account on a different server.' /></p>
       {signupButton}
       <a href='/auth/sign_in' className='button button--block button-tertiary'><FormattedMessage id='sign_in_banner.sign_in' defaultMessage='Login' /></a>
     </div>

app/javascript/mastodon/features/ui/components/video_modal.jsx

@@ -49,6 +49,7 @@ class VideoModal extends ImmutablePureComponent {
           <Video
             preview={media.get('preview_url')}
             frameRate={media.getIn(['meta', 'original', 'frame_rate'])}
+            aspectRatio={`${media.getIn(['meta', 'original', 'width'])} / ${media.getIn(['meta', 'original', 'height'])}`}
             blurhash={media.get('blurhash')}
             src={media.get('url')}
             currentTime={options.startTime}

app/javascript/mastodon/features/ui/index.jsx

@@ -184,6 +184,7 @@ class SwitchingColumnsArea extends PureComponent {
 
           {singleColumn ? <Redirect from='/deck' to='/home' exact /> : null}
           {singleColumn && pathName.startsWith('/deck/') ? <Redirect from={pathName} to={pathName.slice(5)} /> : null}
+          {!singleColumn && pathName === '/getting-started' ? <Redirect from='/getting-started' to='/deck/getting-started' exact /> : null}
 
           <WrappedRoute path='/getting-started' component={GettingStarted} content={children} />
           <WrappedRoute path='/keyboard-shortcuts' component={KeyboardShortcuts} content={children} />

app/javascript/mastodon/features/video/index.jsx

@@ -105,6 +105,7 @@ class Video extends PureComponent {
   static propTypes = {
     preview: PropTypes.string,
     frameRate: PropTypes.string,
+    aspectRatio: PropTypes.string,
     src: PropTypes.string.isRequired,
     alt: PropTypes.string,
     lang: PropTypes.string,
@@ -113,7 +114,6 @@ class Video extends PureComponent {
     onOpenVideo: PropTypes.func,
     onCloseVideo: PropTypes.func,
     detailed: PropTypes.bool,
-    inline: PropTypes.bool,
     editable: PropTypes.bool,
     alwaysVisible: PropTypes.bool,
     visible: PropTypes.bool,
@@ -500,14 +500,9 @@ class Video extends PureComponent {
   }
 
   render () {
-    const { preview, src, inline, onOpenVideo, onCloseVideo, intl, alt, lang, detailed, sensitive, editable, blurhash, autoFocus } = this.props;
+    const { preview, src, aspectRatio, onOpenVideo, onCloseVideo, intl, alt, lang, detailed, sensitive, editable, blurhash, autoFocus } = this.props;
     const { currentTime, duration, volume, buffer, dragging, paused, fullscreen, hovered, muted, revealed } = this.state;
     const progress = Math.min((currentTime / duration) * 100, 100);
-    const playerStyle = {};
-
-    if (inline) {
-      playerStyle.aspectRatio = '16 / 9';
-    }
 
     let preload;
 
@@ -527,95 +522,101 @@ class Video extends PureComponent {
       warning = <FormattedMessage id='status.media_hidden' defaultMessage='Media hidden' />;
     }
 
+    // The outer wrapper is necessary to avoid reflowing the layout when going into full screen
     return (
-      <div
-        role='menuitem'
-        className={classNames('video-player', { inactive: !revealed, detailed, inline: inline && !fullscreen, fullscreen, editable })}
-        style={playerStyle}
-        ref={this.setPlayerRef}
-        onMouseEnter={this.handleMouseEnter}
-        onMouseLeave={this.handleMouseLeave}
-        onClick={this.handleClickRoot}
-        onKeyDown={this.handleKeyDown}
-        tabIndex={0}
-      >
-        <Blurhash
-          hash={blurhash}
-          className={classNames('media-gallery__preview', {
-            'media-gallery__preview--hidden': revealed,
-          })}
-          dummy={!useBlurhash}
-        />
-
-        {(revealed || editable) && <video
-          ref={this.setVideoRef}
-          src={src}
-          poster={preview}
-          preload={preload}
-          role='button'
+      <div style={{ aspectRatio }}>
+        <div
+          role='menuitem'
+          className={classNames('video-player', { inactive: !revealed, detailed, fullscreen, editable })}
+          style={{ aspectRatio }}
+          ref={this.setPlayerRef}
+          onMouseEnter={this.handleMouseEnter}
+          onMouseLeave={this.handleMouseLeave}
+          onClick={this.handleClickRoot}
+          onKeyDown={this.handleKeyDown}
           tabIndex={0}
-          aria-label={alt}
-          title={alt}
-          lang={lang}
-          volume={volume}
-          onClick={this.togglePlay}
-          onKeyDown={this.handleVideoKeyDown}
-          onPlay={this.handlePlay}
-          onPause={this.handlePause}
-          onLoadedData={this.handleLoadedData}
-          onProgress={this.handleProgress}
-          onVolumeChange={this.handleVolumeChange}
-          style={{ ...playerStyle, width: '100%' }}
-        />}
+        >
+          <Blurhash
+            hash={blurhash}
+            className={classNames('media-gallery__preview', {
+              'media-gallery__preview--hidden': revealed,
+            })}
+            dummy={!useBlurhash}
+          />
 
-        <div className={classNames('spoiler-button', { 'spoiler-button--hidden': revealed || editable })}>
-          <button type='button' className='spoiler-button__overlay' onClick={this.toggleReveal}>
-            <span className='spoiler-button__overlay__label'>{warning}</span>
-          </button>
-        </div>
+          {(revealed || editable) && <video
+            ref={this.setVideoRef}
+            src={src}
+            poster={preview}
+            preload={preload}
+            role='button'
+            tabIndex={0}
+            aria-label={alt}
+            title={alt}
+            lang={lang}
+            volume={volume}
+            onClick={this.togglePlay}
+            onKeyDown={this.handleVideoKeyDown}
+            onPlay={this.handlePlay}
+            onPause={this.handlePause}
+            onLoadedData={this.handleLoadedData}
+            onProgress={this.handleProgress}
+            onVolumeChange={this.handleVolumeChange}
+            style={{ width: '100%' }}
+          />}
 
-        <div className={classNames('video-player__controls', { active: paused || hovered })}>
-          <div className='video-player__seek' onMouseDown={this.handleMouseDown} ref={this.setSeekRef}>
-            <div className='video-player__seek__buffer' style={{ width: `${buffer}%` }} />
-            <div className='video-player__seek__progress' style={{ width: `${progress}%` }} />
-
-            <span
-              className={classNames('video-player__seek__handle', { active: dragging })}
-              tabIndex={0}
-              style={{ left: `${progress}%` }}
-              onKeyDown={this.handleVideoKeyDown}
-            />
+          <div className={classNames('spoiler-button', { 'spoiler-button--hidden': revealed || editable })}>
+            <button type='button' className='spoiler-button__overlay' onClick={this.toggleReveal}>
+              <span className='spoiler-button__overlay__label'>
+                {warning}
+                <span className='spoiler-button__overlay__action'><FormattedMessage id='status.media.show' defaultMessage='Click to show' /></span>
+              </span>
+            </button>
           </div>
 
-          <div className='video-player__buttons-bar'>
-            <div className='video-player__buttons left'>
-              <button type='button' title={intl.formatMessage(paused ? messages.play : messages.pause)} aria-label={intl.formatMessage(paused ? messages.play : messages.pause)} className='player-button' onClick={this.togglePlay} autoFocus={autoFocus}><Icon id={paused ? 'play' : 'pause'} fixedWidth /></button>
-              <button type='button' title={intl.formatMessage(muted ? messages.unmute : messages.mute)} aria-label={intl.formatMessage(muted ? messages.unmute : messages.mute)} className='player-button' onClick={this.toggleMute}><Icon id={muted ? 'volume-off' : 'volume-up'} fixedWidth /></button>
+          <div className={classNames('video-player__controls', { active: paused || hovered })}>
+            <div className='video-player__seek' onMouseDown={this.handleMouseDown} ref={this.setSeekRef}>
+              <div className='video-player__seek__buffer' style={{ width: `${buffer}%` }} />
+              <div className='video-player__seek__progress' style={{ width: `${progress}%` }} />
 
-              <div className={classNames('video-player__volume', { active: this.state.hovered })} onMouseDown={this.handleVolumeMouseDown} ref={this.setVolumeRef}>
-                <div className='video-player__volume__current' style={{ width: `${volume * 100}%` }} />
-
-                <span
-                  className={classNames('video-player__volume__handle')}
-                  tabIndex={0}
-                  style={{ left: `${volume * 100}%` }}
-                />
-              </div>
-
-              {(detailed || fullscreen) && (
-                <span className='video-player__time'>
-                  <span className='video-player__time-current'>{formatTime(Math.floor(currentTime))}</span>
-                  <span className='video-player__time-sep'>/</span>
-                  <span className='video-player__time-total'>{formatTime(Math.floor(duration))}</span>
-                </span>
-              )}
+              <span
+                className={classNames('video-player__seek__handle', { active: dragging })}
+                tabIndex={0}
+                style={{ left: `${progress}%` }}
+                onKeyDown={this.handleVideoKeyDown}
+              />
             </div>
 
-            <div className='video-player__buttons right'>
-              {(!onCloseVideo && !editable && !fullscreen && !this.props.alwaysVisible) && <button type='button' title={intl.formatMessage(messages.hide)} aria-label={intl.formatMessage(messages.hide)} className='player-button' onClick={this.toggleReveal}><Icon id='eye-slash' fixedWidth /></button>}
-              {(!fullscreen && onOpenVideo) && <button type='button' title={intl.formatMessage(messages.expand)} aria-label={intl.formatMessage(messages.expand)} className='player-button' onClick={this.handleOpenVideo}><Icon id='expand' fixedWidth /></button>}
-              {onCloseVideo && <button type='button' title={intl.formatMessage(messages.close)} aria-label={intl.formatMessage(messages.close)} className='player-button' onClick={this.handleCloseVideo}><Icon id='compress' fixedWidth /></button>}
-              <button type='button' title={intl.formatMessage(fullscreen ? messages.exit_fullscreen : messages.fullscreen)} aria-label={intl.formatMessage(fullscreen ? messages.exit_fullscreen : messages.fullscreen)} className='player-button' onClick={this.toggleFullscreen}><Icon id={fullscreen ? 'compress' : 'arrows-alt'} fixedWidth /></button>
+            <div className='video-player__buttons-bar'>
+              <div className='video-player__buttons left'>
+                <button type='button' title={intl.formatMessage(paused ? messages.play : messages.pause)} aria-label={intl.formatMessage(paused ? messages.play : messages.pause)} className='player-button' onClick={this.togglePlay} autoFocus={autoFocus}><Icon id={paused ? 'play' : 'pause'} fixedWidth /></button>
+                <button type='button' title={intl.formatMessage(muted ? messages.unmute : messages.mute)} aria-label={intl.formatMessage(muted ? messages.unmute : messages.mute)} className='player-button' onClick={this.toggleMute}><Icon id={muted ? 'volume-off' : 'volume-up'} fixedWidth /></button>
+
+                <div className={classNames('video-player__volume', { active: this.state.hovered })} onMouseDown={this.handleVolumeMouseDown} ref={this.setVolumeRef}>
+                  <div className='video-player__volume__current' style={{ width: `${volume * 100}%` }} />
+
+                  <span
+                    className={classNames('video-player__volume__handle')}
+                    tabIndex={0}
+                    style={{ left: `${volume * 100}%` }}
+                  />
+                </div>
+
+                {(detailed || fullscreen) && (
+                  <span className='video-player__time'>
+                    <span className='video-player__time-current'>{formatTime(Math.floor(currentTime))}</span>
+                    <span className='video-player__time-sep'>/</span>
+                    <span className='video-player__time-total'>{formatTime(Math.floor(duration))}</span>
+                  </span>
+                )}
+              </div>
+
+              <div className='video-player__buttons right'>
+                {(!onCloseVideo && !editable && !fullscreen && !this.props.alwaysVisible) && <button type='button' title={intl.formatMessage(messages.hide)} aria-label={intl.formatMessage(messages.hide)} className='player-button' onClick={this.toggleReveal}><Icon id='eye-slash' fixedWidth /></button>}
+                {(!fullscreen && onOpenVideo) && <button type='button' title={intl.formatMessage(messages.expand)} aria-label={intl.formatMessage(messages.expand)} className='player-button' onClick={this.handleOpenVideo}><Icon id='expand' fixedWidth /></button>}
+                {onCloseVideo && <button type='button' title={intl.formatMessage(messages.close)} aria-label={intl.formatMessage(messages.close)} className='player-button' onClick={this.handleCloseVideo}><Icon id='compress' fixedWidth /></button>}
+                <button type='button' title={intl.formatMessage(fullscreen ? messages.exit_fullscreen : messages.fullscreen)} aria-label={intl.formatMessage(fullscreen ? messages.exit_fullscreen : messages.fullscreen)} className='player-button' onClick={this.toggleFullscreen}><Icon id={fullscreen ? 'compress' : 'arrows-alt'} fixedWidth /></button>
+              </div>
             </div>
           </div>
         </div>

app/javascript/mastodon/initial_state.js

@@ -51,7 +51,6 @@
  * @property {boolean} activity_api_enabled
  * @property {string} admin
  * @property {boolean=} boost_modal
- * @property {boolean} crop_images
  * @property {boolean=} delete_modal
  * @property {boolean=} disable_swiping
  * @property {string=} disabled_account_id
@@ -112,7 +111,6 @@ const getMeta = (prop) => initialState?.meta && initialState.meta[prop];
 export const activityApiEnabled = getMeta('activity_api_enabled');
 export const autoPlayGif = getMeta('auto_play_gif');
 export const boostModal = getMeta('boost_modal');
-export const cropImages = getMeta('crop_images');
 export const deleteModal = getMeta('delete_modal');
 export const disableSwiping = getMeta('disable_swiping');
 export const disabledAccountId = getMeta('disabled_account_id');

app/javascript/mastodon/locales/af.json

@@ -82,7 +82,6 @@
   "column.community": "Plaaslike tydlyn",
   "column.directory": "Blaai deur profiele",
   "column.domain_blocks": "Geblokkeerde domeine",
-  "column.favourites": "Gunstelinge",
   "column.follow_requests": "Volgversoeke",
   "column.home": "Tuis",
   "column.lists": "Lyste",
@@ -136,7 +135,6 @@
   "confirmations.domain_block.confirm": "Blokkeer die hele domein",
   "confirmations.logout.confirm": "Teken Uit",
   "confirmations.logout.message": "Is jy seker jy wil uitteken?",
-  "confirmations.redraft.message": "Is jy seker jy wil hierdie plasing uitvee en oorbegin? Goedkeurings en aangestuurde plasings gaan verdwyn en antwoorde op jou oorspronklike plasing gaan wees gelaat word.",
   "confirmations.reply.confirm": "Antwoord",
   "conversation.mark_as_read": "Merk as gelees",
   "conversation.open": "Sien gesprek",
@@ -146,7 +144,6 @@
   "disabled_account_banner.account_settings": "Rekeninginstellings",
   "disabled_account_banner.text": "Jou rekening {disabledAccount} is tans gedeaktiveer.",
   "dismissable_banner.explore_links": "These news stories are being talked about by people on this and other servers of the decentralized network right now.",
-  "dismissable_banner.explore_statuses": "These posts from this and other servers in the decentralized network are gaining traction on this server right now.",
   "dismissable_banner.explore_tags": "These hashtags are gaining traction among people on this and other servers of the decentralized network right now.",
   "embed.instructions": "Bed hierdie plasing op jou webblad in met die kode wat jy hier onder kan kopieer.",
   "embed.preview": "Dit sal so lyk:",
@@ -162,8 +159,6 @@
   "empty_column.account_timeline": "Geen plasings hier nie!",
   "empty_column.bookmarked_statuses": "Jy het nog geen boekmerke gelaat nie. Boekmerke wat jy by plasings laat, sal jy hier sien.",
   "empty_column.community": "Die plaaslike tydlyn is leeg. Kry die bal aan die rol deur iets te skryf wat mense kan lees!",
-  "empty_column.favourited_statuses": "Jy het nog geen gunstelingplasings nie. As jy een as gunsteling merk, sal jy dit hier sien.",
-  "empty_column.favourites": "Hierdie plasing het nog nie goedkeurings ontvang nie. As iemand dit as gunsteling merk, sien jy dit hier.",
   "empty_column.follow_requests": "Jy het nog geen volgversoeke nie. Wanneer jy een ontvang, sal dit hier vertoon.",
   "empty_column.hashtag": "Daar is nog niks vir hierdie hutsetiket nie.",
   "empty_column.home": "Your home timeline is empty! Follow more people to fill it up. {suggestions}",
@@ -198,8 +193,6 @@
   "keyboard_shortcuts.direct": "to open direct messages column",
   "keyboard_shortcuts.down": "Gaan afwaarts in die lys",
   "keyboard_shortcuts.enter": "Sien plasing",
-  "keyboard_shortcuts.favourite": "Gunsteling",
-  "keyboard_shortcuts.favourites": "Sien gunstelinge",
   "keyboard_shortcuts.federated": "Sien gefedereerde stroom",
   "keyboard_shortcuts.heading": "Keyboard Shortcuts",
   "keyboard_shortcuts.home": "Sien tuisvoer",
@@ -240,7 +233,6 @@
   "navigation_bar.compose": "Skep nuwe plasing",
   "navigation_bar.domain_blocks": "Geblokkeerde domeine",
   "navigation_bar.edit_profile": "Redigeer profiel",
-  "navigation_bar.favourites": "Gunstelinge",
   "navigation_bar.lists": "Lyste",
   "navigation_bar.logout": "Teken uit",
   "navigation_bar.personal": "Persoonlik",
@@ -249,15 +241,12 @@
   "navigation_bar.public_timeline": "Gefedereerde tydlyn",
   "navigation_bar.search": "Soek",
   "not_signed_in_indicator.not_signed_in": "You need to sign in to access this resource.",
-  "notification.favourite": "{name} hou van jou plasing",
   "notification.reblog": "{name} het jou plasing aangestuur",
-  "notifications.column_settings.favourite": "Gunstelinge:",
   "notifications.column_settings.push": "Stootkennisgewings",
   "notifications.column_settings.reblog": "Aangestuurde plasings:",
   "notifications.column_settings.status": "Nuwe plasings:",
   "notifications.column_settings.unread_notifications.highlight": "Lig ongelese kennisgewings uit",
   "notifications.filter.boosts": "Aangestuurde plasings",
-  "notifications.filter.favourites": "Gunstelinge",
   "notifications.group": "{count} kennisgewings",
   "onboarding.actions.go_to_explore": "See what's trending",
   "onboarding.actions.go_to_home": "Go to your home feed",
@@ -299,7 +288,6 @@
   "search_results.total": "{count, number} {count, plural, one {resultaat} other {resultate}}",
   "server_banner.administered_by": "Administrasie deur:",
   "sign_in_banner.sign_in": "Sign in",
-  "sign_in_banner.text": "Sign in to follow profiles or hashtags, favourite, share and reply to posts. You can also interact from your account on a different server.",
   "status.admin_status": "Open hierdie plasing as moderator",
   "status.cancel_reblog_private": "Maak aanstuur ongedaan",
   "status.cannot_reblog": "Hierdie plasing kan nie aangestuur word nie",

app/javascript/mastodon/locales/an.json

@@ -17,7 +17,6 @@
   "account.badges.group": "Grupo",
   "account.block": "Blocar a @{name}",
   "account.block_domain": "Blocar dominio {domain}",
-  "account.block_short": "Blocar",
   "account.blocked": "Blocau",
   "account.browse_more_on_origin_server": "Veyer mas en o perfil orichinal",
   "account.cancel_follow_request": "Retirar solicitut de seguimiento",
@@ -102,7 +101,6 @@
   "column.community": "Linia de tiempo local",
   "column.directory": "Buscar perfils",
   "column.domain_blocks": "Dominios amagaus",
-  "column.favourites": "Favoritos",
   "column.follow_requests": "Solicitutz de seguimiento",
   "column.home": "Inicio",
   "column.lists": "Listas",
@@ -165,7 +163,6 @@
   "confirmations.mute.explanation": "Esto amagará las publicacions d'ells y en as qualas los has mencionau, pero les permitirá veyer los tuyos mensaches y seguir-te.",
   "confirmations.mute.message": "Yes seguro que quiers silenciar a {name}?",
   "confirmations.redraft.confirm": "Borrar y tornar ta borrador",
-  "confirmations.redraft.message": "Yes seguro que quiers eliminar esta publicación y convertir-la en borrador? Perderás totas las respuestas, retutz y favoritos asociaus a ell, y las respuestas a la publicación orichinal quedarán uerfanas.",
   "confirmations.reply.confirm": "Responder",
   "confirmations.reply.message": "Responder sobrescribirá lo mensache que yes escribindo. Yes seguro que deseyas continar?",
   "confirmations.unfollow.confirm": "Deixar de seguir",
@@ -185,7 +182,6 @@
   "dismissable_banner.community_timeline": "Estas son las publicacions publicas mas recients de personas que las suyas cuentas son alochadas en {domain}.",
   "dismissable_banner.dismiss": "Descartar",
   "dismissable_banner.explore_links": "Estas noticias son estando discutidas per personas en este y atros servidors d'o ret descentralizau en este momento.",
-  "dismissable_banner.explore_statuses": "Estas publicacions d'este y atros servidors en o ret descentralizau son ganando popularidat en este servidor en este momento.",
   "dismissable_banner.explore_tags": "Estas tendencias son ganando popularidat entre la chent en este y atros servidors d'o ret descentralizau en este momento.",
   "embed.instructions": "Anyade esta publicación a lo tuyo puesto web con o siguient codigo.",
   "embed.preview": "Asinas ye como se veyerá:",
@@ -212,8 +208,6 @@
   "empty_column.community": "La linia de tiempo local ye vueda. Escribe bella cosa pa empecipiar la fiesta!",
   "empty_column.domain_blocks": "Encara no i hai dominios amagaus.",
   "empty_column.explore_statuses": "Cosa ye en tendencia en este momento. Revisa mas tarde!",
-  "empty_column.favourited_statuses": "Encara no tiens publicacions favoritas. Quan marques una como favorita, amaneixerá aquí.",
-  "empty_column.favourites": "Dengún ha marcau esta publicación como favorita. Quan belún lo faiga, amaneixerá aquí.",
   "empty_column.follow_requests": "No tiens garra petición de seguidor. Quan recibas una, s'amostrará aquí.",
   "empty_column.hashtag": "No i hai cosa en este hashtag encara.",
   "empty_column.home": "La tuya linia temporal ye vueda! Sigue a mas personas pa replenar-la. {suggestions}",
@@ -277,15 +271,12 @@
   "home.column_settings.show_replies": "Amostrar respuestas",
   "home.hide_announcements": "Amagar anuncios",
   "home.show_announcements": "Amostrar anuncios",
-  "interaction_modal.description.favourite": "Con una cuenta en Mastodon, puetz marcar como favorita esta publicación pa que l'autor saba que te fa goyo y alzar-la asinas pa mas abance.",
   "interaction_modal.description.follow": "Con una cuenta en Mastodon, puetz seguir {name} pa recibir las suyas publicacions en a tuya linia temporal d'inicio.",
   "interaction_modal.description.reblog": "Con una cuenta en Mastodon, puetz empentar esta publicación pa compartir-la con os tuyos propios seguidores.",
   "interaction_modal.description.reply": "Con una cuenta en Mastodon, puetz responder a esta publicación.",
   "interaction_modal.on_another_server": "En un servidor diferent",
   "interaction_modal.on_this_server": "En este servidor",
-  "interaction_modal.other_server_instructions": "Copia y apega esta URL en a barra de busqueda d'a tuya aplicación Mastodon favorita u la interficie web d'o tuyo servidor Mastodon.",
   "interaction_modal.preamble": "Ya que Mastodon ye descentralizau, puetz usar la tuya cuenta existent alochada en unatro servidor Mastodon u plataforma compatible si no tiens una cuenta en este servidor.",
-  "interaction_modal.title.favourite": "Marcar como favorita la publicación de {name}",
   "interaction_modal.title.follow": "Seguir a {name}",
   "interaction_modal.title.reblog": "Empentar la publicación de {name}",
   "interaction_modal.title.reply": "Responder a la publicación de {name}",
@@ -301,8 +292,6 @@
   "keyboard_shortcuts.direct": "to open direct messages column",
   "keyboard_shortcuts.down": "Mover enta baixo en a lista",
   "keyboard_shortcuts.enter": "Ubrir estau",
-  "keyboard_shortcuts.favourite": "Anyadir en favoritos",
-  "keyboard_shortcuts.favourites": "Ubrir la lista de favoritos",
   "keyboard_shortcuts.federated": "Ubrir la linia de tiempo federada",
   "keyboard_shortcuts.heading": "Keyboard Shortcuts",
   "keyboard_shortcuts.home": "Ubrir linia de tiempo",
@@ -362,7 +351,6 @@
   "navigation_bar.domain_blocks": "Dominios amagaus",
   "navigation_bar.edit_profile": "Editar perfil",
   "navigation_bar.explore": "Explorar",
-  "navigation_bar.favourites": "Favoritos",
   "navigation_bar.filters": "Parolas silenciadas",
   "navigation_bar.follow_requests": "Solicitutz pa seguir-te",
   "navigation_bar.follows_and_followers": "Seguindo y seguidores",
@@ -378,7 +366,6 @@
   "not_signed_in_indicator.not_signed_in": "Amenestes iniciar sesión pa acceder ta este recurso.",
   "notification.admin.report": "{name} informó {target}",
   "notification.admin.sign_up": "{name} se rechistró",
-  "notification.favourite": "{name} marcó lo tuyo estau como favorito",
   "notification.follow": "{name} t'empecipió a seguir",
   "notification.follow_request": "{name} ha solicitau seguir-te",
   "notification.mention": "{name} t'ha mencionau",
@@ -392,7 +379,6 @@
   "notifications.column_settings.admin.report": "Nuevos informes:",
   "notifications.column_settings.admin.sign_up": "Nuevos rechistros:",
   "notifications.column_settings.alert": "Notificacions d'escritorio",
-  "notifications.column_settings.favourite": "Favoritos:",
   "notifications.column_settings.filter_bar.advanced": "Amostrar totas las categorías",
   "notifications.column_settings.filter_bar.category": "Barra de filtrau rapido",
   "notifications.column_settings.filter_bar.show_bar": "Amostrar barra de filtros",
@@ -410,7 +396,6 @@
   "notifications.column_settings.update": "Edicions:",
   "notifications.filter.all": "Totz",
   "notifications.filter.boosts": "Retutz",
-  "notifications.filter.favourites": "Favoritos",
   "notifications.filter.follows": "Seguidores",
   "notifications.filter.mentions": "Mencions",
   "notifications.filter.polls": "Resultaus d'a votación",
@@ -532,7 +517,6 @@
   "server_banner.server_stats": "Estatisticas d'o servidor:",
   "sign_in_banner.create_account": "Creyar cuenta",
   "sign_in_banner.sign_in": "Iniciar sesión",
-  "sign_in_banner.text": "Sign in to follow profiles or hashtags, favourite, share and reply to posts. You can also interact from your account on a different server.",
   "status.admin_account": "Ubrir interficie de moderación pa @{name}",
   "status.admin_domain": "Ubrir interficie de moderación pa {domain}",
   "status.admin_status": "Ubrir este estau en a interficie de moderación",
@@ -547,7 +531,6 @@
   "status.edited": "Editau {date}",
   "status.edited_x_times": "Editau {count, plural, one {{count} vez} other {{count} veces}}",
   "status.embed": "Incrustado",
-  "status.favourite": "Favorito",
   "status.filter": "Filtrar esta publicación",
   "status.filtered": "Filtrau",
   "status.hide": "Amagar la publicación",

app/javascript/mastodon/locales/ar.json

@@ -113,7 +113,7 @@
   "column.direct": "الإشارات الخاصة",
   "column.directory": "تَصَفُّحُ المَلفات الشخصية",
   "column.domain_blocks": "النطاقات المحظورة",
-  "column.favourites": "المُفَضَّلَة",
+  "column.favourites": "Favorites",
   "column.firehose": "التغذيات المباشرة",
   "column.follow_requests": "طلبات المتابعة",
   "column.home": "الرئيسية",
@@ -181,7 +181,6 @@
   "confirmations.mute.explanation": "هذا سيخفي المنشورات عنهم وتلك المشار فيها إليهم، لكنه سيسمح لهم برؤية منشوراتك ومتابعتك.",
   "confirmations.mute.message": "هل أنت متأكد أنك تريد كتم {name} ؟",
   "confirmations.redraft.confirm": "إزالة وإعادة الصياغة",
-  "confirmations.redraft.message": "هل أنت متأكد من أنك تريد حذف هذا المنشور و إعادة صياغته؟ سوف تفقد جميع الإعجابات و الترقيات أما الردود المتصلة به فستُصبِح يتيمة.",
   "confirmations.reply.confirm": "رد",
   "confirmations.reply.message": "الرد في الحين سوف يُعيد كتابة الرسالة التي أنت بصدد كتابتها. متأكد من أنك تريد المواصلة؟",
   "confirmations.unfollow.confirm": "إلغاء المتابعة",
@@ -202,7 +201,6 @@
   "dismissable_banner.community_timeline": "هذه هي أحدث المشاركات العامة من الأشخاص الذين تُستضاف حساباتهم على {domain}.",
   "dismissable_banner.dismiss": "رفض",
   "dismissable_banner.explore_links": "هذه القصص الإخبارية يتحدث عنها حاليًا أشخاص على هذا الخادم وكذا على الخوادم الأخرى للشبكة اللامركزية.",
-  "dismissable_banner.explore_statuses": "هذه المنشورات مِن هذا الخادم ومِن الخوادم الأخرى في الشبكة اللامركزية تجذب انتباه المستخدمين على هذا الخادم الآن.",
   "dismissable_banner.explore_tags": "هذه الوسوم تكتسب جذب اهتمام الناس حاليًا على هذا الخادم وكذا على الخوادم الأخرى للشبكة اللامركزية.",
   "dismissable_banner.public_timeline": "هذه هي أحدث المنشورات العامة من الناس على الشبكة الاجتماعية التي يتبعها الناس على {domain}.",
   "embed.instructions": "يمكنكم إدماج هذا المنشور على موقعكم الإلكتروني عن طريق نسخ الشفرة أدناه.",
@@ -231,8 +229,6 @@
   "empty_column.direct": "لم يتم الإشارة إليك بشكل خاص بعد. عندما تتلقى أو ترسل إشارة، سيتم عرضها هنا.",
   "empty_column.domain_blocks": "ليس هناك نطاقات تم حجبها بعد.",
   "empty_column.explore_statuses": "ليس هناك ما هو متداوَل الآن. عد في وقت لاحق!",
-  "empty_column.favourited_statuses": "ليس لديك أية منشورات مفضلة بعد. عندما ستقوم بالإعجاب بواحدة، ستظهر هنا.",
-  "empty_column.favourites": "لم يقم أي أحد بالإعجاب بهذا المنشور بعد. عندما يقوم أحدهم بذلك سوف يظهر هنا.",
   "empty_column.follow_requests": "ليس عندك أي طلب للمتابعة بعد. سوف تظهر طلباتك هنا إن قمت بتلقي البعض منها.",
   "empty_column.followed_tags": "لم تُتابع أي وسم بعدُ. ستظهر الوسوم هنا حينما تفعل ذلك.",
   "empty_column.hashtag": "ليس هناك بعدُ أي محتوى ذو علاقة بهذا الوسم.",
@@ -307,15 +303,12 @@
   "home.explore_prompt.title": "هذا مقرك الرئيسي داخل ماستدون.",
   "home.hide_announcements": "إخفاء الإعلانات",
   "home.show_announcements": "إظهار الإعلانات",
-  "interaction_modal.description.favourite": "مع حساب في ماستدون، يمكنك إضافة هذا المنشور إلى مفضلتك لإبلاغ الناشر عن تقديرك وكذا للاحتفاظ به لوقت لاحق.",
   "interaction_modal.description.follow": "مع حساب في ماستدون، يمكنك متابعة {name} وتلقي منشوراته على خيطك الرئيس.",
   "interaction_modal.description.reblog": "مع حساب في ماستدون، يمكنك تعزيز هذا المنشور ومشاركته مع مُتابِعيك.",
   "interaction_modal.description.reply": "مع حساب في ماستدون، يمكنك الرد على هذا المنشور.",
   "interaction_modal.on_another_server": "على خادم مختلف",
   "interaction_modal.on_this_server": "على هذا الخادم",
-  "interaction_modal.other_server_instructions": "انسخ و الصق هذا الرابط في حقل البحث الخاص بك لتطبيق ماستدون المفضل لديك أو واجهة الويب لخادم ماستدون الخاص بك.",
   "interaction_modal.preamble": "بما إن ماستدون لامركزي، يمكنك استخدام حسابك الحالي المستضاف بواسطة خادم ماستدون آخر أو منصة متوافقة إذا لم يكن لديك حساب هنا.",
-  "interaction_modal.title.favourite": "الإعجاب بمنشور {name}",
   "interaction_modal.title.follow": "اتبع {name}",
   "interaction_modal.title.reblog": "مشاركة منشور {name}",
   "interaction_modal.title.reply": "الرد على منشور {name}",
@@ -331,8 +324,6 @@
   "keyboard_shortcuts.direct": "to open direct messages column",
   "keyboard_shortcuts.down": "للانتقال إلى أسفل القائمة",
   "keyboard_shortcuts.enter": "لفتح المنشور",
-  "keyboard_shortcuts.favourite": "للإضافة إلى المفضلة",
-  "keyboard_shortcuts.favourites": "لفتح قائمة المفضلات",
   "keyboard_shortcuts.federated": "لفتح الخيط الزمني الفديرالي",
   "keyboard_shortcuts.heading": "Keyboard Shortcuts",
   "keyboard_shortcuts.home": "لفتح الخيط الرئيسي",
@@ -394,7 +385,6 @@
   "navigation_bar.domain_blocks": "النطاقات المحظورة",
   "navigation_bar.edit_profile": "عدّل الملف التعريفي",
   "navigation_bar.explore": "استكشف",
-  "navigation_bar.favourites": "المفضلة",
   "navigation_bar.filters": "الكلمات المكتومة",
   "navigation_bar.follow_requests": "طلبات المتابعة",
   "navigation_bar.followed_tags": "الوسوم المتابَعة",
@@ -411,7 +401,6 @@
   "not_signed_in_indicator.not_signed_in": "تحتاج إلى تسجيل الدخول للوصول إلى هذا المصدر.",
   "notification.admin.report": "{name} أبلغ عن {target}",
   "notification.admin.sign_up": "أنشأ {name} حسابًا",
-  "notification.favourite": "أُعجِب {name} بمنشورك",
   "notification.follow": "{name} يتابعك",
   "notification.follow_request": "لقد طلب {name} متابعتك",
   "notification.mention": "{name} ذكرك",
@@ -425,7 +414,6 @@
   "notifications.column_settings.admin.report": "التقارير الجديدة:",
   "notifications.column_settings.admin.sign_up": "التسجيلات الجديدة:",
   "notifications.column_settings.alert": "إشعارات سطح المكتب",
-  "notifications.column_settings.favourite": "المُفَضَّلة:",
   "notifications.column_settings.filter_bar.advanced": "اعرض كافة الفئات",
   "notifications.column_settings.filter_bar.category": "شريط الفلترة السريعة",
   "notifications.column_settings.filter_bar.show_bar": "إظهار شريط التصفية",
@@ -443,7 +431,6 @@
   "notifications.column_settings.update": "التعديلات:",
   "notifications.filter.all": "الكل",
   "notifications.filter.boosts": "الترقيات",
-  "notifications.filter.favourites": "المفضلة",
   "notifications.filter.follows": "يتابِع",
   "notifications.filter.mentions": "الإشارات",
   "notifications.filter.polls": "نتائج استطلاع الرأي",
@@ -594,7 +581,6 @@
   "server_banner.server_stats": "إحصائيات الخادم:",
   "sign_in_banner.create_account": "أنشئ حسابًا",
   "sign_in_banner.sign_in": "تسجيل الدخول",
-  "sign_in_banner.text": "قم بالولوج بحسابك لمتابعة الصفحات الشخصية أو الوسوم، أو لإضافة الرسائل إلى المفضلة ومشاركتها والرد عليها أو التفاعل بواسطة حسابك المتواجد على خادم مختلف.",
   "status.admin_account": "افتح الواجهة الإدارية لـ @{name}",
   "status.admin_domain": "فتح واجهة الإشراف لـ {domain}",
   "status.admin_status": "افتح هذا المنشور على واجهة الإشراف",
@@ -611,7 +597,6 @@
   "status.edited": "عُدّل في {date}",
   "status.edited_x_times": "عُدّل {count, plural, zero {} one {مرةً واحدة} two {مرّتان} few {{count} مرات} many {{count} مرة} other {{count} مرة}}",
   "status.embed": "إدماج",
-  "status.favourite": "أضف إلى المفضلة",
   "status.filter": "تصفية هذه الرسالة",
   "status.filtered": "مُصفّى",
   "status.hide": "إخفاء المنشور",

app/javascript/mastodon/locales/ast.json

@@ -80,7 +80,6 @@
   "column.community": "Llinia de tiempu llocal",
   "column.direct": "Menciones privaes",
   "column.domain_blocks": "Dominios bloquiaos",
-  "column.favourites": "Favoritos",
   "column.follow_requests": "Solicitúes de siguimientu",
   "column.home": "Aniciu",
   "column.lists": "Llistes",
@@ -141,7 +140,6 @@
   "directory.recently_active": "Con actividá recién",
   "dismissable_banner.community_timeline": "Esta seición contién los artículos públicos más actuales de los perfiles agospiaos nel dominiu {domain}.",
   "dismissable_banner.dismiss": "Escartar",
-  "dismissable_banner.explore_statuses": "Esta seición contién los artículos del fediversu que tán ganando popularidá güei. Los artículos nuevos que más se compartan ya s'amiesten a Favoritos apaecen no cimero.",
   "dismissable_banner.explore_tags": "Esta seición contién les etiquetes del fediversu que tán ganando popularidá güei. Les etiquetes más usaes polos perfiles apaecen no cimero.",
   "embed.instructions": "Empotra esti artículu nel to sitiu web pente la copia del códigu d'abaxo.",
   "embed.preview": "Va apaecer asina:",
@@ -163,8 +161,6 @@
   "empty_column.direct": "Nun tienes nenguna mención privada. Cuando unvies o recibas dalguna, apaez equí.",
   "empty_column.domain_blocks": "Nun hai nengún dominiu bloquiáu.",
   "empty_column.explore_statuses": "Agora nun hai nada en tendencia. ¡Volvi equí dempués!",
-  "empty_column.favourited_statuses": "Nun marquesti nengún artículu como favoritu. Cuando marques dalgún, apaez equí.",
-  "empty_column.favourites": "Naide marcó esti artículu como favoritu. Cuando dalgún perfil lo faiga, apaez equí.",
   "empty_column.follow_requests": "Nun tienes nenguna solicitú de siguimientu. Cuando recibas dalguna, apaez equí.",
   "empty_column.hashtag": "Entá nun hai nada con esta etiqueta.",
   "empty_column.home": "¡La to llinia de tiempu ta balera! Sigui a cuentes pa enllenala.",
@@ -222,13 +218,11 @@
   "home.column_settings.basic": "Configuración básica",
   "home.column_settings.show_reblogs": "Amosar los artículos compartíos",
   "home.column_settings.show_replies": "Amosar les rempuestes",
-  "interaction_modal.description.favourite": "Con una cuenta de Mastodon pues marcar esti artículu como favoritu ya avisar al autor/a de que te presta ya que lu guardes pa dempués.",
   "interaction_modal.description.follow": "Con una cuenta de Mastodon, pues siguir a {name} pa recibir los artículos de so nel to feed d'aniciu.",
   "interaction_modal.description.reblog": "Con una cuenta de Mastodon, pues compartir esti artículu colos perfiles que te sigan.",
   "interaction_modal.description.reply": "Con una cuenta de Mastodon, pues responder a esti artículu.",
   "interaction_modal.on_another_server": "N'otru sirvidor",
   "interaction_modal.on_this_server": "Nesti sirvidor",
-  "interaction_modal.other_server_instructions": "Copia ya apiega esta URL nel campu de busca de la to aplicación favorita de Mastodon o na interfaz web de dalgún sirvidor de Mastodon.",
   "interaction_modal.preamble": "Darréu que Mastodon ye una rede social descentralizada, pues usar una cuenta agospiada n'otru sirvidor de Mastodon o n'otra plataforma compatible si nun tienes cuenta nesti sirvidor.",
   "interaction_modal.title.reply": "Rempuesta al artículu de: {name}",
   "intervals.full.days": "{number, plural, one {# día} other {# díes}}",
@@ -243,8 +237,6 @@
   "keyboard_shortcuts.direct": "p'abrir la columna de les menciones privaes",
   "keyboard_shortcuts.down": "Baxar na llista",
   "keyboard_shortcuts.enter": "Abrir un artículu",
-  "keyboard_shortcuts.favourite": "Marcar un artículu como favoritu",
-  "keyboard_shortcuts.favourites": "Abrir la llista de Favoritos",
   "keyboard_shortcuts.federated": "Abrir la llinia de tiempu federada",
   "keyboard_shortcuts.heading": "Atayos del tecláu",
   "keyboard_shortcuts.home": "Abrir la llinia de tiempu del aniciu",
@@ -292,7 +284,6 @@
   "navigation_bar.domain_blocks": "Dominios bloquiaos",
   "navigation_bar.edit_profile": "Editar el perfil",
   "navigation_bar.explore": "Esploración",
-  "navigation_bar.favourites": "Favoritos",
   "navigation_bar.filters": "Pallabres desactivaes",
   "navigation_bar.follow_requests": "Solicitúes de siguimientu",
   "navigation_bar.follows_and_followers": "Perfiles que sigues ya te siguen",
@@ -306,7 +297,6 @@
   "not_signed_in_indicator.not_signed_in": "Tienes d'aniciar la sesión p'acceder a esti recursu.",
   "notification.admin.report": "{name} informó de: {target}",
   "notification.admin.sign_up": "{name} rexistróse",
-  "notification.favourite": "{name} marcó'l to artículu como favoritu",
   "notification.follow": "{name} siguióte",
   "notification.follow_request": "{name} solicitó siguite",
   "notification.mention": "{name} mentóte",
@@ -317,7 +307,6 @@
   "notifications.clear": "Borrar los avisos",
   "notifications.column_settings.admin.report": "Informes nuevos:",
   "notifications.column_settings.admin.sign_up": "Rexistros nuevos:",
-  "notifications.column_settings.favourite": "Artículos favoritos:",
   "notifications.column_settings.filter_bar.advanced": "Amosar toles categoríes",
   "notifications.column_settings.filter_bar.category": "Barra de peñera rápida",
   "notifications.column_settings.filter_bar.show_bar": "Amosar la barra de peñera",

app/javascript/mastodon/locales/be.json

@@ -113,7 +113,6 @@
   "column.direct": "Асабістыя згадванні",
   "column.directory": "Праглядзець профілі",
   "column.domain_blocks": "Заблакіраваныя дамены",
-  "column.favourites": "Упадабаныя",
   "column.firehose": "Стужкі",
   "column.follow_requests": "Запыты на падпіску",
   "column.home": "Галоўная",
@@ -181,7 +180,6 @@
   "confirmations.mute.explanation": "Гэта схавае допісы ад гэтага карыстальніка і пра яго, але ўсё яшчэ дазволіць яму чытаць вашыя допісы і быць падпісаным на вас.",
   "confirmations.mute.message": "Вы ўпэўненыя, што хочаце ігнараваць {name}?",
   "confirmations.redraft.confirm": "Выдаліць і перапісаць",
-  "confirmations.redraft.message": "Вы ўпэўнены, што хочаце выдаліць допіс і перапісаць яго? Упадабанні і пашырэнні згубяцца, а адказы да арыгінальнага допісу асірацеюць.",
   "confirmations.reply.confirm": "Адказаць",
   "confirmations.reply.message": "Калі вы адкажаце зараз, гэта ператрэ паведамленне, якое вы пішаце. Вы ўпэўнены, што хочаце працягнуць?",
   "confirmations.unfollow.confirm": "Адпісацца",
@@ -202,7 +200,6 @@
   "dismissable_banner.community_timeline": "Гэта самыя апошнія допісы ад людзей, уліковыя запісы якіх размяшчаюцца на {domain}.",
   "dismissable_banner.dismiss": "Адхіліць",
   "dismissable_banner.explore_links": "Гэтыя навіны абмяркоўваюцца прама зараз на гэтым і іншых серверах дэцэнтралізаванай сеткі.",
-  "dismissable_banner.explore_statuses": "Допісы з гэтага і іншых сервераў дэцэнтралізаванай сеткі, якія набіраюць папулярнасць прама зараз.",
   "dismissable_banner.explore_tags": "Гэтыя хэштэгі зараз набіраюць папулярнасць сярод людзей на гэтым і іншых серверах дэцэнтралізаванай сеткі",
   "dismissable_banner.public_timeline": "Гэта апошнія публічныя допісы людзей з усей сеткі, за якімі сочаць карыстальнікі {domain}.",
   "embed.instructions": "Убудуйце гэты пост на свой сайт, скапіраваўшы прыведзены ніжэй код",
@@ -231,8 +228,6 @@
   "empty_column.direct": "Пакуль у вас няма асабістых згадак. Калі вы дашляце або атрымаеце штось, яно з'явіцца тут.",
   "empty_column.domain_blocks": "Заблакіраваных даменаў пакуль няма.",
   "empty_column.explore_statuses": "Зараз не ў трэндзе. Праверце пазней",
-  "empty_column.favourited_statuses": "Вы яшчэ не ўпадабалі ніводны допіс. Калі гэта адбудзецца, вы ўбачыце яго тут.",
-  "empty_column.favourites": "Ніхто яшчэ не ўпадабаў гэты допіс. Калі гэта адбудзецца, вы ўбачыце гэтых людзей тут.",
   "empty_column.follow_requests": "У вас яшчэ няма запытаў на падпіскуі. Калі вы атрымаеце запыт, ён з'явяцца тут.",
   "empty_column.followed_tags": "Вы пакуль не падпісаны ні на адзін хэштэг. Калі падпішацеся, яны з'явяцца тут.",
   "empty_column.hashtag": "Па гэтаму хэштэгу пакуль што нічога няма.",
@@ -307,15 +302,12 @@
   "home.explore_prompt.title": "Гэта ваша апорная кропка ў Mastodon.",
   "home.hide_announcements": "Схаваць аб'явы",
   "home.show_announcements": "Паказаць аб'явы",
-  "interaction_modal.description.favourite": "Маючы ўліковы запіс Mastodon, вы можаце ўпадабаць гэты допіс, каб паведаміць аўтару, што ён вам падабаецца, і захаваць яго на будучыню.",
   "interaction_modal.description.follow": "Маючы акаўнт у Mastodon, вы можаце падпісацца на {name}, каб бачыць яго/яе допісы ў сваёй хатняй стужцы.",
   "interaction_modal.description.reblog": "З уліковым запісам Mastodon, вы можаце пашырыць гэты пост, каб падзяліцца ім са сваімі падпісчыкамі.",
   "interaction_modal.description.reply": "Маючы акаўнт у Mastodon, вы можаце адказаць на гэты пост.",
   "interaction_modal.on_another_server": "На іншым серверы",
   "interaction_modal.on_this_server": "На гэтым серверы",
-  "interaction_modal.other_server_instructions": "Скапіюйце і ўстаўце гэты URL у поле пошуку вашай любімай праграмы для Mastodon ці інтэрфейса вашага Mastodon сервера.",
   "interaction_modal.preamble": "Паколькі Mastodon дэцэнтралізаваны, вы можаце выкарыстоўваць існуючы акаўнт, які быў створаны на іншым серверы Mastodon або на сумяшчальнай платформе, калі ў вас пакуль няма акаўнта тут.",
-  "interaction_modal.title.favourite": "Упадабаць допіс {name}",
   "interaction_modal.title.follow": "Падпісацца на {name}",
   "interaction_modal.title.reblog": "Пашырыць допіс ад {name}",
   "interaction_modal.title.reply": "Адказаць на допіс {name}",
@@ -331,8 +323,6 @@
   "keyboard_shortcuts.direct": "адкрыць стоўп асабістых згадак",
   "keyboard_shortcuts.down": "Перамясціцца ўніз па спісе",
   "keyboard_shortcuts.enter": "Адкрыць допіс",
-  "keyboard_shortcuts.favourite": "Упадабаць допіс",
-  "keyboard_shortcuts.favourites": "Адкрыць спіс упадабаных",
   "keyboard_shortcuts.federated": "Адкрыць інтэграваную стужку",
   "keyboard_shortcuts.heading": "Спалучэнні клавіш",
   "keyboard_shortcuts.home": "Адкрыць хатнюю храналагічную стужку",
@@ -385,7 +375,6 @@
   "mute_modal.hide_notifications": "Схаваць апавяшчэнні ад гэтага карыстальніка?",
   "mute_modal.indefinite": "Бестэрмінова",
   "navigation_bar.about": "Пра нас",
-  "navigation_bar.advanced_interface": "Ireki web interfaze aurreratuan",
   "navigation_bar.blocks": "Заблакаваныя карыстальнікі",
   "navigation_bar.bookmarks": "Закладкі",
   "navigation_bar.community_timeline": "Лакальная стужка",
@@ -395,7 +384,6 @@
   "navigation_bar.domain_blocks": "Заблакіраваныя дамены",
   "navigation_bar.edit_profile": "Рэдагаваць профіль",
   "navigation_bar.explore": "Агляд",
-  "navigation_bar.favourites": "Упадабаныя",
   "navigation_bar.filters": "Ігнараваныя словы",
   "navigation_bar.follow_requests": "Запыты на падпіску",
   "navigation_bar.followed_tags": "Падпіскі",
@@ -412,7 +400,6 @@
   "not_signed_in_indicator.not_signed_in": "Вам трэба ўвайсці каб атрымаць доступ да гэтага рэсурсу.",
   "notification.admin.report": "{name} паскардзіўся на {target}",
   "notification.admin.sign_up": "{name} зарэгістраваўся",
-  "notification.favourite": "Ваш допіс упадабаны {name}",
   "notification.follow": "{name} падпісаўся на вас",
   "notification.follow_request": "{name} адправіў запыт на падпіску",
   "notification.mention": "{name} згадаў вас",
@@ -426,7 +413,6 @@
   "notifications.column_settings.admin.report": "Новыя скаргі:",
   "notifications.column_settings.admin.sign_up": "Новыя ўваходы:",
   "notifications.column_settings.alert": "Апавяшчэнні на працоўным стале",
-  "notifications.column_settings.favourite": "Упадабаныя:",
   "notifications.column_settings.filter_bar.advanced": "Паказваць усе катэгорыі",
   "notifications.column_settings.filter_bar.category": "Панэль хуткай фільтрацыі",
   "notifications.column_settings.filter_bar.show_bar": "Паказваць панэль фільтрацыі",
@@ -444,7 +430,6 @@
   "notifications.column_settings.update": "Праўкі:",
   "notifications.filter.all": "Усе",
   "notifications.filter.boosts": "Пашырэнні",
-  "notifications.filter.favourites": "Упадабаныя",
   "notifications.filter.follows": "Падпісаны на",
   "notifications.filter.mentions": "Згадванні",
   "notifications.filter.polls": "Вынікі апытання",
@@ -595,7 +580,6 @@
   "server_banner.server_stats": "Статыстыка сервера:",
   "sign_in_banner.create_account": "Стварыць уліковы запіс",
   "sign_in_banner.sign_in": "Увайсці",
-  "sign_in_banner.text": "Увайдзіце, каб падпісацца на людзей і тэгі, каб адказваць на допісы, дзяліцца імі і падабаць іх, альбо кантактаваць з вашага ўліковага запісу на іншым серверы.",
   "status.admin_account": "Адкрыць інтэрфейс мадэратара для @{name}",
   "status.admin_domain": "Адкрыць інтэрфейс мадэратара для {domain}",
   "status.admin_status": "Адкрыць гэты допіс у інтэрфейсе мадэрацыі",
@@ -612,7 +596,6 @@
   "status.edited": "Адрэдагавана {date}",
   "status.edited_x_times": "Рэдагавана {count, plural, one {{count} раз} few {{count} разы} many {{count} разоў} other {{count} разу}}",
   "status.embed": "Убудаваць",
-  "status.favourite": "Упадабаць",
   "status.filter": "Фільтраваць гэты допіс",
   "status.filtered": "Адфільтравана",
   "status.hide": "Схаваць допіс",

app/javascript/mastodon/locales/bg.json

@@ -113,7 +113,6 @@
   "column.direct": "Частни споменавания",
   "column.directory": "Разглеждане на профили",
   "column.domain_blocks": "Блокирани домейни",
-  "column.favourites": "Любими",
   "column.firehose": "Инфоканали на живо",
   "column.follow_requests": "Заявки за последване",
   "column.home": "Начало",
@@ -181,7 +180,6 @@
   "confirmations.mute.explanation": "Това ще скрие публикациите от тях и публикации, които ги споменават, но все още ще им позволява да виждат публикациите ви и да ви следват.",
   "confirmations.mute.message": "Наистина ли искате да заглушите {name}?",
   "confirmations.redraft.confirm": "Изтриване и преработване",
-  "confirmations.redraft.message": "Сигурни ли сте, че искате да изтриете тази публикация и да я върнете в чернова? Ще загубите подсилванията и означаванията като любима, и отговорите към оригинала ще останат висящи.",
   "confirmations.reply.confirm": "Отговор",
   "confirmations.reply.message": "Отговарянето сега ще замени съобщението, което в момента съставяте. Сигурни ли сте, че искате да продължите?",
   "confirmations.unfollow.confirm": "Без следване",
@@ -202,7 +200,6 @@
   "dismissable_banner.community_timeline": "Ето най-скорошните публични публикации от хора, чиито акаунти са разположени в {domain}.",
   "dismissable_banner.dismiss": "Отхвърляне",
   "dismissable_banner.explore_links": "Тези новини се разказват от хората в този и други сървъри на децентрализираната мрежа точно сега.",
-  "dismissable_banner.explore_statuses": "Тези публикации от този и други сървъри в децентрализираната мрежа набират популярност сега на този сървър.",
   "dismissable_banner.explore_tags": "Тези хаштагове сега набират популярност сред хората в този и други сървъри на децентрализирата мрежа.",
   "dismissable_banner.public_timeline": "Ето най-новите обществени публикации от хора в социална мрежа, която хората в {domain} следват.",
   "embed.instructions": "Вградете публикацията в уебсайта си, копирайки кода долу.",
@@ -231,8 +228,6 @@
   "empty_column.direct": "Още нямате никакви частни споменавания. Тук ще се показват, изпращайки или получавайки едно.",
   "empty_column.domain_blocks": "Още няма блокирани домейни.",
   "empty_column.explore_statuses": "Няма нищо налагащо се в момента. Проверете пак по-късно!",
-  "empty_column.favourited_statuses": "Още нямате любими публикации. Поставяйки някоя в любими, то тя ще се покаже тук.",
-  "empty_column.favourites": "Още никой не е поставил публикацията в любими. Когато някой го направи, този човек ще се покаже тук.",
   "empty_column.follow_requests": "Още нямате заявки за последване. Получавайки такава, то тя ще се покаже тук.",
   "empty_column.followed_tags": "Още не сте последвали никакви хаштагове. Последваните хаштагове ще се покажат тук.",
   "empty_column.hashtag": "Още няма нищо в този хаштаг.",
@@ -307,15 +302,12 @@
   "home.explore_prompt.title": "Това е началната ви база с Mastodon.",
   "home.hide_announcements": "Скриване на оповестяванията",
   "home.show_announcements": "Показване на оповестяванията",
-  "interaction_modal.description.favourite": "С акаунт в Mastodon може да направите тази публикация като любима, за да позволите на автора да узнае, че я цените, и да я запазите за по-късно.",
   "interaction_modal.description.follow": "С акаунт в Mastodon може да последвате {name}, за да получавате публикациите от този акаунт в началния си инфоканал.",
   "interaction_modal.description.reblog": "С акаунт в Mastodon може да подсилите тази публикация, за да я споделите с последователите си.",
   "interaction_modal.description.reply": "С акаунт в Mastodon може да добавите отговор към тази публикация.",
   "interaction_modal.on_another_server": "На различен сървър",
   "interaction_modal.on_this_server": "На този сървър",
-  "interaction_modal.other_server_instructions": "Копипейстнете този URL адрес в полето за търсене на любимото си приложение Mastodon или мрежови интерфейс на своя Mastodon сървър.",
   "interaction_modal.preamble": "Откак Mastodon е децентрализиран, може да употребявате съществуващ акаунт, разположен на друг сървър на Mastodon или съвместима платформа, ако нямате акаунт на този сървър.",
-  "interaction_modal.title.favourite": "Любими публикации на {name}",
   "interaction_modal.title.follow": "Последване на {name}",
   "interaction_modal.title.reblog": "Подсилване на публикацията на {name}",
   "interaction_modal.title.reply": "Отговаряне на публикацията на {name}",
@@ -331,8 +323,6 @@
   "keyboard_shortcuts.direct": "за отваряне на колоната с частни споменавания",
   "keyboard_shortcuts.down": "Преместване надолу в списъка",
   "keyboard_shortcuts.enter": "Отваряне на публикация",
-  "keyboard_shortcuts.favourite": "Любима публикация",
-  "keyboard_shortcuts.favourites": "Отваряне на списъка с любими",
   "keyboard_shortcuts.federated": "Отваряне на федерирания инфопоток",
   "keyboard_shortcuts.heading": "Клавишни съчетания",
   "keyboard_shortcuts.home": "Отваряне на началната часова ос",
@@ -395,7 +385,6 @@
   "navigation_bar.domain_blocks": "Блокирани домейни",
   "navigation_bar.edit_profile": "Редактиране на профила",
   "navigation_bar.explore": "Изследване",
-  "navigation_bar.favourites": "Любими",
   "navigation_bar.filters": "Заглушени думи",
   "navigation_bar.follow_requests": "Заявки за последване",
   "navigation_bar.followed_tags": "Последвани хаштагове",
@@ -412,7 +401,6 @@
   "not_signed_in_indicator.not_signed_in": "Трябва ви вход за достъп до ресурса.",
   "notification.admin.report": "{name} докладва {target}",
   "notification.admin.sign_up": "{name} се регистрира",
-  "notification.favourite": "{name} сложи в любими ваша публикация",
   "notification.follow": "{name} ви последва",
   "notification.follow_request": "{name} поиска да ви последва",
   "notification.mention": "{name} ви спомена",
@@ -426,7 +414,6 @@
   "notifications.column_settings.admin.report": "Нови доклади:",
   "notifications.column_settings.admin.sign_up": "Нови регистрации:",
   "notifications.column_settings.alert": "Известия на работния плот",
-  "notifications.column_settings.favourite": "Любими:",
   "notifications.column_settings.filter_bar.advanced": "Показване на всички категории",
   "notifications.column_settings.filter_bar.category": "Лента за бърз филтър",
   "notifications.column_settings.filter_bar.show_bar": "Показване на лентата с филтри",
@@ -444,7 +431,6 @@
   "notifications.column_settings.update": "Промени:",
   "notifications.filter.all": "Всичко",
   "notifications.filter.boosts": "Подсилвания",
-  "notifications.filter.favourites": "Любими",
   "notifications.filter.follows": "Последвания",
   "notifications.filter.mentions": "Споменавания",
   "notifications.filter.polls": "Резултати от анкетата",
@@ -595,7 +581,6 @@
   "server_banner.server_stats": "Статистика на сървъра:",
   "sign_in_banner.create_account": "Създаване на акаунт",
   "sign_in_banner.sign_in": "Вход",
-  "sign_in_banner.text": "Влезте, за да последвате профили или хаштагове, отбелязвате като любими, споделяте и отговаряте на публикации. Можете също така да взаимодействате от акаунта ви на друг сървър.",
   "status.admin_account": "Отваряне на интерфейс за модериране за @{name}",
   "status.admin_domain": "Отваряне на модериращия интерфейс за {domain}",
   "status.admin_status": "Отваряне на публикацията в модериращия интерфейс",
@@ -612,7 +597,6 @@
   "status.edited": "Редактирано на {date}",
   "status.edited_x_times": "Редактирано {count, plural,one {{count} път} other {{count} пъти}}",
   "status.embed": "Вграждане",
-  "status.favourite": "Любимо",
   "status.filter": "Филтриране на публ.",
   "status.filtered": "Филтрирано",
   "status.hide": "Скриване на публ.",

app/javascript/mastodon/locales/bn.json

@@ -109,7 +109,6 @@
   "column.direct": "গোপনে মেনশন করুন",
   "column.directory": "প্রোফাইল ব্রাউজ করুন",
   "column.domain_blocks": "লুকোনো ডোমেনগুলি",
-  "column.favourites": "পছন্দের গুলো",
   "column.follow_requests": "অনুসরণের অনুমতি অনুরোধকারী",
   "column.home": "বাড়ি",
   "column.lists": "তালিকাগুলো",
@@ -170,7 +169,6 @@
   "confirmations.mute.explanation": "এটি তাদের কাছ থেকে পোস্ট এবং তাদেরকে মেনশন করা পোস্টগুলি হাইড করবে, তবুও তাদেরকে এটি আপনার পোস্ট গুলো দেখতে দিবে ও তারা আপনাকে অনুসরন করতে পারবে।.",
   "confirmations.mute.message": "আপনি কি নিশ্চিত {name} সরিয়ে ফেলতে চান ?",
   "confirmations.redraft.confirm": "মুছে ফেলুন এবং আবার সম্পাদন করুন",
-  "confirmations.redraft.message": "আপনি কি নিশ্চিত এটি মুছে ফেলে  এবং আবার সম্পাদন করতে চান ? এটাতে যা পছন্দিত, সমর্থন বা মতামত আছে সেগুলো নতুন লেখার সাথে যুক্ত থাকবে না।",
   "confirmations.reply.confirm": "মতামত",
   "confirmations.reply.message": "এখন মতামত লিখতে গেলে আপনার এখন যেটা লিখছেন সেটা মুছে যাবে। আপনি নি নিশ্চিত এটা করতে চান ?",
   "confirmations.unfollow.confirm": "অনুসরণ বন্ধ করো",
@@ -184,7 +182,6 @@
   "directory.new_arrivals": "নতুন আগত",
   "directory.recently_active": "সম্প্রতি সক্রিয়",
   "dismissable_banner.explore_links": "These news stories are being talked about by people on this and other servers of the decentralized network right now.",
-  "dismissable_banner.explore_statuses": "These posts from this and other servers in the decentralized network are gaining traction on this server right now.",
   "dismissable_banner.explore_tags": "These hashtags are gaining traction among people on this and other servers of the decentralized network right now.",
   "embed.instructions": "এই লেখাটি আপনার ওয়েবসাইটে যুক্ত করতে নিচের কোডটি বেবহার করুন।",
   "embed.preview": "সেটা দেখতে এরকম হবে:",
@@ -208,8 +205,6 @@
   "empty_column.bookmarked_statuses": "আপনার কাছে এখনও কোনও বুকমার্কড টুট নেই। আপনি যখন একটি বুকমার্ক করেন, এটি এখানে প্রদর্শিত হবে।",
   "empty_column.community": "স্থানীয় সময়রেখাতে কিছু নেই। প্রকাশ্যভাবে কিছু লিখে লেখালেখির উদ্বোধন করে ফেলুন!",
   "empty_column.domain_blocks": "এখনও কোনও লুকানো ডোমেন নেই।",
-  "empty_column.favourited_statuses": "আপনার পছন্দের কোনো টুট এখনো নেই। আপনি কোনো লেখা পছন্দের হিসেবে চিহ্নিত করলে এখানে পাওয়া যাবে।",
-  "empty_column.favourites": "কেও এখনো এটাকে পছন্দের টুট হিসেবে চিহ্নিত করেনি। যদি করে, তখন তাদের এখানে পাওয়া যাবে।",
   "empty_column.follow_requests": "তোমার এখনো কোনো অনুসরণের আবেদন পাওনি। যদি কেউ পাঠায়, এখানে পাওয়া যাবে।",
   "empty_column.hashtag": "এই হেসটাগে এখনো কিছু নেই।",
   "empty_column.home": "আপনার বাড়ির সময়রেখা এখনো খালি!  {public} এ ঘুরে আসুন অথবা অনুসন্ধান বেবহার করে শুরু করতে পারেন এবং অন্য ব্যবহারকারীদের সাথে সাক্ষাৎ করতে পারেন।",
@@ -253,8 +248,6 @@
   "keyboard_shortcuts.direct": "to open direct messages column",
   "keyboard_shortcuts.down": "তালিকার ভেতরে নিচে যেতে",
   "keyboard_shortcuts.enter": "অবস্থা দেখতে",
-  "keyboard_shortcuts.favourite": "পছন্দের দেখতে",
-  "keyboard_shortcuts.favourites": "পছন্দের তালিকা বের করতে",
   "keyboard_shortcuts.federated": "যুক্তবিশ্বের সময়রেখাতে যেতে",
   "keyboard_shortcuts.heading": "কিবোর্ডের দ্রুতকারক (শর্টকাট)",
   "keyboard_shortcuts.home": "বাড়ির সময়রেখা খুলতে",
@@ -303,7 +296,6 @@
   "navigation_bar.discover": "ঘুরে দেখুন",
   "navigation_bar.domain_blocks": "লুকানো ডোমেনগুলি",
   "navigation_bar.edit_profile": "নিজের পাতা সম্পাদনা করতে",
-  "navigation_bar.favourites": "পছন্দের",
   "navigation_bar.filters": "বন্ধ করা শব্দ",
   "navigation_bar.follow_requests": "অনুসরণের অনুরোধগুলি",
   "navigation_bar.follows_and_followers": "অনুসরণ এবং অনুসরণকারী",
@@ -316,7 +308,6 @@
   "navigation_bar.public_timeline": "যুক্তবিশ্বের সময়রেখা",
   "navigation_bar.security": "নিরাপত্তা",
   "not_signed_in_indicator.not_signed_in": "You need to sign in to access this resource.",
-  "notification.favourite": "{name} আপনার কার্যক্রম পছন্দ করেছেন",
   "notification.follow": "{name} আপনাকে অনুসরণ করেছেন",
   "notification.follow_request": "{name} আপনাকে অনুসরণ করার জন্য অনুরধ করেছে",
   "notification.mention": "{name} আপনাকে উল্লেখ করেছেন",
@@ -326,7 +317,6 @@
   "notifications.clear": "প্রজ্ঞাপনগুলো মুছে ফেলতে",
   "notifications.clear_confirmation": "আপনি কি নির্চিত প্রজ্ঞাপনগুলো মুছে ফেলতে চান ?",
   "notifications.column_settings.alert": "কম্পিউটারে প্রজ্ঞাপনগুলি",
-  "notifications.column_settings.favourite": "পছন্দের:",
   "notifications.column_settings.filter_bar.advanced": "সব শ্রেণীগুলো দেখানো",
   "notifications.column_settings.filter_bar.category": "সংক্ষিপ্ত ছাঁকনি অংশ",
   "notifications.column_settings.follow": "নতুন অনুসরণকারীরা:",
@@ -340,7 +330,6 @@
   "notifications.column_settings.status": "New toots:",
   "notifications.filter.all": "সব",
   "notifications.filter.boosts": "সমর্থনগুলো",
-  "notifications.filter.favourites": "পছন্দের গুলো",
   "notifications.filter.follows": "অনুসরণের",
   "notifications.filter.mentions": "উল্লেখিত",
   "notifications.filter.polls": "নির্বাচনের ফলাফল",
@@ -396,7 +385,6 @@
   "search_results.statuses_fts_disabled": "তাদের সামগ্রী দ্বারা টুটগুলি অনুসন্ধান এই মস্তোডন সার্ভারে সক্ষম নয়।",
   "search_results.total": "{count, number} {count, plural, one {ফলাফল} other {ফলাফল}}",
   "sign_in_banner.sign_in": "Sign in",
-  "sign_in_banner.text": "Sign in to follow profiles or hashtags, favourite, share and reply to posts. You can also interact from your account on a different server.",
   "status.admin_account": "@{name} র জন্য পরিচালনার ইন্টারফেসে ঢুকুন",
   "status.admin_status": "যায় লেখাটি পরিচালনার ইন্টারফেসে খুলুন",
   "status.block": "@{name} কে ব্লক করুন",
@@ -408,7 +396,6 @@
   "status.detailed_status": "বিস্তারিত কথোপকথনের হিসেবে দেখতে",
   "status.edited_x_times": "Edited {count, plural, one {# time} other {# times}}",
   "status.embed": "এমবেড করতে",
-  "status.favourite": "পছন্দের করতে",
   "status.filtered": "ছাঁকনিদিত",
   "status.load_more": "আরো দেখুন",
   "status.media_hidden": "মিডিয়া লুকানো আছে",

app/javascript/mastodon/locales/br.json

@@ -100,7 +100,6 @@
   "column.community": "Red-amzer lec'hel",
   "column.directory": "Mont a-dreuz ar profiloù",
   "column.domain_blocks": "Domani berzet",
-  "column.favourites": "Muiañ-karet",
   "column.follow_requests": "Rekedoù heuliañ",
   "column.home": "Degemer",
   "column.lists": "Listennoù",
@@ -163,7 +162,6 @@
   "confirmations.mute.explanation": "Kement-se a guzho an toudoù skrivet gantañ·i hag ar re a veneg anezhañ·i, met ne viro ket outañ·i a welet ho toudoù nag a heuliañ ac'hanoc'h.",
   "confirmations.mute.message": "Ha sur oc'h e fell deoc'h kuzhaat {name} ?",
   "confirmations.redraft.confirm": "Diverkañ ha skrivañ en-dro",
-  "confirmations.redraft.message": "Ha sur oc'h e fell deoc'h dilemel an toudoù-mañ hag e adskrivañ ? Kollet e vo ar merkoù « muiañ-karet » hag ar skignadennoù, hag emzivat e vo ar respontoù d'an toud orin.",
   "confirmations.reply.confirm": "Respont",
   "confirmations.reply.message": "Respont bremañ a zilamo ar gemennadenn emaoc'h o skrivañ. Sur e oc'h e fell deoc'h kenderc'hel ganti?",
   "confirmations.unfollow.confirm": "Diheuliañ",
@@ -183,7 +181,6 @@
   "dismissable_banner.community_timeline": "Setu toudoù foran nevesañ an dud a zo herberc’hiet o c'hontoù gant {domain}.",
   "dismissable_banner.dismiss": "Diverkañ",
   "dismissable_banner.explore_links": "These news stories are being talked about by people on this and other servers of the decentralized network right now.",
-  "dismissable_banner.explore_statuses": "These posts from this and other servers in the decentralized network are gaining traction on this server right now.",
   "dismissable_banner.explore_tags": "These hashtags are gaining traction among people on this and other servers of the decentralized network right now.",
   "embed.instructions": "Enframmit an toud-mañ en ho lec'hienn en ur eilañ ar c'hod amañ-dindan.",
   "embed.preview": "Setu penaos e teuio war wel :",
@@ -210,8 +207,6 @@
   "empty_column.community": "Goulo eo ar red-amzer lec'hel. Skrivit'ta un dra evit lakaat tan dezhi !",
   "empty_column.domain_blocks": "N'eus domani kuzh ebet c'hoazh.",
   "empty_column.explore_statuses": "N'eus tuadur ebet evit c'hoazh. Distroit diwezhatoc'h !",
-  "empty_column.favourited_statuses": "N'ho peus toud muiañ-karet ebet c'hoazh. Pa vo ouzhpennet unan e teuio war wel amañ.",
-  "empty_column.favourites": "Den ebet n'eus ouzhpennet an toud-mañ en e reoù muiañ-karet c'hoazh. Pa vo graet gant unan bennak e teuio war wel amañ.",
   "empty_column.follow_requests": "N'ho peus reked heuliañ ebet c'hoazh. Pa vo resevet unan e teuio war wel amañ.",
   "empty_column.hashtag": "N'eus netra er ger-klik-mañ c'hoazh.",
   "empty_column.home": "Goullo eo ho red-amzer degemer! Kit da weladenniñ {public} pe implijit ar c'hlask evit kregiñ ganti ha kejañ gant implijer·ien·ezed all.",
@@ -269,13 +264,11 @@
   "home.column_settings.show_replies": "Diskouez ar respontoù",
   "home.hide_announcements": "Kuzhat ar c'hemennoù",
   "home.show_announcements": "Diskouez ar c'hemennoù",
-  "interaction_modal.description.favourite": "Gant ur gont Mastodon e c'hellit ouzhpennañ an toud-mañ d'ho re vuiañ-karet evit lakaat an den en deus eñ skrivet da c'houzout e plij deoc'h hag en enrollañ evit diwezhatoc'h.",
   "interaction_modal.description.follow": "Gant ur gont Mastodon e c'hellit heuliañ {name} evit resev an toudoù a embann war ho red degemer.",
   "interaction_modal.description.reblog": "Gant ur gont Mastodon e c'hellit skignañ an toud-mañ evit rannañ anezhañ gant ho heulierien·ezed.",
   "interaction_modal.description.reply": "Gant ur gont Mastodon e c'hellit respont d'an toud-mañ.",
   "interaction_modal.on_another_server": "War ur servijer all",
   "interaction_modal.on_this_server": "War ar servijer-mañ",
-  "interaction_modal.title.favourite": "Ouzhpennañ toud {name} d'ar re vuiañ-karet",
   "interaction_modal.title.follow": "Heuliañ {name}",
   "interaction_modal.title.reblog": "Skignañ toud {name}",
   "interaction_modal.title.reply": "Respont da doud {name}",
@@ -291,8 +284,6 @@
   "keyboard_shortcuts.direct": "to open direct messages column",
   "keyboard_shortcuts.down": "Diskennañ er roll",
   "keyboard_shortcuts.enter": "Digeriñ an toud",
-  "keyboard_shortcuts.favourite": "Ouzhpennañ an toud d'ar re vuiañ-karet",
-  "keyboard_shortcuts.favourites": "Digeriñ roll an toudoù muiañ-karet",
   "keyboard_shortcuts.federated": "Digeriñ ar red-amzer kevredet",
   "keyboard_shortcuts.heading": "Berradennoù klavier",
   "keyboard_shortcuts.home": "Digeriñ ho red-amzer degemer",
@@ -350,7 +341,6 @@
   "navigation_bar.domain_blocks": "Domanioù kuzhet",
   "navigation_bar.edit_profile": "Kemmañ ar profil",
   "navigation_bar.explore": "Furchal",
-  "navigation_bar.favourites": "Ar re vuiañ-karet",
   "navigation_bar.filters": "Gerioù kuzhet",
   "navigation_bar.follow_requests": "Pedadoù heuliañ",
   "navigation_bar.follows_and_followers": "Heuliadennoù ha heulier·ezed·ien",
@@ -366,7 +356,6 @@
   "not_signed_in_indicator.not_signed_in": "Ret eo deoc'h kevreañ evit tizhout an danvez-se.",
   "notification.admin.report": "Disklêriet eo bet {target} gant {name}",
   "notification.admin.sign_up": "{name} en·he deus lakaet e·hec'h anv",
-  "notification.favourite": "Gant {name} eo bet ouzhpennet ho toud d'h·e re vuiañ-karet",
   "notification.follow": "heuliañ a ra {name} ac'hanoc'h",
   "notification.follow_request": "Gant {name} eo bet goulennet ho heuliañ",
   "notification.mention": "Gant {name} oc'h bet meneget",
@@ -380,7 +369,6 @@
   "notifications.column_settings.admin.report": "Disklêriadurioù nevez :",
   "notifications.column_settings.admin.sign_up": "Enskrivadurioù nevez :",
   "notifications.column_settings.alert": "Kemennoù war ar burev",
-  "notifications.column_settings.favourite": "Ar re vuiañ-karet:",
   "notifications.column_settings.filter_bar.advanced": "Skrammañ an-holl rummadoù",
   "notifications.column_settings.filter_bar.category": "Barrenn siloù prim",
   "notifications.column_settings.filter_bar.show_bar": "Diskouezh barrenn siloù",
@@ -398,7 +386,6 @@
   "notifications.column_settings.update": "Kemmoù :",
   "notifications.filter.all": "Pep tra",
   "notifications.filter.boosts": "Skignadennoù",
-  "notifications.filter.favourites": "Muiañ-karet",
   "notifications.filter.follows": "Heuliañ",
   "notifications.filter.mentions": "Menegoù",
   "notifications.filter.polls": "Disoc'hoù ar sontadegoù",
@@ -515,7 +502,6 @@
   "server_banner.server_stats": "Stadegoù ar servijer :",
   "sign_in_banner.create_account": "Krouiñ ur gont",
   "sign_in_banner.sign_in": "Kevreañ",
-  "sign_in_banner.text": "Sign in to follow profiles or hashtags, favourite, share and reply to posts. You can also interact from your account on a different server.",
   "status.admin_account": "Digeriñ etrefas evezherezh evit @{name}",
   "status.admin_status": "Digeriñ an toud e-barzh an etrefas evezherezh",
   "status.block": "Berzañ @{name}",
@@ -529,7 +515,6 @@
   "status.edited": "Aozet {date}",
   "status.edited_x_times": "Edited {count, plural, one {# time} other {# times}}",
   "status.embed": "Enframmañ",
-  "status.favourite": "Muiañ-karet",
   "status.filter": "Silañ ar c'hannad-mañ",
   "status.filtered": "Silet",
   "status.history.created": "Krouet gant {name} {date}",

app/javascript/mastodon/locales/bs.json

@@ -12,9 +12,7 @@
   "compose_form.spoiler.unmarked": "Text is not hidden",
   "confirmations.delete.message": "Are you sure you want to delete this status?",
   "confirmations.domain_block.confirm": "Hide entire domain",
-  "confirmations.redraft.message": "Are you sure you want to delete this status and re-draft it? Favourites and boosts will be lost, and replies to the original post will be orphaned.",
   "dismissable_banner.explore_links": "These news stories are being talked about by people on this and other servers of the decentralized network right now.",
-  "dismissable_banner.explore_statuses": "These posts from this and other servers in the decentralized network are gaining traction on this server right now.",
   "dismissable_banner.explore_tags": "These hashtags are gaining traction among people on this and other servers of the decentralized network right now.",
   "embed.instructions": "Embed this status on your website by copying the code below.",
   "empty_column.account_timeline": "No posts found",
@@ -29,8 +27,6 @@
   "keyboard_shortcuts.direct": "to open direct messages column",
   "keyboard_shortcuts.down": "to move down in the list",
   "keyboard_shortcuts.enter": "to open status",
-  "keyboard_shortcuts.favourite": "to favourite",
-  "keyboard_shortcuts.favourites": "to open favourites list",
   "keyboard_shortcuts.federated": "to open federated timeline",
   "keyboard_shortcuts.heading": "Keyboard Shortcuts",
   "keyboard_shortcuts.home": "to open home timeline",
@@ -55,7 +51,6 @@
   "keyboard_shortcuts.up": "to move up in the list",
   "navigation_bar.domain_blocks": "Hidden domains",
   "not_signed_in_indicator.not_signed_in": "You need to sign in to access this resource.",
-  "notification.favourite": "{name} favourited your status",
   "notification.reblog": "{name} boosted your status",
   "onboarding.actions.go_to_explore": "See what's trending",
   "onboarding.actions.go_to_home": "Go to your home feed",
@@ -79,7 +74,6 @@
   "report_notification.attached_statuses": "{count, plural, one {# post} other {# posts}} attached",
   "search_results.total": "{count, plural, one {# result} other {# results}}",
   "sign_in_banner.sign_in": "Sign in",
-  "sign_in_banner.text": "Sign in to follow profiles or hashtags, favourite, share and reply to posts. You can also interact from your account on a different server.",
   "status.admin_status": "Open this status in the moderation interface",
   "status.copy": "Copy link to status",
   "status.edited_x_times": "Edited {count, plural, one {# time} other {# times}}",

app/javascript/mastodon/locales/ca.json

@@ -114,7 +114,7 @@
   "column.directory": "Navega pels perfils",
   "column.domain_blocks": "Dominis blocats",
   "column.favourites": "Favorits",
-  "column.firehose": "Canal en directe",
+  "column.firehose": "Fluxos en directe",
   "column.follow_requests": "Peticions de seguir-te",
   "column.home": "Inici",
   "column.lists": "Llistes",
@@ -150,7 +150,7 @@
   "compose_form.poll.switch_to_multiple": "Canvia l’enquesta per a permetre diverses opcions",
   "compose_form.poll.switch_to_single": "Canvia l’enquesta per a permetre una única opció",
   "compose_form.publish": "Tut",
-  "compose_form.publish_form": "Nova publicació",
+  "compose_form.publish_form": "Nou tut",
   "compose_form.publish_loud": "Tut!",
   "compose_form.save_changes": "Desa els canvis",
   "compose_form.sensitive.hide": "{count, plural, one {Marca mèdia com a sensible} other {Marca mèdia com a sensible}}",
@@ -181,7 +181,7 @@
   "confirmations.mute.explanation": "Això amagarà els tuts d'ells i els d'els que els mencionin, però encara els permetrà veure els teus tuts i seguir-te.",
   "confirmations.mute.message": "Segur que vols silenciar {name}?",
   "confirmations.redraft.confirm": "Elimina i reescriu-la",
-  "confirmations.redraft.message": "Segur que vols eliminar aquest tut i tornar-lo a escriure? Es perdran tots els impulsos i els favorits, i les respostes al tut original quedaran aïllades.",
+  "confirmations.redraft.message": "Segur que vols eliminar aquest tut i tornar a escriure'l? Es perdran tots els impulsos i els favorits, i les respostes al tut original quedaran aïllades.",
   "confirmations.reply.confirm": "Respon",
   "confirmations.reply.message": "Si respons ara, sobreescriuràs el missatge que estàs editant. Segur que vols continuar?",
   "confirmations.unfollow.confirm": "Deixa de seguir",
@@ -202,7 +202,7 @@
   "dismissable_banner.community_timeline": "Aquests són els tuts públics més recents d'usuaris amb els seus comptes a {domain}.",
   "dismissable_banner.dismiss": "Ometre",
   "dismissable_banner.explore_links": "Gent d'aquest i d'altres servidors de la xarxa descentralitzada estan comentant ara mateix aquestes notícies.",
-  "dismissable_banner.explore_statuses": "Aquests tuts d'aquest i altres servidors de la xarxa descentralitzada estan guanyant l'atenció ara mateix en aquest servidor.",
+  "dismissable_banner.explore_statuses": "Aquests son els tuts de la xarxa descentralitzada que guanyen atenció ara mateix. Els tuts més nous amb més impulsos i favorits tenen millor rànquing.",
   "dismissable_banner.explore_tags": "Aquestes etiquetes estan guanyant ara mateix l'atenció dels usuaris d'aquest i altres servidors de la xarxa descentralitzada.",
   "dismissable_banner.public_timeline": "Aquests son els tuts públics més recents de les persones a la web social que les persones de {domain} segueixen.",
   "embed.instructions": "Incrusta aquest tut a la teva pàgina web copiant el codi següent.",
@@ -313,9 +313,9 @@
   "interaction_modal.description.reply": "Amb un compte a Mastodon, pots respondre aquest tut.",
   "interaction_modal.on_another_server": "En un servidor diferent",
   "interaction_modal.on_this_server": "En aquest servidor",
-  "interaction_modal.other_server_instructions": "Copia i enganxa aquest enllaç en el camp de cerca de la teva aplicació Mastodon preferida o a la interfície web del teu servidor Mastodon.",
+  "interaction_modal.other_server_instructions": "Copia i enganxa aquest URL en el camp de cerca de la teva aplicació Mastodon preferida o a la interfície web del teu servidor Mastodon.",
   "interaction_modal.preamble": "Com que Mastodon és descentralitzat, pots fer servir el teu compte existent en un altre servidor Mastodon o plataforma compatible si no tens compte en aquest.",
-  "interaction_modal.title.favourite": "Marca el tut de {name}",
+  "interaction_modal.title.favourite": "Afavoreix el tut de {name}",
   "interaction_modal.title.follow": "Segueix {name}",
   "interaction_modal.title.reblog": "Impulsa el tut de {name}",
   "interaction_modal.title.reply": "Respon al tut de {name}",
@@ -331,7 +331,7 @@
   "keyboard_shortcuts.direct": "per a obrir la columna de mencions privades",
   "keyboard_shortcuts.down": "Abaixa a la llista",
   "keyboard_shortcuts.enter": "Obre el tut",
-  "keyboard_shortcuts.favourite": "Afavoreix el tut",
+  "keyboard_shortcuts.favourite": "Tut afavorit",
   "keyboard_shortcuts.favourites": "Obre la llista de preferits",
   "keyboard_shortcuts.federated": "Obre la línia de temps federada",
   "keyboard_shortcuts.heading": "Dreceres de teclat",
@@ -363,6 +363,7 @@
   "lightbox.previous": "Anterior",
   "limited_account_hint.action": "Mostra el perfil de totes maneres",
   "limited_account_hint.title": "Aquest perfil l'han amagat els moderadors de {domain}.",
+  "link_preview.author": "Per {name}",
   "lists.account.add": "Afegeix a la llista",
   "lists.account.remove": "Elimina de la llista",
   "lists.delete": "Elimina la llista",
@@ -395,7 +396,7 @@
   "navigation_bar.domain_blocks": "Dominis blocats",
   "navigation_bar.edit_profile": "Edita el perfil",
   "navigation_bar.explore": "Explora",
-  "navigation_bar.favourites": "Preferits",
+  "navigation_bar.favourites": "Favorits",
   "navigation_bar.filters": "Paraules silenciades",
   "navigation_bar.follow_requests": "Sol·licituds de seguiment",
   "navigation_bar.followed_tags": "Etiquetes seguides",
@@ -412,7 +413,7 @@
   "not_signed_in_indicator.not_signed_in": "Cal que iniciïs la sessió per a accedir a aquest recurs.",
   "notification.admin.report": "{name} ha reportat {target}",
   "notification.admin.sign_up": "{name} s'ha registrat",
-  "notification.favourite": "a {name} li ha agradat el teu tut",
+  "notification.favourite": "{name} ha afavorit el teu tut",
   "notification.follow": "{name} et segueix",
   "notification.follow_request": "{name} ha sol·licitat seguir-te",
   "notification.mention": "{name} t'ha mencionat",
@@ -444,7 +445,7 @@
   "notifications.column_settings.update": "Edicions:",
   "notifications.filter.all": "Totes",
   "notifications.filter.boosts": "Impulsos",
-  "notifications.filter.favourites": "Preferides",
+  "notifications.filter.favourites": "Favorits",
   "notifications.filter.follows": "Seguiments",
   "notifications.filter.mentions": "Mencions",
   "notifications.filter.polls": "Resultats de l'enquesta",