Optimize shot table loading performance

- Pass episode_id filter to backend API instead of client-side filtering,
  reducing payload size when an episode is selected
- Skip getShot refetch in ShotDetailPanel when initialShot prop is provided
- Fix redundant DB query in list_shots: read project.custom_task_statuses
  directly from the already-fetched project object
- Add missing indexes on Task.shot_id, Task.assigned_user_id,
  Task.deleted_at and Episode.project_id; add add_perf_indexes.py
  migration script to apply them to existing databases
- Center login page layout
- Update CLAUDE.md and AGENTS.md with correct venv path

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

AGENTS.md

@@ -33,9 +33,11 @@ LinkDesk is a VFX/animation production management system: FastAPI backend + Vue
 
 ### Backend
 ```bash
+# venv lives at repo root, not inside backend/
 cd backend
-# Windows: .venv\Scripts\activate  |  bash/mac: source .venv/bin/activate
+..\venv\Scripts\activate   # Windows PowerShell
 uvicorn main:app --reload --port 8000
+# or invoke directly: D:\Repo\LinkDesk\.venv\Scripts\uvicorn.exe main:app --reload --port 8000
 ```
 
 ### Frontend

CLAUDE.md

@@ -34,9 +34,11 @@ LinkDesk is a VFX/animation production management system. It has a FastAPI backe
 
 ### Backend
 ```bash
+# venv is at repo root, not inside backend/
 cd backend
-# Activate venv first (Windows)
+..\venv\Scripts\activate        # Windows PowerShell
-.venv\Scripts\activate   # or: source .venv/bin/activate on bash
+# or run directly:
+# D:\Repo\LinkDesk\.venv\Scripts\uvicorn.exe main:app --reload --port 8000
 uvicorn main:app --reload --port 8000
 ```
 

backend/add_perf_indexes.py

@@ -0,0 +1,18 @@
+"""One-time migration: add performance indexes for shot table queries."""
+from sqlalchemy import text
+from database import engine
+
+indexes = [
+    "CREATE INDEX IF NOT EXISTS ix_tasks_shot_id ON tasks (shot_id)",
+    "CREATE INDEX IF NOT EXISTS ix_tasks_assigned_user_id ON tasks (assigned_user_id)",
+    "CREATE INDEX IF NOT EXISTS ix_tasks_deleted_at ON tasks (deleted_at)",
+    "CREATE INDEX IF NOT EXISTS ix_episodes_project_id ON episodes (project_id)",
+]
+
+with engine.connect() as conn:
+    for sql in indexes:
+        conn.execute(text(sql))
+        print(f"OK: {sql}")
+    conn.commit()
+
+print("Done.")

backend/models/episode.py

@@ -17,7 +17,7 @@ class Episode(Base):
     __tablename__ = "episodes"
 
     id = Column(Integer, primary_key=True, index=True)
-    project_id = Column(Integer, ForeignKey("projects.id"), nullable=False)
+    project_id = Column(Integer, ForeignKey("projects.id"), nullable=False, index=True)
     name = Column(String, nullable=False, index=True)
     description = Column(String)
     episode_number = Column(Integer, nullable=False)

backend/models/task.py

@@ -44,9 +44,9 @@ class Task(Base):
     id = Column(Integer, primary_key=True, index=True)
     project_id = Column(Integer, ForeignKey("projects.id"), nullable=False)
     episode_id = Column(Integer, ForeignKey("episodes.id"), nullable=True)
-    shot_id = Column(Integer, ForeignKey("shots.id"), nullable=True)
+    shot_id = Column(Integer, ForeignKey("shots.id"), nullable=True, index=True)
     asset_id = Column(Integer, ForeignKey("assets.id"), nullable=True)
-    assigned_user_id = Column(Integer, ForeignKey("users.id"), nullable=True)
+    assigned_user_id = Column(Integer, ForeignKey("users.id"), nullable=True, index=True)
     task_type = Column(String, nullable=False)  # Changed from Enum to String to support custom task types
     name = Column(String, nullable=False, index=True)
     description = Column(Text)
@@ -56,7 +56,7 @@ class Task(Base):
     updated_at = Column(DateTime(timezone=True), server_default=func.now(), onupdate=func.now())
     
     # Soft deletion columns
-    deleted_at = Column(DateTime(timezone=True), nullable=True)
+    deleted_at = Column(DateTime(timezone=True), nullable=True, index=True)
     deleted_by = Column(Integer, ForeignKey("users.id"), nullable=True)
 
     # Relationships

backend/routers/shots.py

@@ -266,9 +266,17 @@ async def list_shots(
         )
         for project in projects:
             custom_types = project.custom_shot_task_types or []
+            raw = project.custom_task_statuses
+            if isinstance(raw, str):
+                try:
+                    import json
+                    raw = json.loads(raw)
+                except (json.JSONDecodeError, TypeError):
+                    raw = []
+            custom_statuses = raw if isinstance(raw, list) else []
             project_data[project.id] = {
                 'task_types': STANDARD_SHOT_TASK_TYPES + custom_types,
-                'custom_statuses': get_project_custom_statuses(project.id, db)
+                'custom_statuses': custom_statuses
             }
     
     # OPTIMIZATION: Group results by shot and aggregate task data efficiently
@@ -606,6 +614,58 @@ async def get_shot(
     shot_data = ShotResponse.model_validate(shot)
     shot_data.task_count = task_count
     
+    # Add project_name from episode.project (already eager loaded)
+    if shot.episode and shot.episode.project:
+        shot_data.project_name = shot.episode.project.name
+    
+    # Add task status information (similar to list endpoint)
+    project = shot.episode.project if shot.episode else None
+    
+    # Get all task types: standard + custom
+    from routers.shots import STANDARD_SHOT_TASK_TYPES
+    project_task_types = list(STANDARD_SHOT_TASK_TYPES)  # Start with standard types
+    
+    if project and project.custom_shot_task_types:
+        custom_types = project.custom_shot_task_types or []
+        if isinstance(custom_types, list):
+            for ct in custom_types:
+                if isinstance(ct, dict) and 'type' in ct:
+                    project_task_types.append(ct['type'])
+                elif isinstance(ct, str):
+                    project_task_types.append(ct)
+    
+    # Initialize task_status and task_ids dictionaries
+    task_status_dict = {}
+    task_ids_dict = {}
+    task_details_list = []
+    
+    # Initialize with default not_started for all project task types
+    for task_type_init in project_task_types:
+        task_status_dict[task_type_init] = "not_started"
+    
+    # Build task information from active tasks
+    for task in active_tasks:
+        task_type = task.task_type.value if hasattr(task.task_type, 'value') else task.task_type
+        task_status = task.status.value if hasattr(task.status, 'value') else task.status
+        task_id = task.id
+        assigned_user_id = task.assigned_user_id
+        
+        # Update task status
+        task_status_dict[task_type] = task_status
+        task_ids_dict[task_type] = task_id
+        
+        # Add to task details
+        task_details_list.append(TaskStatusInfo(
+            task_type=task_type,
+            status=task_status,
+            task_id=task_id,
+            assigned_user_id=assigned_user_id
+        ))
+    
+    shot_data.task_status = task_status_dict
+    shot_data.task_ids = task_ids_dict
+    shot_data.task_details = task_details_list
+    
     return shot_data
 
 

backend/schemas/shot.py

@@ -28,6 +28,14 @@ class ShotUpdate(BaseModel):
     project_id: Optional[int] = Field(None, description="Project ID - must match episode's project")
 
 
+class TaskStatusInfo(BaseModel):
+    """Task status information for table display"""
+    task_type: str  # String to support custom task types
+    status: str  # Changed from TaskStatus enum to str to support custom statuses
+    task_id: Optional[int] = None
+    assigned_user_id: Optional[int] = None
+
+
 class ShotResponse(ShotBase):
     id: int
     project_id: int  # Make required in response
@@ -40,19 +48,16 @@ class ShotResponse(ShotBase):
     
     # Optional computed field for display
     project_name: Optional[str] = Field(None, description="Project name for display purposes")
+    
+    # Task status information for detail display
+    task_status: Dict[str, Optional[str]] = Field(default_factory=dict, description="Task status by task type")
+    task_ids: Dict[str, int] = Field(default_factory=dict, description="Task IDs by task type")
+    task_details: List[TaskStatusInfo] = Field(default_factory=list, description="Detailed task information")
 
     class Config:
         from_attributes = True
 
 
-class TaskStatusInfo(BaseModel):
-    """Task status information for table display"""
-    task_type: str  # String to support custom task types
-    status: str  # Changed from TaskStatus enum to str to support custom statuses
-    task_id: Optional[int] = None
-    assigned_user_id: Optional[int] = None
-
-
 class ShotListResponse(BaseModel):
     id: int
     name: str

frontend/src/components/layout/AppSidebar.vue

@@ -138,7 +138,7 @@ const isCollapsed = computed(() => state.value === 'collapsed')
 
 // Check if on shot page - show column switch only on shot pages
 const isOnShotPage = computed(() => {
-  return route.path.includes('/shots') || route.path.includes('/project/')
+  return route.path.endsWith('/shots') || route.path.includes('/project/')
 })
 
 const props = withDefaults(defineProps<SidebarProps>(), {

frontend/src/components/shot/ShotBrowser.vue

@@ -152,6 +152,7 @@
         @update:column-visibility="handleColumnVisibilityChange"
         @update:rowSelection="handleRowSelectionChange"
         @row-click="handleRowClick"
+        @row-dblclick="handleRowDoubleClick"
       />
     </div>
     </div>
@@ -172,6 +173,7 @@
         <ShotDetailPanel
           :project-id="projectId"
           :shot-id="selectedShot.id"
+          :initial-shot="selectedShot"
           @edit="editShot"
           @delete="deleteShot"
           @create-task="handleCreateTask"
@@ -189,6 +191,7 @@
         v-if="selectedShot"
         :project-id="projectId"
         :shot-id="selectedShot.id"
+        :initial-shot="selectedShot"
         @edit="editShot"
         @delete="deleteShot"
         @create-task="handleCreateTask"
@@ -278,6 +281,7 @@
 
 <script setup lang="ts">
 import { ref, computed, watch, shallowRef, markRaw, nextTick, onMounted } from 'vue'
+import { useRouter } from 'vue-router'
 import { 
   Search, Plus, Camera, AlertCircle, RefreshCw,
   Layers, MoreHorizontal, Edit, ListTodo, Trash2
@@ -336,6 +340,7 @@ interface Props {
 const props = defineProps<Props>()
 
 // Composables
+const router = useRouter()
 const { toast } = useToast()
 const taskStatusesStore = useTaskStatusesStore()
 
@@ -355,6 +360,13 @@ const {
   sessionStorageKey: 'shotBrowser.detailPanelEnabled'
 })
 
+// Handle double-click to navigate to shot detail page
+const handleRowDoubleClick = (shot: Shot) => {
+  if (props.projectId) {
+    router.push(`/projects/${props.projectId}/shots/${shot.id}`)
+  }
+}
+
 // Reactive state
 const shots = ref<Shot[]>([])
 const isLoading = ref(false)
@@ -430,7 +442,10 @@ const loadShots = async () => {
     if (taskStatusFilter.value) {
       options.taskStatusFilter = taskStatusFilter.value
     }
-    
+    if (episodeFilter.value !== null) {
+      options.episodeId = episodeFilter.value
+    }
+
     const data = await shotService.getShots(options)
     shots.value = data
   } catch (err) {
@@ -524,6 +539,7 @@ const clearValidationError = () => {
 
 const handleEpisodeFilterChange = (episodeId: number | null) => {
   episodeFilter.value = episodeId
+  loadShots()
 }
 
 const handleTaskStatusFilter = (filter: string) => {

frontend/src/components/shot/ShotDetailPanel.vue

@@ -301,6 +301,7 @@ interface Task extends TaskStatusInfo {
 interface Props {
   projectId: number
   shotId: number
+  initialShot?: Shot
 }
 
 interface Emits {
@@ -387,7 +388,7 @@ const loadShotDetails = async () => {
   try {
     isLoading.value = true
     error.value = null
-    shot.value = await shotService.getShot(props.shotId)
+    shot.value = props.initialShot ?? await shotService.getShot(props.shotId)
     loadTasks() // No longer async - uses embedded data
   } catch (err) {
     error.value = err instanceof Error ? err.message : 'Failed to load shot details'

frontend/src/router/index.ts

@@ -64,7 +64,7 @@ const routes: RouteRecordRaw[] = [
         path: 'shots/:shotId',
         name: 'ShotDetail',
         component: () => import('@/views/project/ShotDetailView.vue'),
-        meta: { requiresAuth: true }
+        meta: { requiresAuth: true, tab: 'shots', tabLabel: 'Shots' }
       },
       {
         path: 'assets',

frontend/src/services/breadcrumb.ts

@@ -1,6 +1,7 @@
 import type { RouteLocationNormalized } from 'vue-router'
 import { useProjectsStore } from '@/stores/projects'
 import { episodeService } from '@/services/episode'
+import { shotService } from '@/services/shot'
 
 export interface BreadcrumbItem {
   label: string
@@ -73,6 +74,30 @@ export class BreadcrumbService {
             })
           }
         }
+        
+        // Handle shot detail page (path: /projects/:projectId/shots/:shotId)
+        if (pathSegments[2] === 'shots' && pathSegments[3]) {
+          const shotId = parseInt(pathSegments[3])
+          if (!isNaN(shotId)) {
+            try {
+              const shot = await shotService.getShot(shotId)
+              // Replace the last item (Shots) with Shots > ShotName
+              if (crumbs.length > 1) {
+                crumbs[crumbs.length - 1] = {
+                  label: 'Shots',
+                  href: `/projects/${projectId}/shots`
+                }
+              }
+              crumbs.push({
+                label: shot.name,
+                isActive: true
+              })
+            } catch (error) {
+              console.error('Failed to load shot for breadcrumbs:', error)
+              // Keep the default behavior - show shot ID
+            }
+          }
+        }
       }
     } else {
       // Handle other routes

frontend/src/views/auth/LoginView.vue

@@ -1,7 +1,6 @@
 <template>
-  <div class="min-h-screen w-full lg:grid lg:grid-cols-2">
+  <div class="min-h-screen w-full flex items-center justify-center">
-    <!-- Left side - Login Form -->
+    <div class="flex items-center justify-center py-12 w-full">
-    <div class="flex items-center justify-center py-12">
       <div class="mx-auto grid w-[350px] gap-6">
         <div class="grid gap-2 text-center">
           <h1 class="text-3xl font-bold">Login</h1>
@@ -67,64 +66,6 @@
         </div>
       </div>
     </div>
-    
-    <!-- Right side - Image/Illustration -->
-    <div class="hidden bg-muted lg:block">
-      <div class="flex h-full items-center justify-center p-10">
-        <div class="max-w-md text-center">
-          <div class="mb-8">
-            <!-- VFX Project Management Logo/Icon -->
-            <div class="mx-auto mb-4 flex h-20 w-20 items-center justify-center rounded-full bg-primary">
-              <svg class="h-10 w-10 text-primary-foreground" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z"/>
-              </svg>
-            </div>
-            <h2 class="text-2xl font-bold">VFX Project Management</h2>
-            <p class="mt-2 text-muted-foreground">
-              Streamline your animation and VFX production workflow
-            </p>
-          </div>
-          
-          <div class="space-y-4 text-left">
-            <div class="flex items-center space-x-3">
-              <div class="flex h-8 w-8 items-center justify-center rounded-full bg-primary/10">
-                <svg class="h-4 w-4 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/>
-                </svg>
-              </div>
-              <span class="text-sm">Project & Task Management</span>
-            </div>
-            
-            <div class="flex items-center space-x-3">
-              <div class="flex h-8 w-8 items-center justify-center rounded-full bg-primary/10">
-                <svg class="h-4 w-4 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"/>
-                </svg>
-              </div>
-              <span class="text-sm">Team Collaboration</span>
-            </div>
-            
-            <div class="flex items-center space-x-3">
-              <div class="flex h-8 w-8 items-center justify-center rounded-full bg-primary/10">
-                <svg class="h-4 w-4 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"/>
-                </svg>
-              </div>
-              <span class="text-sm">Progress Tracking</span>
-            </div>
-            
-            <div class="flex items-center space-x-3">
-              <div class="flex h-8 w-8 items-center justify-center rounded-full bg-primary/10">
-                <svg class="h-4 w-4 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"/>
-                </svg>
-              </div>
-              <span class="text-sm">Secure File Management</span>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
   </div>
 </template>