fix: address code review feedback - add error handling and fix import style

Co-authored-by: ZimengXiong <83783148+ZimengXiong@users.noreply.github.com>

backend/package-lock.json

@@ -1164,6 +1164,7 @@
       "resolved": "https://registry.npmjs.org/@types/node/-/node-24.10.1.tgz",
       "integrity": "sha512-GNWcUTRBgIRJD5zj+Tq0fKOJ5XZajIiBroOF0yvj2bSU1WvNdYS/dn9UxwsujGW4JX06dnHyjV2y9rRaybH0iQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "undici-types": "~7.16.0"
       }
@@ -2654,6 +2655,7 @@
       "resolved": "https://registry.npmjs.org/express/-/express-5.2.0.tgz",
       "integrity": "sha512-XdpJDLxfztVY59X0zPI6sibRiGcxhTPXRD3IhJmjKf2jwMvkRGV1j7loB8U+heeamoU3XvihAaGRTR4aXXUN3A==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "accepts": "^2.0.0",
         "body-parser": "^2.2.1",
@@ -4088,6 +4090,7 @@
       "integrity": "sha512-vtpjW3XuYCSnMsNVBjLMNkTj6OZbudcPPTPYHqX0CJfpcdWciI1dM8uHETwmDxxiqEwCIE6WvXucWUetJgfu/A==",
       "hasInstallScript": true,
       "license": "Apache-2.0",
+      "peer": true,
       "dependencies": {
         "@prisma/engines": "5.22.0"
       },
@@ -5100,6 +5103,7 @@
       "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=12"
       },
@@ -5258,6 +5262,7 @@
       "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
       "dev": true,
       "license": "Apache-2.0",
+      "peer": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
@@ -5348,6 +5353,7 @@
       "integrity": "sha512-tI2l/nFHC5rLh7+5+o7QjKjSR04ivXDF4jcgV0f/bTQ+OJiITy5S6gaynVsEM+7RqzufMnVbIon6Sr5x1SDYaQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "esbuild": "^0.25.0",
         "fdir": "^6.5.0",
@@ -5441,6 +5447,7 @@
       "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=12"
       },

backend/src/__tests__/user-sandboxing.test.ts

@@ -0,0 +1,242 @@
+/**
+ * Security tests for user data sandboxing
+ *
+ * Verifies that:
+ * 1. Drawings cache keys are scoped by userId (prevents cross-user data leakage)
+ * 2. Drawing CRUD operations enforce userId filtering
+ * 3. Collection operations enforce userId filtering
+ */
+
+import { describe, it, expect, beforeAll, afterAll, beforeEach } from "vitest";
+import bcrypt from "bcrypt";
+import {
+  getTestPrisma,
+  cleanupTestDb,
+  setupTestDb,
+  createTestDrawingPayload,
+} from "./testUtils";
+import { PrismaClient } from "../generated/client";
+
+let prisma: PrismaClient;
+
+// These tests verify the data isolation logic at the database query level
+describe("User Data Sandboxing", () => {
+  let userA: { id: string; email: string };
+  let userB: { id: string; email: string };
+
+  beforeAll(async () => {
+    setupTestDb();
+    prisma = getTestPrisma();
+
+    // Create two test users
+    const hashA = await bcrypt.hash("passwordA", 10);
+    const hashB = await bcrypt.hash("passwordB", 10);
+
+    userA = await prisma.user.upsert({
+      where: { email: "usera@test.com" },
+      update: {},
+      create: {
+        email: "usera@test.com",
+        passwordHash: hashA,
+        name: "User A",
+      },
+    });
+
+    userB = await prisma.user.upsert({
+      where: { email: "userb@test.com" },
+      update: {},
+      create: {
+        email: "userb@test.com",
+        passwordHash: hashB,
+        name: "User B",
+      },
+    });
+  });
+
+  afterAll(async () => {
+    await prisma.$disconnect();
+  });
+
+  beforeEach(async () => {
+    await prisma.drawing.deleteMany({});
+    await prisma.collection.deleteMany({});
+  });
+
+  describe("Drawing isolation", () => {
+    it("should not return User A's drawings when querying as User B", async () => {
+      // Create a drawing for User A
+      await prisma.drawing.create({
+        data: {
+          name: "User A Drawing",
+          elements: "[]",
+          appState: "{}",
+          userId: userA.id,
+        },
+      });
+
+      // Query as User B - should get 0 results
+      const userBDrawings = await prisma.drawing.findMany({
+        where: { userId: userB.id },
+      });
+
+      expect(userBDrawings).toHaveLength(0);
+    });
+
+    it("should only return the owning user's drawings", async () => {
+      // Create drawings for both users
+      await prisma.drawing.create({
+        data: {
+          name: "User A Drawing",
+          elements: "[]",
+          appState: "{}",
+          userId: userA.id,
+        },
+      });
+
+      await prisma.drawing.create({
+        data: {
+          name: "User B Drawing",
+          elements: "[]",
+          appState: "{}",
+          userId: userB.id,
+        },
+      });
+
+      const userADrawings = await prisma.drawing.findMany({
+        where: { userId: userA.id },
+      });
+      const userBDrawings = await prisma.drawing.findMany({
+        where: { userId: userB.id },
+      });
+
+      expect(userADrawings).toHaveLength(1);
+      expect(userADrawings[0].name).toBe("User A Drawing");
+
+      expect(userBDrawings).toHaveLength(1);
+      expect(userBDrawings[0].name).toBe("User B Drawing");
+    });
+
+    it("should not allow User B to access User A's drawing by ID", async () => {
+      const drawing = await prisma.drawing.create({
+        data: {
+          name: "User A Secret Drawing",
+          elements: "[]",
+          appState: "{}",
+          userId: userA.id,
+        },
+      });
+
+      // Simulate the findFirst query used in GET /drawings/:id
+      const result = await prisma.drawing.findFirst({
+        where: {
+          id: drawing.id,
+          userId: userB.id, // User B trying to access
+        },
+      });
+
+      expect(result).toBeNull();
+    });
+  });
+
+  describe("Collection isolation", () => {
+    it("should not return User A's collections when querying as User B", async () => {
+      await prisma.collection.create({
+        data: {
+          name: "User A Collection",
+          userId: userA.id,
+        },
+      });
+
+      const userBCollections = await prisma.collection.findMany({
+        where: { userId: userB.id },
+      });
+
+      expect(userBCollections).toHaveLength(0);
+    });
+
+    it("should not allow User B to modify User A's collection", async () => {
+      const collection = await prisma.collection.create({
+        data: {
+          name: "User A Collection",
+          userId: userA.id,
+        },
+      });
+
+      // Simulate the findFirst query used in PUT /collections/:id
+      const result = await prisma.collection.findFirst({
+        where: {
+          id: collection.id,
+          userId: userB.id,
+        },
+      });
+
+      expect(result).toBeNull();
+    });
+  });
+
+  describe("Cache key user scoping", () => {
+    it("should generate different cache keys for different users with same query params", () => {
+      // This tests the buildDrawingsCacheKey function logic inline
+      // The function was updated to include userId in the cache key
+      const buildDrawingsCacheKey = (keyParts: {
+        userId: string;
+        searchTerm: string;
+        collectionFilter: string;
+        includeData: boolean;
+      }) =>
+        JSON.stringify([
+          keyParts.userId,
+          keyParts.searchTerm,
+          keyParts.collectionFilter,
+          keyParts.includeData ? "full" : "summary",
+        ]);
+
+      const keyA = buildDrawingsCacheKey({
+        userId: "user-a-id",
+        searchTerm: "",
+        collectionFilter: "default",
+        includeData: false,
+      });
+
+      const keyB = buildDrawingsCacheKey({
+        userId: "user-b-id",
+        searchTerm: "",
+        collectionFilter: "default",
+        includeData: false,
+      });
+
+      expect(keyA).not.toBe(keyB);
+    });
+
+    it("should generate same cache key for same user with same query params", () => {
+      const buildDrawingsCacheKey = (keyParts: {
+        userId: string;
+        searchTerm: string;
+        collectionFilter: string;
+        includeData: boolean;
+      }) =>
+        JSON.stringify([
+          keyParts.userId,
+          keyParts.searchTerm,
+          keyParts.collectionFilter,
+          keyParts.includeData ? "full" : "summary",
+        ]);
+
+      const key1 = buildDrawingsCacheKey({
+        userId: "same-user",
+        searchTerm: "test",
+        collectionFilter: "default",
+        includeData: true,
+      });
+
+      const key2 = buildDrawingsCacheKey({
+        userId: "same-user",
+        searchTerm: "test",
+        collectionFilter: "default",
+        includeData: true,
+      });
+
+      expect(key1).toBe(key2);
+    });
+  });
+});

backend/src/index.ts

@@ -26,6 +26,7 @@ import {
   getCsrfTokenHeader,
   getOriginFromReferer,
 } from "./security";
+import jwt from "jsonwebtoken";
 import { config } from "./config";
 import { requireAuth } from "./middleware/auth";
 import { errorHandler, asyncHandler } from "./middleware/errorHandler";
@@ -176,11 +177,13 @@ type DrawingsCacheEntry = { body: Buffer; expiresAt: number };
 const drawingsCache = new Map<string, DrawingsCacheEntry>();
 
 const buildDrawingsCacheKey = (keyParts: {
+  userId: string;
   searchTerm: string;
   collectionFilter: string;
   includeData: boolean;
 }) =>
   JSON.stringify([
+    keyParts.userId,
     keyParts.searchTerm,
     keyParts.collectionFilter,
     keyParts.includeData ? "full" : "summary",
@@ -721,16 +724,93 @@ interface User {
 
 const roomUsers = new Map<string, User[]>();
 
+// Track which authenticated user owns each socket for authorization checks
+const socketUserMap = new Map<string, string>();
+
+/**
+ * Verify JWT from Socket.io auth and check if auth is required.
+ * When auth is disabled (single-user mode), all connections are allowed.
+ */
+const getSocketAuthUserId = async (token?: string): Promise<string | null> => {
+  // Check if auth is enabled
+  const systemConfig = await prisma.systemConfig.findUnique({
+    where: { id: "default" },
+    select: { authEnabled: true },
+  });
+
+  if (!systemConfig || !systemConfig.authEnabled) {
+    // Auth disabled: allow all connections (single-user / bootstrap mode)
+    return "bootstrap-admin";
+  }
+
+  // Auth enabled: require valid JWT
+  if (!token) return null;
+
+  try {
+    const decoded = jwt.verify(token, config.jwtSecret) as Record<string, unknown>;
+    if (
+      typeof decoded.userId !== "string" ||
+      typeof decoded.email !== "string" ||
+      decoded.type !== "access"
+    ) {
+      return null;
+    }
+
+    // Verify user is still active
+    const user = await prisma.user.findUnique({
+      where: { id: decoded.userId },
+      select: { id: true, isActive: true },
+    });
+
+    if (!user || !user.isActive) return null;
+    return user.id;
+  } catch {
+    return null;
+  }
+};
+
+io.use(async (socket, next) => {
+  try {
+    const token = socket.handshake.auth?.token as string | undefined;
+    const userId = await getSocketAuthUserId(token);
+
+    if (!userId) {
+      return next(new Error("Authentication required"));
+    }
+
+    socketUserMap.set(socket.id, userId);
+    next();
+  } catch {
+    next(new Error("Authentication failed"));
+  }
+});
+
 io.on("connection", (socket) => {
+  const authenticatedUserId = socketUserMap.get(socket.id);
+
   socket.on(
     "join-room",
-    ({
+    async ({
       drawingId,
       user,
     }: {
       drawingId: string;
       user: Omit<User, "socketId" | "isActive">;
     }) => {
+      try {
+        // Verify the authenticated user owns this drawing
+        if (authenticatedUserId) {
+          const drawing = await prisma.drawing.findFirst({
+            where: { id: drawingId, userId: authenticatedUserId },
+            select: { id: true },
+          });
+
+          if (!drawing) {
+            socket.emit("error", { message: "Drawing not found or access denied" });
+            return;
+          }
+        }
+
         const roomId = `drawing_${drawingId}`;
         socket.join(roomId);
 
@@ -742,6 +822,10 @@ io.on("connection", (socket) => {
         roomUsers.set(roomId, filteredUsers);
 
         io.to(roomId).emit("presence-update", filteredUsers);
+      } catch (err) {
+        console.error("Error in join-room handler:", err);
+        socket.emit("error", { message: "Failed to join room" });
+      }
     }
   );
 
@@ -771,6 +855,7 @@ io.on("connection", (socket) => {
   );
 
   socket.on("disconnect", () => {
+    socketUserMap.delete(socket.id);
     roomUsers.forEach((users, roomId) => {
       const index = users.findIndex((u) => u.socketId === socket.id);
       if (index !== -1) {
@@ -840,6 +925,7 @@ app.get("/drawings", requireAuth, asyncHandler(async (req, res, next) => {
         : false;
 
     const cacheKey = buildDrawingsCacheKey({
+      userId: req.user.id,
       searchTerm: searchTerm ?? "",
       collectionFilter: collectionFilterKey,
       includeData: shouldIncludeData,

frontend/package-lock.json

@@ -162,6 +162,7 @@
       "integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.27.1",
         "@babel/generator": "^7.28.5",
@@ -516,6 +517,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=18"
       },
@@ -559,6 +561,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=18"
       }
@@ -2609,8 +2612,7 @@
       "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz",
       "integrity": "sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/@types/babel__core": {
       "version": "7.20.5",
@@ -2775,6 +2777,7 @@
       "integrity": "sha512-V0kuGBX3+prX+DQ/7r2qsv1NsdfnCLnTgnRJ1pYnxykBhGMz+qj+box5lq7XsO5mtZsBqpjwwTu/7wszPfMBcw==",
       "devOptional": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/prop-types": "*",
         "csstype": "^3.0.2"
@@ -2786,6 +2789,7 @@
       "integrity": "sha512-qW1Mfv8taImTthu4KoXgDfLuk4bydU6Q/TkADnDWWHwi4NX4BR+LWfTp2sVmTqRrsHvyDDTelgelxJ+SsejKKQ==",
       "devOptional": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/react": "*"
       }
@@ -2856,6 +2860,7 @@
       "integrity": "sha512-lJi3PfxVmo0AkEY93ecfN+r8SofEqZNGByvHAI3GBLrvt1Cw6H5k1IM02nSzu0RfUafr2EvFSw0wAsZgubNplQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@typescript-eslint/scope-manager": "8.47.0",
         "@typescript-eslint/types": "8.47.0",
@@ -3219,6 +3224,7 @@
       "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -3269,7 +3275,6 @@
       "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=8"
       }
@@ -3499,6 +3504,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "baseline-browser-mapping": "^2.8.25",
         "caniuse-lite": "^1.0.30001754",
@@ -3834,6 +3840,7 @@
       "resolved": "https://registry.npmjs.org/cytoscape/-/cytoscape-3.33.1.tgz",
       "integrity": "sha512-iJc4TwyANnOGR1OmWhsS9ayRS3s+XQ185FmuHObThD+5AeJCakAAbWv8KimMTt08xCCLNgneQwFp+JRJOr9qGQ==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=0.10"
       }
@@ -4207,6 +4214,7 @@
       "resolved": "https://registry.npmjs.org/d3-selection/-/d3-selection-3.0.0.tgz",
       "integrity": "sha512-fmTRWbNMmsmWq6xJV8D19U/gw/bwrHfNXxrIN+HfZgnzqTHp9jOmKMhsTUjXOJnZOdZY9Q28y4yebKzqDKlxlQ==",
       "license": "ISC",
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -4446,8 +4454,7 @@
       "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz",
       "integrity": "sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/dompurify": {
       "version": "3.1.6",
@@ -4666,6 +4673,7 @@
       "integrity": "sha512-BhHmn2yNOFA9H9JmmIVKJmd288g9hrVRDkdoIgRCRuSySRUHH7r/DI6aAXW9T1WwUuY3DFgrcaqB+deURBLR5g==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.8.0",
         "@eslint-community/regexpp": "^4.12.1",
@@ -5499,6 +5507,7 @@
       "resolved": "https://registry.npmjs.org/jotai/-/jotai-2.11.0.tgz",
       "integrity": "sha512-zKfoBBD1uDw3rljwHkt0fWuja1B76R7CjznuBO+mSX6jpsO1EBeWNRKpeaQho9yPI/pvCv4recGfgOXGxwPZvQ==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=12.20.0"
       },
@@ -5846,7 +5855,6 @@
       "integrity": "sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "bin": {
         "lz-string": "bin/bin.js"
       }
@@ -6876,6 +6884,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "nanoid": "^3.3.7",
         "picocolors": "^1.0.0",
@@ -7041,7 +7050,6 @@
       "integrity": "sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "ansi-regex": "^5.0.1",
         "ansi-styles": "^5.0.0",
@@ -7057,7 +7065,6 @@
       "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=10"
       },
@@ -7113,6 +7120,7 @@
       "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
       "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "loose-envify": "^1.1.0"
       },
@@ -7125,6 +7133,7 @@
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
       "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "loose-envify": "^1.1.0",
         "scheduler": "^0.23.2"
@@ -7138,8 +7147,7 @@
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
       "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/react-refresh": {
       "version": "0.18.0",
@@ -7854,6 +7862,7 @@
       "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=12"
       },
@@ -7992,6 +8001,7 @@
       "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
       "dev": true,
       "license": "Apache-2.0",
+      "peer": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
@@ -8181,6 +8191,7 @@
       "integrity": "sha512-BxAKBWmIbrDgrokdGZH1IgkIk/5mMHDreLDmCJ0qpyJaAteP8NvMhkwr/ZCQNqNH97bw/dANTE9PDzqwJghfMQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "esbuild": "^0.25.0",
         "fdir": "^6.5.0",
@@ -8274,6 +8285,7 @@
       "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=12"
       },
@@ -8600,6 +8612,7 @@
       "integrity": "sha512-JInaHOamG8pt5+Ey8kGmdcAcg3OL9reK8ltczgHTAwNhMys/6ThXHityHxVV2p3fkw/c+MAvBHFVYHFZDmjMCQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "funding": {
         "url": "https://github.com/sponsors/colinhacks"
       }

frontend/src/pages/Editor.tsx

@@ -267,9 +267,11 @@ export const Editor: React.FC = () => {
       ? window.location.origin
       : (import.meta.env.VITE_API_URL || 'http://localhost:8000');
 
+    const authToken = localStorage.getItem('excalidash-access-token');
     const socket = io(socketUrl, {
       path: '/socket.io',
       transports: ['websocket', 'polling'],
+      auth: authToken ? { token: authToken } : {},
     });
     socketRef.current = socket;