diff --git a/notes/bun.lockb b/notes/bun.lockb
index 3af58aa..97bad5d 100755
Binary files a/notes/bun.lockb and b/notes/bun.lockb differ
diff --git a/notes/package.json b/notes/package.json
index f06fe0f..f52d81c 100644
--- a/notes/package.json
+++ b/notes/package.json
@@ -5,7 +5,7 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
-    "build": "tsc && vite build",
+    "build": "tsc && vite build --jsx",
     "preview": "vite preview",
     "tauri": "tauri"
   },
@@ -19,6 +19,7 @@
   },
   "devDependencies": {
     "@tauri-apps/cli": "^2",
+    "@vitejs/plugin-react": "^4.2.1",
     "vite": "^5.3.1",
     "typescript": "^5.2.2"
   }
diff --git a/notes/src/claude-generated-code.tsx b/notes/src/claude-generated-code.tsx
index dc160c4..966efc1 100644
--- a/notes/src/claude-generated-code.tsx
+++ b/notes/src/claude-generated-code.tsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import { useState, useEffect } from 'react';
 import Card from '@mui/material/Card';
 import Button from '@mui/material/Button';
 import { 
diff --git a/notes/src/main.tsx b/notes/src/main.tsx
index 0c0998d..8b70e55 100644
--- a/notes/src/main.tsx
+++ b/notes/src/main.tsx
@@ -1,14 +1,19 @@
 import { invoke } from "@tauri-apps/api/core";
-import { createRoot } from 'react-dom/client';
-import React, { useState, useEffect } from 'react';
 
+import React from 'react';
+// @ts-ignore
+import ReactDOM from "react-dom/client";
 
 import NoteEditor from "./claude-generated-code";
 
 const domElem = document.getElementById("editor");
-console.log(domElem);
-const root = createRoot(domElem);
-root.render(<NoteEditor/>);
+
+ReactDOM.createRoot(domElem).render(
+  <React.StrictMode>
+    <NoteEditor/>
+  </React.StrictMode>,
+);
+
 
 let greetInputEl: HTMLInputElement | null;
 let greetMsgEl: HTMLElement | null;
diff --git a/notes/tsconfig.json b/notes/tsconfig.json
index 75abdef..813e82b 100644
--- a/notes/tsconfig.json
+++ b/notes/tsconfig.json
@@ -12,6 +12,7 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,
+    "jsx": "react-jsx",
 
     /* Linting */
     "strict": true,
diff --git a/notes/vite.config.ts b/notes/vite.config.ts
index e8e567a..e861c38 100644
--- a/notes/vite.config.ts
+++ b/notes/vite.config.ts
@@ -1,10 +1,13 @@
 import { defineConfig } from "vite";
+import react from "@vitejs/plugin-react";
+
 
 // @ts-expect-error process is a nodejs global
 const host = process.env.TAURI_DEV_HOST;
 
 // https://vitejs.dev/config/
 export default defineConfig(async () => ({
+  plugins: [react()],
 
   // Vite options tailored for Tauri development and only applied in `tauri dev` or `tauri build`
   //