Merge branch 'main' into translate-toots

2025-11-27 10:00:50 +00:00 · 2025-11-11 01:10:59 +01:00 · 2025-11-11 01:10:59 +01:00 · b4dd2a96f1
commit b4dd2a96f1
parent 35596627b0 1c3e7545cb
426 changed files with 6677 additions and 4636 deletions
--- a/.devcontainer/compose.yaml
+++ b/.devcontainer/compose.yaml
@ -73,7 +73,7 @@ services:
        hard: -1

  libretranslate:
-    image: libretranslate/libretranslate:v1.6.2
+    image: libretranslate/libretranslate:v1.7.3
    restart: unless-stopped
    volumes:
      - lt-data:/home/libretranslate/.local
--- a/.env.production.sample
+++ b/.env.production.sample
@ -88,21 +88,3 @@ S3_ALIAS_HOST=files.example.com
 # -----------------------
 IP_RETENTION_PERIOD=31556952
 SESSION_RETENTION_PERIOD=31556952
-
-# Fetch All Replies Behavior
-# --------------------------
-
-# Period to wait between fetching replies (in minutes)
-FETCH_REPLIES_COOLDOWN_MINUTES=15
-
-# Period to wait after a post is first created before fetching its replies (in minutes)
-FETCH_REPLIES_INITIAL_WAIT_MINUTES=5
-
-# Max number of replies to fetch - total, recursively through a whole reply tree
-FETCH_REPLIES_MAX_GLOBAL=1000
-
-# Max number of replies to fetch - for a single post
-FETCH_REPLIES_MAX_SINGLE=500
-
-# Max number of replies Collection pages to fetch - total
-FETCH_REPLIES_MAX_PAGES=500
--- a/.github/actions/setup-javascript/action.yml
+++ b/.github/actions/setup-javascript/action.yml
@ -9,7 +9,7 @@ runs:
  using: 'composite'
  steps:
    - name: Set up Node.js
-      uses: actions/setup-node@v4
+      uses: actions/setup-node@v6
      with:
        node-version-file: '.nvmrc'

--- a/.github/renovate.json5
+++ b/.github/renovate.json5
@ -23,8 +23,6 @@
      // Require Dependency Dashboard Approval for major version bumps of these node packages
      matchManagers: ['npm'],
      matchPackageNames: [
-        'tesseract.js', // Requires code changes
-
        // react-router: Requires manual upgrade
        'history',
        'react-router-dom',
--- a/.github/workflows/build-container-image.yml
+++ b/.github/workflows/build-container-image.yml
@ -35,7 +35,7 @@ jobs:
          - linux/arm64

    steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v5

      - name: Prepare
        env:
@ -100,7 +100,7 @@ jobs:

      - name: Upload digest
        if: ${{ inputs.push_to_images != '' }}
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@v5
        with:
          # `hashFiles` is used to disambiguate between streaming and non-streaming images
          name: digests-${{ hashFiles(inputs.file_to_build) }}-${{ env.PLATFORM_PAIR }}
@ -119,10 +119,10 @@ jobs:
      PUSH_TO_IMAGES: ${{ inputs.push_to_images }}

    steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v5

      - name: Download digests
-        uses: actions/download-artifact@v4
+        uses: actions/download-artifact@v6
        with:
          path: ${{ runner.temp }}/digests
          # `hashFiles` is used to disambiguate between streaming and non-streaming images
--- a/.github/workflows/build-push-pr.yml
+++ b/.github/workflows/build-push-pr.yml
@ -18,7 +18,7 @@ jobs:
    steps:
      # Repository needs to be cloned so `git rev-parse` below works
      - name: Clone repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5
      - id: version_vars
        run: |
          echo mastodon_version_metadata=pr-${{ github.event.pull_request.number }}-$(git rev-parse --short ${{github.event.pull_request.head.sha}}) >> $GITHUB_OUTPUT
--- a/.github/workflows/build-releases.yml
+++ b/.github/workflows/build-releases.yml
@ -21,7 +21,7 @@ jobs:
      # Only tag with latest when ran against the latest stable branch
      # This needs to be updated after each minor version release
      flavor: |
-        latest=${{ startsWith(github.ref, 'refs/tags/v4.3.') }}
+        latest=${{ startsWith(github.ref, 'refs/tags/v4.5.') }}
      tags: |
        type=pep440,pattern={{raw}}
        type=pep440,pattern=v{{major}}.{{minor}}
@ -39,7 +39,7 @@ jobs:
      # Only tag with latest when ran against the latest stable branch
      # This needs to be updated after each minor version release
      flavor: |
-        latest=${{ startsWith(github.ref, 'refs/tags/v4.3.') }}
+        latest=${{ startsWith(github.ref, 'refs/tags/v4.5.') }}
      tags: |
        type=pep440,pattern={{raw}}
        type=pep440,pattern=v{{major}}.{{minor}}
--- a/.github/workflows/bundler-audit.yml
+++ b/.github/workflows/bundler-audit.yml
@ -28,7 +28,7 @@ jobs:

    steps:
      - name: Clone repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5

      - name: Set up Ruby
        uses: ruby/setup-ruby@v1
--- a/.github/workflows/check-i18n.yml
+++ b/.github/workflows/check-i18n.yml
@ -21,7 +21,7 @@ jobs:
    runs-on: ubuntu-latest

    steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v5

      - name: Set up Ruby environment
        uses: ./.github/actions/setup-ruby
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@ -23,7 +23,7 @@ jobs:
    if: github.repository == 'mastodon/mastodon'
    steps:
      - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5
        with:
          fetch-depth: 0
      - name: Set up Javascript environment
@ -33,7 +33,7 @@ jobs:
        run: yarn build-storybook

      - name: Run Chromatic
-        uses: chromaui/action@v12
+        uses: chromaui/action@v13
        with:
          # ⚠️ Make sure to configure a `CHROMATIC_PROJECT_TOKEN` repository secret
          projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
--- a/.github/workflows/codeql.yml
+++ b/.github/workflows/codeql.yml
@ -31,11 +31,11 @@ jobs:

    steps:
      - name: Checkout repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5

      # Initializes the CodeQL tools for scanning.
      - name: Initialize CodeQL
-        uses: github/codeql-action/init@v3
+        uses: github/codeql-action/init@v4
        with:
          languages: ${{ matrix.language }}
          # If you wish to specify custom queries, you can do so here or in a config file.
@ -48,7 +48,7 @@ jobs:
      # Autobuild attempts to build any compiled languages  (C/C++, C#, Go, or Java).
      # If this step fails, then you should remove it and run the build manually (see below)
      - name: Autobuild
-        uses: github/codeql-action/autobuild@v3
+        uses: github/codeql-action/autobuild@v4

      # ℹ️ Command-line programs to run using the OS shell.
      # 📚 See https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#jobsjob_idstepsrun
@ -61,6 +61,6 @@ jobs:
      #   ./location_of_script_within_repo/buildscript.sh

      - name: Perform CodeQL Analysis
-        uses: github/codeql-action/analyze@v3
+        uses: github/codeql-action/analyze@v4
        with:
          category: '/language:${{matrix.language}}'
--- a/.github/workflows/crowdin-download-stable.yml
+++ b/.github/workflows/crowdin-download-stable.yml
@ -13,7 +13,7 @@ jobs:

    steps:
      - name: Checkout
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5

      - name: Increase Git http.postBuffer
        # This is needed due to a bug in Ubuntu's cURL version?
--- a/.github/workflows/crowdin-download.yml
+++ b/.github/workflows/crowdin-download.yml
@ -15,7 +15,7 @@ jobs:

    steps:
      - name: Checkout
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5

      - name: Increase Git http.postBuffer
        # This is needed due to a bug in Ubuntu's cURL version?
--- a/.github/workflows/crowdin-upload.yml
+++ b/.github/workflows/crowdin-upload.yml
@ -23,7 +23,7 @@ jobs:

    steps:
      - name: Checkout
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5

      - name: crowdin action
        uses: crowdin/github-action@v2
--- a/.github/workflows/format-check.yml
+++ b/.github/workflows/format-check.yml
@ -13,7 +13,7 @@ jobs:

    steps:
      - name: Clone repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5

      - name: Set up Javascript environment
        uses: ./.github/actions/setup-javascript
--- a/.github/workflows/lint-css.yml
+++ b/.github/workflows/lint-css.yml
@ -34,7 +34,7 @@ jobs:

    steps:
      - name: Clone repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5

      - name: Set up Javascript environment
        uses: ./.github/actions/setup-javascript
--- a/.github/workflows/lint-haml.yml
+++ b/.github/workflows/lint-haml.yml
@ -33,7 +33,7 @@ jobs:

    steps:
      - name: Clone repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5

      - name: Set up Ruby
        uses: ruby/setup-ruby@v1
--- a/.github/workflows/lint-js.yml
+++ b/.github/workflows/lint-js.yml
@ -38,7 +38,7 @@ jobs:

    steps:
      - name: Clone repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5

      - name: Set up Javascript environment
        uses: ./.github/actions/setup-javascript
--- a/.github/workflows/lint-ruby.yml
+++ b/.github/workflows/lint-ruby.yml
@ -35,7 +35,7 @@ jobs:

    steps:
      - name: Clone repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5

      - name: Set up Ruby
        uses: ruby/setup-ruby@v1
--- a/.github/workflows/test-js.yml
+++ b/.github/workflows/test-js.yml
@ -34,7 +34,7 @@ jobs:

    steps:
      - name: Clone repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5

      - name: Set up Javascript environment
        uses: ./.github/actions/setup-javascript
--- a/.github/workflows/test-migrations.yml
+++ b/.github/workflows/test-migrations.yml
@ -72,7 +72,7 @@ jobs:
      BUNDLE_RETRY: 3

    steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v5

      - name: Set up Ruby environment
        uses: ./.github/actions/setup-ruby
--- a/.github/workflows/test-ruby.yml
+++ b/.github/workflows/test-ruby.yml
@ -32,7 +32,7 @@ jobs:
      SECRET_KEY_BASE_DUMMY: 1

    steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v5

      - name: Set up Ruby environment
        uses: ./.github/actions/setup-ruby
@ -65,7 +65,7 @@ jobs:
        run: |
          tar --exclude={"*.br","*.gz"} -zcf artifacts.tar.gz public/assets public/packs* tmp/cache/vite/last-build*.json

-      - uses: actions/upload-artifact@v4
+      - uses: actions/upload-artifact@v5
        if: matrix.mode == 'test'
        with:
          path: |-
@ -128,9 +128,9 @@ jobs:
          - '3.3'
          - '.ruby-version'
    steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v5

-      - uses: actions/download-artifact@v4
+      - uses: actions/download-artifact@v6
        with:
          path: './'
          name: ${{ github.sha }}
@ -230,9 +230,9 @@ jobs:
          - '3.3'
          - '.ruby-version'
    steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v5

-      - uses: actions/download-artifact@v4
+      - uses: actions/download-artifact@v6
        with:
          path: './'
          name: ${{ github.sha }}
@ -309,9 +309,9 @@ jobs:
          - '.ruby-version'

    steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v5

-      - uses: actions/download-artifact@v4
+      - uses: actions/download-artifact@v6
        with:
          path: './'
          name: ${{ github.sha }}
@ -350,14 +350,14 @@ jobs:
      - run: bin/rspec spec/system --tag streaming --tag js

      - name: Archive logs
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@v5
        if: failure()
        with:
          name: e2e-logs-${{ matrix.ruby-version }}
          path: log/

      - name: Archive test screenshots
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@v5
        if: failure()
        with:
          name: e2e-screenshots-${{ matrix.ruby-version }}
@ -447,9 +447,9 @@ jobs:
            search-image: opensearchproject/opensearch:2

    steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v5

-      - uses: actions/download-artifact@v4
+      - uses: actions/download-artifact@v6
        with:
          path: './'
          name: ${{ github.sha }}
@ -469,14 +469,14 @@ jobs:
      - run: bin/rspec --tag search

      - name: Archive logs
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@v5
        if: failure()
        with:
          name: test-search-logs-${{ matrix.ruby-version }}
          path: log/

      - name: Archive test screenshots
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@v5
        if: failure()
        with:
          name: test-search-screenshots
--- a/.gitignore
+++ b/.gitignore
@ -23,6 +23,7 @@
 /public/packs
 /public/packs-dev
 /public/packs-test
+stats.html
 .env
 .env.production
 node_modules/
--- a/.nvmrc
+++ b/.nvmrc
@ -1 +1 @@
-24.10
+24.11
--- a/.storybook/main.ts
+++ b/.storybook/main.ts
@ -31,7 +31,7 @@ const config: StorybookConfig = {
  viteFinal(config) {
    // For an unknown reason, Storybook does not use the root
    // from the Vite config so we need to set it manually.
-    config.root = resolve(__dirname, '../app/javascript');
+    config.root = resolve(import.meta.dirname, '../app/javascript');
    return config;
  },
 };
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -2,45 +2,61 @@

 All notable changes to this project will be documented in this file.

-## [4.5.0] - UNRELEASED
+## [4.5.0] - 2025-11-06

 ### Added

- **Add support for allowing and authoring quotes** (#35355, #35578, #35614, #35618, #35624, #35626, #35652, #35629, #35665, #35653, #35670, #35677, #35690, #35697, #35689, #35699, #35700, #35701, #35709, #35714, #35713, #35715, #35725, #35749, #35769, #35780, #35762, #35804, #35808, #35805, #35819, #35824, #35828, #35822, #35835, #35865, #35860, #35832, #35891, #35894, #35895, #35820, #35917, #35924, #35925, #35914, #35930, #35941, #35939, #35948, #35955, #35967, #35990, #35991, #35975, #35971, #36002, #35986, #36031, #36034, #36038, #36054, #36052, #36055, #36065, #36068, #36083, #36087, #36080, #36091, #36090, #36118, #36119, #36128, #36094, #36129, #36138, #36132, #36151, #36158, #36171, #36194, #36220, #36169, #36130, #36249, #36153, #36299, #36291, #36301, #36315, #36317, #36364, #36383, #36381, #36459, #36464, #36461, #36516 and #36528 by @ChaosExAnima, @ClearlyClaire, @Lycolia, @diondiondion, and @tribela)\
+- **Add support for allowing and authoring quotes** (#35355, #35578, #35614, #35618, #35624, #35626, #35652, #35629, #35665, #35653, #35670, #35677, #35690, #35697, #35689, #35699, #35700, #35701, #35709, #35714, #35713, #35715, #35725, #35749, #35769, #35780, #35762, #35804, #35808, #35805, #35819, #35824, #35828, #35822, #35835, #35865, #35860, #35832, #35891, #35894, #35895, #35820, #35917, #35924, #35925, #35914, #35930, #35941, #35939, #35948, #35955, #35967, #35990, #35991, #35975, #35971, #36002, #35986, #36031, #36034, #36038, #36054, #36052, #36055, #36065, #36068, #36083, #36087, #36080, #36091, #36090, #36118, #36119, #36128, #36094, #36129, #36138, #36132, #36151, #36158, #36171, #36194, #36220, #36169, #36130, #36249, #36153, #36299, #36291, #36301, #36315, #36317, #36364, #36383, #36381, #36459, #36464, #36461, #36516, #36528, #36549, #36550, #36559, #36693, #36704, #36690, #36689, #36696, #36721, #36695 and #36736 by @ChaosExAnima, @ClearlyClaire, @Lycolia, @diondiondion, and @tribela)\
  This includes a revamp of the composer interface.\
  See https://blog.joinmastodon.org/2025/09/introducing-quote-posts/ for a user-centric overview of the feature, and https://docs.joinmastodon.org/client/quotes/ for API documentation.
- **Add support for fetching and refreshing replies to the web UI** (#35210, #35496, #35575, #35500, #35577, #35602, #35603, #35654, #36141, #36237, #36172, #36256, #36271, #36334, #36382, #36239, #36484 and #36481 by @ClearlyClaire, @Gargron, and @diondiondion)
+- **Add support for fetching and refreshing replies to the web UI** (#35210, #35496, #35575, #35500, #35577, #35602, #35603, #35654, #36141, #36237, #36172, #36256, #36271, #36334, #36382, #36239, #36484, #36481, #36583, #36627 and #36547 by @ClearlyClaire, @diondiondion, @Gargron and @renchap)
 - **Add ability to block words in usernames** (#35407, #35655, and #35806 by @ClearlyClaire and @Gargron)
+- Add ability to individually disable local or remote feeds for visitors or logged-in users `disabled` value to server setting for live and topic feeds, as well as user permission to bypass that (#36338, #36467, #36497, #36563, #36577, #36585, #36607 and #36703 by @ClearlyClaire)\
+  This splits the `timeline_preview` setting into four more granular settings controlling live feeds and topic (hashtag, trending link) feeds.\
+  The setting for local topic feeds has 2 values: `public` and `authenticated`. Every other setting has 3 values: `public`, `authenticated`, `disabled`.\
+  When `disabled`, users with the “View live and topic feeds” will still be able to view them.
 - Add support for displaying of quote posts in Moderator UI (#35964 by @ThisIsMissEm)
 - Add support for displaying link previews for Admin UI (#35958 by @ThisIsMissEm)
+- Add a new server setting to choose the server landing page (#36588 and #36602 by @ClearlyClaire and @renchap)
+- Add support for `Update` activities on converted object types (#36322 by @ClearlyClaire)
 - Add support for dynamic viewport height (#36272 by @e1berd)
 - Add support for numeric-based URIs for new local accounts (#32724, #36304, #36316, and #36365 by @ClearlyClaire)
+- Add default visualizer for audio upload without poster (#36734 by @ChaosExAnima)
 - Add Traditional Mongolian to posting languages (#36196 by @shimon1024)
 - Add example post with manual quote approval policy to `dev:populate_sample_data` (#36099 by @ClearlyClaire)
 - Add server-side support for handling posts with a quote policy allowing followers to quote (#36093 and #36127 by @ClearlyClaire)
 - Add schema.org markup to SEO-enabled posts (#36075 by @Gargron)
 - Add migration to fill unset default quote policy based on default post privacy (#36041 by @ClearlyClaire)
+- Add “Posting defaults” setting page, moving existing settings from “Other” (#35896, #36033, #35966, #35969, and #36084 by @ClearlyClaire and @diondiondion)
+- Added emoji from Twemoji v16 (#36501 and #36530 by @ChaosExAnima)
+- Add feature to select custom emoji rendering (#35229, #35282, #35253, #35424, #35473, #35483, #35505, #35568, #35605, #35659, #35664, #35739, #35985, #36051, #36071, #36137, #36165, #36248, #36262, #36275, #36293, #36341, #36342, #36366, #36377, #36378, #36385, #36393, #36397, #36403, #36413, #36410, #36454, #36402, #36503, #36502, #36532, #36603, #36409, #36638 and #36750 by @ChaosExAnima, @ClearlyClaire and @braddunbar)\
+  This also completely reworks the processing and rendering of emojis and server-rendered HTML in statuses and other places.
 - Add support for exposing conversation context for new public conversations according to FEP-7888 (#35959 and #36064 by @ClearlyClaire and @jesseplusplus)
 - Add digest re-check before removing followers in synchronization mechanism (#34273 by @ClearlyClaire)
- Add “Posting defaults” setting page, moving existing settings from “Other” (#35896, #36033, #35966, #35969, and #36084 by @ClearlyClaire and @diondiondion)
 - Add support for displaying Valkey version on admin dashboard (#35785 by @ykzts)
 - Add delivery failure tracking and handling to FASP jobs (#35625, #35628, and #35723 by @oneiros)
 - Add example of quote post with a preview card to development sample data (#35616 by @ClearlyClaire)
 - Add second set of blocked text that applies to accounts regardless of account age for spam-blocking (#35563 by @ClearlyClaire)
- Added emoji from Twemoji v16 (#36501 and #36530 by @ChaosExAnima)
- Add experimental feature to select custom emoji rendering (#35229, #35282, #35253, #35424, #35473, #35483, #35505, #35568, #35605, #35659, #35664, #35739, #35985, #36051, #36071, #36137, #36165, #36248, #36262, #36275, #36293, #36341, #36342, #36366, #36377, #36378, #36385, #36393, #36397, #36403, #36413, #36410, #36454, #36402, #36503, #36502 and #36532 by @ChaosExAnima and @braddunbar)\
-  This also completely reworks the processing and rendering of emojis and server-rendered HTML in statuses and other places.

 ### Changed

 - Change confirmation dialogs for follow button actions “unfollow”, “unblock”, and “withdraw request” (#36289 by @diondiondion)
 - Change “Follow” button labels (#36264 by @diondiondion)
 - Change appearance settings to introduce new Advanced settings section (#36496 and #36506 by @diondiondion)
+- Change display of blocked and muted quoted users (#36619 by @ClearlyClaire)\
+  This adds `blocked_account`, `blocked_domain` and `muted_account` values to the `state` attribute of `Quote` and `ShallowQuote` REST API entities.
+- Change submitting an empty post to show an error rather than failing silently (#36650 by @diondiondion)
+- Change "Privacy and reach" settings from "Public profile" to their own top-level category (#27294 by @ChaelCodes)
+- Change number of times quote verification is retried to better deal with temporary failures (#36698 by @ClearlyClaire)
 - Change display of content warnings in Admin UI (#35935 by @ThisIsMissEm)
+- Change styling of column banners (#36531 by @ClearlyClaire)
+- Change recommended Node version to 24 (LTS) (#36539 by @renchap)
+- Change min. characters required for logged-out account search from 5 to 3 (#36487 by @Gargron)
+- Change browser target to Vite legacy plugin defaults (#36611 by @larouxn)
 - Change index on `follows` table to improve performance of some queries (#36374 by @ClearlyClaire)
 - Change links to accounts in settings and moderation views to link to local view unless account is suspended (#36340 by @diondiondion)
 - Change redirection for denied registration from web app to sign-in page with error message (#36384 by @ClearlyClaire)
- Change `timeline_preview` setting into four more granular settings (#36338, #36467 and #36497 by @ClearlyClaire)
+- Change support for RFC9421 HTTP signatures to be enabled unconditionally (#36610 by @oneiros)
 - Change wording and design of interaction dialog to simplify it (#36124 by @diondiondion)
 - Change dropdown menus to allow disabled items to be focused (#36078 by @diondiondion)
 - Change modal background colours in light mode (#36069 by @diondiondion)
@ -48,7 +64,7 @@ All notable changes to this project will be documented in this file.
 - Change description of “Quiet public” (#36032 by @ClearlyClaire)
 - Change “Boost with original visibility” to “Share again with your followers” (#36035 by @ClearlyClaire)
 - Change handling of push subscriptions to automatically delete invalid ones on delivery (#35987 by @ThisIsMissEm)
- Change design of quote posts in web UI (#35584 and #35834 by @ClearlyClaire and @Gargron)
+- Change design of quote posts in web UI (#35584 and #35834 by @Gargron)
 - Change auditable accounts to be sorted by username in admin action logs interface (#35272 by @breadtk)
 - Change order of translation restoration and service credit on post card (#33619 by @colindean)
 - Change position of ‘add more’ to be inside table toolbar on reports (#35963 by @ThisIsMissEm)
@ -59,6 +75,16 @@ All notable changes to this project will be documented in this file.
 - Fix relationship not being fetched to evaluate whether to show a quote post (#36517 by @ClearlyClaire)
 - Fix rendering of poll options in status history modal (#35633 by @ThisIsMissEm)
 - Fix “mute” button being displayed to unauthenticated visitors in hashtag dropdown (#36353 by @mkljczk)
+- Fix initially selected language in Rules panel, hide selector when no alternative translations exist (#36672 by @diondiondion)
+- Fix URL comparison for mentions in case of empty path (#36613 and #36626 by @ClearlyClaire)
+- Fix hashtags not being picked up when full-width hash sign is used (#36103 and #36625 by @ClearlyClaire and @Gargron)
+- Fix layout of severed relationships when purged events are listed (#36593 by @mejofi)
+- Fix Skeleton placeholders being animated when setting to reduce animations is enabled (#36716 by @ClearlyClaire)
+- Fix vacuum tasks being interrupted by a single batch failure (#36606 by @Gargron)
+- Fix handling of unreachable network error for search services (#36587 by @mjankowski)
+- Fix bookmarks export when a bookmarked status is soft-deleted (#36576 by @ClearlyClaire)
+- Fix text overflow alignment for long author names in News (#36562 by @diondiondion)
+- Fix discovery preamble missing word in admin settings (#36560 by @belatedly)
 - Fix overflow handling of `.more-from-author` (#36310 by @edent)
 - Fix unfortunate action button wrapping in admin area (#36247 by @diondiondion)
 - Fix translate button width in Safari (#36164 and #36216 by @diondiondion)
@ -81,6 +107,10 @@ All notable changes to this project will be documented in this file.
 - Fix glitchy status keyboard navigation (#35455 and #35504 by @diondiondion)
 - Fix post being submitted when pressing “Enter” in the CW field (#35445 by @diondiondion)

+### Removed
+
+- Remove support for PostgreSQL 13 (#36540 by @renchap)
+
 ## [4.4.8] - 2025-10-21

 ### Security
--- a/2
+++ b/2
@ -183,7 +183,7 @@ FROM build AS libvips

 # libvips version to compile, change with [--build-arg VIPS_VERSION="8.15.2"]
 # renovate: datasource=github-releases depName=libvips packageName=libvips/libvips
-ARG VIPS_VERSION=8.17.2
+ARG VIPS_VERSION=8.17.3
 # libvips download URL, change with [--build-arg VIPS_URL="https://github.com/libvips/libvips/releases/download"]
 ARG VIPS_URL=https://github.com/libvips/libvips/releases/download

--- a/6
+++ b/6
@ -13,7 +13,7 @@ gem 'haml-rails', '~>3.0'
 gem 'pg', '~> 1.5'
 gem 'pghero'

-gem 'aws-sdk-core', '< 3.216.0', require: false # TODO: https://github.com/mastodon/mastodon/pull/34173#issuecomment-2733378873
+gem 'aws-sdk-core', require: false
 gem 'aws-sdk-s3', '~> 1.123', require: false
 gem 'blurhash', '~> 0.1'
 gem 'fog-core', '<= 2.6.0'
@ -114,7 +114,7 @@ group :opentelemetry do
  gem 'opentelemetry-instrumentation-http', '~> 0.27.0', require: false
  gem 'opentelemetry-instrumentation-http_client', '~> 0.26.0', require: false
  gem 'opentelemetry-instrumentation-net_http', '~> 0.26.0', require: false
-  gem 'opentelemetry-instrumentation-pg', '~> 0.32.0', require: false
+  gem 'opentelemetry-instrumentation-pg', '~> 0.33.0', require: false
  gem 'opentelemetry-instrumentation-rack', '~> 0.29.0', require: false
  gem 'opentelemetry-instrumentation-rails', '~> 0.39.0', require: false
  gem 'opentelemetry-instrumentation-redis', '~> 0.28.0', require: false
@ -138,7 +138,7 @@ group :test do
  # Browser integration testing
  gem 'capybara', '~> 3.39'
  gem 'capybara-playwright-driver'
-  gem 'playwright-ruby-client', '1.55.0', require: false # Pinning the exact version as it needs to be kept in sync with the installed npm package
+  gem 'playwright-ruby-client', '1.56.0', require: false # Pinning the exact version as it needs to be kept in sync with the installed npm package

  # Used to reset the database between system tests
  gem 'database_cleaner-active_record'
--- a/Gemfile.lock
+++ b/Gemfile.lock
@ -90,23 +90,26 @@ GEM
      public_suffix (>= 2.0.2, < 7.0)
    aes_key_wrap (1.1.0)
    android_key_attestation (0.3.0)
-    annotaterb (4.19.0)
+    annotaterb (4.20.0)
      activerecord (>= 6.0.0)
      activesupport (>= 6.0.0)
    ast (2.4.3)
    attr_required (1.0.2)
    aws-eventstream (1.4.0)
-    aws-partitions (1.1168.0)
-    aws-sdk-core (3.215.1)
+    aws-partitions (1.1180.0)
+    aws-sdk-core (3.236.0)
      aws-eventstream (~> 1, >= 1.3.0)
      aws-partitions (~> 1, >= 1.992.0)
      aws-sigv4 (~> 1.9)
+      base64
+      bigdecimal
      jmespath (~> 1, >= 1.6.1)
-    aws-sdk-kms (1.96.0)
-      aws-sdk-core (~> 3, >= 3.210.0)
+      logger
+    aws-sdk-kms (1.116.0)
+      aws-sdk-core (~> 3, >= 3.234.0)
      aws-sigv4 (~> 1.5)
-    aws-sdk-s3 (1.177.0)
-      aws-sdk-core (~> 3, >= 3.210.0)
+    aws-sdk-s3 (1.203.0)
+      aws-sdk-core (~> 3, >= 3.234.0)
      aws-sdk-kms (~> 1)
      aws-sigv4 (~> 1.5)
    aws-sigv4 (1.12.1)
@ -116,7 +119,7 @@ GEM
    base64 (0.3.0)
    bcp47_spec (0.2.1)
    bcrypt (3.1.20)
-    benchmark (0.4.1)
+    benchmark (0.5.0)
    better_errors (2.10.1)
      erubi (>= 1.0.0)
      rack (>= 0.9.0)
@ -128,7 +131,7 @@ GEM
    blurhash (0.1.8)
    bootsnap (1.18.6)
      msgpack (~> 1.2)
-    brakeman (7.0.2)
+    brakeman (7.1.1)
      racc
    browser (6.2.0)
    builder (3.3.0)
@ -168,7 +171,7 @@ GEM
    cose (1.3.1)
      cbor (~> 0.5.9)
      openssl-signature_algorithm (~> 1.0)
-    crack (1.0.0)
+    crack (1.0.1)
      bigdecimal
      rexml
    crass (1.0.6)
@ -190,10 +193,10 @@ GEM
      railties (>= 4.1.0)
      responders
      warden (~> 1.2.3)
-    devise-two-factor (6.1.0)
-      activesupport (>= 7.0, < 8.1)
+    devise-two-factor (6.2.0)
+      activesupport (>= 7.0, < 8.2)
      devise (~> 4.0)
-      railties (>= 7.0, < 8.1)
+      railties (>= 7.0, < 8.2)
      rotp (~> 6.0)
    devise_pam_authenticatable2 (9.2.0)
      devise (>= 4.0.0)
@ -224,7 +227,7 @@ GEM
      mail (~> 2.7)
    email_validator (2.2.4)
      activemodel
-    erb (5.0.2)
+    erb (5.1.3)
    erubi (1.13.1)
    et-orbi (1.4.0)
      tzinfo
@ -279,7 +282,7 @@ GEM
      rake (>= 13)
    googleapis-common-protos-types (1.22.0)
      google-protobuf (~> 4.26)
-    haml (6.3.0)
+    haml (6.4.0)
      temple (>= 0.8.2)
      thor
      tilt
@ -288,7 +291,7 @@ GEM
      activesupport (>= 5.1)
      haml (>= 4.0.6)
      railties (>= 5.1)
-    haml_lint (0.66.0)
+    haml_lint (0.67.0)
      haml (>= 5.0)
      parallel (~> 1.10)
      rainbow
@ -337,7 +340,7 @@ GEM
      activesupport (>= 3.0)
      nokogiri (>= 1.6)
    io-console (0.8.1)
-    irb (1.15.2)
+    irb (1.15.3)
      pp (>= 0.6.0)
      rdoc (>= 4.0.0)
      reline (>= 0.4.2)
@ -346,7 +349,7 @@ GEM
      azure-blob (~> 0.5.2)
      hashie (~> 5.0)
    jmespath (1.6.2)
-    json (2.15.1)
+    json (2.15.2)
    json-canonicalization (1.0.0)
    json-jwt (1.17.0)
      activesupport (>= 4.2)
@ -443,7 +446,7 @@ GEM
    mime-types-data (3.2025.0924)
    mini_mime (1.1.5)
    mini_portile2 (2.8.9)
-    minitest (5.25.5)
+    minitest (5.26.0)
    msgpack (1.8.0)
    multi_json (1.17.0)
    mutex_m (0.3.0)
@ -465,7 +468,7 @@ GEM
    nokogiri (1.18.10)
      mini_portile2 (~> 2.8.2)
      racc (~> 1.4)
-    oj (3.16.11)
+    oj (3.16.12)
      bigdecimal (>= 3.0)
      ostruct (>= 0.2)
    omniauth (2.1.4)
@ -512,9 +515,9 @@ GEM
      opentelemetry-common (~> 0.20)
      opentelemetry-sdk (~> 1.10)
      opentelemetry-semantic_conventions
-    opentelemetry-helpers-sql (0.2.0)
+    opentelemetry-helpers-sql (0.3.0)
      opentelemetry-api (~> 1.7)
-    opentelemetry-helpers-sql-obfuscation (0.4.0)
+    opentelemetry-helpers-sql-obfuscation (0.5.0)
      opentelemetry-common (~> 0.21)
    opentelemetry-instrumentation-action_mailer (0.6.1)
      opentelemetry-instrumentation-active_support (~> 0.10)
@ -548,7 +551,7 @@ GEM
      opentelemetry-instrumentation-base (~> 0.25)
    opentelemetry-instrumentation-net_http (0.26.0)
      opentelemetry-instrumentation-base (~> 0.25)
-    opentelemetry-instrumentation-pg (0.32.0)
+    opentelemetry-instrumentation-pg (0.33.0)
      opentelemetry-helpers-sql
      opentelemetry-helpers-sql-obfuscation
      opentelemetry-instrumentation-base (~> 0.25)
@ -581,7 +584,7 @@ GEM
    ox (2.14.23)
      bigdecimal (>= 3.0)
    parallel (1.27.0)
-    parser (3.3.9.0)
+    parser (3.3.10.0)
      ast (~> 2.4.1)
      racc
    parslet (2.0.0)
@ -590,7 +593,7 @@ GEM
    pg (1.6.2)
    pghero (3.7.0)
      activerecord (>= 7.1)
-    playwright-ruby-client (1.55.0)
+    playwright-ruby-client (1.56.0)
      concurrent-ruby (>= 1.1.6)
      mime-types (>= 3.0)
    pp (0.6.3)
@ -604,7 +607,7 @@ GEM
      net-smtp
      premailer (~> 1.7, >= 1.7.9)
    prettyprint (0.2.0)
-    prism (1.5.2)
+    prism (1.6.0)
    prometheus_exporter (2.3.0)
      webrick
    propshaft (1.3.1)
@ -621,7 +624,7 @@ GEM
      activesupport (>= 3.0.0)
    raabro (1.4.0)
    racc (1.8.1)
-    rack (3.2.3)
+    rack (3.2.4)
    rack-attack (6.8.0)
      rack (>= 1.0, < 4)
    rack-cors (3.0.0)
@ -691,7 +694,7 @@ GEM
      readline (~> 0.0)
    rdf-normalize (0.7.0)
      rdf (~> 3.3)
-    rdoc (6.15.0)
+    rdoc (6.15.1)
      erb
      psych (>= 4.0.0)
      tsort
@ -706,9 +709,9 @@ GEM
      io-console (~> 0.5)
    request_store (1.7.0)
      rack (>= 1.4)
-    responders (3.1.1)
-      actionpack (>= 5.2)
-      railties (>= 5.2)
+    responders (3.2.0)
+      actionpack (>= 7.0)
+      railties (>= 7.0)
    rexml (3.4.4)
    rotp (6.3.0)
    rouge (4.6.1)
@ -745,7 +748,7 @@ GEM
      rspec-mocks (~> 3.0)
      sidekiq (>= 5, < 9)
    rspec-support (3.13.6)
-    rubocop (1.81.6)
+    rubocop (1.81.7)
      json (~> 2.3)
      language_server-protocol (~> 3.17.0.2)
      lint_roller (~> 1.1.0)
@ -791,7 +794,7 @@ GEM
    ruby-vips (2.2.5)
      ffi (~> 1.12)
      logger
-    rubyzip (3.2.1)
+    rubyzip (3.2.2)
    rufus-scheduler (3.9.2)
      fugit (~> 1.1, >= 1.11.1)
    safety_net_attestation (0.5.0)
@ -803,9 +806,9 @@ GEM
      activerecord (>= 4.0.0)
      railties (>= 4.0.0)
    securerandom (0.4.1)
-    shoulda-matchers (6.5.0)
-      activesupport (>= 5.2.0)
-    sidekiq (8.0.8)
+    shoulda-matchers (7.0.1)
+      activesupport (>= 7.1)
+    sidekiq (8.0.9)
      connection_pool (>= 2.5.0)
      json (>= 2.9.0)
      logger (>= 1.6.2)
@ -822,9 +825,9 @@ GEM
      thor (>= 1.0, < 3.0)
    simple-navigation (4.4.0)
      activesupport (>= 2.3.2)
-    simple_form (5.3.1)
-      actionpack (>= 5.2)
-      activemodel (>= 5.2)
+    simple_form (5.4.0)
+      actionpack (>= 7.0)
+      activemodel (>= 7.0)
    simplecov (0.22.0)
      docile (~> 1.1)
      simplecov-html (~> 0.11)
@ -835,7 +838,7 @@ GEM
    stackprof (0.2.27)
    starry (0.2.0)
      base64
-    stoplight (5.4.0)
+    stoplight (5.5.0)
      zeitwerk
    stringio (3.1.7)
    strong_migrations (2.5.1)
@ -883,7 +886,7 @@ GEM
    unicode-display_width (3.2.0)
      unicode-emoji (~> 4.1)
    unicode-emoji (4.1.0)
-    uri (1.0.4)
+    uri (1.1.1)
    useragent (0.16.11)
    validate_url (1.0.15)
      activemodel (>= 3.0.0)
@ -911,7 +914,7 @@ GEM
      activesupport
      faraday (~> 2.0)
      faraday-follow_redirects
-    webmock (3.25.1)
+    webmock (3.26.1)
      addressable (>= 2.8.0)
      crack (>= 0.3.2)
      hashdiff (>= 0.4.0, < 2.0.0)
@ -933,7 +936,7 @@ DEPENDENCIES
  active_model_serializers (~> 0.10)
  addressable (~> 2.8)
  annotaterb (~> 4.13)
-  aws-sdk-core (< 3.216.0)
+  aws-sdk-core
  aws-sdk-s3 (~> 1.123)
  better_errors (~> 2.9)
  binding_of_caller (~> 1.0)
@ -1018,7 +1021,7 @@ DEPENDENCIES
  opentelemetry-instrumentation-http (~> 0.27.0)
  opentelemetry-instrumentation-http_client (~> 0.26.0)
  opentelemetry-instrumentation-net_http (~> 0.26.0)
-  opentelemetry-instrumentation-pg (~> 0.32.0)
+  opentelemetry-instrumentation-pg (~> 0.33.0)
  opentelemetry-instrumentation-rack (~> 0.29.0)
  opentelemetry-instrumentation-rails (~> 0.39.0)
  opentelemetry-instrumentation-redis (~> 0.28.0)
@ -1028,7 +1031,7 @@ DEPENDENCIES
  parslet
  pg (~> 1.5)
  pghero
-  playwright-ruby-client (= 1.55.0)
+  playwright-ruby-client (= 1.56.0)
  premailer-rails
  prometheus_exporter (~> 2.2)
  propshaft
--- a/SECURITY.md
+++ b/SECURITY.md
@ -15,7 +15,8 @@ A "vulnerability in Mastodon" is a vulnerability in the code distributed through

 | Version | Supported        |
 | ------- | ---------------- |
+| 4.5.x   | Yes              |
 | 4.4.x   | Yes              |
-| 4.3.x   | Yes              |
+| 4.3.x   | Until 2026-05-06 |
 | 4.2.x   | Until 2026-01-08 |
 | < 4.2   | No               |
--- a/app/controllers/activitypub/quote_authorizations_controller.rb
+++ b/app/controllers/activitypub/quote_authorizations_controller.rb
@ -9,7 +9,7 @@ class ActivityPub::QuoteAuthorizationsController < ActivityPub::BaseController
  before_action :set_quote_authorization

  def show
-    expires_in 30.seconds, public: true if @quote.status.distributable? && public_fetch_mode?
+    expires_in 30.seconds, public: true if @quote.quoted_status.distributable? && public_fetch_mode?
    render json: @quote, serializer: ActivityPub::QuoteAuthorizationSerializer, adapter: ActivityPub::Adapter, content_type: 'application/activity+json'
  end

@ -23,7 +23,7 @@ class ActivityPub::QuoteAuthorizationsController < ActivityPub::BaseController
    @quote = Quote.accepted.where(quoted_account: @account).find(params[:id])
    return not_found unless @quote.status.present? && @quote.quoted_status.present?

-    authorize @quote.status, :show?
+    authorize @quote.quoted_status, :show?
  rescue Mastodon::NotPermittedError
    not_found
  end
--- a/app/controllers/api/v1/statuses_controller.rb
+++ b/app/controllers/api/v1/statuses_controller.rb
@ -66,7 +66,7 @@ class Api::V1::StatusesController < Api::BaseController
    if async_refresh.running?
      add_async_refresh_header(async_refresh)
    elsif !current_account.nil? && @status.should_fetch_replies?
-      add_async_refresh_header(AsyncRefresh.create(refresh_key))
+      add_async_refresh_header(AsyncRefresh.create(refresh_key, count_results: true))

      WorkerBatch.new.within do |batch|
        batch.connect(refresh_key, threshold: 1.0)
@ -126,10 +126,11 @@ class Api::V1::StatusesController < Api::BaseController
    @status = Status.where(account: current_account).find(params[:id])
    authorize @status, :destroy?

+    json = render_to_body json: @status, serializer: REST::StatusSerializer, source_requested: true
+
    @status.discard_with_reblogs
    StatusPin.find_by(status: @status)&.destroy
    @status.account.statuses_count = @status.account.statuses_count - 1
-    json = render_to_body json: @status, serializer: REST::StatusSerializer, source_requested: true

    RemovalWorker.perform_async(@status.id, { 'redraft' => !truthy_param?(:delete_media) })

--- a/app/controllers/follower_accounts_controller.rb
+++ b/app/controllers/follower_accounts_controller.rb
@ -7,6 +7,7 @@ class FollowerAccountsController < ApplicationController
  vary_by -> { public_fetch_mode? ? 'Accept, Accept-Language, Cookie' : 'Accept, Accept-Language, Cookie, Signature' }

  before_action :require_account_signature!, if: -> { request.format == :json && authorized_fetch_mode? }
+  before_action :protect_hidden_collections, if: -> { request.format.json? }

  skip_around_action :set_locale, if: -> { request.format == :json }
  skip_before_action :require_functional!, unless: :limited_federation_mode?
@ -18,8 +19,6 @@ class FollowerAccountsController < ApplicationController
      end

      format.json do
-        raise Mastodon::NotPermittedError if page_requested? && @account.hide_collections?
-
        expires_in(page_requested? ? 0 : 3.minutes, public: public_fetch_mode?)

        render json: collection_presenter,
@ -41,6 +40,10 @@ class FollowerAccountsController < ApplicationController
    @follows = scope.recent.page(params[:page]).per(FOLLOW_PER_PAGE).preload(:account)
  end

+  def protect_hidden_collections
+    raise Mastodon::NotPermittedError if page_requested? && @account.hide_collections?
+  end
+
  def page_requested?
    params[:page].present?
  end
--- a/app/controllers/following_accounts_controller.rb
+++ b/app/controllers/following_accounts_controller.rb
@ -7,6 +7,7 @@ class FollowingAccountsController < ApplicationController
  vary_by -> { public_fetch_mode? ? 'Accept, Accept-Language, Cookie' : 'Accept, Accept-Language, Cookie, Signature' }

  before_action :require_account_signature!, if: -> { request.format == :json && authorized_fetch_mode? }
+  before_action :protect_hidden_collections, if: -> { request.format.json? }

  skip_around_action :set_locale, if: -> { request.format == :json }
  skip_before_action :require_functional!, unless: :limited_federation_mode?
@ -18,11 +19,6 @@ class FollowingAccountsController < ApplicationController
      end

      format.json do
-        if page_requested? && @account.hide_collections?
-          forbidden
-          next
-        end
-
        expires_in(page_requested? ? 0 : 3.minutes, public: public_fetch_mode?)

        render json: collection_presenter,
@ -44,6 +40,10 @@ class FollowingAccountsController < ApplicationController
    @follows = scope.recent.page(params[:page]).per(FOLLOW_PER_PAGE).preload(:target_account)
  end

+  def protect_hidden_collections
+    raise Mastodon::NotPermittedError if page_requested? && @account.hide_collections?
+  end
+
  def page_requested?
    params[:page].present?
  end
--- a/app/javascript/entrypoints/public.tsx
+++ b/app/javascript/entrypoints/public.tsx
@ -70,7 +70,7 @@ function loaded() {
  };

  document.querySelectorAll('.emojify').forEach((content) => {
-    content.innerHTML = emojify(content.innerHTML, {}, true); // Force emojify as public doesn't load the new emoji system.
+    content.innerHTML = emojify(content.innerHTML);
  });

  document
--- a/app/javascript/mastodon/actions/compose.js
+++ b/app/javascript/mastodon/actions/compose.js
@ -5,6 +5,7 @@ import { throttle } from 'lodash';

 import api from 'mastodon/api';
 import { browserHistory } from 'mastodon/components/router';
+import { countableText } from 'mastodon/features/compose/util/counter';
 import { search as emojiSearch } from 'mastodon/features/emoji/emoji_mart_search_light';
 import { tagHistory } from 'mastodon/settings';

@ -55,7 +56,6 @@ export const COMPOSE_UNMOUNT = 'COMPOSE_UNMOUNT';
 export const COMPOSE_SENSITIVITY_CHANGE  = 'COMPOSE_SENSITIVITY_CHANGE';
 export const COMPOSE_SPOILERNESS_CHANGE  = 'COMPOSE_SPOILERNESS_CHANGE';
 export const COMPOSE_SPOILER_TEXT_CHANGE = 'COMPOSE_SPOILER_TEXT_CHANGE';
-export const COMPOSE_VISIBILITY_CHANGE   = 'COMPOSE_VISIBILITY_CHANGE';
 export const COMPOSE_COMPOSING_CHANGE    = 'COMPOSE_COMPOSING_CHANGE';
 export const COMPOSE_LANGUAGE_CHANGE     = 'COMPOSE_LANGUAGE_CHANGE';

@ -88,6 +88,7 @@ const messages = defineMessages({
  open: { id: 'compose.published.open', defaultMessage: 'Open' },
  published: { id: 'compose.published.body', defaultMessage: 'Post published.' },
  saved: { id: 'compose.saved.body', defaultMessage: 'Post saved.' },
+  blankPostError: { id: 'compose.error.blank_post', defaultMessage: 'Post can\'t be blank.' },
 });

 export const ensureComposeIsVisible = (getState) => {
@ -197,7 +198,15 @@ export function submitCompose(successCallback) {
    const hasQuote = !!getState().getIn(['compose', 'quoted_status_id']);
    const spoiler_text = getState().getIn(['compose', 'spoiler']) ? getState().getIn(['compose', 'spoiler_text'], '') : '';

-    if (!(status?.length || media.size !== 0 || (hasQuote && spoiler_text?.length))) {
+    const fulltext = `${spoiler_text ?? ''}${countableText(status ?? '')}`;
+    const hasText = fulltext.trim().length > 0;
+
+    if (!(hasText || media.size !== 0 || (hasQuote && spoiler_text?.length))) {
+      dispatch(showAlert({
+        message: messages.blankPostError,
+      }));
+      dispatch(focusCompose());
+
      return;
    }

@ -784,13 +793,6 @@ export function changeComposeSpoilerText(text) {
  };
 }

-export function changeComposeVisibility(value) {
-  return {
-    type: COMPOSE_VISIBILITY_CHANGE,
-    value,
-  };
-}
-
 export function insertEmojiCompose(position, emoji, needsSpace) {
  return {
    type: COMPOSE_EMOJI_INSERT,
--- a/app/javascript/mastodon/actions/compose_typed.ts
+++ b/app/javascript/mastodon/actions/compose_typed.ts
@ -13,10 +13,11 @@ import {
 } from 'mastodon/store/typed_functions';

 import type { ApiQuotePolicy } from '../api_types/quotes';
-import type { Status } from '../models/status';
+import type { Status, StatusVisibility } from '../models/status';
+import type { RootState } from '../store';

 import { showAlert } from './alerts';
-import { focusCompose } from './compose';
+import { changeCompose, focusCompose } from './compose';
 import { importFetchedStatuses } from './importer';
 import { openModal } from './modal';

@ -41,6 +42,10 @@ const messages = defineMessages({
    id: 'quote_error.unauthorized',
    defaultMessage: 'You are not authorized to quote this post.',
  },
+  quoteErrorPrivateMention: {
+    id: 'quote_error.private_mentions',
+    defaultMessage: 'Quoting is not allowed with direct mentions.',
+  },
 });

 type SimulatedMediaAttachmentJSON = ApiMediaAttachmentJSON & {
@ -67,6 +72,39 @@ const simulateModifiedApiResponse = (
  return data;
 };

+export const changeComposeVisibility = createAppThunk(
+  'compose/visibility_change',
+  (visibility: StatusVisibility, { dispatch, getState }) => {
+    if (visibility !== 'direct') {
+      return visibility;
+    }
+
+    const state = getState();
+    const quotedStatusId = state.compose.get('quoted_status_id') as
+      | string
+      | null;
+    if (!quotedStatusId) {
+      return visibility;
+    }
+
+    // Remove the quoted status
+    dispatch(quoteComposeCancel());
+    const quotedStatus = state.statuses.get(quotedStatusId) as Status | null;
+    if (!quotedStatus) {
+      return visibility;
+    }
+
+    // Append the quoted status URL to the compose text
+    const url = quotedStatus.get('url') as string;
+    const text = state.compose.get('text') as string;
+    if (!text.includes(url)) {
+      const newText = text.trim() ? `${text}\n\n${url}` : url;
+      dispatch(changeCompose(newText));
+    }
+    return visibility;
+  },
+);
+
 export const changeUploadCompose = createDataLoadingThunk(
  'compose/changeUpload',
  async (
@ -130,6 +168,8 @@ export const quoteComposeByStatus = createAppThunk(

    if (composeState.get('id')) {
      dispatch(showAlert({ message: messages.quoteErrorEdit }));
+    } else if (composeState.get('privacy') === 'direct') {
+      dispatch(showAlert({ message: messages.quoteErrorPrivateMention }));
    } else if (composeState.get('poll')) {
      dispatch(showAlert({ message: messages.quoteErrorPoll }));
    } else if (
@ -173,6 +213,17 @@ export const quoteComposeById = createAppThunk(
  },
 );

+const composeStateForbidsLink = (composeState: RootState['compose']) => {
+  return (
+    composeState.get('quoted_status_id') ||
+    composeState.get('is_submitting') ||
+    composeState.get('poll') ||
+    composeState.get('is_uploading') ||
+    composeState.get('id') ||
+    composeState.get('privacy') === 'direct'
+  );
+};
+
 export const pasteLinkCompose = createDataLoadingThunk(
  'compose/pasteLink',
  async ({ url }: { url: string }) => {
@ -183,15 +234,12 @@ export const pasteLinkCompose = createDataLoadingThunk(
      limit: 2,
    });
  },
-  (data, { dispatch, getState }) => {
+  (data, { dispatch, getState, requestId }) => {
    const composeState = getState().compose;

    if (
-      composeState.get('quoted_status_id') ||
-      composeState.get('is_submitting') ||
-      composeState.get('poll') ||
-      composeState.get('is_uploading') ||
-      composeState.get('id')
+      composeStateForbidsLink(composeState) ||
+      composeState.get('fetching_link') !== requestId // Request has been cancelled
    )
      return;

@ -207,6 +255,17 @@ export const pasteLinkCompose = createDataLoadingThunk(
      dispatch(quoteComposeById(data.statuses[0].id));
    }
  },
+  {
+    useLoadingBar: false,
+    condition: (_, { getState }) =>
+      !getState().compose.get('fetching_link') &&
+      !composeStateForbidsLink(getState().compose),
+  },
+);
+
+// Ideally this would cancel the action and the HTTP request, but this is good enough
+export const cancelPasteLinkCompose = createAction(
+  'compose/cancelPasteLinkCompose',
 );

 export const quoteComposeCancel = createAction('compose/quoteComposeCancel');
--- a/app/javascript/mastodon/actions/importer/normalizer.js
+++ b/app/javascript/mastodon/actions/importer/normalizer.js
@ -1,8 +1,5 @@
 import escapeTextContentForBrowser from 'escape-html';

-import { makeEmojiMap } from 'mastodon/models/custom_emoji';
-
-import emojify from '../../features/emoji/emoji';
 import { expandSpoilers } from '../../initial_state';

 const domParser = new DOMParser();
@ -88,11 +85,10 @@ export function normalizeStatus(status, normalOldStatus) {

    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');
-    const emojiMap      = makeEmojiMap(normalStatus.emojis);

    normalStatus.search_index = domParser.parseFromString(searchContent, 'text/html').documentElement.textContent;
-    normalStatus.contentHtml  = emojify(normalStatus.content, emojiMap);
-    normalStatus.spoilerHtml  = emojify(escapeTextContentForBrowser(spoilerText), emojiMap);
+    normalStatus.contentHtml  = normalStatus.content;
+    normalStatus.spoilerHtml  = escapeTextContentForBrowser(spoilerText);
    normalStatus.hidden       = expandSpoilers ? false : spoilerText.length > 0 || normalStatus.sensitive;

    // Remove quote fallback link from the DOM so it doesn't mess with paragraph margins
@ -128,14 +124,12 @@ export function normalizeStatus(status, normalOldStatus) {
 }

 export function normalizeStatusTranslation(translation, status) {
-  const emojiMap = makeEmojiMap(status.get('emojis').toJS());
-
  const normalTranslation = {
    detected_source_language: translation.detected_source_language,
    language: translation.language,
    provider: translation.provider,
-    contentHtml: emojify(translation.content, emojiMap),
-    spoilerHtml: emojify(escapeTextContentForBrowser(translation.spoiler_text), emojiMap),
+    contentHtml: translation.content,
+    spoilerHtml: escapeTextContentForBrowser(translation.spoiler_text),
    spoiler_text: translation.spoiler_text,
  };

@ -149,9 +143,8 @@ export function normalizeStatusTranslation(translation, status) {

 export function normalizeAnnouncement(announcement) {
  const normalAnnouncement = { ...announcement };
-  const emojiMap = makeEmojiMap(normalAnnouncement.emojis);

-  normalAnnouncement.contentHtml = emojify(normalAnnouncement.content, emojiMap);
+  normalAnnouncement.contentHtml = normalAnnouncement.content;

  return normalAnnouncement;
 }
--- a/app/javascript/mastodon/actions/streaming.js
+++ b/app/javascript/mastodon/actions/streaming.js
@ -32,13 +32,20 @@ import {
 const randomUpTo = max =>
  Math.floor(Math.random() * Math.floor(max));

+/**
+ * @typedef {import('mastodon/store').AppDispatch} Dispatch
+ * @typedef {import('mastodon/store').GetState} GetState
+ * @typedef {import('redux').UnknownAction} UnknownAction
+ * @typedef {function(Dispatch, GetState): Promise<void>} FallbackFunction
+ */
+
 /**
 * @param {string} timelineId
 * @param {string} channelName
 * @param {Object.<string, string>} params
 * @param {Object} options
- * @param {function(Function, Function): Promise<void>} [options.fallback]
- * @param {function(): void} [options.fillGaps]
+ * @param {FallbackFunction} [options.fallback]
+ * @param {function(): UnknownAction} [options.fillGaps]
 * @param {function(object): boolean} [options.accept]
 * @returns {function(): void}
 */
@ -46,13 +53,14 @@ export const connectTimelineStream = (timelineId, channelName, params = {}, opti
  const { messages } = getLocale();

  return connectStream(channelName, params, (dispatch, getState) => {
+    // @ts-ignore
    const locale = getState().getIn(['meta', 'locale']);

    // @ts-expect-error
    let pollingId;

    /**
-     * @param {function(Function, Function): Promise<void>} fallback
+     * @param {FallbackFunction} fallback
     */

    const useFallback = async fallback => {
@ -132,7 +140,7 @@ export const connectTimelineStream = (timelineId, channelName, params = {}, opti
 };

 /**
- * @param {Function} dispatch
+ * @param {Dispatch} dispatch
 */
 async function refreshHomeTimelineAndNotification(dispatch) {
  await dispatch(expandHomeTimeline({ maxId: undefined }));
@ -151,7 +159,11 @@ async function refreshHomeTimelineAndNotification(dispatch) {
 * @returns {function(): void}
 */
 export const connectUserStream = () =>
-  connectTimelineStream('home', 'user', {}, { fallback: refreshHomeTimelineAndNotification, fillGaps: fillHomeTimelineGaps });
+  connectTimelineStream('home', 'user', {}, {
+    fallback: refreshHomeTimelineAndNotification,
+    // @ts-expect-error
+    fillGaps: fillHomeTimelineGaps
+  });

 /**
 * @param {Object} options
@ -159,7 +171,10 @@ export const connectUserStream = () =>
 * @returns {function(): void}
 */
 export const connectCommunityStream = ({ onlyMedia } = {}) =>
-  connectTimelineStream(`community${onlyMedia ? ':media' : ''}`, `public:local${onlyMedia ? ':media' : ''}`, {}, { fillGaps: () => (fillCommunityTimelineGaps({ onlyMedia })) });
+  connectTimelineStream(`community${onlyMedia ? ':media' : ''}`, `public:local${onlyMedia ? ':media' : ''}`, {}, {
+    // @ts-expect-error
+    fillGaps: () => (fillCommunityTimelineGaps({ onlyMedia }))
+  });

 /**
 * @param {Object} options
@ -168,7 +183,10 @@ export const connectCommunityStream = ({ onlyMedia } = {}) =>
 * @returns {function(): void}
 */
 export const connectPublicStream = ({ onlyMedia, onlyRemote } = {}) =>
-  connectTimelineStream(`public${onlyRemote ? ':remote' : ''}${onlyMedia ? ':media' : ''}`, `public${onlyRemote ? ':remote' : ''}${onlyMedia ? ':media' : ''}`, {}, { fillGaps: () => fillPublicTimelineGaps({ onlyMedia, onlyRemote }) });
+  connectTimelineStream(`public${onlyRemote ? ':remote' : ''}${onlyMedia ? ':media' : ''}`, `public${onlyRemote ? ':remote' : ''}${onlyMedia ? ':media' : ''}`, {}, {
+    // @ts-expect-error
+    fillGaps: () => fillPublicTimelineGaps({ onlyMedia, onlyRemote })
+  });

 /**
 * @param {string} columnId
@ -191,4 +209,7 @@ export const connectDirectStream = () =>
 * @returns {function(): void}
 */
 export const connectListStream = listId =>
-  connectTimelineStream(`list:${listId}`, 'list', { list: listId }, { fillGaps: () => fillListTimelineGaps(listId) });
+  connectTimelineStream(`list:${listId}`, 'list', { list: listId }, {
+    // @ts-expect-error
+    fillGaps: () => fillListTimelineGaps(listId)
+  });
--- a/app/javascript/mastodon/components/account_bio.tsx
+++ b/app/javascript/mastodon/components/account_bio.tsx
@ -1,11 +1,6 @@
-import { useCallback } from 'react';
-
 import classNames from 'classnames';

-import { useLinks } from 'mastodon/hooks/useLinks';
-
 import { useAppSelector } from '../store';
-import { isModernEmojiEnabled } from '../utils/environment';

 import { EmojiHTML } from './emoji/html';
 import { useElementHandledLink } from './status/handled_link';
@ -21,22 +16,6 @@ export const AccountBio: React.FC<AccountBioProps> = ({
  accountId,
  showDropdown = false,
 }) => {
-  const handleClick = useLinks(showDropdown);
-  const handleNodeChange = useCallback(
-    (node: HTMLDivElement | null) => {
-      if (
-        !showDropdown ||
-        !node ||
-        node.childNodes.length === 0 ||
-        isModernEmojiEnabled()
-      ) {
-        return;
-      }
-      addDropdownToHashtags(node, accountId);
-    },
-    [showDropdown, accountId],
-  );
-
  const htmlHandlers = useElementHandledLink({
    hashtagAccountId: showDropdown ? accountId : undefined,
  });
@ -62,30 +41,7 @@ export const AccountBio: React.FC<AccountBioProps> = ({
      htmlString={note}
      extraEmojis={extraEmojis}
      className={classNames(className, 'translate')}
-      onClickCapture={handleClick}
-      ref={handleNodeChange}
      {...htmlHandlers}
    />
  );
 };
-
-function addDropdownToHashtags(node: HTMLElement | null, accountId: string) {
-  if (!node) {
-    return;
-  }
-  for (const childNode of node.childNodes) {
-    if (!(childNode instanceof HTMLElement)) {
-      continue;
-    }
-    if (
-      childNode instanceof HTMLAnchorElement &&
-      (childNode.classList.contains('hashtag') ||
-        childNode.innerText.startsWith('#')) &&
-      !childNode.dataset.menuHashtag
-    ) {
-      childNode.dataset.menuHashtag = accountId;
-    } else if (childNode.childNodes.length > 0) {
-      addDropdownToHashtags(childNode, accountId);
-    }
-  }
-}
--- a/app/javascript/mastodon/components/alert/index.tsx
+++ b/app/javascript/mastodon/components/alert/index.tsx
@ -49,7 +49,11 @@ export const Alert: React.FC<{
      </span>

      {hasAction && (
-        <button className='notification-bar__action' onClick={onActionClick}>
+        <button
+          className='notification-bar__action'
+          onClick={onActionClick}
+          type='button'
+        >
          {action}
        </button>
      )}
--- a/app/javascript/mastodon/components/alt_text_badge.tsx
+++ b/app/javascript/mastodon/components/alt_text_badge.tsx
@ -47,7 +47,7 @@ export const AltTextBadge: React.FC<{ description: string }> = ({
        rootClose
        onHide={handleClose}
        show={open}
-        target={anchorRef.current}
+        target={anchorRef}
        placement='top-end'
        flip
        offset={offset}
--- a/app/javascript/mastodon/components/button/index.tsx
+++ b/app/javascript/mastodon/components/button/index.tsx
@ -78,6 +78,7 @@ export const Button: React.FC<Props> = ({
      aria-live={loading !== undefined ? 'polite' : undefined}
      onClick={handleClick}
      title={title}
+      // eslint-disable-next-line react/button-has-type -- set correctly via TS
      type={type}
      {...props}
    >
--- a/app/javascript/mastodon/components/carousel/carousel.stories.tsx
+++ b/app/javascript/mastodon/components/carousel/carousel.stories.tsx
@ -0,0 +1,126 @@
+import type { FC } from 'react';
+
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { fn, userEvent, expect } from 'storybook/test';
+
+import type { CarouselProps } from './index';
+import { Carousel } from './index';
+
+interface TestSlideProps {
+  id: number;
+  text: string;
+  color: string;
+}
+
+const TestSlide: FC<TestSlideProps & { active: boolean }> = ({
+  active,
+  text,
+  color,
+}) => (
+  <div
+    className='test-slide'
+    style={{
+      backgroundColor: active ? color : undefined,
+    }}
+  >
+    {text}
+  </div>
+);
+
+const slides: TestSlideProps[] = [
+  {
+    id: 1,
+    text: 'first',
+    color: 'red',
+  },
+  {
+    id: 2,
+    text: 'second',
+    color: 'pink',
+  },
+  {
+    id: 3,
+    text: 'third',
+    color: 'orange',
+  },
+];
+
+type StoryProps = Pick<
+  CarouselProps<TestSlideProps>,
+  'items' | 'renderItem' | 'emptyFallback' | 'onChangeSlide'
+>;
+
+const meta = {
+  title: 'Components/Carousel',
+  args: {
+    items: slides,
+    renderItem(item, active) {
+      return <TestSlide {...item} active={active} key={item.id} />;
+    },
+    onChangeSlide: fn(),
+    emptyFallback: 'No slides available',
+  },
+  render(args) {
+    return (
+      <>
+        <Carousel {...args} />
+        <style>
+          {`.test-slide {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            color: white;
+            font-size: 24px;
+            font-weight: bold;
+            min-height: 100px;
+            transition: background-color 0.3s;
+            background-color: black;
+          }`}
+        </style>
+      </>
+    );
+  },
+  argTypes: {
+    emptyFallback: {
+      type: 'string',
+    },
+  },
+  tags: ['test'],
+} satisfies Meta<StoryProps>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+  async play({ args, canvas }) {
+    const nextButton = await canvas.findByRole('button', { name: /next/i });
+    const slides = await canvas.findAllByRole('group');
+    await expect(slides).toHaveLength(slides.length);
+
+    await userEvent.click(nextButton);
+    await expect(args.onChangeSlide).toHaveBeenCalledWith(1, slides[1]);
+
+    await userEvent.click(nextButton);
+    await expect(args.onChangeSlide).toHaveBeenCalledWith(2, slides[2]);
+
+    // Wrap around
+    await userEvent.click(nextButton);
+    await expect(args.onChangeSlide).toHaveBeenCalledWith(0, slides[0]);
+  },
+};
+
+export const DifferentHeights: Story = {
+  args: {
+    items: slides.map((props, index) => ({
+      ...props,
+      styles: { height: 100 + index * 100 },
+    })),
+  },
+};
+
+export const NoSlides: Story = {
+  args: {
+    items: [],
+  },
+};
--- a/app/javascript/mastodon/components/carousel/index.tsx
+++ b/app/javascript/mastodon/components/carousel/index.tsx
@ -0,0 +1,244 @@
+import { useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';
+import type {
+  ComponentPropsWithoutRef,
+  ComponentType,
+  ReactElement,
+  ReactNode,
+} from 'react';
+
+import type { MessageDescriptor } from 'react-intl';
+import { defineMessages, useIntl } from 'react-intl';
+
+import classNames from 'classnames';
+
+import { usePrevious } from '@dnd-kit/utilities';
+import { animated, useSpring } from '@react-spring/web';
+import { useDrag } from '@use-gesture/react';
+
+import type { CarouselPaginationProps } from './pagination';
+import { CarouselPagination } from './pagination';
+
+import './styles.scss';
+
+const defaultMessages = defineMessages({
+  previous: { id: 'lightbox.previous', defaultMessage: 'Previous' },
+  next: { id: 'lightbox.next', defaultMessage: 'Next' },
+  current: {
+    id: 'carousel.current',
+    defaultMessage: '<sr>Slide</sr> {current, number} / {max, number}',
+  },
+  slide: {
+    id: 'carousel.slide',
+    defaultMessage: 'Slide {current, number} of {max, number}',
+  },
+});
+
+export type MessageKeys = keyof typeof defaultMessages;
+
+export interface CarouselSlideProps {
+  id: string | number;
+}
+
+export type RenderSlideFn<
+  SlideProps extends CarouselSlideProps = CarouselSlideProps,
+> = (item: SlideProps, active: boolean, index: number) => ReactElement;
+
+export interface CarouselProps<
+  SlideProps extends CarouselSlideProps = CarouselSlideProps,
+> {
+  items: SlideProps[];
+  renderItem: RenderSlideFn<SlideProps>;
+  onChangeSlide?: (index: number, ref: Element) => void;
+  paginationComponent?: ComponentType<CarouselPaginationProps> | null;
+  paginationProps?: Partial<CarouselPaginationProps>;
+  messages?: Record<MessageKeys, MessageDescriptor>;
+  emptyFallback?: ReactNode;
+  classNamePrefix?: string;
+  slideClassName?: string;
+}
+
+export const Carousel = <
+  SlideProps extends CarouselSlideProps = CarouselSlideProps,
+>({
+  items,
+  renderItem,
+  onChangeSlide,
+  paginationComponent: Pagination = CarouselPagination,
+  paginationProps = {},
+  messages = defaultMessages,
+  children,
+  emptyFallback = null,
+  className,
+  classNamePrefix = 'carousel',
+  slideClassName,
+  ...wrapperProps
+}: CarouselProps<SlideProps> & ComponentPropsWithoutRef<'div'>) => {
+  // Handle slide change
+  const [slideIndex, setSlideIndex] = useState(0);
+  const wrapperRef = useRef<HTMLDivElement>(null);
+  // Handle slide heights
+  const [currentSlideHeight, setCurrentSlideHeight] = useState(
+    () => wrapperRef.current?.scrollHeight ?? 0,
+  );
+  const previousSlideHeight = usePrevious(currentSlideHeight);
+  const handleSlideChange = useCallback(
+    (direction: number) => {
+      setSlideIndex((prev) => {
+        const max = items.length - 1;
+        let newIndex = prev + direction;
+        if (newIndex < 0) {
+          newIndex = max;
+        } else if (newIndex > max) {
+          newIndex = 0;
+        }
+
+        const slide = wrapperRef.current?.children[newIndex];
+        if (slide) {
+          setCurrentSlideHeight(slide.scrollHeight);
+          if (slide instanceof HTMLElement) {
+            onChangeSlide?.(newIndex, slide);
+          }
+        }
+
+        return newIndex;
+      });
+    },
+    [items.length, onChangeSlide],
+  );
+
+  const observerRef = useRef<ResizeObserver | null>(null);
+  observerRef.current ??= new ResizeObserver(() => {
+    handleSlideChange(0);
+  });
+
+  const wrapperStyles = useSpring({
+    x: `-${slideIndex * 100}%`,
+    height: currentSlideHeight,
+    // Don't animate from zero to the height of the initial slide
+    immediate: !previousSlideHeight,
+  });
+  useLayoutEffect(() => {
+    // Update slide height when the component mounts
+    if (currentSlideHeight === 0) {
+      handleSlideChange(0);
+    }
+  }, [currentSlideHeight, handleSlideChange]);
+
+  // Handle swiping animations
+  const bind = useDrag(
+    ({ swipe: [swipeX] }) => {
+      handleSlideChange(swipeX * -1); // Invert swipe as swiping left loads the next slide.
+    },
+    { pointer: { capture: false } },
+  );
+  const handlePrev = useCallback(() => {
+    handleSlideChange(-1);
+    // We're focusing on the wrapper as the child slides can potentially be inert.
+    // Because of that, only the active slide can be focused anyway.
+    wrapperRef.current?.focus();
+  }, [handleSlideChange]);
+  const handleNext = useCallback(() => {
+    handleSlideChange(1);
+    wrapperRef.current?.focus();
+  }, [handleSlideChange]);
+
+  const intl = useIntl();
+
+  if (items.length === 0) {
+    return emptyFallback;
+  }
+
+  return (
+    <div
+      {...bind()}
+      aria-roledescription='carousel'
+      role='region'
+      className={classNames(classNamePrefix, className)}
+      {...wrapperProps}
+    >
+      <div className={`${classNamePrefix}__header`}>
+        {children}
+        {Pagination && items.length > 1 && (
+          <Pagination
+            current={slideIndex}
+            max={items.length}
+            onNext={handleNext}
+            onPrev={handlePrev}
+            className={`${classNamePrefix}__pagination`}
+            messages={messages}
+            {...paginationProps}
+          />
+        )}
+      </div>
+
+      <animated.div
+        className={`${classNamePrefix}__slides`}
+        ref={wrapperRef}
+        style={wrapperStyles}
+        aria-label={intl.formatMessage(messages.slide, {
+          current: slideIndex + 1,
+          max: items.length,
+        })}
+        tabIndex={-1}
+      >
+        {items.map((itemsProps, index) => (
+          <CarouselSlideWrapper<SlideProps>
+            item={itemsProps}
+            renderItem={renderItem}
+            observer={observerRef.current}
+            index={index}
+            key={`slide-${itemsProps.id}`}
+            className={classNames(`${classNamePrefix}__slide`, slideClassName, {
+              active: index === slideIndex,
+            })}
+            active={index === slideIndex}
+          />
+        ))}
+      </animated.div>
+    </div>
+  );
+};
+
+type CarouselSlideWrapperProps<SlideProps extends CarouselSlideProps> = {
+  observer: ResizeObserver | null;
+  className: string;
+  active: boolean;
+  item: SlideProps;
+  index: number;
+} & Pick<CarouselProps<SlideProps>, 'renderItem'>;
+
+const CarouselSlideWrapper = <SlideProps extends CarouselSlideProps>({
+  observer,
+  className,
+  active,
+  renderItem,
+  item,
+  index,
+}: CarouselSlideWrapperProps<SlideProps>) => {
+  const handleRef = useCallback(
+    (instance: HTMLDivElement | null) => {
+      if (observer && instance) {
+        observer.observe(instance);
+      }
+    },
+    [observer],
+  );
+
+  const children = useMemo(
+    () => renderItem(item, active, index),
+    [renderItem, item, active, index],
+  );
+
+  return (
+    <div
+      ref={handleRef}
+      className={className}
+      role='group'
+      aria-roledescription='slide'
+      inert={active ? undefined : ''}
+      data-index={index}
+    >
+      {children}
+    </div>
+  );
+};
--- a/app/javascript/mastodon/components/carousel/pagination.tsx
+++ b/app/javascript/mastodon/components/carousel/pagination.tsx
@ -0,0 +1,54 @@
+import type { FC, MouseEventHandler } from 'react';
+
+import type { MessageDescriptor } from 'react-intl';
+import { useIntl } from 'react-intl';
+
+import ChevronLeftIcon from '@/material-icons/400-24px/chevron_left.svg?react';
+import ChevronRightIcon from '@/material-icons/400-24px/chevron_right.svg?react';
+
+import { IconButton } from '../icon_button';
+
+import type { MessageKeys } from './index';
+
+export interface CarouselPaginationProps {
+  onNext: MouseEventHandler;
+  onPrev: MouseEventHandler;
+  current: number;
+  max: number;
+  className?: string;
+  messages: Record<MessageKeys, MessageDescriptor>;
+}
+
+export const CarouselPagination: FC<CarouselPaginationProps> = ({
+  onNext,
+  onPrev,
+  current,
+  max,
+  className = '',
+  messages,
+}) => {
+  const intl = useIntl();
+  return (
+    <div className={className}>
+      <IconButton
+        title={intl.formatMessage(messages.previous)}
+        icon='chevron-left'
+        iconComponent={ChevronLeftIcon}
+        onClick={onPrev}
+      />
+      <span aria-live='polite'>
+        {intl.formatMessage(messages.current, {
+          current: current + 1,
+          max,
+          sr: (chunk) => <span className='sr-only'>{chunk}</span>,
+        })}
+      </span>
+      <IconButton
+        title={intl.formatMessage(messages.next)}
+        icon='chevron-right'
+        iconComponent={ChevronRightIcon}
+        onClick={onNext}
+      />
+    </div>
+  );
+};
--- a/app/javascript/mastodon/components/carousel/styles.scss
+++ b/app/javascript/mastodon/components/carousel/styles.scss
@ -0,0 +1,28 @@
+.carousel {
+  gap: 16px;
+  overflow: hidden;
+  touch-action: pan-y;
+
+  &__header {
+    padding: 8px 16px;
+  }
+
+  &__pagination {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 4px;
+  }
+
+  &__slides {
+    display: flex;
+    flex-wrap: nowrap;
+    align-items: start;
+  }
+
+  &__slide {
+    flex: 0 0 100%;
+    width: 100%;
+    overflow: hidden;
+  }
+}
--- a/app/javascript/mastodon/components/column_back_button.tsx
+++ b/app/javascript/mastodon/components/column_back_button.tsx
@ -30,7 +30,7 @@ export const ColumnBackButton: React.FC<{ onClick?: OnClickCallback }> = ({
  const handleClick = useHandleClick(onClick);

  const component = (
-    <button onClick={handleClick} className='column-back-button'>
+    <button onClick={handleClick} className='column-back-button' type='button'>
      <Icon
        id='chevron-left'
        icon={ArrowBackIcon}
--- a/app/javascript/mastodon/components/column_header.tsx
+++ b/app/javascript/mastodon/components/column_header.tsx
@ -53,6 +53,7 @@ const BackButton: React.FC<{
        compact: onlyIcon,
      })}
      aria-label={intl.formatMessage(messages.back)}
+      type='button'
    >
      <Icon
        id='chevron-left'
@ -172,6 +173,7 @@ export const ColumnHeader: React.FC<Props> = ({
      <button
        className='text-btn column-header__setting-btn'
        onClick={handlePin}
+        type='button'
      >
        <Icon id='times' icon={CloseIcon} />{' '}
        <FormattedMessage id='column_header.unpin' defaultMessage='Unpin' />
@ -185,6 +187,7 @@ export const ColumnHeader: React.FC<Props> = ({
          aria-label={intl.formatMessage(messages.moveLeft)}
          className='icon-button column-header__setting-btn'
          onClick={handleMoveLeft}
+          type='button'
        >
          <Icon id='chevron-left' icon={ChevronLeftIcon} />
        </button>
@ -193,6 +196,7 @@ export const ColumnHeader: React.FC<Props> = ({
          aria-label={intl.formatMessage(messages.moveRight)}
          className='icon-button column-header__setting-btn'
          onClick={handleMoveRight}
+          type='button'
        >
          <Icon id='chevron-right' icon={ChevronRightIcon} />
        </button>
@ -203,6 +207,7 @@ export const ColumnHeader: React.FC<Props> = ({
      <button
        className='text-btn column-header__setting-btn'
        onClick={handlePin}
+        type='button'
      >
        <Icon id='plus' icon={AddIcon} />{' '}
        <FormattedMessage id='column_header.pin' defaultMessage='Pin' />
@ -237,6 +242,7 @@ export const ColumnHeader: React.FC<Props> = ({
          collapsed ? messages.show : messages.hide,
        )}
        onClick={handleToggleClick}
+        type='button'
      >
        <i className='icon-with-badge'>
          <Icon
@ -259,7 +265,11 @@ export const ColumnHeader: React.FC<Props> = ({
          <>
            {backButton}

-            <button onClick={handleTitleClick} className='column-header__title'>
+            <button
+              onClick={handleTitleClick}
+              className='column-header__title'
+              type='button'
+            >
              {!backButton && (
                <Icon
                  id={icon}
--- a/app/javascript/mastodon/components/column_search_header.tsx
+++ b/app/javascript/mastodon/components/column_search_header.tsx
@ -1,4 +1,4 @@
-import { useCallback, useState, useEffect, useRef } from 'react';
+import { useCallback, useState, useRef } from 'react';

 import { FormattedMessage } from 'react-intl';

@ -12,11 +12,15 @@ export const ColumnSearchHeader: React.FC<{
  const inputRef = useRef<HTMLInputElement>(null);
  const [value, setValue] = useState('');

-  useEffect(() => {
+  // Reset the component when it turns from active to inactive.
+  // [More on this pattern](https://react.dev/learn/you-might-not-need-an-effect#adjusting-some-state-when-a-prop-changes)
+  const [previousActive, setPreviousActive] = useState(active);
+  if (active !== previousActive) {
+    setPreviousActive(active);
    if (!active) {
      setValue('');
    }
-  }, [active]);
+  }

  const handleChange = useCallback(
    ({ target: { value } }: React.ChangeEvent<HTMLInputElement>) => {
--- a/app/javascript/mastodon/components/copy_paste_text.tsx
+++ b/app/javascript/mastodon/components/copy_paste_text.tsx
@ -74,7 +74,7 @@ export const CopyPasteText: React.FC<{ value: string }> = ({ value }) => {
        onBlur={handleBlur}
      />

-      <button className='button' onClick={handleButtonClick}>
+      <button className='button' onClick={handleButtonClick} type='button'>
        <Icon id='copy' icon={ContentCopyIcon} />{' '}
        {copied ? (
          <FormattedMessage id='copypaste.copied' defaultMessage='Copied' />
--- a/app/javascript/mastodon/components/display_name/display_name.stories.tsx
+++ b/app/javascript/mastodon/components/display_name/display_name.stories.tsx
@ -74,6 +74,6 @@ export const Linked: Story = {
          acct: username,
        })
      : undefined;
-    return <LinkedDisplayName {...args} displayProps={{ account }} />;
+    return <LinkedDisplayName displayProps={{ account, ...args }} />;
  },
 };
--- a/app/javascript/mastodon/components/display_name/no-domain.tsx
+++ b/app/javascript/mastodon/components/display_name/no-domain.tsx
@ -9,9 +9,8 @@ import { Skeleton } from '../skeleton';
 import type { DisplayNameProps } from './index';

 export const DisplayNameWithoutDomain: FC<
-  Omit<DisplayNameProps, 'variant' | 'localDomain'> &
-    ComponentPropsWithoutRef<'span'>
-> = ({ account, className, children, ...props }) => {
+  Omit<DisplayNameProps, 'variant'> & ComponentPropsWithoutRef<'span'>
+> = ({ account, className, children, localDomain: _, ...props }) => {
  return (
    <AnimateEmojiProvider
      {...props}
--- a/app/javascript/mastodon/components/display_name/simple.tsx
+++ b/app/javascript/mastodon/components/display_name/simple.tsx
@ -5,9 +5,8 @@ import { EmojiHTML } from '../emoji/html';
 import type { DisplayNameProps } from './index';

 export const DisplayNameSimple: FC<
-  Omit<DisplayNameProps, 'variant' | 'localDomain'> &
-    ComponentPropsWithoutRef<'span'>
-> = ({ account, ...props }) => {
+  Omit<DisplayNameProps, 'variant'> & ComponentPropsWithoutRef<'span'>
+> = ({ account, localDomain: _, ...props }) => {
  if (!account) {
    return null;
  }
--- a/app/javascript/mastodon/components/dropdown/index.tsx
+++ b/app/javascript/mastodon/components/dropdown/index.tsx
@ -109,7 +109,7 @@ export const Dropdown: FC<
        placement='bottom-start'
        onHide={handleClose}
        flip
-        target={buttonRef.current}
+        target={buttonRef}
        popperConfig={{
          strategy: 'fixed',
          modifiers: [matchWidth],
--- a/app/javascript/mastodon/components/dropdown_menu.tsx
+++ b/app/javascript/mastodon/components/dropdown_menu.tsx
@ -42,16 +42,10 @@ import { IconButton } from './icon_button';

 let id = 0;

-export interface RenderItemFnHandlers {
-  onClick: React.MouseEventHandler;
-  onKeyUp: React.KeyboardEventHandler;
-}
-
 export type RenderItemFn<Item = MenuItem> = (
  item: Item,
  index: number,
-  handlers: RenderItemFnHandlers,
-  focusRefCallback?: (c: HTMLAnchorElement | HTMLButtonElement | null) => void,
+  onClick: React.MouseEventHandler,
 ) => React.ReactNode;

 type ItemClickFn<Item = MenuItem> = (item: Item, index: number) => void;
@ -101,7 +95,6 @@ export const DropdownMenu = <Item = MenuItem,>({
  onItemClick,
 }: DropdownMenuProps<Item>) => {
  const nodeRef = useRef<HTMLDivElement>(null);
-  const focusedItemRef = useRef<HTMLElement | null>(null);

  useEffect(() => {
    const handleDocumentClick = (e: MouseEvent) => {
@ -163,8 +156,11 @@ export const DropdownMenu = <Item = MenuItem,>({
    document.addEventListener('click', handleDocumentClick, { capture: true });
    document.addEventListener('keydown', handleKeyDown, { capture: true });

-    if (focusedItemRef.current && openedViaKeyboard) {
-      focusedItemRef.current.focus({ preventScroll: true });
+    if (openedViaKeyboard) {
+      const firstMenuItem = nodeRef.current?.querySelector<
+        HTMLAnchorElement | HTMLButtonElement
+      >('li:first-child > :is(a, button)');
+      firstMenuItem?.focus({ preventScroll: true });
    }

    return () => {
@ -175,13 +171,6 @@ export const DropdownMenu = <Item = MenuItem,>({
    };
  }, [onClose, openedViaKeyboard]);

-  const handleFocusedItemRef = useCallback(
-    (c: HTMLAnchorElement | HTMLButtonElement | null) => {
-      focusedItemRef.current = c as HTMLElement;
-    },
-    [],
-  );
-
  const handleItemClick = useCallback(
    (e: React.MouseEvent | React.KeyboardEvent) => {
      const i = Number(e.currentTarget.getAttribute('data-index'));
@ -207,15 +196,6 @@ export const DropdownMenu = <Item = MenuItem,>({
    [onClose, onItemClick, items],
  );

-  const handleItemKeyUp = useCallback(
-    (e: React.KeyboardEvent) => {
-      if (e.key === 'Enter' || e.key === ' ') {
-        handleItemClick(e);
-      }
-    },
-    [handleItemClick],
-  );
-
  const nativeRenderItem = (option: Item, i: number) => {
    if (!isMenuItem(option)) {
      return null;
@ -232,11 +212,10 @@ export const DropdownMenu = <Item = MenuItem,>({
    if (isActionItem(option)) {
      element = (
        <button
-          ref={i === 0 ? handleFocusedItemRef : undefined}
          onClick={handleItemClick}
-          onKeyUp={handleItemKeyUp}
          data-index={i}
          aria-disabled={disabled}
+          type='button'
        >
          <DropdownMenuItemContent item={option} />
        </button>
@ -248,9 +227,7 @@ export const DropdownMenu = <Item = MenuItem,>({
          target={option.target ?? '_target'}
          data-method={option.method}
          rel='noopener'
-          ref={i === 0 ? handleFocusedItemRef : undefined}
          onClick={handleItemClick}
-          onKeyUp={handleItemKeyUp}
          data-index={i}
        >
          <DropdownMenuItemContent item={option} />
@ -258,13 +235,7 @@ export const DropdownMenu = <Item = MenuItem,>({
      );
    } else {
      element = (
-        <Link
-          to={option.to}
-          ref={i === 0 ? handleFocusedItemRef : undefined}
-          onClick={handleItemClick}
-          onKeyUp={handleItemKeyUp}
-          data-index={i}
-        >
+        <Link to={option.to} onClick={handleItemClick} data-index={i}>
          <DropdownMenuItemContent item={option} />
        </Link>
      );
@ -307,15 +278,7 @@ export const DropdownMenu = <Item = MenuItem,>({
          })}
        >
          {items.map((option, i) =>
-            renderItemMethod(
-              option,
-              i,
-              {
-                onClick: handleItemClick,
-                onKeyUp: handleItemKeyUp,
-              },
-              i === 0 ? handleFocusedItemRef : undefined,
-            ),
+            renderItemMethod(option, i, handleItemClick),
          )}
        </ul>
      )}
@ -399,7 +362,7 @@ export const Dropdown = <Item extends object | null = MenuItem>({
  }, [dispatch, currentId]);

  const handleItemClick = useCallback(
-    (e: React.MouseEvent | React.KeyboardEvent) => {
+    (e: React.MouseEvent) => {
      const i = Number(e.currentTarget.getAttribute('data-index'));
      const item = items?.[i];

@ -420,10 +383,20 @@ export const Dropdown = <Item extends object | null = MenuItem>({
    [handleClose, onItemClick, items],
  );

-  const toggleDropdown = useCallback(
-    (e: React.MouseEvent | React.KeyboardEvent) => {
-      const { type } = e;
+  const isKeypressRef = useRef(false);

+  const handleKeyDown = useCallback((e: React.KeyboardEvent) => {
+    if (e.key === ' ' || e.key === 'Enter') {
+      isKeypressRef.current = true;
+    }
+  }, []);
+
+  const unsetIsKeypress = useCallback(() => {
+    isKeypressRef.current = false;
+  }, []);
+
+  const toggleDropdown = useCallback(
+    (e: React.MouseEvent) => {
      if (open) {
        handleClose();
      } else {
@ -450,10 +423,11 @@ export const Dropdown = <Item extends object | null = MenuItem>({
          dispatch(
            openDropdownMenu({
              id: currentId,
-              keyboard: type !== 'click',
+              keyboard: isKeypressRef.current,
              scrollKey,
            }),
          );
+          isKeypressRef.current = false;
        }
      }
    },
@ -484,6 +458,9 @@ export const Dropdown = <Item extends object | null = MenuItem>({
  const buttonProps = {
    disabled,
    onClick: toggleDropdown,
+    onKeyDown: handleKeyDown,
+    onKeyUp: unsetIsKeypress,
+    onBlur: unsetIsKeypress,
    'aria-expanded': open,
    'aria-controls': menuId,
    ref: buttonRef,
--- a/app/javascript/mastodon/components/edited_timestamp/index.tsx
+++ b/app/javascript/mastodon/components/edited_timestamp/index.tsx
@ -58,17 +58,7 @@ export const EditedTimestamp: React.FC<{
  }, []);

  const renderItem = useCallback(
-    (
-      item: HistoryItem,
-      index: number,
-      {
-        onClick,
-        onKeyUp,
-      }: {
-        onClick: React.MouseEventHandler;
-        onKeyUp: React.KeyboardEventHandler;
-      },
-    ) => {
+    (item: HistoryItem, index: number, onClick: React.MouseEventHandler) => {
      const formattedDate = (
        <RelativeTimestamp
          timestamp={item.get('created_at') as string}
@ -98,7 +88,7 @@ export const EditedTimestamp: React.FC<{
          className='dropdown-menu__item edited-timestamp__history__item'
          key={item.get('created_at') as string}
        >
-          <button data-index={index} onClick={onClick} onKeyUp={onKeyUp}>
+          <button data-index={index} onClick={onClick} type='button'>
            {label}
          </button>
        </li>
@ -118,7 +108,7 @@ export const EditedTimestamp: React.FC<{
      onItemClick={handleItemClick}
      forceDropdown
    >
-      <button className='dropdown-menu__text-button'>
+      <button className='dropdown-menu__text-button' type='button'>
        <FormattedMessage
          id='status.edited'
          defaultMessage='Edited {date}'
--- a/app/javascript/mastodon/components/emoji/context.tsx
+++ b/app/javascript/mastodon/components/emoji/context.tsx
@ -7,8 +7,6 @@ import {
  useState,
 } from 'react';

-import classNames from 'classnames';
-
 import { cleanExtraEmojis } from '@/mastodon/features/emoji/normalize';
 import { autoPlayGif } from '@/mastodon/initial_state';
 import { polymorphicForwardRef } from '@/types/polymorphic';
@ -65,11 +63,7 @@ export const AnimateEmojiProvider = polymorphicForwardRef<
    const parentContext = useContext(AnimateEmojiContext);
    if (parentContext !== null) {
      return (
-        <Wrapper
-          {...props}
-          className={classNames(className, 'animate-parent')}
-          ref={ref}
-        >
+        <Wrapper {...props} className={className} ref={ref}>
          {children}
        </Wrapper>
      );
@ -78,7 +72,7 @@ export const AnimateEmojiProvider = polymorphicForwardRef<
    return (
      <Wrapper
        {...props}
-        className={classNames(className, 'animate-parent')}
+        className={className}
        onMouseEnter={handleEnter}
        onMouseLeave={handleLeave}
        ref={ref}
--- a/app/javascript/mastodon/components/emoji/html.tsx
+++ b/app/javascript/mastodon/components/emoji/html.tsx
@ -1,9 +1,6 @@
 import { useMemo } from 'react';

-import classNames from 'classnames';
-
 import type { CustomEmojiMapArg } from '@/mastodon/features/emoji/types';
-import { isModernEmojiEnabled } from '@/mastodon/utils/environment';
 import type {
  OnAttributeHandler,
  OnElementHandler,
@ -22,7 +19,7 @@ export interface EmojiHTMLProps {
  onAttribute?: OnAttributeHandler;
 }

-export const ModernEmojiHTML = polymorphicForwardRef<'div', EmojiHTMLProps>(
+export const EmojiHTML = polymorphicForwardRef<'div', EmojiHTMLProps>(
  (
    {
      extraEmojis,
@ -59,32 +56,4 @@ export const ModernEmojiHTML = polymorphicForwardRef<'div', EmojiHTMLProps>(
    );
  },
 );
-ModernEmojiHTML.displayName = 'ModernEmojiHTML';
-
-export const LegacyEmojiHTML = polymorphicForwardRef<'div', EmojiHTMLProps>(
-  (props, ref) => {
-    const {
-      as: asElement,
-      htmlString,
-      extraEmojis,
-      className,
-      onElement,
-      onAttribute,
-      ...rest
-    } = props;
-    const Wrapper = asElement ?? 'div';
-    return (
-      <Wrapper
-        {...rest}
-        ref={ref}
-        dangerouslySetInnerHTML={{ __html: htmlString }}
-        className={classNames(className, 'animate-parent')}
-      />
-    );
-  },
-);
-LegacyEmojiHTML.displayName = 'LegacyEmojiHTML';
-
-export const EmojiHTML = isModernEmojiEnabled()
-  ? ModernEmojiHTML
-  : LegacyEmojiHTML;
+EmojiHTML.displayName = 'EmojiHTML';
--- a/app/javascript/mastodon/components/exit_animation_wrapper.tsx
+++ b/app/javascript/mastodon/components/exit_animation_wrapper.tsx
@ -27,22 +27,23 @@ export const ExitAnimationWrapper: React.FC<{
   */
  children: (delayedIsActive: boolean) => React.ReactNode;
 }> = ({ isActive = false, delayMs = 500, withEntryDelay, children }) => {
-  const [delayedIsActive, setDelayedIsActive] = useState(false);
+  const [delayedIsActive, setDelayedIsActive] = useState(
+    isActive && !withEntryDelay,
+  );

  useEffect(() => {
-    if (isActive && !withEntryDelay) {
-      setDelayedIsActive(true);
+    const withDelay = !isActive || withEntryDelay;

-      return () => '';
-    } else {
-      const timeout = setTimeout(() => {
+    const timeout = setTimeout(
+      () => {
        setDelayedIsActive(isActive);
-      }, delayMs);
+      },
+      withDelay ? delayMs : 0,
+    );

-      return () => {
-        clearTimeout(timeout);
-      };
-    }
+    return () => {
+      clearTimeout(timeout);
+    };
  }, [isActive, delayMs, withEntryDelay]);

  if (!isActive && !delayedIsActive) {
--- a/app/javascript/mastodon/components/featured_carousel.tsx
+++ b/app/javascript/mastodon/components/featured_carousel.tsx
@ -1,38 +1,43 @@
-import type { ComponentPropsWithRef } from 'react';
-import {
-  useCallback,
-  useEffect,
-  useLayoutEffect,
-  useRef,
-  useState,
-  useId,
-} from 'react';
+import { useCallback, useEffect, useId } from 'react';

-import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
+import { defineMessages, FormattedMessage } from 'react-intl';

 import type { Map as ImmutableMap } from 'immutable';
 import { List as ImmutableList } from 'immutable';

-import type { AnimatedProps } from '@react-spring/web';
-import { animated, useSpring } from '@react-spring/web';
-import { useDrag } from '@use-gesture/react';
-
 import { expandAccountFeaturedTimeline } from '@/mastodon/actions/timelines';
 import { Icon } from '@/mastodon/components/icon';
-import { IconButton } from '@/mastodon/components/icon_button';
 import { StatusQuoteManager } from '@/mastodon/components/status_quoted';
-import { usePrevious } from '@/mastodon/hooks/usePrevious';
-import { useAppDispatch, useAppSelector } from '@/mastodon/store';
-import ChevronLeftIcon from '@/material-icons/400-24px/chevron_left.svg?react';
-import ChevronRightIcon from '@/material-icons/400-24px/chevron_right.svg?react';
+import {
+  createAppSelector,
+  useAppDispatch,
+  useAppSelector,
+} from '@/mastodon/store';
 import PushPinIcon from '@/material-icons/400-24px/push_pin.svg?react';

+import { Carousel } from './carousel';
+
+const pinnedStatusesSelector = createAppSelector(
+  [
+    (state, accountId: string, tagged?: string) =>
+      (state.timelines as ImmutableMap<string, unknown>).getIn(
+        [`account:${accountId}:pinned${tagged ? `:${tagged}` : ''}`, 'items'],
+        ImmutableList(),
+      ) as ImmutableList<string>,
+  ],
+  (items) => items.toArray().map((id) => ({ id })),
+);
+
 const messages = defineMessages({
-  previous: { id: 'featured_carousel.previous', defaultMessage: 'Previous' },
-  next: { id: 'featured_carousel.next', defaultMessage: 'Next' },
+  previous: { id: 'lightbox.previous', defaultMessage: 'Previous' },
+  next: { id: 'lightbox.next', defaultMessage: 'Next' },
+  current: {
+    id: 'featured_carousel.current',
+    defaultMessage: '<sr>Post</sr> {current, number} / {max, number}',
+  },
  slide: {
    id: 'featured_carousel.slide',
-    defaultMessage: '{index} of {total}',
+    defaultMessage: 'Post {current, number} of {max, number}',
  },
 });

@ -40,7 +45,6 @@ export const FeaturedCarousel: React.FC<{
  accountId: string;
  tagged?: string;
 }> = ({ accountId, tagged }) => {
-  const intl = useIntl();
  const accessibilityId = useId();

  // Load pinned statuses
@ -50,175 +54,37 @@ export const FeaturedCarousel: React.FC<{
      void dispatch(expandAccountFeaturedTimeline(accountId, { tagged }));
    }
  }, [accountId, dispatch, tagged]);
-  const pinnedStatuses = useAppSelector(
-    (state) =>
-      (state.timelines as ImmutableMap<string, unknown>).getIn(
-        [`account:${accountId}:pinned${tagged ? `:${tagged}` : ''}`, 'items'],
-        ImmutableList(),
-      ) as ImmutableList<string>,
+  const pinnedStatuses = useAppSelector((state) =>
+    pinnedStatusesSelector(state, accountId, tagged),
  );

-  // Handle slide change
-  const [slideIndex, setSlideIndex] = useState(0);
-  const wrapperRef = useRef<HTMLDivElement>(null);
-  const handleSlideChange = useCallback(
-    (direction: number) => {
-      setSlideIndex((prev) => {
-        const max = pinnedStatuses.size - 1;
-        let newIndex = prev + direction;
-        if (newIndex < 0) {
-          newIndex = max;
-        } else if (newIndex > max) {
-          newIndex = 0;
-        }
-        const slide = wrapperRef.current?.children[newIndex];
-        if (slide) {
-          setCurrentSlideHeight(slide.scrollHeight);
-        }
-        return newIndex;
-      });
-    },
-    [pinnedStatuses.size],
+  const renderSlide = useCallback(
+    ({ id }: { id: string }) => (
+      <StatusQuoteManager id={id} contextType='account' withCounters />
+    ),
+    [],
  );

-  // Handle slide heights
-  const [currentSlideHeight, setCurrentSlideHeight] = useState(
-    wrapperRef.current?.scrollHeight ?? 0,
-  );
-  const previousSlideHeight = usePrevious(currentSlideHeight);
-  const observerRef = useRef<ResizeObserver>(
-    new ResizeObserver(() => {
-      handleSlideChange(0);
-    }),
-  );
-  const wrapperStyles = useSpring({
-    x: `-${slideIndex * 100}%`,
-    height: currentSlideHeight,
-    // Don't animate from zero to the height of the initial slide
-    immediate: !previousSlideHeight,
-  });
-  useLayoutEffect(() => {
-    // Update slide height when the component mounts
-    if (currentSlideHeight === 0) {
-      handleSlideChange(0);
-    }
-  }, [currentSlideHeight, handleSlideChange]);
-
-  // Handle swiping animations
-  const bind = useDrag(({ swipe: [swipeX] }) => {
-    handleSlideChange(swipeX * -1); // Invert swipe as swiping left loads the next slide.
-  });
-  const handlePrev = useCallback(() => {
-    handleSlideChange(-1);
-  }, [handleSlideChange]);
-  const handleNext = useCallback(() => {
-    handleSlideChange(1);
-  }, [handleSlideChange]);
-
-  if (!accountId || pinnedStatuses.isEmpty()) {
+  if (!accountId || pinnedStatuses.length === 0) {
    return null;
  }

  return (
-    <div
-      className='featured-carousel'
-      {...bind()}
-      aria-roledescription='carousel'
+    <Carousel
+      items={pinnedStatuses}
+      renderItem={renderSlide}
      aria-labelledby={`${accessibilityId}-title`}
-      role='region'
+      classNamePrefix='featured-carousel'
+      messages={messages}
    >
-      <div className='featured-carousel__header'>
-        <h4
-          className='featured-carousel__title'
-          id={`${accessibilityId}-title`}
-        >
-          <Icon id='thumb-tack' icon={PushPinIcon} />
-          <FormattedMessage
-            id='featured_carousel.header'
-            defaultMessage='{count, plural, one {Pinned Post} other {Pinned Posts}}'
-            values={{ count: pinnedStatuses.size }}
-          />
-        </h4>
-        {pinnedStatuses.size > 1 && (
-          <>
-            <IconButton
-              title={intl.formatMessage(messages.previous)}
-              icon='chevron-left'
-              iconComponent={ChevronLeftIcon}
-              onClick={handlePrev}
-            />
-            <span aria-live='polite'>
-              <FormattedMessage
-                id='featured_carousel.post'
-                defaultMessage='Post'
-              >
-                {(text) => <span className='sr-only'>{text}</span>}
-              </FormattedMessage>
-              {slideIndex + 1} / {pinnedStatuses.size}
-            </span>
-            <IconButton
-              title={intl.formatMessage(messages.next)}
-              icon='chevron-right'
-              iconComponent={ChevronRightIcon}
-              onClick={handleNext}
-            />
-          </>
-        )}
-      </div>
-      <animated.div
-        className='featured-carousel__slides'
-        ref={wrapperRef}
-        style={wrapperStyles}
-        aria-atomic='false'
-        aria-live='polite'
-      >
-        {pinnedStatuses.map((statusId, index) => (
-          <FeaturedCarouselItem
-            key={`f-${statusId}`}
-            data-index={index}
-            aria-label={intl.formatMessage(messages.slide, {
-              index: index + 1,
-              total: pinnedStatuses.size,
-            })}
-            statusId={statusId}
-            observer={observerRef.current}
-            active={index === slideIndex}
-          />
-        ))}
-      </animated.div>
-    </div>
-  );
-};
-
-interface FeaturedCarouselItemProps {
-  statusId: string;
-  active: boolean;
-  observer: ResizeObserver;
-}
-
-const FeaturedCarouselItem: React.FC<
-  FeaturedCarouselItemProps & AnimatedProps<ComponentPropsWithRef<'div'>>
-> = ({ statusId, active, observer, ...props }) => {
-  const handleRef = useCallback(
-    (instance: HTMLDivElement | null) => {
-      if (instance) {
-        observer.observe(instance);
-      }
-    },
-    [observer],
-  );
-
-  return (
-    <animated.div
-      className='featured-carousel__slide'
-      // @ts-expect-error inert in not in this version of React
-      inert={!active ? 'true' : undefined}
-      aria-roledescription='slide'
-      role='group'
-      ref={handleRef}
-      {...props}
-    >
-      <StatusQuoteManager id={statusId} contextType='account' withCounters />
-    </animated.div>
+      <h4 className='featured-carousel__title' id={`${accessibilityId}-title`}>
+        <Icon id='thumb-tack' icon={PushPinIcon} />
+        <FormattedMessage
+          id='featured_carousel.header'
+          defaultMessage='{count, plural, one {Pinned Post} other {Pinned Posts}}'
+          values={{ count: pinnedStatuses.length }}
+        />
+      </h4>
+    </Carousel>
  );
 };
--- a/app/javascript/mastodon/components/hashtag_bar.tsx
+++ b/app/javascript/mastodon/components/hashtag_bar.tsx
@ -235,7 +235,7 @@ const HashtagBar: React.FC<{
      ))}

      {!expanded && hashtags.length > VISIBLE_HASHTAGS && (
-        <button className='link-button' onClick={handleClick}>
+        <button className='link-button' onClick={handleClick} type='button'>
          <FormattedMessage
            id='hashtags.and_other'
            defaultMessage='…and {count, plural, other {# more}}'
--- a/app/javascript/mastodon/components/hotkeys/hotkeys.stories.tsx
+++ b/app/javascript/mastodon/components/hotkeys/hotkeys.stories.tsx
@ -153,7 +153,7 @@ export const Default = {
            the app.
          </p>
          <p>
-            When a <button>Button</button> is focused,
+            When a <button type='button'>Button</button> is focused,
            <kbd>Enter</kbd>
            should not trigger open, but <kbd>o</kbd>
            should.
--- a/app/javascript/mastodon/components/hover_card_account.tsx
+++ b/app/javascript/mastodon/components/hover_card_account.tsx
@ -23,8 +23,6 @@ import { domain } from 'mastodon/initial_state';
 import { getAccountHidden } from 'mastodon/selectors/accounts';
 import { useAppSelector, useAppDispatch } from 'mastodon/store';

-import { useLinks } from '../hooks/useLinks';
-
 export const HoverCardAccount = forwardRef<
  HTMLDivElement,
  { accountId?: string }
@ -66,8 +64,6 @@ export const HoverCardAccount = forwardRef<
    !isMutual &&
    !isFollower;

-  const handleClick = useLinks();
-
  return (
    <div
      ref={ref}
@ -110,7 +106,7 @@ export const HoverCardAccount = forwardRef<
                  className='hover-card__bio'
                />

-                <div className='account-fields' onClickCapture={handleClick}>
+                <div className='account-fields'>
                  <AccountFields
                    fields={account.fields.take(2)}
                    emojis={account.emojis}
--- a/app/javascript/mastodon/components/hover_card_controller.tsx
+++ b/app/javascript/mastodon/components/hover_card_controller.tsx
@ -27,7 +27,6 @@ export const HoverCardController: React.FC = () => {
  const [setLeaveTimeout, cancelLeaveTimeout] = useTimeout();
  const [setEnterTimeout, cancelEnterTimeout, delayEnterTimeout] = useTimeout();
  const [setScrollTimeout] = useTimeout();
-  const location = useLocation();

  const handleClose = useCallback(() => {
    cancelEnterTimeout();
@ -36,9 +35,12 @@ export const HoverCardController: React.FC = () => {
    setAnchor(null);
  }, [cancelEnterTimeout, cancelLeaveTimeout, setOpen, setAnchor]);

-  useEffect(() => {
+  const location = useLocation();
+  const [previousLocation, setPreviousLocation] = useState(location);
+  if (location !== previousLocation) {
+    setPreviousLocation(location);
    handleClose();
-  }, [handleClose, location]);
+  }

  useEffect(() => {
    let isScrolling = false;
--- a/app/javascript/mastodon/components/html_block/index.tsx
+++ b/app/javascript/mastodon/components/html_block/index.tsx
@ -4,7 +4,7 @@ import type { OnElementHandler } from '@/mastodon/utils/html';
 import { polymorphicForwardRef } from '@/types/polymorphic';

 import type { EmojiHTMLProps } from '../emoji/html';
-import { ModernEmojiHTML } from '../emoji/html';
+import { EmojiHTML } from '../emoji/html';
 import { useElementHandledLink } from '../status/handled_link';

 export const HTMLBlock = polymorphicForwardRef<
@ -25,6 +25,6 @@ export const HTMLBlock = polymorphicForwardRef<
      (...args) => onParentElement?.(...args) ?? onLinkElement(...args),
      [onLinkElement, onParentElement],
    );
-    return <ModernEmojiHTML {...props} onElement={onElement} />;
+    return <EmojiHTML {...props} onElement={onElement} />;
  },
 );
--- a/app/javascript/mastodon/components/icon_button.tsx
+++ b/app/javascript/mastodon/components/icon_button.tsx
@ -1,4 +1,4 @@
-import { useState, useEffect, useCallback, forwardRef } from 'react';
+import { useCallback, forwardRef } from 'react';

 import classNames from 'classnames';

@ -55,23 +55,6 @@ export const IconButton = forwardRef<HTMLButtonElement, Props>(
    },
    buttonRef,
  ) => {
-    const [activate, setActivate] = useState(false);
-    const [deactivate, setDeactivate] = useState(false);
-
-    useEffect(() => {
-      if (!animate) {
-        return;
-      }
-
-      if (activate && !active) {
-        setActivate(false);
-        setDeactivate(true);
-      } else if (!activate && active) {
-        setActivate(true);
-        setDeactivate(false);
-      }
-    }, [setActivate, setDeactivate, animate, active, activate]);
-
    const handleClick: React.MouseEventHandler<HTMLButtonElement> = useCallback(
      (e) => {
        e.preventDefault();
@ -112,8 +95,8 @@ export const IconButton = forwardRef<HTMLButtonElement, Props>(
      active,
      disabled,
      inverted,
-      activate,
-      deactivate,
+      activate: animate && active,
+      deactivate: animate && !active,
      overlayed: overlay,
      'icon-button--with-counter': typeof counter !== 'undefined',
    });
--- a/app/javascript/mastodon/components/learn_more_link.tsx
+++ b/app/javascript/mastodon/components/learn_more_link.tsx
@ -23,6 +23,7 @@ export const LearnMoreLink: React.FC<{ children: React.ReactNode }> = ({
        onClick={handleClick}
        aria-expanded={open}
        aria-controls={accessibilityId}
+        type='button'
      >
        <FormattedMessage
          id='learn_more_link.learn_more'
@ -48,7 +49,11 @@ export const LearnMoreLink: React.FC<{ children: React.ReactNode }> = ({
            <div className='learn-more__popout__content'>{children}</div>

            <div>
-              <button className='link-button' onClick={handleClick}>
+              <button
+                className='link-button'
+                onClick={handleClick}
+                type='button'
+              >
                <FormattedMessage
                  id='learn_more_link.got_it'
                  defaultMessage='Got it'
--- a/app/javascript/mastodon/components/load_gap.tsx
+++ b/app/javascript/mastodon/components/load_gap.tsx
@ -32,6 +32,7 @@ export const LoadGap = <T,>({ disabled, param, onClick }: Props<T>) => {
      onClick={handleClick}
      aria-label={intl.formatMessage(messages.load_more)}
      title={intl.formatMessage(messages.load_more)}
+      type='button'
    >
      {loading ? (
        <LoadingIndicator />
--- a/app/javascript/mastodon/components/load_pending.tsx
+++ b/app/javascript/mastodon/components/load_pending.tsx
@ -7,7 +7,7 @@ interface Props {

 export const LoadPending: React.FC<Props> = ({ onClick, count }) => {
  return (
-    <button className='load-more load-gap' onClick={onClick}>
+    <button className='load-more load-gap' onClick={onClick} type='button'>
      <FormattedMessage
        id='load_pending'
        defaultMessage='{count, plural, one {# new item} other {# new items}}'
--- a/app/javascript/mastodon/components/poll.tsx
+++ b/app/javascript/mastodon/components/poll.tsx
@ -13,9 +13,7 @@ import CheckIcon from '@/material-icons/400-24px/check.svg?react';
 import { openModal } from 'mastodon/actions/modal';
 import { fetchPoll, vote } from 'mastodon/actions/polls';
 import { Icon } from 'mastodon/components/icon';
-import emojify from 'mastodon/features/emoji/emoji';
 import { useIdentity } from 'mastodon/identity_context';
-import { makeEmojiMap } from 'mastodon/models/custom_emoji';
 import type * as Model from 'mastodon/models/poll';
 import type { Status } from 'mastodon/models/status';
 import { useAppDispatch, useAppSelector } from 'mastodon/store';
@ -37,6 +35,9 @@ const messages = defineMessages({
  },
 });

+const isPollExpired = (expiresAt: Model.Poll['expires_at']) =>
+  new Date(expiresAt).getTime() < Date.now();
+
 interface PollProps {
  pollId: string;
  status: Status;
@ -60,8 +61,7 @@ export const Poll: React.FC<PollProps> = ({ pollId, disabled, status }) => {
    if (!poll) {
      return false;
    }
-    const expiresAt = poll.expires_at;
-    return poll.expired || new Date(expiresAt).getTime() < Date.now();
+    return poll.expired || isPollExpired(poll.expires_at);
  }, [poll]);
  const timeRemaining = useMemo(() => {
    if (!poll) {
@ -173,13 +173,14 @@ export const Poll: React.FC<PollProps> = ({ pollId, disabled, status }) => {
            className='button button-secondary'
            disabled={voteDisabled}
            onClick={handleVote}
+            type='button'
          >
            <FormattedMessage id='poll.vote' defaultMessage='Vote' />
          </button>
        )}
        {!showResults && (
          <>
-            <button className='poll__link' onClick={handleReveal}>
+            <button className='poll__link' onClick={handleReveal} type='button'>
              <FormattedMessage id='poll.reveal' defaultMessage='See results' />
            </button>{' '}
            ·{' '}
@ -187,7 +188,11 @@ export const Poll: React.FC<PollProps> = ({ pollId, disabled, status }) => {
        )}
        {showResults && !disabled && (
          <>
-            <button className='poll__link' onClick={handleRefresh}>
+            <button
+              className='poll__link'
+              onClick={handleRefresh}
+              type='button'
+            >
              <FormattedMessage id='poll.refresh' defaultMessage='Refresh' />
            </button>{' '}
            ·{' '}
@ -235,12 +240,11 @@ const PollOption: React.FC<PollOptionProps> = (props) => {
    let titleHtml = option.translation?.titleHtml ?? option.titleHtml;

    if (!titleHtml) {
-      const emojiMap = makeEmojiMap(poll.emojis);
-      titleHtml = emojify(escapeTextContentForBrowser(title), emojiMap);
+      titleHtml = escapeTextContentForBrowser(title);
    }

    return titleHtml;
-  }, [option, poll, title]);
+  }, [option, title]);

  // Handlers
  const handleOptionChange = useCallback(() => {
--- a/app/javascript/mastodon/components/status/boost_button.tsx
+++ b/app/javascript/mastodon/components/status/boost_button.tsx
@ -14,7 +14,7 @@ import type { Status } from '@/mastodon/models/status';
 import { useAppDispatch, useAppSelector } from '@/mastodon/store';
 import type { SomeRequired } from '@/mastodon/utils/types';

-import type { RenderItemFn, RenderItemFnHandlers } from '../dropdown_menu';
+import type { RenderItemFn } from '../dropdown_menu';
 import { Dropdown, DropdownMenuItemContent } from '../dropdown_menu';
 import { IconButton } from '../icon_button';

@ -74,18 +74,12 @@ const StandaloneBoostButton: FC<ReblogButtonProps> = ({ status, counters }) => {
  );
 };

-const renderMenuItem: RenderItemFn<ActionMenuItem> = (
-  item,
-  index,
-  handlers,
-  focusRefCallback,
-) => (
+const renderMenuItem: RenderItemFn<ActionMenuItem> = (item, index, onClick) => (
  <ReblogMenuItem
    index={index}
    item={item}
-    handlers={handlers}
+    onClick={onClick}
    key={`${item.text}-${index}`}
-    focusRefCallback={focusRefCallback}
  />
 );

@ -118,6 +112,18 @@ const BoostOrQuoteMenu: FC<ReblogButtonProps> = ({ status, counters }) => {
  const statusId = status.get('id') as string;
  const wasBoosted = !!status.get('reblogged');

+  let count: number | undefined;
+  if (counters) {
+    count = 0;
+    // Ensure count is a valid integer.
+    if (Number.isInteger(status.get('reblogs_count'))) {
+      count += status.get('reblogs_count') as number;
+    }
+    if (Number.isInteger(status.get('quotes_count'))) {
+      count += status.get('quotes_count') as number;
+    }
+  }
+
  const showLoginPrompt = useCallback(() => {
    dispatch(
      openModal({
@ -193,12 +199,7 @@ const BoostOrQuoteMenu: FC<ReblogButtonProps> = ({ status, counters }) => {
        )}
        icon='retweet'
        iconComponent={boostIcon}
-        counter={
-          counters
-            ? (status.get('reblogs_count') as number) +
-              (status.get('quotes_count') as number)
-            : undefined
-        }
+        counter={count}
        active={isReblogged}
      />
    </Dropdown>
@ -208,16 +209,10 @@ const BoostOrQuoteMenu: FC<ReblogButtonProps> = ({ status, counters }) => {
 interface ReblogMenuItemProps {
  item: ActionMenuItem;
  index: number;
-  handlers: RenderItemFnHandlers;
-  focusRefCallback?: (c: HTMLAnchorElement | HTMLButtonElement | null) => void;
+  onClick: React.MouseEventHandler;
 }

-const ReblogMenuItem: FC<ReblogMenuItemProps> = ({
-  index,
-  item,
-  handlers,
-  focusRefCallback,
-}) => {
+const ReblogMenuItem: FC<ReblogMenuItemProps> = ({ index, item, onClick }) => {
  const { text, highlighted, disabled } = item;

  return (
@ -228,10 +223,10 @@ const ReblogMenuItem: FC<ReblogMenuItemProps> = ({
      key={`${text}-${index}`}
    >
      <button
-        {...handlers}
-        ref={focusRefCallback}
+        onClick={onClick}
        aria-disabled={disabled}
        data-index={index}
+        type='button'
      >
        <DropdownMenuItemContent item={item} />
      </button>
--- a/app/javascript/mastodon/components/status/handled_link.tsx
+++ b/app/javascript/mastodon/components/status/handled_link.tsx
@ -26,7 +26,12 @@ export const HandledLink: FC<HandledLinkProps & ComponentProps<'a'>> = ({
  ...props
 }) => {
  // Handle hashtags
-  if (text.startsWith('#') || prevText?.endsWith('#')) {
+  if (
+    text.startsWith('#') ||
+    prevText?.endsWith('#') ||
+    text.startsWith('＃') ||
+    prevText?.endsWith('＃')
+  ) {
    const hashtag = text.slice(1).trim();
    return (
      <Link
--- a/app/javascript/mastodon/components/status_action_bar/remove_quote_hint.tsx
+++ b/app/javascript/mastodon/components/status_action_bar/remove_quote_hint.tsx
@ -44,6 +44,7 @@ export const RemoveQuoteHint: React.FC<{

    if (!firstHintId) {
      firstHintId = uniqueId;
+      // eslint-disable-next-line react-hooks/set-state-in-effect
      setIsOnlyHint(true);
    }

@ -64,8 +65,8 @@ export const RemoveQuoteHint: React.FC<{
          flip
          offset={[12, 10]}
          placement='bottom-end'
-          target={anchorRef.current}
-          container={anchorRef.current}
+          target={anchorRef}
+          container={anchorRef}
        >
          {({ props, placement }) => (
            <div
--- a/app/javascript/mastodon/components/status_banner.tsx
+++ b/app/javascript/mastodon/components/status_banner.tsx
@ -49,6 +49,7 @@ export const StatusBanner: React.FC<{

      <button
        ref={buttonRef}
+        type='button'
        className='link-button'
        onClick={onClick}
        aria-describedby={descriptionId}
--- a/app/javascript/mastodon/components/status_content.jsx
+++ b/app/javascript/mastodon/components/status_content.jsx
@ -17,8 +17,6 @@ import { Poll } from 'mastodon/components/poll';
 import { identityContextPropShape, withIdentity } from 'mastodon/identity_context';
 import { languages as preloadedLanguages } from 'mastodon/initial_state';

-import { isModernEmojiEnabled } from '../utils/environment';
-
 import { EmojiHTML } from './emoji/html';
 import { HandledLink } from './status/handled_link';

@ -81,7 +79,7 @@ const compareUrls = (href1, href2) => {
    const url1 = new URL(href1);
    const url2 = new URL(href2);

-    return url1.origin === url2.origin && url1.path === url2.path && url1.search === url2.search;
+    return url1.origin === url2.origin && url1.pathname === url2.pathname && url1.search === url2.search;
  } catch {
    return false;
  }
@ -131,41 +129,6 @@ class StatusContent extends PureComponent {

      onCollapsedToggle(collapsed);
    }
-
-    // Exit if modern emoji is enabled, as it handles links using the HandledLink component.
-    if (isModernEmojiEnabled()) {
-      return;
-    }
-
-    const links = node.querySelectorAll('a');
-
-    let link, mention;
-
-    for (var i = 0; i < links.length; ++i) {
-      link = links[i];
-
-      if (link.classList.contains('status-link')) {
-        continue;
-      }
-
-      link.classList.add('status-link');
-
-      mention = this.props.status.get('mentions').find(item => compareUrls(link, item.get('url')));
-
-      if (mention) {
-        link.addEventListener('click', this.onMentionClick.bind(this, mention), false);
-        link.setAttribute('title', `@${mention.get('acct')}`);
-        link.setAttribute('href', `/@${mention.get('acct')}`);
-        link.setAttribute('data-hover-card-account', mention.get('id'));
-      } else if (link.textContent[0] === '#' || (link.previousSibling && link.previousSibling.textContent && link.previousSibling.textContent[link.previousSibling.textContent.length - 1] === '#')) {
-        link.addEventListener('click', this.onHashtagClick.bind(this, link.text), false);
-        link.setAttribute('href', `/tags/${link.text.replace(/^#/, '')}`);
-        link.setAttribute('data-menu-hashtag', this.props.status.getIn(['account', 'id']));
-      } else {
-        link.setAttribute('title', link.href);
-        link.classList.add('unhandled-link');
-      }
-    }
  }

  async componentDidMount () {
@ -204,22 +167,6 @@ class StatusContent extends PureComponent {
    this._updateStatusLinks();
  }

-  onMentionClick = (mention, e) => {
-    if (this.props.history && e.button === 0 && !(e.ctrlKey || e.metaKey)) {
-      e.preventDefault();
-      this.props.history.push(`/@${mention.get('acct')}`);
-    }
-  };
-
-  onHashtagClick = (hashtag, e) => {
-    hashtag = hashtag.replace(/^#/, '');
-
-    if (this.props.history && e.button === 0 && !(e.ctrlKey || e.metaKey)) {
-      e.preventDefault();
-      this.props.history.push(`/tags/${hashtag}`);
-    }
-  };
-
  handleMouseDown = (e) => {
    this.startXY = [e.clientX, e.clientY];
  };
@ -299,7 +246,7 @@ class StatusContent extends PureComponent {
          {children}
        </HandledLink>
      );
-    } else if (element.classList.contains('quote-inline')) {
+    } else if (element.classList.contains('quote-inline') && this.props.status.get('quote')) {
      return null;
    }
    return undefined;
--- a/app/javascript/mastodon/components/status_quoted.tsx
+++ b/app/javascript/mastodon/components/status_quoted.tsx
@ -1,4 +1,4 @@
-import { useCallback, useEffect, useMemo, useRef } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';

 import { FormattedMessage } from 'react-intl';

@ -73,7 +73,63 @@ const LimitedAccountHint: React.FC<{ accountId: string }> = ({ accountId }) => {
        defaultMessage='This account has been hidden by the moderators of {domain}.'
        values={{ domain }}
      />
-      <button onClick={reveal} className='link-button'>
+      <button onClick={reveal} className='link-button' type='button'>
+        <FormattedMessage
+          id='status.quote_error.limited_account_hint.action'
+          defaultMessage='Show anyway'
+        />
+      </button>
+    </>
+  );
+};
+
+const FilteredQuote: React.FC<{
+  reveal: VoidFunction;
+  quotedAccountId: string;
+  quoteState: string;
+}> = ({ reveal, quotedAccountId, quoteState }) => {
+  const account = useAppSelector((state) =>
+    quotedAccountId ? state.accounts.get(quotedAccountId) : undefined,
+  );
+
+  const quoteAuthorName = account?.acct;
+  const domain = quoteAuthorName?.split('@')[1];
+
+  let message;
+
+  switch (quoteState) {
+    case 'blocked_account':
+      message = (
+        <FormattedMessage
+          id='status.quote_error.blocked_account_hint.title'
+          defaultMessage="This post is hidden because you've blocked @{name}."
+          values={{ name: quoteAuthorName }}
+        />
+      );
+      break;
+    case 'blocked_domain':
+      message = (
+        <FormattedMessage
+          id='status.quote_error.blocked_domain_hint.title'
+          defaultMessage="This post is hidden because you've blocked {domain}."
+          values={{ domain }}
+        />
+      );
+      break;
+    case 'muted_account':
+      message = (
+        <FormattedMessage
+          id='status.quote_error.muted_account_hint.title'
+          defaultMessage="This post is hidden because you've muted @{name}."
+          values={{ name: quoteAuthorName }}
+        />
+      );
+  }
+
+  return (
+    <>
+      {message}
+      <button onClick={reveal} className='link-button' type='button'>
        <FormattedMessage
          id='status.quote_error.limited_account_hint.action'
          defaultMessage='Show anyway'
@ -130,6 +186,11 @@ export const QuotedStatus: React.FC<QuotedStatusProps> = ({
  const isLoaded = loadingState === 'complete';

  const isFetchingQuoteRef = useRef(false);
+  const [revealed, setRevealed] = useState(false);
+
+  const reveal = useCallback(() => {
+    setRevealed(true);
+  }, [setRevealed]);

  useEffect(() => {
    if (isLoaded) {
@ -189,6 +250,20 @@ export const QuotedStatus: React.FC<QuotedStatusProps> = ({
        defaultMessage='Post removed by author'
      />
    );
+  } else if (
+    (quoteState === 'blocked_account' ||
+      quoteState === 'blocked_domain' ||
+      quoteState === 'muted_account') &&
+    !revealed &&
+    accountId
+  ) {
+    quoteError = (
+      <FilteredQuote
+        quoteState={quoteState}
+        reveal={reveal}
+        quotedAccountId={accountId}
+      />
+    );
  } else if (
    !status ||
    !quotedStatusId ||
--- a/app/javascript/mastodon/components/verified_badge.tsx
+++ b/app/javascript/mastodon/components/verified_badge.tsx
@ -1,30 +1,10 @@
 import { EmojiHTML } from '@/mastodon/components/emoji/html';
 import CheckIcon from '@/material-icons/400-24px/check.svg?react';

-import { isModernEmojiEnabled } from '../utils/environment';
 import type { OnAttributeHandler } from '../utils/html';

 import { Icon } from './icon';

-const domParser = new DOMParser();
-
-const stripRelMe = (html: string) => {
-  if (isModernEmojiEnabled()) {
-    return html;
-  }
-  const document = domParser.parseFromString(html, 'text/html').documentElement;
-
-  document.querySelectorAll<HTMLAnchorElement>('a[rel]').forEach((link) => {
-    link.rel = link.rel
-      .split(' ')
-      .filter((x: string) => x !== 'me')
-      .join(' ');
-  });
-
-  const body = document.querySelector('body');
-  return body?.innerHTML ?? '';
-};
-
 const onAttribute: OnAttributeHandler = (name, value, tagName) => {
  if (name === 'rel' && tagName === 'a') {
    if (value === 'me') {
@ -47,10 +27,6 @@ interface Props {
 export const VerifiedBadge: React.FC<Props> = ({ link }) => (
  <span className='verified-badge'>
    <Icon id='check' icon={CheckIcon} className='verified-badge__mark' />
-    <EmojiHTML
-      as='span'
-      htmlString={stripRelMe(link)}
-      onAttribute={onAttribute}
-    />
+    <EmojiHTML as='span' htmlString={link} onAttribute={onAttribute} />
  </span>
 );
--- a/app/javascript/mastodon/containers/media_container.jsx
+++ b/app/javascript/mastodon/containers/media_container.jsx
@ -10,7 +10,7 @@ import ModalRoot from 'mastodon/components/modal_root';
 import { Poll } from 'mastodon/components/poll';
 import { Audio } from 'mastodon/features/audio';
 import Card from 'mastodon/features/status/components/card';
-import MediaModal from 'mastodon/features/ui/components/media_modal';
+import { MediaModal } from 'mastodon/features/ui/components/media_modal';
 import { Video } from 'mastodon/features/video';
 import { IntlProvider } from 'mastodon/locales';
 import { createPollFromServerJSON } from 'mastodon/models/poll';
--- a/app/javascript/mastodon/containers/scroll_container/scroll_context.tsx
+++ b/app/javascript/mastodon/containers/scroll_container/scroll_context.tsx
@ -86,6 +86,7 @@ export const ScrollContext: React.FC<ScrollContextProps> = ({
        ) =>
          // Hack to allow accessing scrollBehavior._stateStorage
          shouldUpdateScroll.call(
+            // eslint-disable-next-line react-hooks/immutability
            scrollBehavior,
            prevLocationContext,
            locationContext,
--- a/app/javascript/mastodon/features/about/components/rules.tsx
+++ b/app/javascript/mastodon/features/about/components/rules.tsx
@ -32,16 +32,38 @@ interface Rule extends BaseRule {
  translations?: Record<string, BaseRule>;
 }

+function getDefaultSelectedLocale(
+  currentUiLocale: string,
+  localeOptions: SelectItem[],
+) {
+  const preciseMatch = localeOptions.find(
+    (option) => option.value === currentUiLocale,
+  );
+  if (preciseMatch) {
+    return preciseMatch.value;
+  }
+
+  const partialLocale = currentUiLocale.split('-')[0];
+  const partialMatch = localeOptions.find(
+    (option) => option.value.split('-')[0] === partialLocale,
+  );
+
+  return partialMatch?.value ?? 'default';
+}
+
 export const RulesSection: FC<RulesSectionProps> = ({ isLoading = false }) => {
  const intl = useIntl();
-  const [locale, setLocale] = useState(intl.locale);
-  const rules = useAppSelector((state) => rulesSelector(state, locale));
  const localeOptions = useAppSelector((state) =>
    localeOptionsSelector(state, intl),
  );
+  const [selectedLocale, setSelectedLocale] = useState(() =>
+    getDefaultSelectedLocale(intl.locale, localeOptions),
+  );
+  const rules = useAppSelector((state) => rulesSelector(state, selectedLocale));
+
  const handleLocaleChange: ChangeEventHandler<HTMLSelectElement> = useCallback(
    (e) => {
-      setLocale(e.currentTarget.value);
+      setSelectedLocale(e.currentTarget.value);
    },
    [],
  );
@ -74,25 +96,27 @@ export const RulesSection: FC<RulesSectionProps> = ({ isLoading = false }) => {
        ))}
      </ol>

-      <div className='rules-languages'>
-        <label htmlFor='language-select'>
-          <FormattedMessage
-            id='about.language_label'
-            defaultMessage='Language'
-          />
-        </label>
-        <select onChange={handleLocaleChange} id='language-select'>
-          {localeOptions.map((option) => (
-            <option
-              key={option.value}
-              value={option.value}
-              selected={option.value === locale}
-            >
-              {option.text}
-            </option>
-          ))}
-        </select>
-      </div>
+      {localeOptions.length > 1 && (
+        <div className='rules-languages'>
+          <label htmlFor='language-select'>
+            <FormattedMessage
+              id='about.language_label'
+              defaultMessage='Language'
+            />
+          </label>
+          <select onChange={handleLocaleChange} id='language-select'>
+            {localeOptions.map((option) => (
+              <option
+                key={option.value}
+                value={option.value}
+                selected={option.value === selectedLocale}
+              >
+                {option.text}
+              </option>
+            ))}
+          </select>
+        </div>
+      )}
    </Section>
  );
 };
--- a/app/javascript/mastodon/features/about/components/section.tsx
+++ b/app/javascript/mastodon/features/about/components/section.tsx
@ -31,6 +31,7 @@ export const Section: FC<SectionProps> = ({
        className='about__section__title'
        tabIndex={0}
        onClick={handleClick}
+        type='button'
      >
        <Icon
          id={collapsed ? 'chevron-right' : 'chevron-down'}
--- a/app/javascript/mastodon/features/account/components/domain_pill.tsx
+++ b/app/javascript/mastodon/features/account/components/domain_pill.tsx
@ -37,6 +37,7 @@ export const DomainPill: React.FC<{
        onClick={handleClick}
        aria-expanded={open}
        aria-controls={accessibilityId}
+        type='button'
      >
        {domain}
      </button>
@ -154,6 +155,7 @@ export const DomainPill: React.FC<{
                      <button
                        onClick={handleExpandClick}
                        className='link-button'
+                        type='button'
                      >
                        {x}
                      </button>
@ -169,6 +171,7 @@ export const DomainPill: React.FC<{
                      <button
                        onClick={handleExpandClick}
                        className='link-button'
+                        type='button'
                      >
                        {x}
                      </button>
--- a/app/javascript/mastodon/features/account_timeline/components/account_header.tsx
+++ b/app/javascript/mastodon/features/account_timeline/components/account_header.tsx
@ -49,7 +49,6 @@ import { ShortNumber } from 'mastodon/components/short_number';
 import { AccountNote } from 'mastodon/features/account/components/account_note';
 import { DomainPill } from 'mastodon/features/account/components/domain_pill';
 import FollowRequestNoteContainer from 'mastodon/features/account/containers/follow_request_note_container';
-import { useLinks } from 'mastodon/hooks/useLinks';
 import { useIdentity } from 'mastodon/identity_context';
 import { autoPlayGif, me, domain as localDomain } from 'mastodon/initial_state';
 import type { Account } from 'mastodon/models/account';
@ -198,7 +197,6 @@ export const AccountHeader: React.FC<{
    state.relationships.get(accountId),
  );
  const hidden = useAppSelector((state) => getAccountHidden(state, accountId));
-  const handleLinkClick = useLinks();

  const handleBlock = useCallback(() => {
    if (!account) {
@ -852,10 +850,7 @@ export const AccountHeader: React.FC<{

          {!(suspended || hidden) && (
            <div className='account__header__extra'>
-              <div
-                className='account__header__bio'
-                onClickCapture={handleLinkClick}
-              >
+              <div className='account__header__bio'>
                {account.id !== me && signedIn && (
                  <AccountNote accountId={accountId} />
                )}
--- a/app/javascript/mastodon/features/alt_text_modal/index.tsx
+++ b/app/javascript/mastodon/features/alt_text_modal/index.tsx
@ -101,16 +101,17 @@ const Preview: React.FC<{
  position: FocalPoint;
  onPositionChange: (arg0: FocalPoint) => void;
 }> = ({ mediaId, position, onPositionChange }) => {
-  const draggingRef = useRef<boolean>(false);
  const nodeRef = useRef<HTMLImageElement | HTMLVideoElement | null>(null);

+  const [dragging, setDragging] = useState<'started' | 'moving' | null>(null);
+
  const [x, y] = position;
  const style = useSpring({
    to: {
      left: `${x * 100}%`,
      top: `${y * 100}%`,
    },
-    immediate: draggingRef.current,
+    immediate: dragging === 'moving',
  });
  const media = useAppSelector((state) =>
    (
@ -123,8 +124,6 @@ const Preview: React.FC<{
    me ? state.accounts.get(me) : undefined,
  );

-  const [dragging, setDragging] = useState(false);
-
  const setRef = useCallback(
    (e: HTMLImageElement | HTMLVideoElement | null) => {
      nodeRef.current = e;
@ -140,20 +139,20 @@ const Preview: React.FC<{

      const handleMouseMove = (e: MouseEvent) => {
        const { x, y } = getPointerPosition(nodeRef.current, e);
-        draggingRef.current = true; // This will disable the animation for quicker feedback, only do this if the mouse actually moves
+
+        setDragging('moving'); // This will disable the animation for quicker feedback, only do this if the mouse actually moves
        onPositionChange([x, y]);
      };

      const handleMouseUp = () => {
-        setDragging(false);
-        draggingRef.current = false;
+        setDragging(null);
        document.removeEventListener('mouseup', handleMouseUp);
        document.removeEventListener('mousemove', handleMouseMove);
      };

      const { x, y } = getPointerPosition(nodeRef.current, e.nativeEvent);

-      setDragging(true);
+      setDragging('started');
      onPositionChange([x, y]);

      document.addEventListener('mouseup', handleMouseUp);
@ -489,6 +488,7 @@ export const AltTextModal = forwardRef<ModalRef, Props & Partial<RestoreProps>>(
                  className='link-button'
                  onClick={handleDetectClick}
                  disabled={type !== 'image' || isDetecting}
+                  type='button'
                >
                  <FormattedMessage
                    id='alt_text_modal.add_text_from_image'
--- a/app/javascript/mastodon/features/annual_report/index.tsx
+++ b/app/javascript/mastodon/features/annual_report/index.tsx
@ -31,15 +31,13 @@ export const AnnualReport: React.FC<{
  year: string;
 }> = ({ year }) => {
  const [response, setResponse] = useState<AnnualReportResponse | null>(null);
-  const [loading, setLoading] = useState(false);
+  const [loading, setLoading] = useState(true);
  const currentAccount = useAppSelector((state) =>
    me ? state.accounts.get(me) : undefined,
  );
  const dispatch = useAppDispatch();

  useEffect(() => {
-    setLoading(true);
-
    apiRequestGet<AnnualReportResponse>(`v1/annual_reports/${year}`)
      .then((data) => {
        dispatch(importFetchedStatuses(data.statuses));
--- a/app/javascript/mastodon/features/audio/index.tsx
+++ b/app/javascript/mastodon/features/audio/index.tsx
@ -1,4 +1,4 @@
-import { useEffect, useRef, useCallback, useState, useId } from 'react';
+import { useEffect, useRef, useCallback, useState } from 'react';

 import { defineMessages, useIntl, FormattedMessage } from 'react-intl';

@ -22,6 +22,8 @@ import { useAudioVisualizer } from 'mastodon/hooks/useAudioVisualizer';
 import { displayMedia, useBlurhash } from 'mastodon/initial_state';
 import { playerSettings } from 'mastodon/settings';

+import { AudioVisualizer } from './visualizer';
+
 const messages = defineMessages({
  play: { id: 'video.play', defaultMessage: 'Play' },
  pause: { id: 'video.pause', defaultMessage: 'Pause' },
@ -116,7 +118,6 @@ export const Audio: React.FC<{
  const seekRef = useRef<HTMLDivElement>(null);
  const volumeRef = useRef<HTMLDivElement>(null);
  const hoverTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>();
-  const accessibilityId = useId();

  const { audioContextRef, sourceRef, gainNodeRef, playAudio, pauseAudio } =
    useAudioContext({ audioElementRef: audioRef });
@ -538,19 +539,6 @@ export const Audio: React.FC<{
    [togglePlay, toggleMute],
  );

-  const springForBand0 = useSpring({
-    to: { r: 50 + (frequencyBands[0] ?? 0) * 10 },
-    config: config.wobbly,
-  });
-  const springForBand1 = useSpring({
-    to: { r: 50 + (frequencyBands[1] ?? 0) * 10 },
-    config: config.wobbly,
-  });
-  const springForBand2 = useSpring({
-    to: { r: 50 + (frequencyBands[2] ?? 0) * 10 },
-    config: config.wobbly,
-  });
-
  const progress = Math.min((currentTime / loadedDuration) * 100, 100);
  const effectivelyMuted = muted || volume === 0;

@ -641,81 +629,7 @@ export const Audio: React.FC<{
        </div>

        <div className='audio-player__controls__play'>
-          <svg
-            className='audio-player__visualizer'
-            viewBox='0 0 124 124'
-            xmlns='http://www.w3.org/2000/svg'
-          >
-            <animated.circle
-              opacity={0.5}
-              cx={57}
-              cy={62.5}
-              r={springForBand0.r}
-              fill='var(--player-accent-color)'
-            />
-            <animated.circle
-              opacity={0.5}
-              cx={65}
-              cy={57.5}
-              r={springForBand1.r}
-              fill='var(--player-accent-color)'
-            />
-            <animated.circle
-              opacity={0.5}
-              cx={63}
-              cy={66.5}
-              r={springForBand2.r}
-              fill='var(--player-accent-color)'
-            />
-
-            <g clipPath={`url(#${accessibilityId}-clip)`}>
-              <rect
-                x={14}
-                y={14}
-                width={96}
-                height={96}
-                fill={`url(#${accessibilityId}-pattern)`}
-              />
-              <rect
-                x={14}
-                y={14}
-                width={96}
-                height={96}
-                fill='var(--player-background-color'
-                opacity={0.45}
-              />
-            </g>
-
-            <defs>
-              <pattern
-                id={`${accessibilityId}-pattern`}
-                patternContentUnits='objectBoundingBox'
-                width='1'
-                height='1'
-              >
-                <use href={`#${accessibilityId}-image`} />
-              </pattern>
-
-              <clipPath id={`${accessibilityId}-clip`}>
-                <rect
-                  x={14}
-                  y={14}
-                  width={96}
-                  height={96}
-                  rx={48}
-                  fill='white'
-                />
-              </clipPath>
-
-              <image
-                id={`${accessibilityId}-image`}
-                href={poster}
-                width={1}
-                height={1}
-                preserveAspectRatio='none'
-              />
-            </defs>
-          </svg>
+          <AudioVisualizer frequencyBands={frequencyBands} poster={poster} />

          <button
            type='button'
--- a/app/javascript/mastodon/features/audio/visualizer.tsx
+++ b/app/javascript/mastodon/features/audio/visualizer.tsx
@ -0,0 +1,100 @@
+import { useId } from 'react';
+import type { FC } from 'react';
+
+import { animated, config, useSpring } from '@react-spring/web';
+
+interface AudioVisualizerProps {
+  frequencyBands?: number[];
+  poster?: string;
+}
+
+export const AudioVisualizer: FC<AudioVisualizerProps> = ({
+  frequencyBands = [],
+  poster,
+}) => {
+  const accessibilityId = useId();
+
+  const springForBand0 = useSpring({
+    to: { r: 50 + (frequencyBands[0] ?? 0) * 10 },
+    config: config.wobbly,
+  });
+  const springForBand1 = useSpring({
+    to: { r: 50 + (frequencyBands[1] ?? 0) * 10 },
+    config: config.wobbly,
+  });
+  const springForBand2 = useSpring({
+    to: { r: 50 + (frequencyBands[2] ?? 0) * 10 },
+    config: config.wobbly,
+  });
+
+  return (
+    <svg
+      className='audio-player__visualizer'
+      viewBox='0 0 124 124'
+      xmlns='http://www.w3.org/2000/svg'
+    >
+      <animated.circle
+        opacity={0.5}
+        cx={57}
+        cy={62.5}
+        r={springForBand0.r}
+        fill='var(--player-accent-color)'
+      />
+      <animated.circle
+        opacity={0.5}
+        cx={65}
+        cy={57.5}
+        r={springForBand1.r}
+        fill='var(--player-accent-color)'
+      />
+      <animated.circle
+        opacity={0.5}
+        cx={63}
+        cy={66.5}
+        r={springForBand2.r}
+        fill='var(--player-accent-color)'
+      />
+
+      <g clipPath={`url(#${accessibilityId}-clip)`}>
+        <rect
+          x={14}
+          y={14}
+          width={96}
+          height={96}
+          fill={`url(#${accessibilityId}-pattern)`}
+        />
+        <rect
+          x={14}
+          y={14}
+          width={96}
+          height={96}
+          fill='var(--player-background-color'
+          opacity={0.45}
+        />
+      </g>
+
+      <defs>
+        <pattern
+          id={`${accessibilityId}-pattern`}
+          patternContentUnits='objectBoundingBox'
+          width='1'
+          height='1'
+        >
+          <use href={`#${accessibilityId}-image`} />
+        </pattern>
+
+        <clipPath id={`${accessibilityId}-clip`}>
+          <rect x={14} y={14} width={96} height={96} rx={48} fill='white' />
+        </clipPath>
+
+        <image
+          id={`${accessibilityId}-image`}
+          href={poster}
+          width={1}
+          height={1}
+          preserveAspectRatio='none'
+        />
+      </defs>
+    </svg>
+  );
+};
--- a/app/javascript/mastodon/features/compose/components/compose_form.jsx
+++ b/app/javascript/mastodon/features/compose/components/compose_form.jsx
@ -123,11 +123,10 @@ class ComposeForm extends ImmutablePureComponent {
  };

  canSubmit = () => {
-    const { isSubmitting, isChangingUpload, isUploading, anyMedia, maxChars } = this.props;
+    const { isSubmitting, isChangingUpload, isUploading, maxChars } = this.props;
    const fulltext = this.getFulltextForCharacterCounting();
-    const isOnlyWhitespace = fulltext.length !== 0 && fulltext.trim().length === 0;

-    return !(isSubmitting || isUploading || isChangingUpload || length(fulltext) > maxChars || (isOnlyWhitespace && !anyMedia));
+    return !(isSubmitting || isUploading || isChangingUpload || length(fulltext) > maxChars);
  };

  handleSubmit = (e) => {
@ -141,7 +140,10 @@ class ComposeForm extends ImmutablePureComponent {
      return;
    }

-    this.props.onSubmit(missingAltTextModal && this.props.missingAltText && this.props.privacy !== 'direct');
+    this.props.onSubmit({
+      missingAltText: missingAltTextModal && this.props.missingAltText && this.props.privacy !== 'direct',
+      quoteToPrivate: this.props.quoteToPrivate,
+    });

    if (e) {
      e.preventDefault();
--- a/app/javascript/mastodon/features/compose/components/language_dropdown.tsx
+++ b/app/javascript/mastodon/features/compose/components/language_dropdown.tsx
@ -55,6 +55,8 @@ const getFrequentlyUsedLanguages = createSelector(
      .toArray(),
 );

+const isTextLongEnoughForGuess = (text: string) => text.length > 20;
+
 const LanguageDropdownMenu: React.FC<{
  value: string;
  guess?: string;
@ -375,14 +377,27 @@ export const LanguageDropdown: React.FC = () => {
  );

  useEffect(() => {
-    if (text.length > 20) {
+    if (isTextLongEnoughForGuess(text)) {
      debouncedGuess(text, setGuess);
    } else {
      debouncedGuess.cancel();
-      setGuess('');
    }
  }, [text, setGuess]);

+  // Keeping track of the previous render's text length here
+  // to be able to reset the guess when the text length drops
+  // below the threshold needed to make a guess
+  const [wasLongText, setWasLongText] = useState(() =>
+    isTextLongEnoughForGuess(text),
+  );
+  if (wasLongText !== isTextLongEnoughForGuess(text)) {
+    setWasLongText(isTextLongEnoughForGuess(text));
+
+    if (wasLongText) {
+      setGuess('');
+    }
+  }
+
  return (
    <div ref={targetRef}>
      <button
--- a/app/javascript/mastodon/features/compose/components/quote_placeholder.tsx
+++ b/app/javascript/mastodon/features/compose/components/quote_placeholder.tsx
@ -0,0 +1,48 @@
+import { useCallback } from 'react';
+import type { FC } from 'react';
+
+import { defineMessages, useIntl } from 'react-intl';
+
+import { cancelPasteLinkCompose } from '@/mastodon/actions/compose_typed';
+import { useAppDispatch } from '@/mastodon/store';
+import CancelFillIcon from '@/material-icons/400-24px/cancel-fill.svg?react';
+import { DisplayName } from 'mastodon/components/display_name';
+import { IconButton } from 'mastodon/components/icon_button';
+import { Skeleton } from 'mastodon/components/skeleton';
+
+const messages = defineMessages({
+  quote_cancel: { id: 'status.quote.cancel', defaultMessage: 'Cancel quote' },
+});
+
+export const QuotePlaceholder: FC = () => {
+  const intl = useIntl();
+  const dispatch = useAppDispatch();
+  const handleQuoteCancel = useCallback(() => {
+    dispatch(cancelPasteLinkCompose());
+  }, [dispatch]);
+
+  return (
+    <div className='status__quote'>
+      <div className='status'>
+        <div className='status__info'>
+          <div className='status__avatar'>
+            <Skeleton width='32px' height='32px' />
+          </div>
+          <div className='status__display-name'>
+            <DisplayName />
+          </div>
+          <IconButton
+            onClick={handleQuoteCancel}
+            className='status__quote-cancel'
+            title={intl.formatMessage(messages.quote_cancel)}
+            icon='cancel-fill'
+            iconComponent={CancelFillIcon}
+          />
+        </div>
+        <div className='status__content'>
+          <Skeleton />
+        </div>
+      </div>
+    </div>
+  );
+};
--- a/app/javascript/mastodon/features/compose/components/quoted_post.tsx
+++ b/app/javascript/mastodon/features/compose/components/quoted_post.tsx
@ -7,11 +7,17 @@ import { quoteComposeCancel } from '@/mastodon/actions/compose_typed';
 import { QuotedStatus } from '@/mastodon/components/status_quoted';
 import { useAppDispatch, useAppSelector } from '@/mastodon/store';

+import { QuotePlaceholder } from './quote_placeholder';
+
 export const ComposeQuotedStatus: FC = () => {
  const quotedStatusId = useAppSelector(
    (state) => state.compose.get('quoted_status_id') as string | null,
  );

+  const isFetchingLink = useAppSelector(
+    (state) => !!state.compose.get('fetching_link'),
+  );
+
  const isEditing = useAppSelector((state) => !!state.compose.get('id'));

  const quote = useMemo(
@ -30,7 +36,9 @@ export const ComposeQuotedStatus: FC = () => {
    dispatch(quoteComposeCancel());
  }, [dispatch]);

-  if (!quote) {
+  if (isFetchingLink && !quote) {
+    return <QuotePlaceholder />;
+  } else if (!quote) {
    return null;
  }

--- a/app/javascript/mastodon/features/compose/components/search.tsx
+++ b/app/javascript/mastodon/features/compose/components/search.tsx
@ -1,4 +1,4 @@
-import { useCallback, useState, useRef, useEffect } from 'react';
+import { useCallback, useState, useRef, useEffect, useMemo } from 'react';

 import {
  defineMessages,
@ -97,173 +97,13 @@ export const Search: React.FC<{
  const [expanded, setExpanded] = useState(false);
  const [selectedOption, setSelectedOption] = useState(-1);
  const [quickActions, setQuickActions] = useState<SearchOption[]>([]);
-  useEffect(() => {
-    setValue(initialValue ?? '');
-    setQuickActions([]);
-  }, [initialValue]);
-  const searchOptions: SearchOption[] = [];

  const unfocus = useCallback(() => {
    document.querySelector('.ui')?.parentElement?.focus();
    setExpanded(false);
  }, []);

-  if (searchEnabled) {
-    searchOptions.push(
-      {
-        key: 'prompt-has',
-        label: (
-          <>
-            <mark>has:</mark>{' '}
-            <FormattedList
-              type='disjunction'
-              value={['media', 'poll', 'embed']}
-            />
-          </>
-        ),
-        action: (e) => {
-          e.preventDefault();
-          insertText('has:');
-        },
-      },
-      {
-        key: 'prompt-is',
-        label: (
-          <>
-            <mark>is:</mark>{' '}
-            <FormattedList type='disjunction' value={['reply', 'sensitive']} />
-          </>
-        ),
-        action: (e) => {
-          e.preventDefault();
-          insertText('is:');
-        },
-      },
-      {
-        key: 'prompt-language',
-        label: (
-          <>
-            <mark>language:</mark>{' '}
-            <FormattedMessage
-              id='search_popout.language_code'
-              defaultMessage='ISO language code'
-            />
-          </>
-        ),
-        action: (e) => {
-          e.preventDefault();
-          insertText('language:');
-        },
-      },
-      {
-        key: 'prompt-from',
-        label: (
-          <>
-            <mark>from:</mark>{' '}
-            <FormattedMessage id='search_popout.user' defaultMessage='user' />
-          </>
-        ),
-        action: (e) => {
-          e.preventDefault();
-          insertText('from:');
-        },
-      },
-      {
-        key: 'prompt-before',
-        label: (
-          <>
-            <mark>before:</mark>{' '}
-            <FormattedMessage
-              id='search_popout.specific_date'
-              defaultMessage='specific date'
-            />
-          </>
-        ),
-        action: (e) => {
-          e.preventDefault();
-          insertText('before:');
-        },
-      },
-      {
-        key: 'prompt-during',
-        label: (
-          <>
-            <mark>during:</mark>{' '}
-            <FormattedMessage
-              id='search_popout.specific_date'
-              defaultMessage='specific date'
-            />
-          </>
-        ),
-        action: (e) => {
-          e.preventDefault();
-          insertText('during:');
-        },
-      },
-      {
-        key: 'prompt-after',
-        label: (
-          <>
-            <mark>after:</mark>{' '}
-            <FormattedMessage
-              id='search_popout.specific_date'
-              defaultMessage='specific date'
-            />
-          </>
-        ),
-        action: (e) => {
-          e.preventDefault();
-          insertText('after:');
-        },
-      },
-      {
-        key: 'prompt-in',
-        label: (
-          <>
-            <mark>in:</mark>{' '}
-            <FormattedList
-              type='disjunction'
-              value={['all', 'library', 'public']}
-            />
-          </>
-        ),
-        action: (e) => {
-          e.preventDefault();
-          insertText('in:');
-        },
-      },
-    );
-  }
-
-  const recentOptions: SearchOption[] = recent.map((search) => ({
-    key: `${search.type}/${search.q}`,
-    label: labelForRecentSearch(search),
-    action: () => {
-      setValue(search.q);
-
-      if (search.type === 'account') {
-        history.push(`/@${search.q}`);
-      } else if (search.type === 'hashtag') {
-        history.push(`/tags/${search.q}`);
-      } else {
-        const queryParams = new URLSearchParams({ q: search.q });
-        if (search.type) queryParams.set('type', search.type);
-        history.push({ pathname: '/search', search: queryParams.toString() });
-      }
-
-      unfocus();
-    },
-    forget: (e) => {
-      e.stopPropagation();
-      void dispatch(forgetSearchResult(search));
-    },
-  }));
-
-  const navigableOptions = hasValue
-    ? quickActions.concat(searchOptions)
-    : recentOptions.concat(quickActions, searchOptions);
-
-  const insertText = (text: string) => {
+  const insertText = useCallback((text: string) => {
    setValue((currentValue) => {
      if (currentValue === '') {
        return text;
@ -273,7 +113,181 @@ export const Search: React.FC<{
        return `${currentValue} ${text}`;
      }
    });
-  };
+  }, []);
+
+  const searchOptions = useMemo(() => {
+    if (!searchEnabled) {
+      return [];
+    } else {
+      const options: SearchOption[] = [
+        {
+          key: 'prompt-has',
+          label: (
+            <>
+              <mark>has:</mark>{' '}
+              <FormattedList
+                type='disjunction'
+                value={['media', 'poll', 'embed']}
+              />
+            </>
+          ),
+          action: (e) => {
+            e.preventDefault();
+            insertText('has:');
+          },
+        },
+        {
+          key: 'prompt-is',
+          label: (
+            <>
+              <mark>is:</mark>{' '}
+              <FormattedList
+                type='disjunction'
+                value={['reply', 'sensitive']}
+              />
+            </>
+          ),
+          action: (e) => {
+            e.preventDefault();
+            insertText('is:');
+          },
+        },
+        {
+          key: 'prompt-language',
+          label: (
+            <>
+              <mark>language:</mark>{' '}
+              <FormattedMessage
+                id='search_popout.language_code'
+                defaultMessage='ISO language code'
+              />
+            </>
+          ),
+          action: (e) => {
+            e.preventDefault();
+            insertText('language:');
+          },
+        },
+        {
+          key: 'prompt-from',
+          label: (
+            <>
+              <mark>from:</mark>{' '}
+              <FormattedMessage id='search_popout.user' defaultMessage='user' />
+            </>
+          ),
+          action: (e) => {
+            e.preventDefault();
+            insertText('from:');
+          },
+        },
+        {
+          key: 'prompt-before',
+          label: (
+            <>
+              <mark>before:</mark>{' '}
+              <FormattedMessage
+                id='search_popout.specific_date'
+                defaultMessage='specific date'
+              />
+            </>
+          ),
+          action: (e) => {
+            e.preventDefault();
+            insertText('before:');
+          },
+        },
+        {
+          key: 'prompt-during',
+          label: (
+            <>
+              <mark>during:</mark>{' '}
+              <FormattedMessage
+                id='search_popout.specific_date'
+                defaultMessage='specific date'
+              />
+            </>
+          ),
+          action: (e) => {
+            e.preventDefault();
+            insertText('during:');
+          },
+        },
+        {
+          key: 'prompt-after',
+          label: (
+            <>
+              <mark>after:</mark>{' '}
+              <FormattedMessage
+                id='search_popout.specific_date'
+                defaultMessage='specific date'
+              />
+            </>
+          ),
+          action: (e) => {
+            e.preventDefault();
+            insertText('after:');
+          },
+        },
+        {
+          key: 'prompt-in',
+          label: (
+            <>
+              <mark>in:</mark>{' '}
+              <FormattedList
+                type='disjunction'
+                value={['all', 'library', 'public']}
+              />
+            </>
+          ),
+          action: (e) => {
+            e.preventDefault();
+            insertText('in:');
+          },
+        },
+      ];
+      return options;
+    }
+  }, [insertText]);
+
+  const recentOptions: SearchOption[] = useMemo(
+    () =>
+      recent.map((search) => ({
+        key: `${search.type}/${search.q}`,
+        label: labelForRecentSearch(search),
+        action: () => {
+          setValue(search.q);
+
+          if (search.type === 'account') {
+            history.push(`/@${search.q}`);
+          } else if (search.type === 'hashtag') {
+            history.push(`/tags/${search.q}`);
+          } else {
+            const queryParams = new URLSearchParams({ q: search.q });
+            if (search.type) queryParams.set('type', search.type);
+            history.push({
+              pathname: '/search',
+              search: queryParams.toString(),
+            });
+          }
+
+          unfocus();
+        },
+        forget: (e) => {
+          e.stopPropagation();
+          void dispatch(forgetSearchResult(search));
+        },
+      })),
+    [dispatch, history, recent, unfocus],
+  );
+
+  const navigableOptions: SearchOption[] = useMemo(
+    () =>
+      hasValue
+        ? quickActions.concat(searchOptions)
+        : recentOptions.concat(quickActions, searchOptions),
+    [hasValue, quickActions, recentOptions, searchOptions],
+  );

  const submit = useCallback(
    (q: string, type?: SearchType) => {
@ -557,7 +571,11 @@ export const Search: React.FC<{
                    )}
                  >
                    <span>{label}</span>
-                    <button className='icon-button' onMouseDown={forget}>
+                    <button
+                      className='icon-button'
+                      onMouseDown={forget}
+                      type='button'
+                    >
                      <Icon id='times' icon={CloseIcon} />
                    </button>
                  </div>
@ -591,6 +609,7 @@ export const Search: React.FC<{
                  className={classNames('search__popout__menu__item', {
                    selected: selectedOption === i,
                  })}
+                  type='button'
                >
                  {label}
                </button>
@ -617,6 +636,7 @@ export const Search: React.FC<{
                    selectedOption ===
                    (quickActions.length || recent.length) + i,
                })}
+                type='button'
              >
                {label}
              </button>
--- a/app/javascript/mastodon/features/compose/components/upload.tsx
+++ b/app/javascript/mastodon/features/compose/components/upload.tsx
@ -10,6 +10,7 @@ import { useSortable } from '@dnd-kit/sortable';
 import { CSS } from '@dnd-kit/utilities';

 import CloseIcon from '@/material-icons/400-20px/close.svg?react';
+import SoundIcon from '@/material-icons/400-24px/audio.svg?react';
 import EditIcon from '@/material-icons/400-24px/edit.svg?react';
 import WarningIcon from '@/material-icons/400-24px/warning.svg?react';
 import { undoUploadCompose } from 'mastodon/actions/compose';
@ -17,7 +18,18 @@ import { openModal } from 'mastodon/actions/modal';
 import { Blurhash } from 'mastodon/components/blurhash';
 import { Icon } from 'mastodon/components/icon';
 import type { MediaAttachment } from 'mastodon/models/media_attachment';
-import { useAppDispatch, useAppSelector } from 'mastodon/store';
+import {
+  createAppSelector,
+  useAppDispatch,
+  useAppSelector,
+} from 'mastodon/store';
+
+import { AudioVisualizer } from '../../audio/visualizer';
+
+const selectUserAvatar = createAppSelector(
+  [(state) => state.accounts, (state) => state.meta.get('me') as string],
+  (accounts, myId) => accounts.get(myId)?.avatar_static,
+);

 export const Upload: React.FC<{
  id: string;
@ -38,6 +50,7 @@ export const Upload: React.FC<{
  const sensitive = useAppSelector(
    (state) => state.compose.get('spoiler') as boolean,
  );
+  const userAvatar = useAppSelector(selectUserAvatar);

  const handleUndoClick = useCallback(() => {
    dispatch(undoUploadCompose(id));
@ -67,6 +80,8 @@ export const Upload: React.FC<{
    transform: CSS.Transform.toString(transform),
    transition,
  };
+  const preview_url = media.get('preview_url') as string | null;
+  const blurhash = media.get('blurhash') as string | null;

  return (
    <div
@ -85,17 +100,19 @@ export const Upload: React.FC<{
      <div
        className='compose-form__upload__thumbnail'
        style={{
-          backgroundImage: !sensitive
-            ? `url(${media.get('preview_url') as string})`
-            : undefined,
+          backgroundImage:
+            !sensitive && preview_url ? `url(${preview_url})` : undefined,
          backgroundPosition: `${x}% ${y}%`,
        }}
      >
-        {sensitive && (
-          <Blurhash
-            hash={media.get('blurhash') as string}
-            className='compose-form__upload__preview'
-          />
+        {sensitive && blurhash && (
+          <Blurhash hash={blurhash} className='compose-form__upload__preview' />
+        )}
+        {!sensitive && !preview_url && (
+          <div className='compose-form__upload__visualizer'>
+            <AudioVisualizer poster={userAvatar} />
+            <Icon id='sound' icon={SoundIcon} />
+          </div>
        )}

        <div className='compose-form__upload__actions'>
--- a/app/javascript/mastodon/features/compose/components/visibility_button.tsx
+++ b/app/javascript/mastodon/features/compose/components/visibility_button.tsx
@ -5,8 +5,10 @@ import { defineMessages, useIntl } from 'react-intl';

 import classNames from 'classnames';

-import { changeComposeVisibility } from '@/mastodon/actions/compose';
-import { setComposeQuotePolicy } from '@/mastodon/actions/compose_typed';
+import {
+  changeComposeVisibility,
+  setComposeQuotePolicy,
+} from '@/mastodon/actions/compose_typed';
 import { openModal } from '@/mastodon/actions/modal';
 import type { ApiQuotePolicy } from '@/mastodon/api_types/quotes';
 import type { StatusVisibility } from '@/mastodon/api_types/statuses';
--- a/app/javascript/mastodon/features/compose/containers/compose_form_container.js
+++ b/app/javascript/mastodon/features/compose/containers/compose_form_container.js
@ -12,6 +12,7 @@ import {
 } from 'mastodon/actions/compose';
 import { pasteLinkCompose } from 'mastodon/actions/compose_typed';
 import { openModal } from 'mastodon/actions/modal';
+import { PRIVATE_QUOTE_MODAL_ID } from 'mastodon/features/ui/components/confirmation_modals/private_quote_notify';

 import ComposeForm from '../components/compose_form';

@ -32,6 +33,10 @@ const mapStateToProps = state => ({
  isUploading: state.getIn(['compose', 'is_uploading']),
  anyMedia: state.getIn(['compose', 'media_attachments']).size > 0,
  missingAltText: state.getIn(['compose', 'media_attachments']).some(media => ['image', 'gifv'].includes(media.get('type')) && (media.get('description') ?? '').length === 0),
+  quoteToPrivate:
+    !!state.getIn(['compose', 'quoted_status_id'])
+    && state.getIn(['compose', 'privacy']) === 'private'
+    && !state.getIn(['settings', 'dismissed_banners', PRIVATE_QUOTE_MODAL_ID]),
  isInReply: state.getIn(['compose', 'in_reply_to']) !== null,
  lang: state.getIn(['compose', 'language']),
  maxChars: state.getIn(['server', 'server', 'configuration', 'statuses', 'max_characters'], 500),
@ -43,12 +48,17 @@ const mapDispatchToProps = (dispatch, props) => ({
    dispatch(changeCompose(text));
  },

-  onSubmit (missingAltText) {
+  onSubmit ({ missingAltText, quoteToPrivate }) {
    if (missingAltText) {
      dispatch(openModal({
        modalType: 'CONFIRM_MISSING_ALT_TEXT',
        modalProps: {},
      }));
+    } else if (quoteToPrivate) {
+      dispatch(openModal({
+        modalType: 'CONFIRM_PRIVATE_QUOTE_NOTIFY',
+        modalProps: {},
+      }));
    } else {
      dispatch(submitCompose((status) => {
        if (props.redirectOnSuccess) {
--- a/app/javascript/mastodon/features/compose/containers/privacy_dropdown_container.js
+++ b/app/javascript/mastodon/features/compose/containers/privacy_dropdown_container.js
@ -1,8 +1,7 @@
 import { connect } from 'react-redux';

-import { changeComposeVisibility } from '../../../actions/compose';
-import { openModal, closeModal } from '../../../actions/modal';
-import { isUserTouching } from '../../../is_mobile';
+import { changeComposeVisibility } from '@/mastodon/actions/compose_typed';
+
 import PrivacyDropdown from '../components/privacy_dropdown';

 const mapStateToProps = state => ({
--- a/app/javascript/mastodon/features/domain_blocks/index.tsx
+++ b/app/javascript/mastodon/features/domain_blocks/index.tsx
@ -19,14 +19,12 @@ const messages = defineMessages({
 const Blocks: React.FC<{ multiColumn: boolean }> = ({ multiColumn }) => {
  const intl = useIntl();
  const [domains, setDomains] = useState<string[]>([]);
-  const [loading, setLoading] = useState(false);
+  const [loading, setLoading] = useState(true);
  const [next, setNext] = useState<string | undefined>();
  const hasMore = !!next;
  const columnRef = useRef<ColumnRef>(null);

  useEffect(() => {
-    setLoading(true);
-
    void apiGetDomainBlocks()
      .then(({ domains, links }) => {
        const next = links.refs.find((link) => link.rel === 'next');
@ -40,7 +38,7 @@ const Blocks: React.FC<{ multiColumn: boolean }> = ({ multiColumn }) => {
      .catch(() => {
        setLoading(false);
      });
-  }, [setLoading, setDomains, setNext]);
+  }, []);

  const handleLoadMore = useCallback(() => {
    setLoading(true);
--- a/app/javascript/mastodon/features/emoji/emoji.js
+++ b/app/javascript/mastodon/features/emoji/emoji.js
@ -1,6 +1,5 @@
 import Trie from 'substring-trie';

-import { isModernEmojiEnabled } from '@/mastodon/utils/environment';
 import { assetHost } from 'mastodon/utils/config';

 import { autoPlayGif } from '../../initial_state';
@ -153,13 +152,9 @@ const emojifyNode = (node, customEmojis) => {
 * Legacy emoji processing function.
 * @param {string} str
 * @param {object} customEmojis
- * @param {boolean} force If true, always emojify even if modern emoji is enabled
 * @returns {string}
 */
-const emojify = (str, customEmojis = {}, force = false) => {
-  if (isModernEmojiEnabled() && !force) {
-    return str;
-  }
+const emojify = (str, customEmojis = {}) => {
  const wrapper = document.createElement('div');
  wrapper.innerHTML = str;

--- a/app/javascript/mastodon/features/emoji/emoji_compressed.mjs
+++ b/app/javascript/mastodon/features/emoji/emoji_compressed.mjs
@ -14,8 +14,7 @@ import { uncompress as emojiMartUncompress } from 'emoji-mart/dist/utils/data';

 import data from './emoji_data.json';
 import emojiMap from './emoji_map.json';
-import { unicodeToFilename } from './unicode_to_filename';
-import { unicodeToUnifiedName } from './unicode_to_unified_name';
+import { unicodeToFilename, unicodeToUnifiedName } from './unicode_utils';

 emojiMartUncompress(data);

--- a/Show More
+++ b/Show More
 @ -1 +1 @@
 .10
 .11