Add React Compiler integration to webview-ui (#9565)

pnpm-lock.yaml

@@ -269,7 +269,7 @@ importers:
         version: 0.518.0([email protected])
       next:
         specifier: ~15.2.8
-        version: 15.2.8(@opentelemetry/[email protected])([email protected]([email protected]))([email protected])
+        version: 15.2.8(@opentelemetry/[email protected])([email protected])([email protected]([email protected]))([email protected])
       next-themes:
         specifier: ^0.4.6
         version: 0.4.6([email protected]([email protected]))([email protected])
@@ -378,7 +378,7 @@ importers:
         version: 0.518.0([email protected])
       next:
         specifier: ~15.2.8
-        version: 15.2.8(@opentelemetry/[email protected])([email protected]([email protected]))([email protected])
+        version: 15.2.8(@opentelemetry/[email protected])([email protected])([email protected]([email protected]))([email protected])
       next-themes:
         specifier: ^0.4.6
         version: 0.4.6([email protected]([email protected]))([email protected])
@@ -445,7 +445,7 @@ importers:
         version: 10.4.21([email protected])
       next-sitemap:
         specifier: ^4.2.3
-        version: 4.2.3([email protected](@opentelemetry/[email protected])([email protected]([email protected]))([email protected]))
+        version: 4.2.3([email protected](@opentelemetry/[email protected])([email protected])([email protected]([email protected]))([email protected]))
       postcss:
         specifier: ^8.5.4
         version: 8.5.4
@@ -1236,6 +1236,9 @@ importers:
       react:
         specifier: ^18.3.1
         version: 18.3.1
+      react-compiler-runtime:
+        specifier: ^1.0.0
+        version: 1.0.0([email protected])
       react-dom:
         specifier: ^18.3.1
         version: 18.3.1([email protected])
@@ -1363,6 +1366,9 @@ importers:
       '@vitest/ui':
         specifier: ^3.2.3
         version: 3.2.4([email protected])
+      babel-plugin-react-compiler:
+        specifier: ^1.0.0
+        version: 1.0.0
       identity-obj-proxy:
         specifier: ^3.0.0
         version: 3.0.0
@@ -4854,6 +4860,9 @@ packages:
   [email protected]:
     resolution: {integrity: sha512-OnAYlL5b7LEkALw87fUVafQw5rVR9RjwGd4KUwNQ6DrrNmaVaUCgLipfVlzrPQ4tWOR9P0IXGNOx50jYCCdSJg==}
 
+  [email protected]:
+    resolution: {integrity: sha512-Ixm8tFfoKKIPYdCCKYTsqv+Fd4IJ0DQqMyEimo+pxUOMUR9cVPlwTrFt9Avu+3cb6Zp3mAzl+t1MrG2fxxKsxw==}
+
   [email protected]:
     resolution: {integrity: sha512-xFbRxM1tahm08yHBP16MMjVUAvDaBMD38zsM9EMAUN61omwLmKlOpB/Zku5QkjZ8TZ4vn53pj+t518cH0S03RQ==}
 
@@ -8877,6 +8886,11 @@ packages:
     resolution: {integrity: sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==}
     hasBin: true
 
+  [email protected]:
+    resolution: {integrity: sha512-rRfjYv66HlG8896yPUDONgKzG5BxZD1nV9U6rkm+7VCuvQc903C4MjcoZR4zPw53IKSOX9wMQVpA1IAbRtzQ7w==}
+    peerDependencies:
+      react: ^17.0.0 || ^18.0.0 || ^19.0.0 || ^0.0.0-experimental
+
   [email protected]:
     resolution: {integrity: sha512-Blyj+m+Zz7SFHYqT18p16EANgnSg2sIyU6Yp3vk83AnOnSW7qnehPkUe4+8+qxztJrNmCH5GP+VHsWzAKVOoZA==}
     engines: {node: '>=10'}
@@ -15039,6 +15053,10 @@ snapshots:
 
   [email protected]: {}
 
+  [email protected]:
+    dependencies:
+      '@babel/types': 7.27.1
+
   [email protected]: {}
 
   [email protected]: {}
@@ -18855,20 +18873,20 @@ snapshots:
 
   [email protected]: {}
 
-  [email protected]([email protected](@opentelemetry/[email protected])([email protected]([email protected]))([email protected])):
+  [email protected]([email protected](@opentelemetry/[email protected])([email protected])([email protected]([email protected]))([email protected])):
     dependencies:
       '@corex/deepmerge': 4.0.43
       '@next/env': 13.5.11
       fast-glob: 3.3.3
       minimist: 1.2.8
-      next: 15.2.8(@opentelemetry/[email protected])([email protected]([email protected]))([email protected])
+      next: 15.2.8(@opentelemetry/[email protected])([email protected])([email protected]([email protected]))([email protected])
 
   [email protected]([email protected]([email protected]))([email protected]):
     dependencies:
       react: 18.3.1
       react-dom: 18.3.1([email protected])
 
-  [email protected](@opentelemetry/[email protected])([email protected]([email protected]))([email protected]):
+  [email protected](@opentelemetry/[email protected])([email protected])([email protected]([email protected]))([email protected]):
     dependencies:
       '@next/env': 15.2.8
       '@swc/counter': 0.1.3
@@ -18889,6 +18907,7 @@ snapshots:
       '@next/swc-win32-arm64-msvc': 15.2.5
       '@next/swc-win32-x64-msvc': 15.2.5
       '@opentelemetry/api': 1.9.0
+      babel-plugin-react-compiler: 1.0.0
       sharp: 0.33.5
     transitivePeerDependencies:
       - '@babel/core'
@@ -19600,6 +19619,10 @@ snapshots:
       strip-json-comments: 2.0.1
     optional: true
 
+  [email protected]([email protected]):
+    dependencies:
+      react: 18.3.1
+
   [email protected]([email protected]):
     dependencies:
       js-cookie: 2.2.1

webview-ui/package.json

@@ -58,6 +58,7 @@
 		"qrcode": "^1.5.4",
 		"react": "^18.3.1",
 		"react-dom": "^18.3.1",
+		"react-compiler-runtime": "^1.0.0",
 		"react-i18next": "^15.4.1",
 		"react-icons": "^5.5.0",
 		"react-markdown": "^9.0.3",
@@ -85,6 +86,7 @@
 		"zod": "^3.25.61"
 	},
 	"devDependencies": {
+		"babel-plugin-react-compiler": "^1.0.0",
 		"@roo-code/config-eslint": "workspace:^",
 		"@roo-code/config-typescript": "workspace:^",
 		"@testing-library/jest-dom": "^6.6.3",

webview-ui/vite.config.ts

@@ -81,7 +81,17 @@ export default defineConfig(({ mode }) => {
 		define["process.env.PKG_OUTPUT_CHANNEL"] = JSON.stringify("Roo-Code-Nightly")
 	}
 
-	const plugins: PluginOption[] = [react(), tailwindcss(), persistPortPlugin(), wasmPlugin(), sourcemapPlugin()]
+	const plugins: PluginOption[] = [
+		react({
+			babel: {
+				plugins: [["babel-plugin-react-compiler", { target: "18" }]],
+			},
+		}),
+		tailwindcss(),
+		persistPortPlugin(),
+		wasmPlugin(),
+		sourcemapPlugin(),
+	]
 
 	return {
 		plugins,