diff --git a/.gitignore b/.gitignore
index e29814c..fa35967 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,15 +1,11 @@
dist/
.DS_Store
bun.lockb
-yarn.lock
-# Logs
logs
_.log
npm-debug.log_
-yarn-debug.log*
-yarn-error.log*
lerna-debug.log*
.pnpm-debug.log*
@@ -95,7 +91,6 @@ web_modules/
# Yarn Integrity file
-.yarn-integrity
# dotenv environment variable files
@@ -163,14 +158,6 @@ dist
.vscode-test
-# yarn v2
-
-.yarn/cache
-.yarn/unplugged
-.yarn/build-state.yml
-.yarn/install-state.gz
-.pnp.\*
-
.wrangler/
# Vercel
@@ -191,3 +178,5 @@ dist
# Keep example file
!.env.example
+
+package-lock.json
\ No newline at end of file
diff --git a/.npmrc b/.npmrc
new file mode 100644
index 0000000..78854da
--- /dev/null
+++ b/.npmrc
@@ -0,0 +1,3 @@
+legacy-peer-deps=true
+strict-peer-dependencies=false
+auto-install-peers=true
\ No newline at end of file
diff --git a/README.md b/README.md
index be5786b..af28b22 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,3 @@
A website.
-Do `bun i` and `bun dev`
+Do `npm i` and `npm run dev`
diff --git a/canvas-website.code-workspace b/canvas-website.code-workspace
deleted file mode 100644
index be8366e..0000000
--- a/canvas-website.code-workspace
+++ /dev/null
@@ -1,12 +0,0 @@
-{
- "folders": [
- {
- "path": "."
- },
- {
- "name": "jeffemmett.com",
- "path": "../jeffemmett.com"
- }
- ],
- "settings": {}
-}
\ No newline at end of file
diff --git a/package.json b/package.json
index a12f11e..6c188bc 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
"description": "Jeff Emmett's personal website",
"type": "module",
"scripts": {
- "dev": "concurrently --kill-others --names client,worker --prefix-colors blue,red \"yarn dev:client\" \"yarn dev:worker\"",
+ "dev": "concurrently --kill-others --names client,worker --prefix-colors blue,red \"bun dev:client\" \"bun dev:worker\"",
"dev:client": "vite --host --port 5173",
"dev:worker": "wrangler dev --local --port 5172 --ip 0.0.0.0",
"build": "tsc && vite build",
@@ -26,19 +26,18 @@
"gray-matter": "^4.0.3",
"itty-router": "^5.0.17",
"lodash.throttle": "^4.1.1",
- "react-error-boundary": "^4.1.2",
+ "react": "^18.2.0",
+ "react-dom": "^18.2.0",
"react-router-dom": "^7.0.2",
"tldraw": "^3.6.0",
- "vercel": "^39.1.1",
- "react": "^18.2.0",
- "react-dom": "^18.2.0"
+ "vercel": "^39.1.1"
},
"devDependencies": {
"@cloudflare/types": "^6.0.0",
"@cloudflare/workers-types": "^4.20240821.1",
"@types/lodash.throttle": "^4",
- "@types/react": "^18.2.0",
- "@types/react-dom": "^18.2.0",
+ "@types/react": "^19.0.1",
+ "@types/react-dom": "^19.0.1",
"@vitejs/plugin-react": "^4.0.3",
"@vitejs/plugin-react-swc": "^3.6.0",
"concurrently": "^9.1.0",
diff --git a/src/App.tsx b/src/App.tsx
index 29a2e29..7f55f75 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,95 +1,91 @@
-import { inject } from '@vercel/analytics';
-import "tldraw/tldraw.css";
+import { inject } from "@vercel/analytics"
+import "tldraw/tldraw.css"
import "@/css/style.css"
-import ReactDOM from "react-dom/client";
-import { Default } from "@/routes/Default";
-import { BrowserRouter, Route, Routes } from 'react-router-dom';
-import { Contact } from "@/routes/Contact";
-import { Board } from './routes/Board';
-import { Inbox } from './routes/Inbox';
-import {
- Editor,
- Tldraw,
- TLShapeId,
-} from 'tldraw';
-import { components, overrides } from './ui-overrides'
-import { ChatBoxShape } from './shapes/ChatBoxShapeUtil';
-import { VideoChatShape } from './shapes/VideoChatShapeUtil';
-import { ChatBoxTool } from './tools/ChatBoxTool';
-import { VideoChatTool } from './tools/VideoChatTool';
-import { EmbedTool } from './tools/EmbedTool';
-import { EmbedShape } from './shapes/EmbedShapeUtil';
+import { Default } from "@/routes/Default"
+import { BrowserRouter, Route, Routes } from "react-router-dom"
+import { Contact } from "@/routes/Contact"
+import { Board } from "./routes/Board"
+import { Inbox } from "./routes/Inbox"
+import { Editor, Tldraw, TLShapeId } from "tldraw"
+import { components, overrides } from "./ui-overrides"
+import { ChatBoxShape } from "./shapes/ChatBoxShapeUtil"
+import { VideoChatShape } from "./shapes/VideoChatShapeUtil"
+import { ChatBoxTool } from "./tools/ChatBoxTool"
+import { VideoChatTool } from "./tools/VideoChatTool"
+import { EmbedTool } from "./tools/EmbedTool"
+import { EmbedShape } from "./shapes/EmbedShapeUtil"
+import { createRoot } from "react-dom/client"
-inject();
+inject()
-const customShapeUtils = [ChatBoxShape, VideoChatShape, EmbedShape];
-const customTools = [ChatBoxTool, VideoChatTool, EmbedTool];
+const customShapeUtils = [ChatBoxShape, VideoChatShape, EmbedShape]
+const customTools = [ChatBoxTool, VideoChatTool, EmbedTool]
export default function InteractiveShapeExample() {
- return (
-
- {
- handleInitialShapeLoad(editor);
- editor.createShape({ type: 'my-interactive-shape', x: 100, y: 100 });
- }}
- />
-
- );
+ return (
+
+ {
+ handleInitialShapeLoad(editor)
+ editor.createShape({ type: "my-interactive-shape", x: 100, y: 100 })
+ }}
+ />
+
+ )
}
const handleInitialShapeLoad = (editor: Editor) => {
- const url = new URL(window.location.href);
- const shapeId = url.searchParams.get('shapeId') || url.searchParams.get('frameId');
- const x = url.searchParams.get('x');
- const y = url.searchParams.get('y');
- const zoom = url.searchParams.get('zoom');
+ const url = new URL(window.location.href)
+ const shapeId =
+ url.searchParams.get("shapeId") || url.searchParams.get("frameId")
+ const x = url.searchParams.get("x")
+ const y = url.searchParams.get("y")
+ const zoom = url.searchParams.get("zoom")
- if (shapeId) {
- console.log('Found shapeId in URL:', shapeId);
- const shape = editor.getShape(shapeId as TLShapeId);
+ if (shapeId) {
+ console.log("Found shapeId in URL:", shapeId)
+ const shape = editor.getShape(shapeId as TLShapeId)
- if (shape) {
- console.log('Found shape:', shape);
- if (x && y && zoom) {
- console.log('Setting camera to:', { x, y, zoom });
- editor.setCamera({
- x: parseFloat(x),
- y: parseFloat(y),
- z: parseFloat(zoom)
- });
- } else {
- console.log('Zooming to shape bounds');
- editor.zoomToBounds(editor.getShapeGeometry(shape).bounds, {
- targetZoom: 1,
- });
- }
- } else {
- console.warn('Shape not found in the editor');
- }
- } else {
- console.warn('No shapeId found in the URL');
- }
+ if (shape) {
+ console.log("Found shape:", shape)
+ if (x && y && zoom) {
+ console.log("Setting camera to:", { x, y, zoom })
+ editor.setCamera({
+ x: parseFloat(x),
+ y: parseFloat(y),
+ z: parseFloat(zoom),
+ })
+ } else {
+ console.log("Zooming to shape bounds")
+ editor.zoomToBounds(editor.getShapeGeometry(shape).bounds, {
+ targetZoom: 1,
+ })
+ }
+ } else {
+ console.warn("Shape not found in the editor")
+ }
+ } else {
+ console.warn("No shapeId found in the URL")
+ }
}
-ReactDOM.createRoot(document.getElementById("root")!).render();
+createRoot(document.getElementById("root")!).render()
function App() {
-
- return (
- //
-
-
- } />
- } />
- } />
- } />
-
-
- //
- );
-};
+ return (
+ //
+
+
+ } />
+ } />
+ } />
+ } />
+
+
+ //
+ )
+}
diff --git a/vercel.json b/vercel.json
index 5f5753c..659b950 100644
--- a/vercel.json
+++ b/vercel.json
@@ -1,6 +1,6 @@
{
- "buildCommand": "yarn build",
- "installCommand": "yarn install",
+ "buildCommand": "npm run build",
+ "installCommand": "npm install",
"framework": "vite",
"outputDirectory": "dist",
"rewrites": [
diff --git a/wrangler.toml b/wrangler.toml
index c6397bc..840cbbd 100644
--- a/wrangler.toml
+++ b/wrangler.toml
@@ -2,7 +2,6 @@ main = "worker/worker.ts"
compatibility_date = "2024-07-01"
name = "jeffemmett-canvas"
account_id = "0e7b3338d5278ed1b148e6456b940913"
-zone_id = "45c200f8dc2a01852e41b9bb09eb7359"
[vars]
# Environment variables are managed in Cloudflare Dashboard