application [wireframe-renderer-web] view page [pages/index] development

apps/wireframe-renderer-web/src/pages/canvas.tsx

@@ -1,4 +1,5 @@
 import { useState, useRef, useEffect } from "react";
+import { useSearchParams } from "react-router-dom";
 import { Button } from "@/components/ui/button";
 import { Textarea } from "@/components/ui/textarea";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
@@ -24,6 +25,7 @@ interface DrawingElement {
 }
 
 export default function CanvasPage() {
+  const [searchParams] = useSearchParams();
   const canvasRef = useRef<HTMLCanvasElement>(null);
   const [tool, setTool] = useState<Tool>("pen");
   const [isDrawing, setIsDrawing] = useState(false);
@@ -198,6 +200,8 @@ export default function CanvasPage() {
       const user = await auth.currentUser();
       if (!user) return;
 
+      const projectIdFromUrl = searchParams.get("projectId");
+
       // Load projects
       const { data: userProjects } = await entities
         .from("nvwa_project")
@@ -206,8 +210,14 @@ export default function CanvasPage() {
 
       if (userProjects && userProjects.length > 0) {
         setProjects(userProjects);
-        // Use first project or create new one
-        const project = userProjects[0];
+        // Use specified project or first one
+        let project;
+        if (projectIdFromUrl) {
+          project = userProjects.find(p => p.id === parseInt(projectIdFromUrl));
+        }
+        if (!project) {
+          project = userProjects[0];
+        }
         setCurrentProject(project);
 
         // Load latest wireframe for this project
@@ -230,7 +240,7 @@ export default function CanvasPage() {
           }
         }
       } else {
-        // Create default project
+        // Create default project if no projects exist
         const { data: newProject } = await entities
           .from("nvwa_project")
           .insert({