From e3dfb7ddd6ab8d821bca6337892f5d5b42992133 Mon Sep 17 00:00:00 2001
From: diondiondion <mail@diondiondion.com>
Date: Wed, 25 Mar 2026 16:01:40 +0100
Subject: [PATCH] Render `FormattedMessage` translations into `React.Fragment`
 by default (#38398)

---
 .storybook/preview.tsx                                     | 6 +-----
 .../mastodon/components/alt_text_badge/index.tsx           | 3 +--
 .../mastodon/features/collections/detail/accounts_list.tsx | 7 +------
 .../mastodon/features/collections/editor/details.tsx       | 3 +--
 app/javascript/mastodon/locales/intl_provider.tsx          | 1 -
 5 files changed, 4 insertions(+), 16 deletions(-)

diff --git a/.storybook/preview.tsx b/.storybook/preview.tsx
index b8b9bd385e..4fb559ccf9 100644
--- a/.storybook/preview.tsx
+++ b/.storybook/preview.tsx
@@ -137,11 +137,7 @@ const preview: Preview = {
       }, [currentLocale, currentLocaleData]);
 
       return (
-        <IntlProvider
-          locale={currentLocale}
-          messages={currentLocaleData}
-          textComponent='span'
-        >
+        <IntlProvider locale={currentLocale} messages={currentLocaleData}>
           <Story />
         </IntlProvider>
       );
diff --git a/app/javascript/mastodon/components/alt_text_badge/index.tsx b/app/javascript/mastodon/components/alt_text_badge/index.tsx
index 6bb64254c6..ecfb29fd52 100644
--- a/app/javascript/mastodon/components/alt_text_badge/index.tsx
+++ b/app/javascript/mastodon/components/alt_text_badge/index.tsx
@@ -1,4 +1,4 @@
-import { useState, useCallback, useRef, useId, Fragment } from 'react';
+import { useState, useCallback, useRef, useId } from 'react';
 
 import { FormattedMessage, useIntl } from 'react-intl';
 
@@ -84,7 +84,6 @@ export const AltTextBadge: React.FC<{ description: string }> = ({
                 <FormattedMessage
                   id='alt_text_badge.title'
                   defaultMessage='Alt text'
-                  tagName={Fragment}
                 />
               </h4>
 
diff --git a/app/javascript/mastodon/features/collections/detail/accounts_list.tsx b/app/javascript/mastodon/features/collections/detail/accounts_list.tsx
index e458dd27f0..7199b8c32a 100644
--- a/app/javascript/mastodon/features/collections/detail/accounts_list.tsx
+++ b/app/javascript/mastodon/features/collections/detail/accounts_list.tsx
@@ -1,4 +1,4 @@
-import { Fragment, useCallback, useRef, useState } from 'react';
+import { useCallback, useRef, useState } from 'react';
 
 import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
 
@@ -100,14 +100,12 @@ const RevokeControls: React.FC<{
         <FormattedMessage
           id='collections.detail.accept_inclusion'
           defaultMessage='Okay'
-          tagName={Fragment}
         />
       </Button>
       <Button secondary onClick={confirmRevoke}>
         <FormattedMessage
           id='collections.detail.revoke_inclusion'
           defaultMessage='Remove me'
-          tagName={Fragment}
         />
       </Button>
     </div>
@@ -143,7 +141,6 @@ const SensitiveScreen: React.FC<{
         <FormattedMessage
           id='content_warning.show'
           defaultMessage='Show anyway'
-          tagName={Fragment}
         />
       </Button>
     </div>
@@ -205,7 +202,6 @@ export const CollectionAccountsList: React.FC<{
               values={{
                 author: <SimpleAuthorName id={collection.account_id} />,
               }}
-              tagName={Fragment}
             />
           </h3>
           <Article
@@ -231,7 +227,6 @@ export const CollectionAccountsList: React.FC<{
             <FormattedMessage
               id='collections.detail.other_accounts_in_collection'
               defaultMessage='Others in this collection:'
-              tagName={Fragment}
             />
           </h3>
         </>
diff --git a/app/javascript/mastodon/features/collections/editor/details.tsx b/app/javascript/mastodon/features/collections/editor/details.tsx
index 9a7ea16be8..ce0019353d 100644
--- a/app/javascript/mastodon/features/collections/editor/details.tsx
+++ b/app/javascript/mastodon/features/collections/editor/details.tsx
@@ -1,4 +1,4 @@
-import { Fragment, useCallback, useMemo } from 'react';
+import { useCallback, useMemo } from 'react';
 
 import { FormattedMessage, useIntl } from 'react-intl';
 
@@ -413,7 +413,6 @@ const LanguageField: React.FC = () => {
         <FormattedMessage
           id='collections.collection_language_none'
           defaultMessage='None'
-          tagName={Fragment}
         />
       </option>
       {languages?.map(([code, name, localName]) => (
diff --git a/app/javascript/mastodon/locales/intl_provider.tsx b/app/javascript/mastodon/locales/intl_provider.tsx
index 94372f95b0..b59458cd2d 100644
--- a/app/javascript/mastodon/locales/intl_provider.tsx
+++ b/app/javascript/mastodon/locales/intl_provider.tsx
@@ -50,7 +50,6 @@ export const IntlProvider: React.FC<
       locale={locale}
       messages={messages}
       onError={onProviderError}
-      textComponent='span'
       {...props}
     >
       {children}