tooling: react compiler

apps/client/package.json

@@ -72,6 +72,7 @@
     "@typescript-eslint/eslint-plugin": "catalog:",
     "@typescript-eslint/parser": "catalog:",
     "@vitejs/plugin-react": "4.5.1",
+    "babel-plugin-react-compiler": "19.1.0-rc.2",
     "eslint": "catalog:",
     "eslint-config-prettier": "catalog:",
     "eslint-plugin-jest": "^28.6.0",
@@ -83,6 +84,7 @@
     "ontime-types": "workspace:*",
     "ontime-utils": "workspace:*",
     "prettier": "catalog:",
+    "react-compiler-runtime": "19.1.0-rc.2",
     "sass": "^1.57.1",
     "typescript": "catalog:",
     "vite": "6.3.1",

apps/client/vite.config.js

@@ -1,6 +1,6 @@
 import { sentryVitePlugin } from '@sentry/vite-plugin';
 import react from '@vitejs/plugin-react';
-import { fileURLToPath, URL } from 'node:url';
+import path from 'path';
 import { defineConfig } from 'vite';
 import { compression } from 'vite-plugin-compression2';
 import svgrPlugin from 'vite-plugin-svgr';
@@ -10,10 +10,19 @@ import { ONTIME_VERSION } from './src/ONTIME_VERSION';
 const sentryAuthToken = process.env.SENTRY_AUTH_TOKEN;
 const isDev = process.env.NODE_ENV === 'local' || process.env.NODE_ENV === 'development';
 
+const ReactCompilerConfig = {
+  runtimeModule: '@/mycache',
+  target: '18',
+};
+
 export default defineConfig({
   base: './', // Ontime cloud: we use relative paths to allow them to reference a dynamic base set at runtime
   plugins: [
-    react(),
+    react({
+      babel: {
+        plugins: [['babel-plugin-react-compiler', ReactCompilerConfig]],
+      },
+    }),
     svgrPlugin(),
     !isDev &&
       sentryVitePlugin({
@@ -89,7 +98,7 @@ export default defineConfig({
   },
   resolve: {
     alias: {
-      '@': fileURLToPath(new URL('./src', import.meta.url)),
+      '@': path.resolve(__dirname, './src'),
     },
   },
   esbuild: {