From ff3e99a3f40d56ec9cbab1cc299ec49254d523b1 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Fri, 21 Nov 2025 06:17:51 -0500
Subject: [PATCH 01/27] Install `react-compiler-webpack` as devDep

---
 package.json |  1 +
 yarn.lock    | 27 ++++++++++++++++++++++++++-
 2 files changed, 27 insertions(+), 1 deletion(-)

diff --git a/package.json b/package.json
index c924e3229024..6188fb82a7a1 100644
--- a/package.json
+++ b/package.json
@@ -683,6 +683,7 @@
     "process": "^0.11.10",
     "pumpify": "^2.0.1",
     "randomcolor": "^0.5.4",
+    "react-compiler-webpack": "0.2.1",
     "react-devtools": "^6.1.5",
     "react-devtools-core": "^6.1.5",
     "react-syntax-highlighter": "^15.5.0",
diff --git a/yarn.lock b/yarn.lock
index 8149eee368b5..1dba7990c934 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -775,7 +775,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/plugin-syntax-jsx@npm:^7.22.5, @babel/plugin-syntax-jsx@npm:^7.25.9, @babel/plugin-syntax-jsx@npm:^7.7.2":
+"@babel/plugin-syntax-jsx@npm:^7.22.5, @babel/plugin-syntax-jsx@npm:^7.25.9, @babel/plugin-syntax-jsx@npm:^7.27.1, @babel/plugin-syntax-jsx@npm:^7.7.2":
   version: 7.27.1
   resolution: "@babel/plugin-syntax-jsx@npm:7.27.1"
   dependencies:
@@ -874,6 +874,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/plugin-syntax-typescript@npm:^7.27.1":
+  version: 7.27.1
+  resolution: "@babel/plugin-syntax-typescript@npm:7.27.1"
+  dependencies:
+    "@babel/helper-plugin-utils": "npm:^7.27.1"
+  peerDependencies:
+    "@babel/core": ^7.0.0-0
+  checksum: 10/87836f7e32af624c2914c73cd6b9803cf324e07d43f61dbb973c6a86f75df725e12540d91fac7141c14b697aa9268fd064220998daced156e96ac3062d7afb41
+  languageName: node
+  linkType: hard
+
 "@babel/plugin-syntax-unicode-sets-regex@npm:^7.18.6":
   version: 7.18.6
   resolution: "@babel/plugin-syntax-unicode-sets-regex@npm:7.18.6"
@@ -33697,6 +33708,7 @@ __metadata:
     react-beautiful-dnd: "npm:^13.1.1"
     react-chartjs-2: "npm:^5.2.0"
     react-compiler-runtime: "npm:^1.0.0"
+    react-compiler-webpack: "npm:0.2.1"
     react-devtools: "npm:^6.1.5"
     react-devtools-core: "npm:^6.1.5"
     react-dom: "npm:^17.0.2"
@@ -37844,6 +37856,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-compiler-webpack@npm:0.2.1":
+  version: 0.2.1
+  resolution: "react-compiler-webpack@npm:0.2.1"
+  dependencies:
+    "@babel/core": "npm:^7.28.4"
+    "@babel/plugin-syntax-jsx": "npm:^7.27.1"
+    "@babel/plugin-syntax-typescript": "npm:^7.27.1"
+  peerDependencies:
+    babel-plugin-react-compiler: "*"
+  checksum: 10/5571abebe68334969f3a40c6c21a4a6c3d8ba8a63c91348eac1209624e58e5b373609677244bbbd7480a094517c1b15f75d54400a91914728d74c9194d76775a
+  languageName: node
+  linkType: hard
+
 "react-devtools-core@npm:6.1.5, react-devtools-core@npm:^6.1.5":
   version: 6.1.5
   resolution: "react-devtools-core@npm:6.1.5"

From 27301e346623e9cf86ced8bd8f43ebfeac5aaff9 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Fri, 21 Nov 2025 06:18:07 -0500
Subject: [PATCH 02/27] Add to depcheck ignore list

---
 .depcheckrc.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.depcheckrc.yml b/.depcheckrc.yml
index f07a90b9a488..5d4a1561aa99 100644
--- a/.depcheckrc.yml
+++ b/.depcheckrc.yml
@@ -82,6 +82,7 @@ ignores:
   - 'path-browserify' # polyfill
   - 'nyc' # coverage
   - 'core-js-pure' # polyfills
+  - 'react-compiler-webpack' # build tool
   # babel
   - '@babel/plugin-transform-logical-assignment-operators'
   - 'babel-plugin-react-compiler'

From 11907d8f9990a61e133eedcad7627c691818124e Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Fri, 21 Nov 2025 06:18:24 -0500
Subject: [PATCH 03/27] Update LavaMoat policies

---
 lavamoat/build-system/policy.json | 6 +++---
 lavamoat/webpack/mv2/policy.json  | 8 ++++++++
 lavamoat/webpack/mv3/policy.json  | 8 ++++++++
 3 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/lavamoat/build-system/policy.json b/lavamoat/build-system/policy.json
index 497155b5ec35..57e787623b95 100644
--- a/lavamoat/build-system/policy.json
+++ b/lavamoat/build-system/policy.json
@@ -291,7 +291,7 @@
         "@babel/preset-env>@babel/helper-plugin-utils": true
       }
     },
-    "@babel/preset-typescript>@babel/plugin-syntax-jsx": {
+    "react-compiler-webpack>@babel/plugin-syntax-jsx": {
       "packages": {
         "@babel/preset-env>@babel/helper-plugin-utils": true
       }
@@ -584,7 +584,7 @@
         "@babel/preset-env>@babel/plugin-transform-classes>@babel/helper-annotate-as-pure": true,
         "@babel/core>@babel/helper-module-transforms>@babel/helper-module-imports": true,
         "@babel/preset-env>@babel/helper-plugin-utils": true,
-        "@babel/preset-typescript>@babel/plugin-syntax-jsx": true
+        "react-compiler-webpack>@babel/plugin-syntax-jsx": true
       }
     },
     "@babel/preset-react>@babel/plugin-transform-react-pure-annotations": {
@@ -768,7 +768,7 @@
       "packages": {
         "@babel/preset-env>@babel/helper-plugin-utils": true,
         "@babel/preset-env>@babel/helper-validator-option": true,
-        "@babel/preset-typescript>@babel/plugin-syntax-jsx": true,
+        "react-compiler-webpack>@babel/plugin-syntax-jsx": true,
         "@babel/preset-env>@babel/plugin-transform-modules-commonjs": true,
         "@babel/preset-typescript>@babel/plugin-transform-typescript": true
       }
diff --git a/lavamoat/webpack/mv2/policy.json b/lavamoat/webpack/mv2/policy.json
index 7d22f550b0d7..16f1ecd02619 100644
--- a/lavamoat/webpack/mv2/policy.json
+++ b/lavamoat/webpack/mv2/policy.json
@@ -4976,6 +4976,14 @@
         "react": true
       }
     },
+    "react-compiler-runtime": {
+      "globals": {
+        "console.error": true
+      },
+      "packages": {
+        "react": true
+      }
+    },
     "react-devtools-core": {
       "globals": {
         "CSSStyleRule": true,
diff --git a/lavamoat/webpack/mv3/policy.json b/lavamoat/webpack/mv3/policy.json
index d6217eb8ffba..0c5504fe8a11 100644
--- a/lavamoat/webpack/mv3/policy.json
+++ b/lavamoat/webpack/mv3/policy.json
@@ -3356,6 +3356,14 @@
         "react": true
       }
     },
+    "react-compiler-runtime": {
+      "globals": {
+        "console.error": true
+      },
+      "packages": {
+        "react": true
+      }
+    },
     "react-devtools-core": {
       "globals": {
         "CSSStyleRule": true,

From 95bc1879207fce2846573c78abf91ffc66763fe3 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Fri, 21 Nov 2025 06:20:19 -0500
Subject: [PATCH 04/27] Set up webpack config with react compiler loader

---
 development/webpack/utils/config.ts   | 23 +++++++++++++++++++++++
 development/webpack/utils/helpers.ts  |  7 +++++++
 development/webpack/webpack.config.ts | 18 +++++++++++++++++-
 3 files changed, 47 insertions(+), 1 deletion(-)

diff --git a/development/webpack/utils/config.ts b/development/webpack/utils/config.ts
index 6bd746fa9d2b..a4f85d3d52c5 100644
--- a/development/webpack/utils/config.ts
+++ b/development/webpack/utils/config.ts
@@ -1,6 +1,7 @@
 import { join } from 'node:path';
 import { readFileSync } from 'node:fs';
 import { parse } from 'dotenv';
+import type { ReactCompilerLoaderOption } from 'react-compiler-webpack';
 import { setEnvironmentVariables } from '../../build/set-environment-variables';
 import type { Variables } from '../../lib/variables';
 import type { BuildTypesConfig, BuildType } from '../../lib/build-type';
@@ -191,3 +192,25 @@ function loadConfigVars(
 
   return definitions;
 }
+export const reactCompilerOptions = {
+  target: '17',
+  sources: (filename) => {
+    const excludePatterns = [
+      '.test.',
+      '.stories.',
+      '.container.',
+      '/ui/index.js',
+      '/__mocks__/',
+      '/__snapshots__/',
+      '/constants/',
+      '/helpers/',
+      '/ducks/',
+      '/selectors/',
+      '/store/',
+    ];
+    if (excludePatterns.some((pattern) => filename.includes(pattern))) {
+      return false;
+    }
+    return true;
+  },
+} as const satisfies ReactCompilerLoaderOption;
diff --git a/development/webpack/utils/helpers.ts b/development/webpack/utils/helpers.ts
index 2d36018f79b0..4eb0aeeb7899 100644
--- a/development/webpack/utils/helpers.ts
+++ b/development/webpack/utils/helpers.ts
@@ -53,6 +53,13 @@ export const TREZOR_MODULE_RE = new RegExp(
   'u',
 );
 
+/**
+ * Regular expression to match files in the `ui/` directory
+ * Uses a platform-specific path separator: `/` on Unix-like systems and `\` on
+ * Windows.
+ */
+export const UI_DIR_RE = new RegExp(`^.*${slash}ui${slash}.*$`, 'u');
+
 /**
  * No Operation. A function that does nothing and returns nothing.
  *
diff --git a/development/webpack/webpack.config.ts b/development/webpack/webpack.config.ts
index d7fc57cb0ea6..9b8cf387cecb 100644
--- a/development/webpack/webpack.config.ts
+++ b/development/webpack/webpack.config.ts
@@ -18,6 +18,10 @@ import rtlCss from 'postcss-rtlcss';
 import autoprefixer from 'autoprefixer';
 import discardFonts from 'postcss-discard-font-face';
 import type ReactRefreshPluginType from '@pmmmwh/react-refresh-webpack-plugin';
+import {
+  defineReactCompilerLoaderOption,
+  reactCompilerLoader,
+} from 'react-compiler-webpack';
 import tailwindcss from 'tailwindcss';
 import { loadBuildTypesConfig } from '../lib/build-type';
 import {
@@ -28,12 +32,13 @@ import {
   __HMR_READY__,
   SNOW_MODULE_RE,
   TREZOR_MODULE_RE,
+  UI_DIR_RE,
 } from './utils/helpers';
 import { transformManifest } from './utils/plugins/ManifestPlugin/helpers';
 import { parseArgv, getDryRunMessage } from './utils/cli';
 import { getCodeFenceLoader } from './utils/loaders/codeFenceLoader';
 import { getSwcLoader } from './utils/loaders/swcLoader';
-import { getVariables } from './utils/config';
+import { getVariables, reactCompilerOptions } from './utils/config';
 import { ManifestPlugin } from './utils/plugins/ManifestPlugin';
 import { getLatestCommit } from './utils/git';
 
@@ -320,6 +325,17 @@ const config = {
         dependency: 'url',
         type: 'asset/resource',
       },
+      {
+        test: /\.(?:js|mjs|jsx|ts|mts|tsx)$/u,
+        include: UI_DIR_RE,
+        exclude: NODE_MODULES_RE,
+        use: [
+          {
+            loader: reactCompilerLoader,
+            options: defineReactCompilerLoaderOption(reactCompilerOptions),
+          },
+        ],
+      },
       // own typescript, and own typescript with jsx
       {
         test: /\.(?:ts|mts|tsx)$/u,

From 6037088caeca67f20da3cd6aacfbb41cc0413f19 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Fri, 21 Nov 2025 08:03:08 -0500
Subject: [PATCH 05/27] Bump `react-compiler-webpack` to `^1.0.0`

---
 package.json |  2 +-
 yarn.lock    | 12 ++++++------
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/package.json b/package.json
index 6188fb82a7a1..2db638b840c3 100644
--- a/package.json
+++ b/package.json
@@ -683,7 +683,7 @@
     "process": "^0.11.10",
     "pumpify": "^2.0.1",
     "randomcolor": "^0.5.4",
-    "react-compiler-webpack": "0.2.1",
+    "react-compiler-webpack": "^1.0.0",
     "react-devtools": "^6.1.5",
     "react-devtools-core": "^6.1.5",
     "react-syntax-highlighter": "^15.5.0",
diff --git a/yarn.lock b/yarn.lock
index 1dba7990c934..4beed5f43d5a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -33708,7 +33708,7 @@ __metadata:
     react-beautiful-dnd: "npm:^13.1.1"
     react-chartjs-2: "npm:^5.2.0"
     react-compiler-runtime: "npm:^1.0.0"
-    react-compiler-webpack: "npm:0.2.1"
+    react-compiler-webpack: "npm:^1.0.0"
     react-devtools: "npm:^6.1.5"
     react-devtools-core: "npm:^6.1.5"
     react-dom: "npm:^17.0.2"
@@ -37856,16 +37856,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-compiler-webpack@npm:0.2.1":
-  version: 0.2.1
-  resolution: "react-compiler-webpack@npm:0.2.1"
+"react-compiler-webpack@npm:^1.0.0":
+  version: 1.0.0
+  resolution: "react-compiler-webpack@npm:1.0.0"
   dependencies:
-    "@babel/core": "npm:^7.28.4"
+    "@babel/core": "npm:^7.28.5"
     "@babel/plugin-syntax-jsx": "npm:^7.27.1"
     "@babel/plugin-syntax-typescript": "npm:^7.27.1"
   peerDependencies:
     babel-plugin-react-compiler: "*"
-  checksum: 10/5571abebe68334969f3a40c6c21a4a6c3d8ba8a63c91348eac1209624e58e5b373609677244bbbd7480a094517c1b15f75d54400a91914728d74c9194d76775a
+  checksum: 10/00f07cbfa1568628ea593fbbb577645dac73baa682462ace681de610c9a4800039ddd33fbc751260fa1a36a114ddc4a6ffb48c9b84aab9298ae9b3db6ba0b7ed
   languageName: node
   linkType: hard
 

From 7f6626deb10df6ed797bbb25f31a27a70371276d Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Fri, 21 Nov 2025 12:06:31 -0500
Subject: [PATCH 06/27] Use regex instead of array iteration to filter paths
 for react compiler loader

---
 development/webpack/utils/config.ts   | 19 -------------------
 development/webpack/utils/helpers.ts  |  7 +++++--
 development/webpack/webpack.config.ts |  2 +-
 3 files changed, 6 insertions(+), 22 deletions(-)

diff --git a/development/webpack/utils/config.ts b/development/webpack/utils/config.ts
index a4f85d3d52c5..705afa5dc3b1 100644
--- a/development/webpack/utils/config.ts
+++ b/development/webpack/utils/config.ts
@@ -194,23 +194,4 @@ function loadConfigVars(
 }
 export const reactCompilerOptions = {
   target: '17',
-  sources: (filename) => {
-    const excludePatterns = [
-      '.test.',
-      '.stories.',
-      '.container.',
-      '/ui/index.js',
-      '/__mocks__/',
-      '/__snapshots__/',
-      '/constants/',
-      '/helpers/',
-      '/ducks/',
-      '/selectors/',
-      '/store/',
-    ];
-    if (excludePatterns.some((pattern) => filename.includes(pattern))) {
-      return false;
-    }
-    return true;
-  },
 } as const satisfies ReactCompilerLoaderOption;
diff --git a/development/webpack/utils/helpers.ts b/development/webpack/utils/helpers.ts
index 4eb0aeeb7899..c3845c11eb8d 100644
--- a/development/webpack/utils/helpers.ts
+++ b/development/webpack/utils/helpers.ts
@@ -54,11 +54,14 @@ export const TREZOR_MODULE_RE = new RegExp(
 );
 
 /**
- * Regular expression to match files in the `ui/` directory
+ * Regular expression to match React files in the `ui/` directory
  * Uses a platform-specific path separator: `/` on Unix-like systems and `\` on
  * Windows.
  */
-export const UI_DIR_RE = new RegExp(`^.*${slash}ui${slash}.*$`, 'u');
+export const UI_DIR_RE = new RegExp(
+  `.*${slash}ui${slash}(components|contexts|hooks|layouts|pages)${slash}.*$`,
+  'u',
+);
 
 /**
  * No Operation. A function that does nothing and returns nothing.
diff --git a/development/webpack/webpack.config.ts b/development/webpack/webpack.config.ts
index 9b8cf387cecb..3836946a90fd 100644
--- a/development/webpack/webpack.config.ts
+++ b/development/webpack/webpack.config.ts
@@ -326,7 +326,7 @@ const config = {
         type: 'asset/resource',
       },
       {
-        test: /\.(?:js|mjs|jsx|ts|mts|tsx)$/u,
+        test: /(?!\.(test|stories|container))\.(?:m?[jt]s|[jt]sx?)$/u,
         include: UI_DIR_RE,
         exclude: NODE_MODULES_RE,
         use: [

From 50fa7b3d97d97409071dace09866d8fc285c32f1 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Fri, 21 Nov 2025 12:52:52 -0500
Subject: [PATCH 07/27] Fix `UI_DIR_RE` to only match top-level `ui/` dir

---
 development/webpack/utils/helpers.ts  | 4 ++--
 development/webpack/webpack.config.ts | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/development/webpack/utils/helpers.ts b/development/webpack/utils/helpers.ts
index c3845c11eb8d..7f6c8edcc5d6 100644
--- a/development/webpack/utils/helpers.ts
+++ b/development/webpack/utils/helpers.ts
@@ -54,12 +54,12 @@ export const TREZOR_MODULE_RE = new RegExp(
 );
 
 /**
- * Regular expression to match React files in the `ui/` directory
+ * Regular expression to match React files in the top-level `ui/` directory
  * Uses a platform-specific path separator: `/` on Unix-like systems and `\` on
  * Windows.
  */
 export const UI_DIR_RE = new RegExp(
-  `.*${slash}ui${slash}(components|contexts|hooks|layouts|pages)${slash}.*$`,
+  `${join(__dirname, '../../../').replaceAll(sep, slash)}ui${slash}(components|contexts|hooks|layouts|pages)${slash}.*$`,
   'u',
 );
 
diff --git a/development/webpack/webpack.config.ts b/development/webpack/webpack.config.ts
index 3836946a90fd..cb4fc89c938c 100644
--- a/development/webpack/webpack.config.ts
+++ b/development/webpack/webpack.config.ts
@@ -326,7 +326,7 @@ const config = {
         type: 'asset/resource',
       },
       {
-        test: /(?!\.(test|stories|container))\.(?:m?[jt]s|[jt]sx?)$/u,
+        test: /(?!\.(test|stories|container))\.(?:m?[jt]s|[jt]sx)$/u,
         include: UI_DIR_RE,
         exclude: NODE_MODULES_RE,
         use: [

From 13a52f8613f0dfb33a3c9df90c221a98c946903f Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Fri, 21 Nov 2025 13:04:50 -0500
Subject: [PATCH 08/27] Make regex groups non-capturing

---
 development/webpack/utils/helpers.ts  | 2 +-
 development/webpack/webpack.config.ts | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/development/webpack/utils/helpers.ts b/development/webpack/utils/helpers.ts
index 7f6c8edcc5d6..9c15c5ea3eb5 100644
--- a/development/webpack/utils/helpers.ts
+++ b/development/webpack/utils/helpers.ts
@@ -59,7 +59,7 @@ export const TREZOR_MODULE_RE = new RegExp(
  * Windows.
  */
 export const UI_DIR_RE = new RegExp(
-  `${join(__dirname, '../../../').replaceAll(sep, slash)}ui${slash}(components|contexts|hooks|layouts|pages)${slash}.*$`,
+  `${join(__dirname, '../../../').replaceAll(sep, slash)}ui${slash}(?:components|contexts|hooks|layouts|pages)${slash}.*$`,
   'u',
 );
 
diff --git a/development/webpack/webpack.config.ts b/development/webpack/webpack.config.ts
index cb4fc89c938c..f3aedb84303d 100644
--- a/development/webpack/webpack.config.ts
+++ b/development/webpack/webpack.config.ts
@@ -326,7 +326,7 @@ const config = {
         type: 'asset/resource',
       },
       {
-        test: /(?!\.(test|stories|container))\.(?:m?[jt]s|[jt]sx)$/u,
+        test: /(?!\.(?:test|stories|container))\.(?:m?[jt]s|[jt]sx)$/u,
         include: UI_DIR_RE,
         exclude: NODE_MODULES_RE,
         use: [

From 943035ded30a40a93c6a27afb42e1e8dfb55d018 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Fri, 21 Nov 2025 14:07:45 -0500
Subject: [PATCH 09/27] Remove redundant node_modules exclude

---
 development/webpack/webpack.config.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/development/webpack/webpack.config.ts b/development/webpack/webpack.config.ts
index f3aedb84303d..6d4a8e78a098 100644
--- a/development/webpack/webpack.config.ts
+++ b/development/webpack/webpack.config.ts
@@ -328,7 +328,6 @@ const config = {
       {
         test: /(?!\.(?:test|stories|container))\.(?:m?[jt]s|[jt]sx)$/u,
         include: UI_DIR_RE,
-        exclude: NODE_MODULES_RE,
         use: [
           {
             loader: reactCompilerLoader,

From 29b7626f724ba35f9d36d8a5ee49b13f2be2496a Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Fri, 21 Nov 2025 15:50:48 -0500
Subject: [PATCH 10/27] Define `reactCompilerLoader`, `ReactCompilerLogger`

---
 .../utils/loaders/reactCompilerLoader.ts      | 115 ++++++++++++++++++
 1 file changed, 115 insertions(+)
 create mode 100644 development/webpack/utils/loaders/reactCompilerLoader.ts

diff --git a/development/webpack/utils/loaders/reactCompilerLoader.ts b/development/webpack/utils/loaders/reactCompilerLoader.ts
new file mode 100644
index 000000000000..804b91f91205
--- /dev/null
+++ b/development/webpack/utils/loaders/reactCompilerLoader.ts
@@ -0,0 +1,115 @@
+import {
+  type ReactCompilerLoaderOption,
+  defineReactCompilerLoaderOption,
+  reactCompilerLoader,
+} from 'react-compiler-webpack';
+import type { Logger } from 'babel-plugin-react-compiler';
+
+/**
+ * React Compiler logger that tracks compilation statistics
+ */
+class ReactCompilerLogger {
+  private compiledCount = 0;
+
+  private skippedCount = 0;
+
+  private errorCount = 0;
+
+  private todoCount = 0;
+
+  private compiledFiles: string[] = [];
+
+  private skippedFiles: string[] = [];
+
+  private errorFiles: string[] = [];
+
+  private todoFiles: string[] = [];
+
+  logEvent(
+    filename: string | null,
+    event: { kind: string; detail: { options: { category: string } } },
+  ) {
+    if (filename === null) {
+      return;
+    }
+    switch (event.kind) {
+      case 'CompileSuccess':
+        this.compiledCount++;
+        this.compiledFiles.push(filename);
+        console.log(`✅ Compiled: ${filename}`);
+        break;
+      case 'CompileSkip':
+        this.skippedCount++;
+        this.skippedFiles.push(filename);
+        break;
+      case 'CompileError':
+        if (event.detail?.options?.category === 'Todo') {
+          this.todoCount++;
+          this.todoFiles.push(filename);
+          break;
+        }
+        this.errorCount++;
+        this.errorFiles.push(filename);
+        console.error(
+          `❌ React Compiler error in ${filename}: ${JSON.stringify(event.detail?.options) || 'Unknown error'}`,
+        );
+        break;
+      default:
+        // Ignore other event types
+        break;
+    }
+  }
+
+  getStats() {
+    return {
+      compiled: this.compiledCount,
+      skipped: this.skippedCount,
+      errors: this.errorCount,
+      unsupported: this.todoCount,
+      total:
+        this.compiledCount +
+        this.skippedCount +
+        this.errorCount +
+        this.todoCount,
+      compiledFiles: this.compiledFiles,
+      skippedFiles: this.skippedFiles,
+      errorFiles: this.errorFiles,
+      unsupportedFiles: this.todoFiles,
+    };
+  }
+
+  logSummary() {
+    const stats = this.getStats();
+    console.log('\n📊 React Compiler Statistics:');
+    console.log(`   ✅ Compiled: ${stats.compiled} files`);
+    console.log(`   ⏭️  Skipped: ${stats.skipped} files`);
+    console.log(`   ❌ Errors: ${stats.errors} files`);
+    console.log(`   🔍 Unsupported: ${stats.unsupported} files`);
+    console.log(`   📦 Total processed: ${stats.total} files`);
+  }
+}
+
+// Create a singleton logger instance
+const reactCompilerLogger = new ReactCompilerLogger();
+
+/**
+ * Get the React Compiler logger instance for accessing statistics
+ */
+export function getReactCompilerLogger(): ReactCompilerLogger {
+  return reactCompilerLogger;
+}
+
+export const getReactCompilerLoader = (
+  target: ReactCompilerLoaderOption['target'],
+  verbose: boolean,
+) => {
+  const reactCompilerOptions = {
+    target,
+    logger: verbose ? (reactCompilerLogger as Logger) : undefined,
+  } as const satisfies ReactCompilerLoaderOption;
+
+  return {
+    loader: reactCompilerLoader,
+    options: defineReactCompilerLoaderOption(reactCompilerOptions),
+  };
+};

From 87b31a781cb70175f317a0a355c8b4cb74169441 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Fri, 21 Nov 2025 15:51:10 -0500
Subject: [PATCH 11/27] Add `reactCompilerVerbose` cli argument

---
 development/webpack/utils/cli.ts | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/development/webpack/utils/cli.ts b/development/webpack/utils/cli.ts
index da0bddee71c2..0d057781348c 100644
--- a/development/webpack/utils/cli.ts
+++ b/development/webpack/utils/cli.ts
@@ -356,6 +356,13 @@ function getOptions(
       group: toOrange('Security:'),
       type: 'boolean',
     },
+    reactCompilerVerbose: {
+      array: false,
+      default: false,
+      description: 'Enables/disables React Compiler verbose mode',
+      group: toOrange('Developer assistance:'),
+      type: 'boolean',
+    },
 
     dryRun: {
       array: false,

From bfa3091f9d0b9da1de028afd6b12f07c0765d6d9 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Fri, 21 Nov 2025 15:51:48 -0500
Subject: [PATCH 12/27] Set up loader, logger in webpack config

---
 development/webpack/utils/config.ts   |  4 ----
 development/webpack/webpack.config.ts | 33 ++++++++++++++++++---------
 2 files changed, 22 insertions(+), 15 deletions(-)

diff --git a/development/webpack/utils/config.ts b/development/webpack/utils/config.ts
index 705afa5dc3b1..6bd746fa9d2b 100644
--- a/development/webpack/utils/config.ts
+++ b/development/webpack/utils/config.ts
@@ -1,7 +1,6 @@
 import { join } from 'node:path';
 import { readFileSync } from 'node:fs';
 import { parse } from 'dotenv';
-import type { ReactCompilerLoaderOption } from 'react-compiler-webpack';
 import { setEnvironmentVariables } from '../../build/set-environment-variables';
 import type { Variables } from '../../lib/variables';
 import type { BuildTypesConfig, BuildType } from '../../lib/build-type';
@@ -192,6 +191,3 @@ function loadConfigVars(
 
   return definitions;
 }
-export const reactCompilerOptions = {
-  target: '17',
-} as const satisfies ReactCompilerLoaderOption;
diff --git a/development/webpack/webpack.config.ts b/development/webpack/webpack.config.ts
index 6d4a8e78a098..cf99d86144cf 100644
--- a/development/webpack/webpack.config.ts
+++ b/development/webpack/webpack.config.ts
@@ -18,10 +18,6 @@ import rtlCss from 'postcss-rtlcss';
 import autoprefixer from 'autoprefixer';
 import discardFonts from 'postcss-discard-font-face';
 import type ReactRefreshPluginType from '@pmmmwh/react-refresh-webpack-plugin';
-import {
-  defineReactCompilerLoaderOption,
-  reactCompilerLoader,
-} from 'react-compiler-webpack';
 import tailwindcss from 'tailwindcss';
 import { loadBuildTypesConfig } from '../lib/build-type';
 import {
@@ -38,7 +34,11 @@ import { transformManifest } from './utils/plugins/ManifestPlugin/helpers';
 import { parseArgv, getDryRunMessage } from './utils/cli';
 import { getCodeFenceLoader } from './utils/loaders/codeFenceLoader';
 import { getSwcLoader } from './utils/loaders/swcLoader';
-import { getVariables, reactCompilerOptions } from './utils/config';
+import {
+  getReactCompilerLoader,
+  getReactCompilerLogger,
+} from './utils/loaders/reactCompilerLoader';
+import { getVariables } from './utils/config';
 import { ManifestPlugin } from './utils/plugins/ManifestPlugin';
 import { getLatestCommit } from './utils/git';
 
@@ -216,6 +216,18 @@ if (args.progress) {
   const { ProgressPlugin } = require('webpack');
   plugins.push(new ProgressPlugin());
 }
+
+if (args.reactCompilerVerbose) {
+  plugins.push({
+    apply(compiler) {
+      compiler.hooks.done.tap('ReactCompilerStatsPlugin', () => {
+        const logger = getReactCompilerLogger();
+        logger.logSummary();
+      });
+    },
+  } as WebpackPluginInstance);
+}
+
 // #endregion plugins
 
 const swcConfig = { args, browsersListQuery, isDevelopment };
@@ -223,6 +235,10 @@ const tsxLoader = getSwcLoader('typescript', true, safeVariables, swcConfig);
 const jsxLoader = getSwcLoader('ecmascript', true, safeVariables, swcConfig);
 const npmLoader = getSwcLoader('ecmascript', false, {}, swcConfig);
 const cjsLoader = getSwcLoader('ecmascript', false, {}, swcConfig, 'commonjs');
+const reactCompilerLoader = getReactCompilerLoader(
+  '17',
+  args.reactCompilerVerbose,
+);
 
 const config = {
   entry,
@@ -328,12 +344,7 @@ const config = {
       {
         test: /(?!\.(?:test|stories|container))\.(?:m?[jt]s|[jt]sx)$/u,
         include: UI_DIR_RE,
-        use: [
-          {
-            loader: reactCompilerLoader,
-            options: defineReactCompilerLoaderOption(reactCompilerOptions),
-          },
-        ],
+        use: [reactCompilerLoader],
       },
       // own typescript, and own typescript with jsx
       {

From 5fe6afd564399db0eb9cc6ed7bccd72d4985b222 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Fri, 21 Nov 2025 16:06:06 -0500
Subject: [PATCH 13/27] Update webpack-cli test mock

---
 development/webpack/test/cli.test.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/development/webpack/test/cli.test.ts b/development/webpack/test/cli.test.ts
index 0fa3ea421fe6..2917aaa32bc8 100644
--- a/development/webpack/test/cli.test.ts
+++ b/development/webpack/test/cli.test.ts
@@ -25,6 +25,7 @@ describe('./utils/cli.ts', () => {
     lavamoatDebug: false,
     generatePolicy: false,
     snow: false,
+    reactCompilerVerbose: false,
     dryRun: false,
     stats: false,
   };

From 6a0635c6c9cb377ee0f4eeb61316d322ad14d966 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Sun, 23 Nov 2025 02:18:39 -0500
Subject: [PATCH 14/27] Stricter regex for `ui/`

---
 development/webpack/utils/helpers.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/development/webpack/utils/helpers.ts b/development/webpack/utils/helpers.ts
index 9c15c5ea3eb5..fc445c3d0023 100644
--- a/development/webpack/utils/helpers.ts
+++ b/development/webpack/utils/helpers.ts
@@ -59,7 +59,7 @@ export const TREZOR_MODULE_RE = new RegExp(
  * Windows.
  */
 export const UI_DIR_RE = new RegExp(
-  `${join(__dirname, '../../../').replaceAll(sep, slash)}ui${slash}(?:components|contexts|hooks|layouts|pages)${slash}.*$`,
+  `^${join(__dirname, '../../../').replaceAll(sep, slash)}ui${slash}(?:components|contexts|hooks|layouts|pages)${slash}.*$`,
   'u',
 );
 

From 0e67907bc6ec14594657b86a091462b76afa2245 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Sun, 23 Nov 2025 02:18:57 -0500
Subject: [PATCH 15/27] Add comments

---
 .../utils/loaders/reactCompilerLoader.ts       | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/development/webpack/utils/loaders/reactCompilerLoader.ts b/development/webpack/utils/loaders/reactCompilerLoader.ts
index 804b91f91205..2a75e9bff5c9 100644
--- a/development/webpack/utils/loaders/reactCompilerLoader.ts
+++ b/development/webpack/utils/loaders/reactCompilerLoader.ts
@@ -32,6 +32,7 @@ class ReactCompilerLogger {
     if (filename === null) {
       return;
     }
+    const { options: errorDetails } = event.detail ?? {};
     switch (event.kind) {
       case 'CompileSuccess':
         this.compiledCount++;
@@ -43,7 +44,9 @@ class ReactCompilerLogger {
         this.skippedFiles.push(filename);
         break;
       case 'CompileError':
-        if (event.detail?.options?.category === 'Todo') {
+        // This error is thrown for syntax that is not yet supported by the React Compiler.
+        // We count these separately as "unsupported" errors, since there's no actionable fix we can apply.
+        if (errorDetails?.category === 'Todo') {
           this.todoCount++;
           this.todoFiles.push(filename);
           break;
@@ -51,11 +54,10 @@ class ReactCompilerLogger {
         this.errorCount++;
         this.errorFiles.push(filename);
         console.error(
-          `❌ React Compiler error in ${filename}: ${JSON.stringify(event.detail?.options) || 'Unknown error'}`,
+          `❌ React Compiler error in ${filename}: ${errorDetails ? JSON.stringify(errorDetails) : 'Unknown error'}`,
         );
         break;
       default:
-        // Ignore other event types
         break;
     }
   }
@@ -89,16 +91,22 @@ class ReactCompilerLogger {
   }
 }
 
-// Create a singleton logger instance
 const reactCompilerLogger = new ReactCompilerLogger();
 
 /**
- * Get the React Compiler logger instance for accessing statistics
+ * Get the React Compiler logger singleton instance to access statistics.
  */
 export function getReactCompilerLogger(): ReactCompilerLogger {
   return reactCompilerLogger;
 }
 
+/**
+ * Get the React Compiler loader.
+ *
+ * @param target - The target version of the React Compiler.
+ * @param verbose - Whether to enable verbose mode.
+ * @returns The React Compiler loader object with the loader and configured options.
+ */
 export const getReactCompilerLoader = (
   target: ReactCompilerLoaderOption['target'],
   verbose: boolean,

From 477739132da922c544932ebd9b66fbf3af83d6cd Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Sun, 23 Nov 2025 02:56:23 -0500
Subject: [PATCH 16/27] Define `--reactCompilerDebug` webpack build argument
 that sets `panicThreshold` option

---
 development/webpack/test/cli.test.ts                 |  1 +
 development/webpack/utils/cli.ts                     | 12 +++++++++++-
 .../webpack/utils/loaders/reactCompilerLoader.ts     |  6 ++++++
 development/webpack/webpack.config.ts                |  1 +
 4 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/development/webpack/test/cli.test.ts b/development/webpack/test/cli.test.ts
index 2917aaa32bc8..d0ced4e2eb2b 100644
--- a/development/webpack/test/cli.test.ts
+++ b/development/webpack/test/cli.test.ts
@@ -26,6 +26,7 @@ describe('./utils/cli.ts', () => {
     generatePolicy: false,
     snow: false,
     reactCompilerVerbose: false,
+    reactCompilerDebug: undefined,
     dryRun: false,
     stats: false,
   };
diff --git a/development/webpack/utils/cli.ts b/development/webpack/utils/cli.ts
index 0d057781348c..5219bd330397 100644
--- a/development/webpack/utils/cli.ts
+++ b/development/webpack/utils/cli.ts
@@ -359,10 +359,20 @@ function getOptions(
     reactCompilerVerbose: {
       array: false,
       default: false,
-      description: 'Enables/disables React Compiler verbose mode',
+      description:
+        'Enables/disables React Compiler verbose mode and statistics',
       group: toOrange('Developer assistance:'),
       type: 'boolean',
     },
+    reactCompilerDebug: {
+      array: false,
+      choices: ['all', 'critical'],
+      default: undefined,
+      description:
+        'Sets React Compiler panic threshold that fails the build for all errors or critical errors only',
+      group: toOrange('Developer assistance:'),
+      type: 'string',
+    },
 
     dryRun: {
       array: false,
diff --git a/development/webpack/utils/loaders/reactCompilerLoader.ts b/development/webpack/utils/loaders/reactCompilerLoader.ts
index 2a75e9bff5c9..0b27ca991a8c 100644
--- a/development/webpack/utils/loaders/reactCompilerLoader.ts
+++ b/development/webpack/utils/loaders/reactCompilerLoader.ts
@@ -105,15 +105,21 @@ export function getReactCompilerLogger(): ReactCompilerLogger {
  *
  * @param target - The target version of the React Compiler.
  * @param verbose - Whether to enable verbose mode.
+ * @param debug - The debug level to use.
+ * - 'all': Fail build on and display debug information for all compilation errors.
+ * - 'critical': Fail build on and display debug information only for critical compilation errors.
+ * - 'none': Prevent build from failing.
  * @returns The React Compiler loader object with the loader and configured options.
  */
 export const getReactCompilerLoader = (
   target: ReactCompilerLoaderOption['target'],
   verbose: boolean,
+  debug: 'all' | 'critical' | undefined,
 ) => {
   const reactCompilerOptions = {
     target,
     logger: verbose ? (reactCompilerLogger as Logger) : undefined,
+    panicThreshold: debug ? `${debug}_errors` : 'none',
   } as const satisfies ReactCompilerLoaderOption;
 
   return {
diff --git a/development/webpack/webpack.config.ts b/development/webpack/webpack.config.ts
index cf99d86144cf..1fd484c4fca8 100644
--- a/development/webpack/webpack.config.ts
+++ b/development/webpack/webpack.config.ts
@@ -238,6 +238,7 @@ const cjsLoader = getSwcLoader('ecmascript', false, {}, swcConfig, 'commonjs');
 const reactCompilerLoader = getReactCompilerLoader(
   '17',
   args.reactCompilerVerbose,
+  args.reactCompilerDebug,
 );
 
 const config = {

From 83d86b9e4e4df0d6bbd5a10577b77230f9c4be47 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Sun, 23 Nov 2025 03:15:30 -0500
Subject: [PATCH 17/27] Less ambiguous regex

---
 development/webpack/utils/helpers.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/development/webpack/utils/helpers.ts b/development/webpack/utils/helpers.ts
index fc445c3d0023..0107971cb762 100644
--- a/development/webpack/utils/helpers.ts
+++ b/development/webpack/utils/helpers.ts
@@ -59,7 +59,7 @@ export const TREZOR_MODULE_RE = new RegExp(
  * Windows.
  */
 export const UI_DIR_RE = new RegExp(
-  `^${join(__dirname, '../../../').replaceAll(sep, slash)}ui${slash}(?:components|contexts|hooks|layouts|pages)${slash}.*$`,
+  `^${join(__dirname, '..', '..', '..', 'ui').replaceAll(sep, slash)}${slash}(?:components|contexts|hooks|layouts|pages)${slash}.*$`,
   'u',
 );
 

From 6f381b1119c29f926f2ca52c6d1cced43c722f06 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Mon, 24 Nov 2025 09:40:11 -0500
Subject: [PATCH 18/27] Fix regex

---
 development/webpack/webpack.config.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/development/webpack/webpack.config.ts b/development/webpack/webpack.config.ts
index 1fd484c4fca8..3c30d179d19d 100644
--- a/development/webpack/webpack.config.ts
+++ b/development/webpack/webpack.config.ts
@@ -343,7 +343,7 @@ const config = {
         type: 'asset/resource',
       },
       {
-        test: /(?!\.(?:test|stories|container))\.(?:m?[jt]s|[jt]sx)$/u,
+        test: /(?:.(?!\.(?:test|stories|container)))+\.(?:m?[jt]s|[jt]sx)$/u,
         include: UI_DIR_RE,
         use: [reactCompilerLoader],
       },

From 38c2fb60f7373200a2534b0313f94dad147c7649 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Mon, 24 Nov 2025 12:49:11 -0500
Subject: [PATCH 19/27] Set debug mode option default to 'none'

---
 development/webpack/test/cli.test.ts                     | 2 +-
 development/webpack/utils/cli.ts                         | 6 +++---
 development/webpack/utils/loaders/reactCompilerLoader.ts | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/development/webpack/test/cli.test.ts b/development/webpack/test/cli.test.ts
index d0ced4e2eb2b..8149bee270bd 100644
--- a/development/webpack/test/cli.test.ts
+++ b/development/webpack/test/cli.test.ts
@@ -26,7 +26,7 @@ describe('./utils/cli.ts', () => {
     generatePolicy: false,
     snow: false,
     reactCompilerVerbose: false,
-    reactCompilerDebug: undefined,
+    reactCompilerDebug: 'none',
     dryRun: false,
     stats: false,
   };
diff --git a/development/webpack/utils/cli.ts b/development/webpack/utils/cli.ts
index 5219bd330397..a45a6240af9d 100644
--- a/development/webpack/utils/cli.ts
+++ b/development/webpack/utils/cli.ts
@@ -366,10 +366,10 @@ function getOptions(
     },
     reactCompilerDebug: {
       array: false,
-      choices: ['all', 'critical'],
-      default: undefined,
+      choices: ['all', 'critical', 'none'],
+      default: 'none',
       description:
-        'Sets React Compiler panic threshold that fails the build for all errors or critical errors only',
+        'Sets React Compiler panic threshold that fails the build for all errors or critical errors only. If `none`, the build will not fail.',
       group: toOrange('Developer assistance:'),
       type: 'string',
     },
diff --git a/development/webpack/utils/loaders/reactCompilerLoader.ts b/development/webpack/utils/loaders/reactCompilerLoader.ts
index 0b27ca991a8c..ca82578df77b 100644
--- a/development/webpack/utils/loaders/reactCompilerLoader.ts
+++ b/development/webpack/utils/loaders/reactCompilerLoader.ts
@@ -114,12 +114,12 @@ export function getReactCompilerLogger(): ReactCompilerLogger {
 export const getReactCompilerLoader = (
   target: ReactCompilerLoaderOption['target'],
   verbose: boolean,
-  debug: 'all' | 'critical' | undefined,
+  debug: 'all' | 'critical' | 'none',
 ) => {
   const reactCompilerOptions = {
     target,
     logger: verbose ? (reactCompilerLogger as Logger) : undefined,
-    panicThreshold: debug ? `${debug}_errors` : 'none',
+    panicThreshold: debug === 'none' ? debug : `${debug}_errors`,
   } as const satisfies ReactCompilerLoaderOption;
 
   return {

From e5e61dbfea1ed314975ffb88f321a2aaa1b0c986 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Mon, 24 Nov 2025 12:50:35 -0500
Subject: [PATCH 20/27] Add entries to dry run message

---
 development/webpack/utils/cli.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/development/webpack/utils/cli.ts b/development/webpack/utils/cli.ts
index a45a6240af9d..f9d9ec1fba99 100644
--- a/development/webpack/utils/cli.ts
+++ b/development/webpack/utils/cli.ts
@@ -411,6 +411,8 @@ LavaMoat debug: ${args.lavamoatDebug}
 Generate policy: ${args.generatePolicy}
 Snow: ${args.snow}
 Sentry: ${args.sentry}
+React Compiler verbose: ${args.reactCompilerVerbose}
+React Compiler debug: ${args.reactCompilerDebug}
 Manifest version: ${args.manifest_version}
 Release version: ${args.releaseVersion}
 Browsers: ${args.browser.join(', ')}

From e78570607af17eae8789562f61f29c651c6e85bc Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Thu, 27 Nov 2025 01:33:09 -0500
Subject: [PATCH 21/27] Group new CLI arguments with other developer assistance
 entries in `getOptions` return object

---
 development/webpack/test/cli.test.ts |  4 ++--
 development/webpack/utils/cli.ts     | 34 ++++++++++++++--------------
 2 files changed, 19 insertions(+), 19 deletions(-)

diff --git a/development/webpack/test/cli.test.ts b/development/webpack/test/cli.test.ts
index 8149bee270bd..29023d1ab6f2 100644
--- a/development/webpack/test/cli.test.ts
+++ b/development/webpack/test/cli.test.ts
@@ -14,6 +14,8 @@ describe('./utils/cli.ts', () => {
     devtool: 'source-map',
     sentry: false,
     test: false,
+    reactCompilerVerbose: false,
+    reactCompilerDebug: 'none',
     zip: false,
     minify: false,
     browser: ['chrome'],
@@ -25,8 +27,6 @@ describe('./utils/cli.ts', () => {
     lavamoatDebug: false,
     generatePolicy: false,
     snow: false,
-    reactCompilerVerbose: false,
-    reactCompilerDebug: 'none',
     dryRun: false,
     stats: false,
   };
diff --git a/development/webpack/utils/cli.ts b/development/webpack/utils/cli.ts
index f9d9ec1fba99..3967f6bdb519 100644
--- a/development/webpack/utils/cli.ts
+++ b/development/webpack/utils/cli.ts
@@ -237,6 +237,23 @@ function getOptions(
       group: toOrange('Developer assistance:'),
       type: 'boolean',
     },
+    reactCompilerVerbose: {
+      array: false,
+      default: false,
+      description:
+        'Enables/disables React Compiler verbose mode and statistics',
+      group: toOrange('Developer assistance:'),
+      type: 'boolean',
+    },
+    reactCompilerDebug: {
+      array: false,
+      choices: ['all', 'critical', 'none'],
+      default: 'none',
+      description:
+        'Sets React Compiler panic threshold that fails the build for all errors or critical errors only. If `none`, the build will not fail.',
+      group: toOrange('Developer assistance:'),
+      type: 'string',
+    },
 
     ...prerequisites,
     zip: {
@@ -356,23 +373,6 @@ function getOptions(
       group: toOrange('Security:'),
       type: 'boolean',
     },
-    reactCompilerVerbose: {
-      array: false,
-      default: false,
-      description:
-        'Enables/disables React Compiler verbose mode and statistics',
-      group: toOrange('Developer assistance:'),
-      type: 'boolean',
-    },
-    reactCompilerDebug: {
-      array: false,
-      choices: ['all', 'critical', 'none'],
-      default: 'none',
-      description:
-        'Sets React Compiler panic threshold that fails the build for all errors or critical errors only. If `none`, the build will not fail.',
-      group: toOrange('Developer assistance:'),
-      type: 'string',
-    },
 
     dryRun: {
       array: false,

From 1444569bbc68c5446be174f0cd7c242938035c7e Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Fri, 28 Nov 2025 09:13:28 -0500
Subject: [PATCH 22/27] Define `ReactCompilerPlugin`

---
 .../utils/plugins/ReactCompilerPlugin/index.ts | 11 +++++++++++
 development/webpack/webpack.config.ts          | 18 +++++-------------
 2 files changed, 16 insertions(+), 13 deletions(-)
 create mode 100644 development/webpack/utils/plugins/ReactCompilerPlugin/index.ts

diff --git a/development/webpack/utils/plugins/ReactCompilerPlugin/index.ts b/development/webpack/utils/plugins/ReactCompilerPlugin/index.ts
new file mode 100644
index 000000000000..284be36929cd
--- /dev/null
+++ b/development/webpack/utils/plugins/ReactCompilerPlugin/index.ts
@@ -0,0 +1,11 @@
+import type { Compiler } from 'webpack';
+import { getReactCompilerLogger } from '../../loaders/reactCompilerLoader';
+
+export class ReactCompilerPlugin {
+  apply(compiler: Compiler): void {
+    compiler.hooks.afterEmit.tap(ReactCompilerPlugin.name, () => {
+      const logger = getReactCompilerLogger();
+      logger.logSummary();
+    });
+  }
+}
diff --git a/development/webpack/webpack.config.ts b/development/webpack/webpack.config.ts
index 3c30d179d19d..a6fcfc208fd2 100644
--- a/development/webpack/webpack.config.ts
+++ b/development/webpack/webpack.config.ts
@@ -34,10 +34,7 @@ import { transformManifest } from './utils/plugins/ManifestPlugin/helpers';
 import { parseArgv, getDryRunMessage } from './utils/cli';
 import { getCodeFenceLoader } from './utils/loaders/codeFenceLoader';
 import { getSwcLoader } from './utils/loaders/swcLoader';
-import {
-  getReactCompilerLoader,
-  getReactCompilerLogger,
-} from './utils/loaders/reactCompilerLoader';
+import { getReactCompilerLoader } from './utils/loaders/reactCompilerLoader';
 import { getVariables } from './utils/config';
 import { ManifestPlugin } from './utils/plugins/ManifestPlugin';
 import { getLatestCommit } from './utils/git';
@@ -216,16 +213,11 @@ if (args.progress) {
   const { ProgressPlugin } = require('webpack');
   plugins.push(new ProgressPlugin());
 }
-
 if (args.reactCompilerVerbose) {
-  plugins.push({
-    apply(compiler) {
-      compiler.hooks.done.tap('ReactCompilerStatsPlugin', () => {
-        const logger = getReactCompilerLogger();
-        logger.logSummary();
-      });
-    },
-  } as WebpackPluginInstance);
+  const {
+    ReactCompilerPlugin,
+  } = require('./utils/plugins/ReactCompilerPlugin');
+  plugins.push(new ReactCompilerPlugin());
 }
 
 // #endregion plugins

From b560c3e321fefaf21391df4d508ee69748f171f5 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Wed, 3 Dec 2025 09:53:57 -0500
Subject: [PATCH 23/27] Reset react compiler stats to prevent accumulation in
 watch mode

---
 .../webpack/utils/loaders/reactCompilerLoader.ts  | 15 +++++++++++++++
 .../utils/plugins/ReactCompilerPlugin/index.ts    |  2 ++
 2 files changed, 17 insertions(+)

diff --git a/development/webpack/utils/loaders/reactCompilerLoader.ts b/development/webpack/utils/loaders/reactCompilerLoader.ts
index ca82578df77b..c53ec040df3e 100644
--- a/development/webpack/utils/loaders/reactCompilerLoader.ts
+++ b/development/webpack/utils/loaders/reactCompilerLoader.ts
@@ -89,6 +89,21 @@ class ReactCompilerLogger {
     console.log(`   🔍 Unsupported: ${stats.unsupported} files`);
     console.log(`   📦 Total processed: ${stats.total} files`);
   }
+
+  /**
+   * Reset all statistics. Should be called after each build in watch mode
+   * to prevent accumulation across rebuilds.
+   */
+  reset() {
+    this.compiledCount = 0;
+    this.skippedCount = 0;
+    this.errorCount = 0;
+    this.todoCount = 0;
+    this.compiledFiles = [];
+    this.skippedFiles = [];
+    this.errorFiles = [];
+    this.todoFiles = [];
+  }
 }
 
 const reactCompilerLogger = new ReactCompilerLogger();
diff --git a/development/webpack/utils/plugins/ReactCompilerPlugin/index.ts b/development/webpack/utils/plugins/ReactCompilerPlugin/index.ts
index 284be36929cd..231b0b595529 100644
--- a/development/webpack/utils/plugins/ReactCompilerPlugin/index.ts
+++ b/development/webpack/utils/plugins/ReactCompilerPlugin/index.ts
@@ -6,6 +6,8 @@ export class ReactCompilerPlugin {
     compiler.hooks.afterEmit.tap(ReactCompilerPlugin.name, () => {
       const logger = getReactCompilerLogger();
       logger.logSummary();
+      // Reset statistics after logging to prevent accumulation in watch mode
+      logger.reset();
     });
   }
 }

From 986c815fe7de395602630991de151cdeee282136 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Wed, 3 Dec 2025 10:10:51 -0500
Subject: [PATCH 24/27] Dedupe lockfile

---
 yarn.lock | 13 +------------
 1 file changed, 1 insertion(+), 12 deletions(-)

diff --git a/yarn.lock b/yarn.lock
index 4beed5f43d5a..80b8378a80f6 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -863,18 +863,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/plugin-syntax-typescript@npm:^7.25.9, @babel/plugin-syntax-typescript@npm:^7.7.2":
-  version: 7.25.9
-  resolution: "@babel/plugin-syntax-typescript@npm:7.25.9"
-  dependencies:
-    "@babel/helper-plugin-utils": "npm:^7.25.9"
-  peerDependencies:
-    "@babel/core": ^7.0.0-0
-  checksum: 10/0e9821e8ba7d660c36c919654e4144a70546942ae184e85b8102f2322451eae102cbfadbcadd52ce077a2b44b400ee52394c616feab7b5b9f791b910e933fd33
-  languageName: node
-  linkType: hard
-
-"@babel/plugin-syntax-typescript@npm:^7.27.1":
+"@babel/plugin-syntax-typescript@npm:^7.25.9, @babel/plugin-syntax-typescript@npm:^7.27.1, @babel/plugin-syntax-typescript@npm:^7.7.2":
   version: 7.27.1
   resolution: "@babel/plugin-syntax-typescript@npm:7.27.1"
   dependencies:

From 52857d760ad2cba6e98ce5883f121011bcb1aef5 Mon Sep 17 00:00:00 2001
From: MetaMask Bot <metamaskbot@users.noreply.github.com>
Date: Wed, 3 Dec 2025 15:30:54 +0000
Subject: [PATCH 25/27] Update LavaMoat policies

---
 lavamoat/build-system/policy.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/lavamoat/build-system/policy.json b/lavamoat/build-system/policy.json
index 57e787623b95..efc163f3ff9f 100644
--- a/lavamoat/build-system/policy.json
+++ b/lavamoat/build-system/policy.json
@@ -296,7 +296,7 @@
         "@babel/preset-env>@babel/helper-plugin-utils": true
       }
     },
-    "@babel/preset-typescript>@babel/plugin-transform-typescript>@babel/plugin-syntax-typescript": {
+    "react-compiler-webpack>@babel/plugin-syntax-typescript": {
       "packages": {
         "@babel/preset-env>@babel/helper-plugin-utils": true
       }
@@ -650,7 +650,7 @@
         "@babel/preset-env>@babel/plugin-transform-private-methods>@babel/helper-create-class-features-plugin": true,
         "@babel/preset-env>@babel/helper-plugin-utils": true,
         "@babel/preset-env>@babel/plugin-transform-for-of>@babel/helper-skip-transparent-expression-wrappers": true,
-        "@babel/preset-typescript>@babel/plugin-transform-typescript>@babel/plugin-syntax-typescript": true
+        "react-compiler-webpack>@babel/plugin-syntax-typescript": true
       }
     },
     "@babel/preset-env>@babel/plugin-transform-unicode-escapes": {

From e7c11bf176e065acc8223cc639f2723bbe4f628c Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Wed, 3 Dec 2025 11:11:42 -0500
Subject: [PATCH 26/27] Fix test regex for react compiler loader in both
 webpack, babel config

---
 babel.config.js                       | 2 +-
 development/webpack/webpack.config.ts | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/babel.config.js b/babel.config.js
index e1e4e98d7fe1..3ad8419d8415 100644
--- a/babel.config.js
+++ b/babel.config.js
@@ -13,7 +13,7 @@ module.exports = function (api) {
     overrides: [
       {
         test: new RegExp(
-          `^${path.join(__dirname, 'ui')}${slash}(?:components|contexts|hooks|layouts|pages)${slash}(?:.(?!\\.(?:test|stories|container)))+\\.(?:m?[jt]s|[jt]sx)$`,
+          `^${path.join(__dirname, 'ui')}${slash}(?:components|contexts|hooks|layouts|pages)${slash}(?!.*\\.(?:test|stories|container)\\.)(?:.*)\\.(?:m?[jt]s|[jt]sx)$`,
           'u',
         ),
         plugins: [['babel-plugin-react-compiler', { target: '17' }]],
diff --git a/development/webpack/webpack.config.ts b/development/webpack/webpack.config.ts
index a6fcfc208fd2..093cf8b0319e 100644
--- a/development/webpack/webpack.config.ts
+++ b/development/webpack/webpack.config.ts
@@ -335,7 +335,7 @@ const config = {
         type: 'asset/resource',
       },
       {
-        test: /(?:.(?!\.(?:test|stories|container)))+\.(?:m?[jt]s|[jt]sx)$/u,
+        test: /^(?!.*\.(?:test|stories|container)\.)(?:.*)\.(?:m?[jt]s|[jt]sx)$/u,
         include: UI_DIR_RE,
         use: [reactCompilerLoader],
       },

From 0b3aa55a34c98fd4a6d902a3c73a5fcaf6ab8eb5 Mon Sep 17 00:00:00 2001
From: Jongsun Suh <jongsun.suh@icloud.com>
Date: Wed, 3 Dec 2025 11:14:32 -0500
Subject: [PATCH 27/27] Set `panicThreshold` to `undefined` when `debug` set to
 `none`

---
 development/webpack/utils/cli.ts                         | 2 +-
 development/webpack/utils/loaders/reactCompilerLoader.ts | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/development/webpack/utils/cli.ts b/development/webpack/utils/cli.ts
index 3967f6bdb519..9d56749ebc06 100644
--- a/development/webpack/utils/cli.ts
+++ b/development/webpack/utils/cli.ts
@@ -247,7 +247,7 @@ function getOptions(
     },
     reactCompilerDebug: {
       array: false,
-      choices: ['all', 'critical', 'none'],
+      choices: ['all', 'critical', 'none'] as const,
       default: 'none',
       description:
         'Sets React Compiler panic threshold that fails the build for all errors or critical errors only. If `none`, the build will not fail.',
diff --git a/development/webpack/utils/loaders/reactCompilerLoader.ts b/development/webpack/utils/loaders/reactCompilerLoader.ts
index c53ec040df3e..9edd16594498 100644
--- a/development/webpack/utils/loaders/reactCompilerLoader.ts
+++ b/development/webpack/utils/loaders/reactCompilerLoader.ts
@@ -134,7 +134,7 @@ export const getReactCompilerLoader = (
   const reactCompilerOptions = {
     target,
     logger: verbose ? (reactCompilerLogger as Logger) : undefined,
-    panicThreshold: debug === 'none' ? debug : `${debug}_errors`,
+    panicThreshold: debug === 'none' ? undefined : `${debug}_errors`,
   } as const satisfies ReactCompilerLoaderOption;
 
   return {