Wrap all React roots with StrictMode

.storybook/preview.tsx

@@ -3,7 +3,7 @@
 
 import '../ts/window.d.ts';
 
-import React from 'react';
+import React, { StrictMode } from 'react';
 
 import 'sanitize.css';
 import '../stylesheets/manifest.scss';
@@ -153,6 +153,14 @@ window.ConversationController.isSignalConversationId = () => false;
 window.ConversationController.onConvoMessageMount = noop;
 window.reduxStore = mockStore;
 
+function withStrictMode(Story, context) {
+  return (
+    <StrictMode>
+      <Story {...context} />
+    </StrictMode>
+  );
+}
+
 const withGlobalTypesProvider = (Story, context) => {
   const theme =
     context.globals.theme === 'light' ? ThemeType.light : ThemeType.dark;
@@ -234,6 +242,7 @@ function withFunProvider(Story, context) {
 }
 
 export const decorators = [
+  withStrictMode,
   withGlobalTypesProvider,
   withMockStoreProvider,
   withScrollLockProvider,

ts/components/MediaPermissionsModal.stories.tsx

@@ -1,6 +1,6 @@
 // Copyright 2025 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
-import React, { StrictMode } from 'react';
+import React from 'react';
 import { action } from '@storybook/addon-actions';
 import { type ComponentMeta } from '../storybook/types';
 import type { PropsType } from './MediaPermissionsModal';
@@ -11,11 +11,7 @@ const { i18n } = window.SignalContext;
 type TemplateProps = Omit<PropsType, 'i18n' | 'children'>;
 
 function Template(props: TemplateProps) {
-  return (
-    <StrictMode>
-      <MediaPermissionsModal i18n={i18n} {...props} />
-    </StrictMode>
-  );
+  return <MediaPermissionsModal i18n={i18n} {...props} />;
 }
 
 export default {

ts/components/fun/FunEmoji.stories.tsx

@@ -2,7 +2,7 @@
 // SPDX-License-Identifier: AGPL-3.0-only
 import { useVirtualizer } from '@tanstack/react-virtual';
 import { chunk } from 'lodash';
-import React, { StrictMode, useCallback, useEffect, useRef } from 'react';
+import React, { useCallback, useEffect, useRef } from 'react';
 import { type ComponentMeta } from '../../storybook/types';
 import type { FunStaticEmojiProps } from './FunEmoji';
 import { FunStaticEmoji } from './FunEmoji';
@@ -57,65 +57,63 @@ export function All(props: AllProps): JSX.Element {
   }, [rowVirtualizer, props.size]);
 
   return (
-    <StrictMode>
+    <div
+      ref={scrollerRef}
+      style={{
+        overflow: 'auto',
+        height: 400,
+        padding: 10,
+        border: '1px solid',
+      }}
+    >
       <div
-        ref={scrollerRef}
         style={{
-          overflow: 'auto',
-          height: 400,
-          padding: 10,
-          border: '1px solid',
+          position: 'relative',
+          width: '100%',
+          height: rowVirtualizer.getTotalSize(),
         }}
       >
-        <div
-          style={{
-            position: 'relative',
-            width: '100%',
-            height: rowVirtualizer.getTotalSize(),
-          }}
-        >
-          {rowVirtualizer.getVirtualItems().map(rowItem => {
-            const row = rows[rowItem.index];
-            return (
-              <div
-                key={rowItem.index}
-                style={{
-                  position: 'absolute',
-                  top: 0,
-                  left: 0,
-                  width: '100%',
-                  height: rowItem.size,
-                  transform: `translate(0, ${rowItem.start}px)`,
-                  display: 'flex',
-                  flexDirection: 'row',
-                  gap: 4,
-                  alignItems: 'center',
-                }}
-              >
-                {row.map(emojiVariantKey => {
-                  const variant = getEmojiVariantByKey(emojiVariantKey);
-                  const parentKey =
-                    getEmojiParentKeyByVariantKey(emojiVariantKey);
-                  const parent = getEmojiParentByKey(parentKey);
-                  return (
-                    <div
-                      key={emojiVariantKey}
-                      style={{ display: 'flex', outline: '1px solid' }}
-                    >
-                      <FunStaticEmoji
-                        role="img"
-                        aria-label={parent.englishShortNameDefault}
-                        size={props.size}
-                        emoji={variant}
-                      />
-                    </div>
-                  );
-                })}
-              </div>
-            );
-          })}
-        </div>
+        {rowVirtualizer.getVirtualItems().map(rowItem => {
+          const row = rows[rowItem.index];
+          return (
+            <div
+              key={rowItem.index}
+              style={{
+                position: 'absolute',
+                top: 0,
+                left: 0,
+                width: '100%',
+                height: rowItem.size,
+                transform: `translate(0, ${rowItem.start}px)`,
+                display: 'flex',
+                flexDirection: 'row',
+                gap: 4,
+                alignItems: 'center',
+              }}
+            >
+              {row.map(emojiVariantKey => {
+                const variant = getEmojiVariantByKey(emojiVariantKey);
+                const parentKey =
+                  getEmojiParentKeyByVariantKey(emojiVariantKey);
+                const parent = getEmojiParentByKey(parentKey);
+                return (
+                  <div
+                    key={emojiVariantKey}
+                    style={{ display: 'flex', outline: '1px solid' }}
+                  >
+                    <FunStaticEmoji
+                      role="img"
+                      aria-label={parent.englishShortNameDefault}
+                      size={props.size}
+                      emoji={variant}
+                    />
+                  </div>
+                );
+              })}
+            </div>
+          );
+        })}
       </div>
-    </StrictMode>
+    </div>
   );
 }

ts/components/fun/FunEmojiPicker.stories.tsx

@@ -1,6 +1,6 @@
 // Copyright 2025 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
-import React, { StrictMode, useCallback, useState } from 'react';
+import React, { useCallback, useState } from 'react';
 import { Button } from 'react-aria-components';
 import { action } from '@storybook/addon-actions';
 import { type ComponentMeta } from '../../storybook/types';
@@ -26,34 +26,32 @@ function Template(props: TemplateProps): JSX.Element {
   }, []);
 
   return (
-    <StrictMode>
-      <FunProvider
-        i18n={i18n}
-        // Recents
-        recentEmojis={MOCK_RECENT_EMOJIS}
-        recentStickers={recentStickers}
-        recentGifs={[]}
-        // Emojis
-        emojiSkinToneDefault={EmojiSkinTone.None}
-        onEmojiSkinToneDefaultChange={() => null}
-        onOpenCustomizePreferredReactionsModal={() => null}
-        onSelectEmoji={() => null}
-        // Stickers
-        installedStickerPacks={packs}
-        showStickerPickerHint={false}
-        onClearStickerPickerHint={() => null}
-        onSelectSticker={() => null}
-        // Gifs
-        fetchGifsSearch={() => Promise.reject()}
-        fetchGifsFeatured={() => Promise.reject()}
-        fetchGif={() => Promise.reject()}
-        onSelectGif={() => null}
-      >
-        <FunEmojiPicker {...props} open={open} onOpenChange={handleOpenChange}>
-          <Button>Open EmojiPicker</Button>
-        </FunEmojiPicker>
-      </FunProvider>
-    </StrictMode>
+    <FunProvider
+      i18n={i18n}
+      // Recents
+      recentEmojis={MOCK_RECENT_EMOJIS}
+      recentStickers={recentStickers}
+      recentGifs={[]}
+      // Emojis
+      emojiSkinToneDefault={EmojiSkinTone.None}
+      onEmojiSkinToneDefaultChange={() => null}
+      onOpenCustomizePreferredReactionsModal={() => null}
+      onSelectEmoji={() => null}
+      // Stickers
+      installedStickerPacks={packs}
+      showStickerPickerHint={false}
+      onClearStickerPickerHint={() => null}
+      onSelectSticker={() => null}
+      // Gifs
+      fetchGifsSearch={() => Promise.reject()}
+      fetchGifsFeatured={() => Promise.reject()}
+      fetchGif={() => Promise.reject()}
+      onSelectGif={() => null}
+    >
+      <FunEmojiPicker {...props} open={open} onOpenChange={handleOpenChange}>
+        <Button>Open EmojiPicker</Button>
+      </FunEmojiPicker>
+    </FunProvider>
   );
 }
 

ts/components/fun/FunPicker.stories.tsx

@@ -1,6 +1,6 @@
 // Copyright 2025 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
-import React, { StrictMode, useCallback, useState } from 'react';
+import React, { useCallback, useState } from 'react';
 import { Button } from 'react-aria-components';
 import { action } from '@storybook/addon-actions';
 import { type ComponentMeta } from '../../storybook/types';
@@ -23,34 +23,32 @@ function Template(props: TemplateProps) {
   }, []);
 
   return (
-    <StrictMode>
-      <FunProvider
-        i18n={i18n}
-        // Recents
-        recentEmojis={MOCK_RECENT_EMOJIS}
-        recentStickers={recentStickers}
-        recentGifs={[]}
-        // Emojis
-        emojiSkinToneDefault={EmojiSkinTone.None}
-        onEmojiSkinToneDefaultChange={() => null}
-        onOpenCustomizePreferredReactionsModal={() => null}
-        onSelectEmoji={() => null}
-        // Stickers
-        installedStickerPacks={packs}
-        showStickerPickerHint={false}
-        onClearStickerPickerHint={() => null}
-        onSelectSticker={() => null}
-        // Gifs
-        fetchGifsSearch={() => Promise.resolve(MOCK_GIFS_PAGINATED_ONE_PAGE)}
-        fetchGifsFeatured={() => Promise.resolve(MOCK_GIFS_PAGINATED_ONE_PAGE)}
-        fetchGif={() => Promise.resolve(new Blob([new Uint8Array(1)]))}
-        onSelectGif={() => null}
-      >
-        <FunPicker {...props} open={open} onOpenChange={handleOpenChange}>
-          <Button>Open FunPicker</Button>
-        </FunPicker>
-      </FunProvider>
-    </StrictMode>
+    <FunProvider
+      i18n={i18n}
+      // Recents
+      recentEmojis={MOCK_RECENT_EMOJIS}
+      recentStickers={recentStickers}
+      recentGifs={[]}
+      // Emojis
+      emojiSkinToneDefault={EmojiSkinTone.None}
+      onEmojiSkinToneDefaultChange={() => null}
+      onOpenCustomizePreferredReactionsModal={() => null}
+      onSelectEmoji={() => null}
+      // Stickers
+      installedStickerPacks={packs}
+      showStickerPickerHint={false}
+      onClearStickerPickerHint={() => null}
+      onSelectSticker={() => null}
+      // Gifs
+      fetchGifsSearch={() => Promise.resolve(MOCK_GIFS_PAGINATED_ONE_PAGE)}
+      fetchGifsFeatured={() => Promise.resolve(MOCK_GIFS_PAGINATED_ONE_PAGE)}
+      fetchGif={() => Promise.resolve(new Blob([new Uint8Array(1)]))}
+      onSelectGif={() => null}
+    >
+      <FunPicker {...props} open={open} onOpenChange={handleOpenChange}>
+        <Button>Open FunPicker</Button>
+      </FunPicker>
+    </FunProvider>
   );
 }
 

ts/components/fun/FunStickerPicker.stories.tsx

@@ -1,6 +1,6 @@
 // Copyright 2025 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
-import React, { StrictMode, useCallback, useState } from 'react';
+import React, { useCallback, useState } from 'react';
 import { Button } from 'react-aria-components';
 import { action } from '@storybook/addon-actions';
 import enMessages from '../../../_locales/en/messages.json';
@@ -28,38 +28,32 @@ function Template(props: TemplateProps): JSX.Element {
   }, []);
 
   return (
-    <StrictMode>
-      <FunProvider
-        i18n={i18n}
-        // Recents
-        recentEmojis={MOCK_RECENT_EMOJIS}
-        recentStickers={recentStickers}
-        recentGifs={[]}
-        // Emojis
-        emojiSkinToneDefault={EmojiSkinTone.None}
-        onEmojiSkinToneDefaultChange={() => null}
-        onOpenCustomizePreferredReactionsModal={() => null}
-        onSelectEmoji={() => null}
-        // Stickers
-        installedStickerPacks={packs}
-        showStickerPickerHint={false}
-        onClearStickerPickerHint={() => null}
-        onSelectSticker={() => null}
-        // Gifs
-        fetchGifsSearch={() => Promise.reject()}
-        fetchGifsFeatured={() => Promise.reject()}
-        fetchGif={() => Promise.reject()}
-        onSelectGif={() => null}
-      >
-        <FunStickerPicker
-          {...props}
-          open={open}
-          onOpenChange={handleOpenChange}
-        >
-          <Button>Open StickerPicker</Button>
-        </FunStickerPicker>
-      </FunProvider>
-    </StrictMode>
+    <FunProvider
+      i18n={i18n}
+      // Recents
+      recentEmojis={MOCK_RECENT_EMOJIS}
+      recentStickers={recentStickers}
+      recentGifs={[]}
+      // Emojis
+      emojiSkinToneDefault={EmojiSkinTone.None}
+      onEmojiSkinToneDefaultChange={() => null}
+      onOpenCustomizePreferredReactionsModal={() => null}
+      onSelectEmoji={() => null}
+      // Stickers
+      installedStickerPacks={packs}
+      showStickerPickerHint={false}
+      onClearStickerPickerHint={() => null}
+      onSelectSticker={() => null}
+      // Gifs
+      fetchGifsSearch={() => Promise.reject()}
+      fetchGifsFeatured={() => Promise.reject()}
+      fetchGif={() => Promise.reject()}
+      onSelectGif={() => null}
+    >
+      <FunStickerPicker {...props} open={open} onOpenChange={handleOpenChange}>
+        <Button>Open StickerPicker</Button>
+      </FunStickerPicker>
+    </FunProvider>
   );
 }
 

ts/quill/mentions/blot.tsx

@@ -1,7 +1,7 @@
 // Copyright 2020 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
-import React from 'react';
+import React, { StrictMode } from 'react';
 import EmbedBlot from '@signalapp/quill-cjs/blots/embed';
 import { render } from 'react-dom';
 
@@ -47,14 +47,16 @@ export class MentionBlot extends EmbedBlot {
     const mentionSpan = document.createElement('span');
 
     render(
-      <FunEmojiLocalizationProvider i18n={window.i18n}>
-        <span className="module-composition-input__at-mention">
-          <bdi>
-            @
-            <Emojify text={mention.title} />
-          </bdi>
-        </span>
-      </FunEmojiLocalizationProvider>,
+      <StrictMode>
+        <FunEmojiLocalizationProvider i18n={window.i18n}>
+          <span className="module-composition-input__at-mention">
+            <bdi>
+              @
+              <Emojify text={mention.title} />
+            </bdi>
+          </span>
+        </FunEmojiLocalizationProvider>
+      </StrictMode>,
       mentionSpan
     );
 

ts/shims/renderClearingDataView.tsx

@@ -1,7 +1,7 @@
 // Copyright 2021 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
-import React from 'react';
+import React, { StrictMode } from 'react';
 import { render } from 'react-dom';
 
 import { ClearingData } from '../components/ClearingData';
@@ -10,9 +10,11 @@ import { FunDefaultEnglishEmojiLocalizationProvider } from '../components/fun/Fu
 
 export function renderClearingDataView(): void {
   render(
-    <FunDefaultEnglishEmojiLocalizationProvider>
-      <ClearingData deleteAllData={deleteAllData} i18n={window.i18n} />
-    </FunDefaultEnglishEmojiLocalizationProvider>,
+    <StrictMode>
+      <FunDefaultEnglishEmojiLocalizationProvider>
+        <ClearingData deleteAllData={deleteAllData} i18n={window.i18n} />
+      </FunDefaultEnglishEmojiLocalizationProvider>
+    </StrictMode>,
     document.getElementById('app-container')
   );
 }

ts/util/longRunningTaskWrapper.tsx

@@ -1,7 +1,7 @@
 // Copyright 2021 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
-import React from 'react';
+import React, { StrictMode } from 'react';
 import { render, unmountComponentAtNode } from 'react-dom';
 
 import * as Errors from '../types/errors';
@@ -33,9 +33,11 @@ export async function longRunningTaskWrapper<T>({
 
     log.info(`longRunningTaskWrapper/${idLog}: Creating spinner`);
     render(
-      <FunDefaultEnglishEmojiLocalizationProvider>
-        <ProgressModal i18n={window.i18n} />
-      </FunDefaultEnglishEmojiLocalizationProvider>,
+      <StrictMode>
+        <FunDefaultEnglishEmojiLocalizationProvider>
+          <ProgressModal i18n={window.i18n} />
+        </FunDefaultEnglishEmojiLocalizationProvider>
+      </StrictMode>,
       progressNode
     );
     spinnerStart = Date.now();

ts/util/showConfirmationDialog.tsx

@@ -1,7 +1,7 @@
 // Copyright 2015 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
-import React from 'react';
+import React, { StrictMode } from 'react';
 import { render, unmountComponentAtNode } from 'react-dom';
 import { ConfirmationDialog } from '../components/ConfirmationDialog';
 import { FunDefaultEnglishEmojiLocalizationProvider } from '../components/fun/FunEmojiLocalizationProvider';
@@ -56,37 +56,39 @@ export function showConfirmationDialog(
   confirmationDialogPreviousFocus = document.activeElement as HTMLElement;
 
   render(
-    <FunDefaultEnglishEmojiLocalizationProvider>
-      <ConfirmationDialog
-        dialogName={options.dialogName}
-        onTopOfEverything={options.onTopOfEverything}
-        actions={[
-          {
-            action: () => {
-              options.resolve();
+    <StrictMode>
+      <FunDefaultEnglishEmojiLocalizationProvider>
+        <ConfirmationDialog
+          dialogName={options.dialogName}
+          onTopOfEverything={options.onTopOfEverything}
+          actions={[
+            {
+              action: () => {
+                options.resolve();
+              },
+              style: options.confirmStyle,
+              text: options.okText || window.i18n('icu:ok'),
             },
-            style: options.confirmStyle,
-            text: options.okText || window.i18n('icu:ok'),
-          },
-        ]}
-        cancelText={options.cancelText || window.i18n('icu:cancel')}
-        i18n={window.i18n}
-        onCancel={() => {
-          if (options.reject) {
-            options.reject(
-              new Error('showConfirmationDialog: onCancel called')
-            );
-          }
-        }}
-        onClose={() => {
-          removeConfirmationDialog();
-        }}
-        title={options.title}
-        noMouseClose={options.noMouseClose}
-      >
-        {options.description}
-      </ConfirmationDialog>
-    </FunDefaultEnglishEmojiLocalizationProvider>,
+          ]}
+          cancelText={options.cancelText || window.i18n('icu:cancel')}
+          i18n={window.i18n}
+          onCancel={() => {
+            if (options.reject) {
+              options.reject(
+                new Error('showConfirmationDialog: onCancel called')
+              );
+            }
+          }}
+          onClose={() => {
+            removeConfirmationDialog();
+          }}
+          title={options.title}
+          noMouseClose={options.noMouseClose}
+        >
+          {options.description}
+        </ConfirmationDialog>
+      </FunDefaultEnglishEmojiLocalizationProvider>
+    </StrictMode>,
     confirmationDialogViewNode
   );
 }

ts/windows/about/app.tsx

@@ -1,7 +1,7 @@
 // Copyright 2023 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
-import React from 'react';
+import React, { StrictMode } from 'react';
 import ReactDOM from 'react-dom';
 
 import { About } from '../../components/About';
@@ -14,15 +14,17 @@ const { AboutWindowProps } = window.Signal;
 strictAssert(AboutWindowProps, 'window values not provided');
 
 ReactDOM.render(
-  <FunDefaultEnglishEmojiLocalizationProvider>
-    <About
-      closeAbout={() => window.SignalContext.executeMenuRole('close')}
-      appEnv={AboutWindowProps.appEnv}
-      platform={AboutWindowProps.platform}
-      arch={AboutWindowProps.arch}
-      i18n={i18n}
-      version={window.SignalContext.getVersion()}
-    />
-  </FunDefaultEnglishEmojiLocalizationProvider>,
+  <StrictMode>
+    <FunDefaultEnglishEmojiLocalizationProvider>
+      <About
+        closeAbout={() => window.SignalContext.executeMenuRole('close')}
+        appEnv={AboutWindowProps.appEnv}
+        platform={AboutWindowProps.platform}
+        arch={AboutWindowProps.arch}
+        i18n={i18n}
+        version={window.SignalContext.getVersion()}
+      />
+    </FunDefaultEnglishEmojiLocalizationProvider>
+  </StrictMode>,
   document.getElementById('app')
 );

ts/windows/debuglog/app.tsx

@@ -1,7 +1,7 @@
 // Copyright 2023 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
-import React from 'react';
+import React, { StrictMode } from 'react';
 import { render } from 'react-dom';
 import { DebugLogWindow } from '../../components/DebugLogWindow';
 import { FunDefaultEnglishEmojiLocalizationProvider } from '../../components/fun/FunEmojiLocalizationProvider';
@@ -13,14 +13,16 @@ const { DebugLogWindowProps } = window.Signal;
 strictAssert(DebugLogWindowProps, 'window values not provided');
 
 render(
-  <FunDefaultEnglishEmojiLocalizationProvider>
-    <DebugLogWindow
-      closeWindow={() => window.SignalContext.executeMenuRole('close')}
-      downloadLog={DebugLogWindowProps.downloadLog}
-      i18n={i18n}
-      fetchLogs={DebugLogWindowProps.fetchLogs}
-      uploadLogs={DebugLogWindowProps.uploadLogs}
-    />
-  </FunDefaultEnglishEmojiLocalizationProvider>,
+  <StrictMode>
+    <FunDefaultEnglishEmojiLocalizationProvider>
+      <DebugLogWindow
+        closeWindow={() => window.SignalContext.executeMenuRole('close')}
+        downloadLog={DebugLogWindowProps.downloadLog}
+        i18n={i18n}
+        fetchLogs={DebugLogWindowProps.fetchLogs}
+        uploadLogs={DebugLogWindowProps.uploadLogs}
+      />
+    </FunDefaultEnglishEmojiLocalizationProvider>
+  </StrictMode>,
   document.getElementById('app')
 );

ts/windows/permissions/app.tsx

@@ -1,7 +1,7 @@
 // Copyright 2023 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
-import React from 'react';
+import React, { StrictMode } from 'react';
 import ReactDOM from 'react-dom';
 
 import { PermissionsPopup } from '../../components/PermissionsPopup';
@@ -27,13 +27,15 @@ if (forCalling) {
 }
 
 ReactDOM.render(
-  <FunDefaultEnglishEmojiLocalizationProvider>
-    <PermissionsPopup
-      i18n={i18n}
-      message={message}
-      onAccept={PermissionsWindowProps.onAccept}
-      onClose={PermissionsWindowProps.onClose}
-    />
-  </FunDefaultEnglishEmojiLocalizationProvider>,
+  <StrictMode>
+    <FunDefaultEnglishEmojiLocalizationProvider>
+      <PermissionsPopup
+        i18n={i18n}
+        message={message}
+        onAccept={PermissionsWindowProps.onAccept}
+        onClose={PermissionsWindowProps.onClose}
+      />
+    </FunDefaultEnglishEmojiLocalizationProvider>
+  </StrictMode>,
   document.getElementById('app')
 );

ts/windows/screenShare/app.tsx

@@ -1,7 +1,7 @@
 // Copyright 2023 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
-import React from 'react';
+import React, { StrictMode } from 'react';
 import ReactDOM from 'react-dom';
 
 import { CallingScreenSharingController } from '../../components/CallingScreenSharingController';
@@ -29,17 +29,19 @@ function render() {
   strictAssert(ScreenShareWindowProps, 'window values not provided');
 
   ReactDOM.render(
-    <FunDefaultEnglishEmojiLocalizationProvider>
-      <div className="App dark-theme">
-        <CallingScreenSharingController
-          i18n={i18n}
-          onCloseController={onCloseController}
-          onStopSharing={ScreenShareWindowProps.onStopSharing}
-          status={ScreenShareWindowProps.getStatus()}
-          presentedSourceName={ScreenShareWindowProps.presentedSourceName}
-        />
-      </div>
-    </FunDefaultEnglishEmojiLocalizationProvider>,
+    <StrictMode>
+      <FunDefaultEnglishEmojiLocalizationProvider>
+        <div className="App dark-theme">
+          <CallingScreenSharingController
+            i18n={i18n}
+            onCloseController={onCloseController}
+            onStopSharing={ScreenShareWindowProps.onStopSharing}
+            status={ScreenShareWindowProps.getStatus()}
+            presentedSourceName={ScreenShareWindowProps.presentedSourceName}
+          />
+        </div>
+      </FunDefaultEnglishEmojiLocalizationProvider>
+    </StrictMode>,
 
     document.getElementById('app')
   );

ts/windows/settings/app.tsx

@@ -1,7 +1,7 @@
 // Copyright 2023 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
-import React from 'react';
+import React, { StrictMode } from 'react';
 import ReactDOM from 'react-dom';
 
 import type { PropsPreloadType } from '../../components/Preferences';
@@ -135,122 +135,124 @@ SettingsWindowProps.onRender(
     zoomFactor,
   }: PropsPreloadType) => {
     ReactDOM.render(
-      <Preferences
-        addCustomColor={addCustomColor}
-        autoDownloadAttachment={autoDownloadAttachment}
-        availableCameras={availableCameras}
-        availableLocales={availableLocales}
-        availableMicrophones={availableMicrophones}
-        availableSpeakers={availableSpeakers}
-        backupFeatureEnabled={backupFeatureEnabled}
-        backupSubscriptionStatus={backupSubscriptionStatus}
-        blockedCount={blockedCount}
-        closeSettings={closeSettings}
-        cloudBackupStatus={cloudBackupStatus}
-        customColors={customColors}
-        defaultConversationColor={defaultConversationColor}
-        deviceName={deviceName}
-        emojiSkinToneDefault={emojiSkinToneDefault}
-        phoneNumber={phoneNumber}
-        doDeleteAllData={doDeleteAllData}
-        doneRendering={doneRendering}
-        editCustomColor={editCustomColor}
-        getConversationsWithCustomColor={getConversationsWithCustomColor}
-        hasAudioNotifications={hasAudioNotifications}
-        hasAutoConvertEmoji={hasAutoConvertEmoji}
-        hasAutoDownloadUpdate={hasAutoDownloadUpdate}
-        hasAutoLaunch={hasAutoLaunch}
-        hasCallNotifications={hasCallNotifications}
-        hasCallRingtoneNotification={hasCallRingtoneNotification}
-        hasCountMutedConversations={hasCountMutedConversations}
-        hasHideMenuBar={hasHideMenuBar}
-        hasIncomingCallNotifications={hasIncomingCallNotifications}
-        hasLinkPreviews={hasLinkPreviews}
-        hasMediaCameraPermissions={hasMediaCameraPermissions}
-        hasMediaPermissions={hasMediaPermissions}
-        hasMessageAudio={hasMessageAudio}
-        hasMinimizeToAndStartInSystemTray={hasMinimizeToAndStartInSystemTray}
-        hasMinimizeToSystemTray={hasMinimizeToSystemTray}
-        hasNotificationAttention={hasNotificationAttention}
-        hasNotifications={hasNotifications}
-        hasReadReceipts={hasReadReceipts}
-        hasRelayCalls={hasRelayCalls}
-        hasSpellCheck={hasSpellCheck}
-        hasStoriesDisabled={hasStoriesDisabled}
-        hasTextFormatting={hasTextFormatting}
-        hasTypingIndicators={hasTypingIndicators}
-        i18n={i18n}
-        initialSpellCheckSetting={initialSpellCheckSetting}
-        isAutoDownloadUpdatesSupported={isAutoDownloadUpdatesSupported}
-        isAutoLaunchSupported={isAutoLaunchSupported}
-        isHideMenuBarSupported={isHideMenuBarSupported}
-        isMinimizeToAndStartInSystemTraySupported={
-          isMinimizeToAndStartInSystemTraySupported
-        }
-        isNotificationAttentionSupported={isNotificationAttentionSupported}
-        isSyncSupported={isSyncSupported}
-        isSystemTraySupported={isSystemTraySupported}
-        isInternalUser={isInternalUser}
-        lastSyncTime={lastSyncTime}
-        localeOverride={localeOverride}
-        makeSyncRequest={makeSyncRequest}
-        notificationContent={notificationContent}
-        onAudioNotificationsChange={onAudioNotificationsChange}
-        onAutoConvertEmojiChange={onAutoConvertEmojiChange}
-        onAutoDownloadAttachmentChange={onAutoDownloadAttachmentChange}
-        onAutoDownloadUpdateChange={onAutoDownloadUpdateChange}
-        onAutoLaunchChange={onAutoLaunchChange}
-        onCallNotificationsChange={onCallNotificationsChange}
-        onCallRingtoneNotificationChange={onCallRingtoneNotificationChange}
-        onCountMutedConversationsChange={onCountMutedConversationsChange}
-        onEmojiSkinToneDefaultChange={onEmojiSkinToneDefaultChange}
-        onHasStoriesDisabledChanged={onHasStoriesDisabledChanged}
-        onHideMenuBarChange={onHideMenuBarChange}
-        onIncomingCallNotificationsChange={onIncomingCallNotificationsChange}
-        onLastSyncTimeChange={onLastSyncTimeChange}
-        onLocaleChange={onLocaleChange}
-        onMediaCameraPermissionsChange={onMediaCameraPermissionsChange}
-        onMediaPermissionsChange={onMediaPermissionsChange}
-        onMessageAudioChange={onMessageAudioChange}
-        onMinimizeToAndStartInSystemTrayChange={
-          onMinimizeToAndStartInSystemTrayChange
-        }
-        onMinimizeToSystemTrayChange={onMinimizeToSystemTrayChange}
-        onNotificationAttentionChange={onNotificationAttentionChange}
-        onNotificationContentChange={onNotificationContentChange}
-        onNotificationsChange={onNotificationsChange}
-        onRelayCallsChange={onRelayCallsChange}
-        onSelectedCameraChange={onSelectedCameraChange}
-        onSelectedMicrophoneChange={onSelectedMicrophoneChange}
-        onSelectedSpeakerChange={onSelectedSpeakerChange}
-        onSentMediaQualityChange={onSentMediaQualityChange}
-        onSpellCheckChange={onSpellCheckChange}
-        onTextFormattingChange={onTextFormattingChange}
-        onThemeChange={onThemeChange}
-        onUniversalExpireTimerChange={onUniversalExpireTimerChange}
-        onWhoCanFindMeChange={onWhoCanFindMeChange}
-        onWhoCanSeeMeChange={onWhoCanSeeMeChange}
-        onZoomFactorChange={onZoomFactorChange}
-        preferredSystemLocales={preferredSystemLocales}
-        refreshCloudBackupStatus={refreshCloudBackupStatus}
-        refreshBackupSubscriptionStatus={refreshBackupSubscriptionStatus}
-        removeCustomColorOnConversations={removeCustomColorOnConversations}
-        removeCustomColor={removeCustomColor}
-        resetAllChatColors={resetAllChatColors}
-        resetDefaultChatColor={resetDefaultChatColor}
-        resolvedLocale={resolvedLocale}
-        selectedCamera={selectedCamera}
-        selectedMicrophone={selectedMicrophone}
-        selectedSpeaker={selectedSpeaker}
-        sentMediaQualitySetting={sentMediaQualitySetting}
-        setGlobalDefaultConversationColor={setGlobalDefaultConversationColor}
-        themeSetting={themeSetting}
-        universalExpireTimer={universalExpireTimer}
-        validateBackup={validateBackup}
-        whoCanFindMe={whoCanFindMe}
-        whoCanSeeMe={whoCanSeeMe}
-        zoomFactor={zoomFactor}
-      />,
+      <StrictMode>
+        <Preferences
+          addCustomColor={addCustomColor}
+          autoDownloadAttachment={autoDownloadAttachment}
+          availableCameras={availableCameras}
+          availableLocales={availableLocales}
+          availableMicrophones={availableMicrophones}
+          availableSpeakers={availableSpeakers}
+          backupFeatureEnabled={backupFeatureEnabled}
+          backupSubscriptionStatus={backupSubscriptionStatus}
+          blockedCount={blockedCount}
+          closeSettings={closeSettings}
+          cloudBackupStatus={cloudBackupStatus}
+          customColors={customColors}
+          defaultConversationColor={defaultConversationColor}
+          deviceName={deviceName}
+          emojiSkinToneDefault={emojiSkinToneDefault}
+          phoneNumber={phoneNumber}
+          doDeleteAllData={doDeleteAllData}
+          doneRendering={doneRendering}
+          editCustomColor={editCustomColor}
+          getConversationsWithCustomColor={getConversationsWithCustomColor}
+          hasAudioNotifications={hasAudioNotifications}
+          hasAutoConvertEmoji={hasAutoConvertEmoji}
+          hasAutoDownloadUpdate={hasAutoDownloadUpdate}
+          hasAutoLaunch={hasAutoLaunch}
+          hasCallNotifications={hasCallNotifications}
+          hasCallRingtoneNotification={hasCallRingtoneNotification}
+          hasCountMutedConversations={hasCountMutedConversations}
+          hasHideMenuBar={hasHideMenuBar}
+          hasIncomingCallNotifications={hasIncomingCallNotifications}
+          hasLinkPreviews={hasLinkPreviews}
+          hasMediaCameraPermissions={hasMediaCameraPermissions}
+          hasMediaPermissions={hasMediaPermissions}
+          hasMessageAudio={hasMessageAudio}
+          hasMinimizeToAndStartInSystemTray={hasMinimizeToAndStartInSystemTray}
+          hasMinimizeToSystemTray={hasMinimizeToSystemTray}
+          hasNotificationAttention={hasNotificationAttention}
+          hasNotifications={hasNotifications}
+          hasReadReceipts={hasReadReceipts}
+          hasRelayCalls={hasRelayCalls}
+          hasSpellCheck={hasSpellCheck}
+          hasStoriesDisabled={hasStoriesDisabled}
+          hasTextFormatting={hasTextFormatting}
+          hasTypingIndicators={hasTypingIndicators}
+          i18n={i18n}
+          initialSpellCheckSetting={initialSpellCheckSetting}
+          isAutoDownloadUpdatesSupported={isAutoDownloadUpdatesSupported}
+          isAutoLaunchSupported={isAutoLaunchSupported}
+          isHideMenuBarSupported={isHideMenuBarSupported}
+          isMinimizeToAndStartInSystemTraySupported={
+            isMinimizeToAndStartInSystemTraySupported
+          }
+          isNotificationAttentionSupported={isNotificationAttentionSupported}
+          isSyncSupported={isSyncSupported}
+          isSystemTraySupported={isSystemTraySupported}
+          isInternalUser={isInternalUser}
+          lastSyncTime={lastSyncTime}
+          localeOverride={localeOverride}
+          makeSyncRequest={makeSyncRequest}
+          notificationContent={notificationContent}
+          onAudioNotificationsChange={onAudioNotificationsChange}
+          onAutoConvertEmojiChange={onAutoConvertEmojiChange}
+          onAutoDownloadAttachmentChange={onAutoDownloadAttachmentChange}
+          onAutoDownloadUpdateChange={onAutoDownloadUpdateChange}
+          onAutoLaunchChange={onAutoLaunchChange}
+          onCallNotificationsChange={onCallNotificationsChange}
+          onCallRingtoneNotificationChange={onCallRingtoneNotificationChange}
+          onCountMutedConversationsChange={onCountMutedConversationsChange}
+          onEmojiSkinToneDefaultChange={onEmojiSkinToneDefaultChange}
+          onHasStoriesDisabledChanged={onHasStoriesDisabledChanged}
+          onHideMenuBarChange={onHideMenuBarChange}
+          onIncomingCallNotificationsChange={onIncomingCallNotificationsChange}
+          onLastSyncTimeChange={onLastSyncTimeChange}
+          onLocaleChange={onLocaleChange}
+          onMediaCameraPermissionsChange={onMediaCameraPermissionsChange}
+          onMediaPermissionsChange={onMediaPermissionsChange}
+          onMessageAudioChange={onMessageAudioChange}
+          onMinimizeToAndStartInSystemTrayChange={
+            onMinimizeToAndStartInSystemTrayChange
+          }
+          onMinimizeToSystemTrayChange={onMinimizeToSystemTrayChange}
+          onNotificationAttentionChange={onNotificationAttentionChange}
+          onNotificationContentChange={onNotificationContentChange}
+          onNotificationsChange={onNotificationsChange}
+          onRelayCallsChange={onRelayCallsChange}
+          onSelectedCameraChange={onSelectedCameraChange}
+          onSelectedMicrophoneChange={onSelectedMicrophoneChange}
+          onSelectedSpeakerChange={onSelectedSpeakerChange}
+          onSentMediaQualityChange={onSentMediaQualityChange}
+          onSpellCheckChange={onSpellCheckChange}
+          onTextFormattingChange={onTextFormattingChange}
+          onThemeChange={onThemeChange}
+          onUniversalExpireTimerChange={onUniversalExpireTimerChange}
+          onWhoCanFindMeChange={onWhoCanFindMeChange}
+          onWhoCanSeeMeChange={onWhoCanSeeMeChange}
+          onZoomFactorChange={onZoomFactorChange}
+          preferredSystemLocales={preferredSystemLocales}
+          refreshCloudBackupStatus={refreshCloudBackupStatus}
+          refreshBackupSubscriptionStatus={refreshBackupSubscriptionStatus}
+          removeCustomColorOnConversations={removeCustomColorOnConversations}
+          removeCustomColor={removeCustomColor}
+          resetAllChatColors={resetAllChatColors}
+          resetDefaultChatColor={resetDefaultChatColor}
+          resolvedLocale={resolvedLocale}
+          selectedCamera={selectedCamera}
+          selectedMicrophone={selectedMicrophone}
+          selectedSpeaker={selectedSpeaker}
+          sentMediaQualitySetting={sentMediaQualitySetting}
+          setGlobalDefaultConversationColor={setGlobalDefaultConversationColor}
+          themeSetting={themeSetting}
+          universalExpireTimer={universalExpireTimer}
+          validateBackup={validateBackup}
+          whoCanFindMe={whoCanFindMe}
+          whoCanSeeMe={whoCanSeeMe}
+          zoomFactor={zoomFactor}
+        />
+      </StrictMode>,
       document.getElementById('app')
     );
   }