From 3361a2e4ab3da620e6e08c0ed8531cead33d78c5 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 3 Aug 2025 13:28:40 +0300
Subject: [PATCH] feat(react): set up client to support Preact with JSX

---
 apps/client/package.json      | 1 +
 apps/client/tsconfig.app.json | 6 +++++-
 apps/client/vite.config.mts   | 2 ++
 3 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/apps/client/package.json b/apps/client/package.json
index 67fcb5c4f..e9c9a9de6 100644
--- a/apps/client/package.json
+++ b/apps/client/package.json
@@ -59,6 +59,7 @@
   },
   "devDependencies": {
     "@ckeditor/ckeditor5-inspector": "5.0.0",
+    "@preact/preset-vite": "2.10.2",
     "@types/bootstrap": "5.2.10",
     "@types/jquery": "3.5.32",
     "@types/leaflet": "1.9.20",
diff --git a/apps/client/tsconfig.app.json b/apps/client/tsconfig.app.json
index 20119a29f..f823b8cba 100644
--- a/apps/client/tsconfig.app.json
+++ b/apps/client/tsconfig.app.json
@@ -4,9 +4,13 @@
     "lib": [ "ESNext" ],
     "outDir": "dist",
     "types": [
-      "node"
+      "node",
+      "preact"
     ],
     "rootDir": "src",
+    "jsx": "preserve",
+    "jsxFactory": "h",
+		"jsxImportSource": "preact",
     "module": "esnext",
     "moduleResolution": "bundler",
     "tsBuildInfoFile": "dist/tsconfig.app.tsbuildinfo"
diff --git a/apps/client/vite.config.mts b/apps/client/vite.config.mts
index 81f9cf9a7..640313bff 100644
--- a/apps/client/vite.config.mts
+++ b/apps/client/vite.config.mts
@@ -4,6 +4,7 @@ import { defineConfig, type Plugin } from 'vite';
 import { viteStaticCopy } from 'vite-plugin-static-copy'
 import asset_path from './src/asset_path';
 import webpackStatsPlugin from 'rollup-plugin-webpack-stats';
+import preact from "@preact/preset-vite";
 
 const assets = [ "assets", "stylesheets", "fonts", "translations" ];
 
@@ -20,6 +21,7 @@ export default defineConfig(() => ({
         host: 'localhost',
     },
     plugins: [
+        preact(),
         viteStaticCopy({
             targets: assets.map((asset) => ({
                 src: `src/${asset}/*`,