feat: react 19 to take advantage of compiler

package.json

@@ -28,10 +28,10 @@
 		"clsx": "^2.1.1",
 		"isbot": "^5.1.6",
 		"oauth4webapi": "^2.10.4",
-		"react": "^18.3.1",
+		"react": "19.0.0-beta-26f2496093-20240514",
 		"react-aria-components": "^1.2.0",
 		"react-codemirror-merge": "^4.22.0",
-		"react-dom": "^18.3.1",
+		"react-dom": "19.0.0-beta-26f2496093-20240514",
 		"remix-utils": "^7.6.0",
 		"tailwind-merge": "^2.3.0",
 		"tailwindcss-react-aria-components": "^1.1.2",
@@ -41,9 +41,10 @@
 	},
 	"devDependencies": {
 		"@remix-run/dev": "^2.9.1",
-		"@types/react": "^18.3.1",
+		"@types/react": "npm:types-react@beta",
-		"@types/react-dom": "^18.3.0",
+		"@types/react-dom": "npm:types-react-dom@beta",
 		"autoprefixer": "^10.4.19",
+		"babel-plugin-react-compiler": "0.0.0-experimental-c23de8d-20240515",
 		"eslint": "^8.57.0",
 		"eslint-config-tale": "^2.0.4",
 		"postcss": "^8.4.38",
@@ -51,8 +52,13 @@
 		"tailwindcss-animate": "^1.0.7",
 		"typescript": "^5.4.5",
 		"vite": "^5.2.11",
+		"vite-plugin-babel": "^1.2.0",
 		"vite-tsconfig-paths": "^4.2.1"
 	},
+	"overrides": {
+		"@types/react": "npm:types-react@beta",
+		"@types/react-dom": "npm:types-react-dom@beta"
+	},
 	"engines": {
 		"node": ">=18.0.0"
 	},

vite.config.ts

@@ -1,13 +1,28 @@
 import { vitePlugin as remix } from '@remix-run/dev'
 import { installGlobals } from '@remix-run/node'
 import { defineConfig } from 'vite'
+import babel from 'vite-plugin-babel'
 import tsconfigPaths from 'vite-tsconfig-paths'
 
 installGlobals()
 
+const ReactCompilerConfig = {}
+
 export default defineConfig({
 	base: '/admin/',
-	plugins: [remix({
+	plugins: [
-		basename: '/admin/'
+		remix({
-	}), tsconfigPaths()]
+			basename: '/admin/',
+		}),
+		tsconfigPaths(),
+		babel({
+			filter: /\.[jt]sx?$/,
+			babelConfig: {
+				presets: ['@babel/preset-typescript'], // if you use TypeScript
+				plugins: [
+					['babel-plugin-react-compiler', ReactCompilerConfig],
+				],
+			},
+		}),
+	],
 })