# Implementation Plan - [x] 1. Set up project structure and development environment - Create backend directory structure with FastAPI application - Set up frontend directory structure with Vue.js and Vite - Configure development environment with proper dependencies - Set up database configuration with SQLAlchemy and SQLite - _Requirements: 8.1, 8.2, 8.3_ - [x] 2. Implement core database models and relationships - [x] 2.1 Create User model with authentication fields - Implement User model with functional role and approval status - Add independent admin permission field (is_admin boolean) - Add password hashing utilities with bcrypt - _Requirements: 1.1, 1.2, 1.4, 12.1_ - [x] 2.2 Create Project and Episode models - Implement Project model with basic project information - Create Episode model with project relationship - _Requirements: 2.1, 2.2_ - [x] 2.3 Create Asset and Shot models - Implement Asset model with category classification - Create Shot model with episode relationship and frame information - _Requirements: 2.2, 2.3, 2.4_ - [x] 2.4 Create Task and related models - Implement Task model with shot/asset relationships - Create Submission model for work uploads - Add Review model for approval workflow - Create ProductionNote model with threading support - Add TaskAttachment model for file attachments - _Requirements: 2.5, 2.6, 3.1, 4.1, 5.1_ - [x] 3. Implement authentication and user management backend - [x] 3.1 Create JWT authentication system - Implement JWT token generation and validation - Add refresh token mechanism - Create authentication middleware - _Requirements: 1.1, 7.4_ - [x] 3.2 Implement user registration and approval workflow - Create user registration endpoint - Add admin permission approval functionality - Implement functional role assignment system - _Requirements: 1.2, 1.3, 1.5_ - [x] 3.3 Create user management API endpoints - Implement user CRUD operations - Add role-based and admin permission checking - Create user profile endpoints - Add admin permission management endpoints - _Requirements: 1.3, 1.4, 1.5, 12.1, 12.2, 12.3_ - [x] 3.4 Update database schema for admin permission separation - Add is_admin boolean field to User model - Remove ADMIN from UserRole enum, keeping only functional roles - Create database migration script for existing admin users - Update authentication middleware to check admin permission separately - _Requirements: 12.1, 12.4, 12.5_ - [x] 4. Implement project and episode management backend - [x] 4.1 Create project management API endpoints - Implement project CRUD operations - Add project member management - Create department role assignment for project members - _Requirements: 2.1, 8.5, 8.6_ - [x] 4.3 Add technical specifications to project model and API - Extend Project model with technical specification fields (frame_rate, data_drive_path, publish_storage_path, delivery_image_resolution, delivery_movie_specs_by_department) - Update project creation and update endpoints to handle technical specifications - Add validation for frame rate (1-120 fps), resolution formats, and movie specifications - Create technical specifications management endpoints - Add default delivery movie specifications per department (layout, animation, lighting, composite) - _Requirements: 13.1, 13.2, 13.3, 13.4, 13.5, 13.6, 13.7, 15.1, 15.2, 15.3, 15.4, 15.5, 15.6_ - [ ] 4.4 Implement global settings system for upload limit - Create GlobalSettings model for site-wide configuration storage - Add global upload size limit setting with default value (1GB) for movie files - Add global settings API endpoints for admin configuration - Create upload size validation middleware using global limit - Add settings initialization with default upload limit - _Requirements: 16.1, 16.2, 16.3, 16.4, 16.5, 16.6_ - [x] 4.2 Create episode management API endpoints - Implement episode CRUD operations within projects - Add episode ordering and organization - _Requirements: 2.1, 2.2_ - [x] 5. Implement asset and shot management backend - [x] 5.1 Create asset management API endpoints - Implement asset CRUD operations with categories - Add asset organization within projects - _Requirements: 2.2, 2.3, 2.4_ - [x] 5.3 Implement default asset task creation - Add automatic task generation when assets are created based on asset category - Create default task templates for each asset category (modeling, surfacing, rigging) - Implement customizable task creation options for coordinators - Add default task naming conventions and unassigned task creation - Create API endpoint for retrieving default tasks by asset category - _Requirements: 17.1, 17.2, 17.3, 17.4, 17.5, 17.6, 17.7_ - [ ] 5.4 Implement reference file management for assets, shots, and tasks - Create ReferenceFile model for storing reference images and documents - Add reference file upload endpoints for assets, shots, and tasks - Implement file type validation and storage for reference files - Create reference file CRUD operations with descriptions and captions - Add reference file access control for project members - Organize reference files by type (images, documents, videos) for browsing - _Requirements: 18.1, 18.2, 18.3, 18.4, 18.5, 18.6, 18.7, 18.8, 18.9_ - [x] 5.5 Implement project settings for upload location and default tasks - Extend Project model with upload location and task template settings - Create project settings API endpoints for coordinators - Implement project-specific default task templates for assets and shots - Add project-specific upload data location configuration - Create task template enable/disable functionality per project - _Requirements: 19.1, 19.2, 19.3, 19.4, 19.5, 19.6, 19.7, 19.8, 19.9_ - [x] 5.6 Implement asset task status API for table display - Update asset list API to include task status information for each asset - Create task status aggregation query for efficient data retrieval - Add task status endpoint for individual assets with detailed task information - Implement task status filtering and sorting in asset list API - Add real-time task status updates through WebSocket or polling - Optimize database queries for task status retrieval performance - _Requirements: 20.1, 20.2, 20.4, 20.7, 20.8_ - [x] 5.2 Create shot management API endpoints - Implement shot CRUD operations within episodes - Add bulk shot creation with default tasks - Create automatic task generation based on shot type - _Requirements: 2.2, 2.5, 2.6_ - [x] 6. Implement task management and workflow backend - [x] 6.1 Create task management API endpoints - Implement task CRUD operations - Add task assignment with department role filtering - Create task status update endpoints - _Requirements: 2.5, 2.6, 3.1, 3.4, 3.5_ - [x] 6.2 Implement task notes and attachments - Create threaded notes system for tasks - Add file attachment upload and management - Implement attachment categorization (reference, work files, etc.) - _Requirements: 3.3, 6.4_ - [x] 6.3 Create submission and review workflow - Implement work submission endpoints - Add review and approval system - Create notification system for review decisions - _Requirements: 4.1, 4.2, 4.3, 4.4, 5.1, 5.2, 5.3, 5.4, 5.5_ - [x] 7. Implement file handling and storage system - [x] 7.1 Create file upload system - Implement secure file upload with validation - Add support for common VFX media formats - Create organized directory structure for file storage - _Requirements: 4.1, 4.2, 8.5_ - [x] 7.2 Implement file serving and access control - Create authenticated file serving endpoints - Add thumbnail generation for images - Implement version control for submissions - _Requirements: 4.5, 5.1_ - [x] 8. Complete missing backend functionality - [x] 8.1 Add developer role and API key system - Add DEVELOPER role to UserRole enum in user model - Create APIKey model with scoped permissions - Implement API key authentication middleware - Add API key management endpoints to auth router - _Requirements: 10.1, 10.2, 10.3, 10.4, 10.5, 11.1, 11.2, 11.3, 11.4, 11.5, 11.6, 11.7, 11.8, 11.9_ - [x] 8.2 Create developer-specific endpoints - Add developer endpoints for read-only access to all projects - Implement developer endpoints for read-only access to all tasks - Add developer endpoints for read-only access to all submissions - Create API key usage logging system - _Requirements: 10.2, 11.7_ - [x] 9. Set up frontend project structure and core components - [x] 9.1 Initialize Vue.js application with shadcn-vue - Install and configure shadcn-vue component library - Set up component registry and imports - Implement Sidebar07 layout structure - Add Inter font family configuration - _Requirements: 7.1, 7.2, 7.3_ - [x] 9.2 Create authentication components - Implement login and registration forms using shadcn-vue - Add JWT token management with Pinia store - Create route guards for protected pages - Add authentication service for API calls - _Requirements: 1.1, 7.4, 7.5_ - [x] 9.3 Create core layout components - Implement three-panel layout (sidebar, content, detail panel) - Create responsive navigation with role-based menu items - Add breadcrumb navigation system - Create loading states and error handling components - _Requirements: 7.1, 7.5_ - [x] 9.4 Implement dark theme support - Create theme store with Pinia for theme state management - Add theme toggle button to application header - Implement localStorage persistence for theme preference - Add system preference detection for automatic theme selection - Configure CSS transitions for smooth theme switching - _Requirements: 7.6, 7.7_ - [x] 10. Implement user management frontend - [x] 10.1 Create user registration and approval interface - Build user registration form with validation using shadcn-vue - Implement admin permission approval interface with user list - Add functional role management for users with admin permission - Add admin permission management interface (grant/revoke admin access) - Create pending user approval dashboard - _Requirements: 1.1, 1.2, 1.3, 1.4, 1.5, 10.5, 12.1, 12.2, 12.3_ - [x] 10.2 Create user profile and settings - Implement user profile display and editing - Add department role assignment interface - Create user dashboard with personalized content - Add developer-specific API key management interface - _Requirements: 8.5, 8.6, 11.9_ - [x] 10.3 Update profile and dashboard for admin permission separation - Update profile view to display functional role and admin permission separately - Modify dashboard to show admin-specific features based on admin permission, not role - Update user interface to distinguish between functional role and admin access - Add admin permission toggle in user management interface - _Requirements: 12.1, 12.3, 12.4_ - [x] 11. Implement project and episode management frontend - [x] 11.1 Create project dashboard and management - Build project overview dashboard with progress indicators using shadcn-vue cards - Implement project creation and editing forms with validation - Add project member management interface with department role assignment - Create project filtering and search functionality - _Requirements: 2.1, 6.1, 6.3, 8.5, 8.6_ - [x] 11.3 Create technical specifications management interface - Build technical specifications form component with frame rate, storage paths, and resolution settings - Implement frame rate selector with common VFX frame rate presets (23.976, 24, 25, 29.97, 30, 50, 59.94, 60 fps) - Add file path input components for data drive and publish storage paths with validation - Create resolution selector with standard delivery formats (HD, 2K, 4K, etc.) - Build delivery movie specifications editor for each department with resolution, format, codec, and quality settings - Add movie format and codec selectors with standard VFX formats (mov, mp4, exr, prores, h264, etc.) - Create department-specific delivery requirements display panel for artists - Add technical specifications display panel for artists to view project requirements - Implement technical specifications update notifications for project members - _Requirements: 13.1, 13.2, 13.3, 13.4, 13.5, 13.6, 13.7, 14.1, 14.2, 14.3, 14.4, 14.5, 14.7, 15.1, 15.2, 15.3, 15.4, 15.5, 15.6_ - [x] 11.4 Create global upload limit management interface - Build global upload limit editor for admin users with single size setting for movie files - Implement upload limit display component for artists during file submission - Add global settings management panel in admin interface - Create upload size validation with user-friendly error messages - Add default upload limit initialization and reset functionality - _Requirements: 16.1, 16.2, 16.3, 16.4, 16.5, 16.6, 14.5_ - [x] 11.2 Create episode management interface - Implement episode creation and organization within projects - Add episode-based navigation and filtering - Create episode progress tracking with visual indicators - Build episode list and detail views - _Requirements: 2.1, 2.2_ - [x] 11.5 Fix project switcher and episode navigation - [x] 11.5.1 Fix project switcher in sidebar - Debug and fix project loading in ProjectSwitcher component - Ensure projects are automatically fetched on application initialization - Add proper error handling and loading states for project fetching - Implement project refresh functionality when projects are updated - Add visual indicators for project loading and error states - _Requirements: 7.8, 7.9_ - [x] 11.5.2 Implement project tab navigation system - Create ProjectTabs component with Overview, Shots, and Assets tabs - Implement tab switching with proper routing and state management - Add tab-specific content areas and navigation - Ensure tab state persistence during project navigation - Style tabs using shadcn-vue components for consistency - _Requirements: 2.10_ - [x] 11.5.3 Implement episode dropdown for Shots tab - Create EpisodeDropdown component specifically for the Shots tab - Integrate episode dropdown into the Shots tab content area - Implement episode-based shot filtering when episode is selected - Add episode creation quick action in dropdown for coordinators - Add "All Episodes" option to view shots from all episodes - Add visual indicators for episode status and progress - _Requirements: 2.9, 2.11, 2.12, 2.13_ - [x] 11.5.4 Update project page layout with tab system - Modify project views to use the new tab-based layout - Update routing to support tab-based navigation (/projects/:id/shots, /projects/:id/assets) - Implement proper breadcrumb navigation with tab information - Add episode context to URLs when episode is selected in Shots tab - Ensure responsive design for tab navigation on mobile devices - _Requirements: 2.10, 2.11, 2.12, 2.13_ - [x] 12. Implement asset and shot management frontend - [x] 12.1 Create asset browser and management - Build categorized asset browser with grid and list views using shadcn-vue - Implement asset creation with category selection dropdown - Add asset detail view with task tracking and progress - Create asset filtering by category and project - _Requirements: 2.2, 2.3, 2.4_ - [x] 12.3 Implement asset creation with default tasks - Update asset creation form to show default tasks that will be created - Add checkbox options for coordinators to customize which default tasks are created - Implement preview of default tasks based on selected asset category - Add confirmation dialog showing tasks that will be created with the asset - Integrate with backend API for automatic task generation during asset creation - _Requirements: 17.1, 17.2, 17.3, 17.4, 17.5, 17.6, 17.7_ - [x] 12.6 Implement asset table with task status display and thumbnails - Update asset list API to include task status information for each asset - Create task status badge component with color-coded status indicators - Add task status columns to asset table for modeling, surfacing, and rigging tasks - Implement column toggle switch to show/hide task status columns - Add sorting functionality for each task status column - Create task status filtering options for assets - Implement category-aware task column display (hide rigging for props/sets) - Add real-time task status updates in the asset table - Store user preference for task column visibility per session - _Requirements: 20.1, 20.2, 20.3, 20.4, 20.5, 20.6, 20.7, 20.8, 20.9_ - [ ] 12.4 Implement reference file management interface - Add reference file upload component to asset, shot, and task forms - Create reference file gallery component for detail views - Implement drag-and-drop file upload with preview for multiple file types - Add file description and caption editing functionality - Create reference file browser organized by type (images, documents, videos) - Implement reference file management interface for updating and deleting files - _Requirements: 18.1, 18.2, 18.3, 18.4, 18.5, 18.6, 18.7, 18.8, 18.9_ - [x] 12.5 Implement project settings interface with episode management - Create project settings page with tabbed interface for different settings sections - Build episode management section within project settings for creating and editing episodes - Implement episode list display with episode number, name, status, and shot count - Add episode creation form with name, episode number, description, and status fields - Create episode edit functionality with validation - Implement episode deletion with protection for episodes containing shots - Add upload location configuration section - Build default task template editor for assets and shots per project - Add task enable/disable toggles for customizing default task creation - Implement project-specific settings form with validation - Create settings preview showing how templates will be applied - _Requirements: 3.1, 3.2, 3.3, 3.4, 3.5, 3.6, 3.7, 3.8, 3.9, 19.1, 19.2, 19.3, 19.4, 19.5, 19.6, 19.7, 19.8, 19.9_ - [x] 12.2 Create shot management and bulk creation - Implement shot browser with episode organization - Build bulk shot creation interface with naming conventions - Add automatic task generation for new shots with default task types - Create shot detail view with task list and progress tracking - _Requirements: 2.2, 2.5, 2.6_ - [x] 13. Implement task management frontend - [x] 13.1 Create task list and filtering interface - Build artist task dashboard with filtering and sorting using shadcn-vue table - Implement task status updates with dropdown selection - Add deadline visualization with urgency indicators and color coding - Create task assignment interface with department role filtering - _Requirements: 3.1, 3.2, 3.4, 3.5, 8.3_ - [x] 13.2 Create task detail panel - Implement right-side task detail panel (ftrack-style) using shadcn-vue sheet - Add task information display with status and assignment details - Create quick action buttons for common operations - Add task assignment and status update controls - _Requirements: 3.1, 3.3, 3.4_ - [ ] 13.3 Implement task notes and attachments interface - Build threaded notes system with rich text editing - Create attachment gallery with file type categorization - Add reference image viewer with comparison tools - Implement file upload with drag-and-drop functionality - _Requirements: 3.3, 6.4_ - [ ] 14. Implement submission and review workflow frontend - [ ] 14.1 Create work submission interface - Build file upload interface for work submissions with progress tracking - Implement version control and submission history display - Add submission status tracking for artists with visual indicators - Create submission notes and metadata input forms - Integrate global upload size limit for movie file size validation - Display project frame rate and delivery resolution requirements during submission - Show department-specific delivery movie format and codec requirements during submission - Add validation for file sizes based on global upload limits and project technical specifications - Add validation for movie format and codec compliance with department specifications - _Requirements: 4.1, 4.2, 4.3, 4.5, 14.5, 14.6_ - [ ] 14.2 Create review and approval interface - Implement media player with playback controls for video submissions - Build approval/retake interface with feedback forms using shadcn-vue - Add notification system for review decisions with toast notifications - Create version comparison tools for side-by-side viewing - Add image viewer with zoom and annotation capabilities - _Requirements: 5.1, 5.2, 5.3, 5.4, 5.5_ - [ ] 15. Implement coordinator tracking and reporting - [ ] 15.1 Create production dashboard - Build project progress overview with completion percentages using charts - Implement workload distribution visualization with user assignment charts - Add overdue task identification with visual indicators and alerts - Create project status overview with timeline visualization - _Requirements: 6.1, 6.2, 6.3_ - [ ] 15.2 Create reporting and analytics - Implement task completion rate reports with filtering options - Add artist performance tracking with productivity metrics - Create production timeline and scheduling views with Gantt-style charts - Build export functionality for reports - _Requirements: 6.5_ - [x] 16. Implement notification and activity system - [x] 16.1 Create notification system - Implement real-time notifications for task updates using toast components - Add email notification configuration in user settings - Create notification preferences for users with granular controls - Build notification center with unread indicators - _Requirements: 4.4, 5.4_ - [ ] 16.2 Create activity feed and timeline - Build project activity stream with real-time updates - Implement task activity timeline with chronological events - Add user activity tracking with action history - Create activity filtering and search functionality - _Requirements: 6.4_ - [ ]* 17. Testing and quality assurance - [ ]* 17.1 Backend API testing - Write unit tests for all API endpoints including API key authentication - Create integration tests for workflow scenarios - Add authentication and authorization tests for all user roles - Test developer role permissions and API key functionality - _Requirements: All backend requirements_ - [ ]* 17.2 Frontend component testing - Write unit tests for Vue components using Vitest - Create integration tests for user workflows - Add end-to-end tests for critical paths using Playwright - Test shadcn-vue component integration - _Requirements: All frontend requirements_ - [ ]* 17.3 Performance and security testing - Test file upload performance and limits - Validate security measures and access controls - Perform load testing on critical endpoints - Test API key security and scoping - _Requirements: 8.5, Security considerations, 11.7, 11.8_ - [ ] 18. Final integration and deployment preparation - [ ] 18.1 Complete system integration - Connect all frontend components to backend APIs - Implement comprehensive error handling and user feedback - Add loading states and progress indicators throughout the application - Test all user workflows end-to-end - Verify API key authentication integration - _Requirements: All requirements_ - [ ] 18.2 Production deployment setup - Configure production database settings with proper indexing - Set up file storage and backup systems - Create deployment documentation and scripts - Configure environment variables for production - Set up monitoring and logging systems - _Requirements: 8.1, 8.2, 8.3, 8.4, 8.5_ - [-] 19. Custom task type management - [x] 19.1 Implement backend API for custom task types - Add custom_asset_task_types and custom_shot_task_types columns to projects table - Create migration script for new database columns - Implement GET endpoint to retrieve all task types (standard + custom) for a project - Implement POST endpoint to add new custom task types - Implement PUT endpoint to update custom task type names - Implement DELETE endpoint to remove custom task types - Add validation for task type names (alphanumeric with underscores, 3-50 chars) - Add check to prevent deletion of task types currently in use - Add authorization checks (coordinators and admins only) - _Requirements: 21.1, 21.2, 21.3, 21.4, 21.5, 21.8_ - [x] 19.2 Create custom task type manager component - Build CustomTaskTypeManager.vue component for project settings - Create separate sections for asset and shot task types - Display list of all task types with visual distinction between standard and custom - Add "Add Task Type" button and dialog for creating new custom types - Implement edit functionality with inline editing or dialog - Add delete button with confirmation dialog - Show warning when attempting to delete task types in use - Validate task type names on frontend before submission - Integrate with project settings service layer - _Requirements: 21.1, 21.2, 21.3, 21.4, 21.5, 21.6, 21.9_ - [x] 19.3 Integrate custom task types with task template editor - Update DefaultTaskTemplatesEditor to dynamically load task types from API - Add custom task type rows to asset task templates table - Add custom task type rows to shot task templates table - Show edit/delete icons for custom task rows only - Update template save logic to include custom task types - Refresh task type list when custom types are added/edited/deleted - Handle task type name changes in existing templates - _Requirements: 21.6, 21.7, 21.9, 21.10_ - [x] 19.4 Update asset and shot creation to use custom task types - Modify asset creation logic to include custom task types from templates - Modify shot creation logic to include custom task types from templates - Update task generation to handle both standard and custom task types - Ensure custom task types appear in task lists and filters - Update task type dropdowns and selectors to include custom types - Test end-to-end workflow with custom task types - _Requirements: 21.7, 21.10_ - [x] 20. Shot table view with task status display - [x] 20.1 Enhance backend shot list endpoint with task status - Update ShotListResponse schema to include task_status dict and task_details list - Modify list_shots endpoint to query and include task information for each shot - Add task status filtering parameter to list_shots endpoint - Implement logic to build task_status dictionary with all task types - Add task_details list with TaskStatusInfo for each task - Test endpoint returns correct task status data for shots - Verify filtering works correctly for different task statuses - _Requirements: Shot table display, Task status visibility_ - [x] 20.2 Create shot table view component - Build ShotsTableView.vue component with table layout - Implement table header with sortable columns - Add columns for: Shot Name, Episode, Frame Range, Status, Task Status columns, Description - Render task status badges in individual columns for each task type - Implement row click handler to open shot detail panel - Add hover states and selected row highlighting - Ensure table is responsive with horizontal scroll for many columns - Style table to match asset table design consistency - _Requirements: Shot table display, Shot selection_ - [x] 20.3 Implement column visibility control for shots - Create or adapt ColumnVisibilityControl component for shots - Add dropdown menu with checkboxes for each column - Implement separate sections for info columns and task columns - Add "Show All" / "Hide All" quick actions - Implement column show/hide logic in table component - Store column visibility preferences in session storage - Load saved preferences on component mount - Test column visibility persists across page refreshes - _Requirements: Column visibility control_ - [x] 20.4 Add task status filtering and sorting - Create or adapt TaskStatusFilter component for shots - Add dropdown with status options (All, Not Started, In Progress, Submitted, Approved, Retake) - Implement filtering logic to show shots matching selected status - Add column sorting functionality for all columns - Implement sort indicators on column headers - Add sort order toggle (ascending/descending) - Test filter and sort work correctly together - Ensure performance is acceptable with 100+ shots - _Requirements: Task status filtering, Sortable columns_ - [x] 20.5 Integrate shot table with project shots view - Update ProjectShotsView.vue to include table view option - Add view toggle between grid and table views (optional) - Ensure episode filtering works with table view - Wire up shot selection to existing detail panel - Maintain table scroll position when opening/closing detail panel - Test complete workflow from table to detail panel - Verify all CRUD operations work with table view - _Requirements: Shot selection and detail view, Integration_ - [x] 17. Implement comprehensive admin user management interface - [x] 17.1 Create admin user management backend endpoints - Add POST /users/admin/create endpoint for admin user creation - Add PUT /users/{user_id}/admin endpoint for admin user editing - Add PUT /users/{user_id}/password endpoint for admin password reset - Add DELETE /users/{user_id}/admin endpoint for admin user deletion with association checks - Add validation to prevent admins from removing their own admin permission - Add validation to prevent deletion of users with project memberships or task assignments - Implement email uniqueness validation across all user operations - _Requirements: 1.1.2, 1.1.3, 1.1.6, 1.1.7, 1.1.8, 1.1.9, 1.1.10, 1.1.11_ - [x] 17.2 Create user management table component - Build UserManagementTable.vue component with data table layout - Implement columns for: Name, Email, Role, Admin Status, Approval Status, Last Login, Actions - Add sortable column headers with sort indicators - Implement search functionality for name and email - Add filter dropdowns for role, approval status, and admin permission - Display status badges (Approved/Pending, Admin, Role) - Add actions dropdown menu for each user (Edit, Reset Password, Delete) - Implement row selection for bulk operations - Add pagination for large user lists - _Requirements: 1.1.1, 1.1.12_ - [x] 17.3 Create user creation and edit dialogs - Build UserCreateDialog.vue component with form fields - Add fields: first name, last name, email, password, confirm password, role, approval, admin permission - Implement real-time validation for email format and password strength - Add password requirements display and strength indicator - Build UserEditDialog.vue component with editable fields - Pre-populate edit form with current user data - Highlight modified fields in edit dialog - Prevent admins from removing their own admin permission in edit dialog - Add success/error toast notifications for all operations - _Requirements: 1.1.2, 1.1.3, 1.1.4, 1.1.5, 1.1.6, 1.1.9_ - [ ] 17.4 Implement password reset functionality - Build PasswordResetDialog.vue component - Add new password and confirm password fields with validation - Implement password strength indicator - Add "Generate Password" button for secure password generation - Add "Copy to Clipboard" functionality for generated passwords - Display security notice about password change - Integrate password reset with user management table actions - _Requirements: 1.1.7_ - [ ] 17.5 Implement user deletion with safety checks - Build UserDeleteConfirmDialog.vue component - Check for project memberships and task assignments before deletion - Display warning message if user has associations - Require typing user email to confirm deletion - Add prominent cancel button to prevent accidental deletion - Show success message after successful deletion - Refresh user list after deletion - _Requirements: 1.1.10, 1.1.11_ - [ ] 17.6 Update user management page and navigation - Update UsersView.vue to include admin user management interface - Add "Add User" button in page header for admins - Integrate UserManagementTable component - Add tab or section toggle between pending approvals and all users - Ensure proper permission checks (admin-only access) - Update sidebar navigation to highlight user management for admins - Add breadcrumb navigation for user management page - _Requirements: 1.1.1, 1.1.2_ - [-] 18. Implement user profile management with avatar upload and password change - [x] 18.1 Add avatar field to user model and create upload endpoints - Add avatar_url field to User model in database - Create migration script to add avatar_url column - Add POST /users/me/avatar endpoint for avatar upload - Add DELETE /users/me/avatar endpoint for avatar removal - Implement image validation (format, size, dimensions) - Implement image processing (resize, crop to 200x200) - Store uploaded avatars in uploads/avatars directory - Generate unique filenames to prevent conflicts - Return avatar URL in user profile responses - _Requirements: 1.2.2, 1.2.3, 1.2.4, 1.2.5, 1.2.13_ - [x] 18.2 Create password change endpoint - Add PUT /users/me/password endpoint for password changes - Require current password for authentication - Validate new password meets security requirements - Hash new password with bcrypt before storing - Return success message after password update - Add error handling for incorrect current password - _Requirements: 1.2.7, 1.2.8, 1.2.9, 1.2.10, 1.2.12_ - [x] 18.3 Create avatar upload component - Build AvatarUpload.vue component with drag-and-drop support - Add file input with click-to-browse functionality - Implement image preview before upload - Add client-side validation for file size (5MB max) - Add client-side validation for file format (jpg, jpeg, png, gif, webp) - Implement image cropping interface using a cropping library - Add upload progress indicator - Display current avatar with remove button - Show initials-based placeholder when no avatar exists - Add success/error toast notifications - _Requirements: 1.2.2, 1.2.3, 1.2.4, 1.2.5, 1.2.6, 1.2.13_ - [x] 18.4 Create password change component - Build PasswordChangeForm.vue component - Add current password field with show/hide toggle - Add new password field with show/hide toggle - Add confirm password field with real-time matching validation - Display password requirements list - Implement password strength indicator (weak, medium, strong) - Add real-time validation for all fields - Disable submit button until all validations pass - Show success toast after password change - Display clear error messages for validation failures - _Requirements: 1.2.7, 1.2.8, 1.2.9, 1.2.10, 1.2.11, 1.2.12_ - [x] 18.5 Update profile page with avatar and password management - Update ProfileView.vue to include avatar management section - Add AvatarUpload component to profile page - Add PasswordChangeForm component to profile page - Update profile header to display user avatar - Ensure avatar displays in application header (AppHeader.vue) - Update user menu to show avatar instead of initials - Add section separators for visual organization - Implement unsaved changes warning - Add loading states for all async operations - _Requirements: 1.2.1, 1.2.6_ - [x] 18.6 Update user service and store for avatar and password - Add uploadAvatar method to user service - Add removeAvatar method to user service - Add changePassword method to user service - Update user store to handle avatar URL - Update auth store to refresh user data after avatar/password changes - Add error handling for all service methods - Update user types to include avatar_url field - _Requirements: 1.2.2, 1.2.7, 1.2.13_ ## Recently Completed Features - [x] 22. Avatar Display System - [x] 22.1 Implement avatar display across all user components - Added avatar support to UserManagementTable, UserApprovalCard, UserEditDialog, UserDeleteConfirmDialog - Added avatar support to ProjectMemberManagement for team members - Added avatar support to TaskList and TaskDetailPanel for assignments - Added avatar support to SubmissionCard, NoteItem, AttachmentCard - Added avatar support to ActivityFeed - Implemented 3-tier fallback: uploaded avatar → Dicebear generated → initials - Created standardized helper functions for avatar URL handling and initials generation - _Requirements: 22.1, 22.2, 22.3, 22.4, 22.5_ - [x] 23. Shot Detail Panel Enhancement with Tabbed Interface - [x] 23.1 Implement tabbed shot detail panel with five tabs - Created comprehensive shot detail panel with header, progress overview, and tabbed interface - Implemented Notes tab with "Add Note" action button and empty state - Implemented Tasks tab with task list display, loading states, and task selection - Implemented Assets tab with "Link Asset" action button and empty state - Implemented References tab with "Upload Reference" action button and empty state - Implemented Design tab with camera, lighting, and animation notes sections - Integrated task loading using shot_id filtering - Added progress calculation and status breakdown above tabs - Added role-based permission checks for all tab actions - Created new event emitters for create-note, link-asset, upload-reference, edit-design - Fixed shotService.getShot() method call (removed incorrect projectId parameter) - _Requirements: 2.7.1, 2.7.2, 2.7.3, 2.7.4, 2.7.5, 2.7.6, 2.7.7, 2.7.8, 2.7.9, 2.7.10, 2.7.11, 2.7.12_ - [x] 24. Task Filtering by Shot and Asset - [x] 24.1 Add shot_id and asset_id filtering to backend - Added shot_id and asset_id query parameters to GET /tasks endpoint - Implemented filtering logic in backend router - _Requirements: 24.1, 24.2, 24.3, 24.4, 24.5_ - [x] 24.2 Update frontend task service - Updated TaskFilters interface to include shotId and assetId - Updated getTasks method to pass new filter parameters - Implemented task loading in ShotDetailPanel using shot filtering - _Requirements: 24.1, 24.2, 24.3, 24.4, 24.5_ - [x] 25. File Handler Path Resolution Fix - [x] 25.1 Fix upload directory path resolution - Changed from relative to absolute path resolution - Used __file__ location to determine backend directory - Added parents=True to mkdir calls for proper directory creation - Ensures uploads directory works regardless of working directory - _Technical Debt_ - [x] 25. Implement Project Tasks Tab with Unified Task View - [x] 25.1 Create ProjectTasksView component - Create new view component at `frontend/src/views/project/ProjectTasksView.vue` - Set up basic layout with data table container - Add route configuration for `/projects/:projectId/tasks` - _Requirements: 25.1, 25.2_ - [ ] 25.2 Add Tasks tab to ProjectTabs component - Update `frontend/src/components/project/ProjectTabs.vue` to include Tasks tab - Add navigation link for Tasks tab alongside Overview, Shots, and Assets - Ensure proper routing when Tasks tab is clicked - _Requirements: 25.1_ - [ ] 25.3 Create TasksDataTable component - Create `frontend/src/components/task/TasksDataTable.vue` component - Implement TanStack Table for data table functionality - Define column structure with Task Name, Type, Status, Context, Shot/Asset, Episode, Assignee, Deadline, Created - Add row click handler to open task detail panel - _Requirements: 25.3, 25.4, 25.11, 25.12_ - [x] 25.4 Implement task data fetching and state management - Update task service to fetch all project tasks with project_id filter - Fetch tasks from both shots and assets - Store tasks in Pinia store with proper typing - Handle loading and error states - _Requirements: 25.2, 25.3_ - [ ] 25.5 Create TaskTableToolbar component with filters - Create toolbar component with filter controls - Implement status filter (multi-select dropdown) - Implement task type filter (multi-select dropdown) - Implement episode filter (dropdown) - Implement assignee filter (multi-select dropdown) - Add search input with debouncing - Add context filter toggle (All/Shots/Assets) - _Requirements: 25.5, 25.6, 25.7, 25.8, 25.9_ - [ ] 25.6 Implement column visibility controls - Add column visibility dropdown menu - Allow toggling visibility for each column - Persist column visibility preferences in session storage - Ensure minimum required columns remain visible - _Requirements: 25.16, 25.17_ - [ ] 25.7 Implement sorting functionality - Enable sorting for all columns - Add sort indicators (ascending/descending arrows) - Set default sort to Created date (newest first) - Support multi-column sorting - _Requirements: 25.10_ - [ ] 25.8 Add status badges and visual indicators - Create color-coded status badges for task status - Add task type badges - Display context icons (shot/asset indicators) - Add urgency indicators for deadlines - _Requirements: 25.11, 25.4_ - [ ] 25.9 Display shot/asset and episode information - Show shot name or asset name in dedicated column - Display episode information for shot tasks - Add context indicator (Shot/Asset) with icon - Handle null/empty episode gracefully for asset tasks - _Requirements: 25.13, 25.14, 25.15_ - [ ] 25.10 Integrate TaskDetailPanel - Reuse existing TaskDetailPanel component - Implement slide-in animation from right - Handle task selection and panel opening - Add close functionality - _Requirements: 25.12_ - [ ]* 25.11 Implement bulk operations for coordinators - Add row selection checkboxes - Create bulk action toolbar - Implement bulk status update - Implement bulk reassignment - Implement bulk deadline modification - Restrict to coordinator and admin roles - _Requirements: 25.19_ - [ ]* 25.12 Add export functionality - Implement CSV export for filtered tasks - Implement Excel export for filtered tasks - Include all visible columns in export - Add export button to toolbar - _Requirements: 25.20_ - [ ] 25.13 Add task count display - Show total task count in table header - Show filtered task count when filters are active - Update counts dynamically as filters change - _Requirements: 25.18_ - [ ]* 25.14 Implement pagination - Add pagination controls at table bottom - Support page size selection (25, 50, 100, 200) - Show current page and total pages - Persist page size preference - [ ]* 25.15 Add responsive design - Implement responsive table for desktop - Hide less critical columns on tablet - Switch to card layout on mobile - Test on various screen sizes - [ ]* 25.16 Implement virtual scrolling for performance - Add virtual scrolling for large task lists (1000+ tasks) - Optimize rendering performance - Test with large datasets - [ ]* 25.17 Add loading and empty states - Create loading skeleton for table - Design empty state when no tasks exist - Design empty state when filters return no results - Add helpful messages and actions ## Project Thumbnail Upload Feature - [x] 21. Implement backend support for project thumbnails - Add thumbnail_path field to Project model - Create database migration for new field - _Requirements: 2.1_ - [x] 21.1 Create thumbnail upload API endpoint - Implement POST /projects/{project_id}/thumbnail endpoint - Add file validation (type, size) - Implement image processing and resizing using Pillow - Store original and resized thumbnail versions - _Requirements: 2.1, 2.1.3, 2.1.4, 2.1.5, 2.1.6_ - [x] 21.2 Create thumbnail deletion API endpoint - Implement DELETE /projects/{project_id}/thumbnail endpoint - Remove thumbnail files from filesystem - Update database to clear thumbnail_path - _Requirements: 2.1.10_ - [x] 21.3 Create thumbnail serving endpoint - Implement GET /files/projects/{project_id}/thumbnail endpoint - Add authentication check for thumbnail access - Serve thumbnail file with proper content-type - _Requirements: 2.1.7_ - [x] 21.4 Update project API responses to include thumbnail URL - Add thumbnail_url property to Project model - Include thumbnail_url in project list and detail responses - _Requirements: 2.1.7_ - [x] 22. Implement frontend project thumbnail upload component - Create ProjectThumbnailUpload component - Implement drag-and-drop upload interface - Add file selection via click - _Requirements: 2.1.1, 2.1.2_ - [x] 22.1 Add thumbnail preview and management - Display current thumbnail with preview - Add replace thumbnail functionality - Add remove thumbnail button - Show upload progress indicator - _Requirements: 2.1.9, 2.1.10, 2.1.11, 2.1.12_ - [x] 22.2 Integrate thumbnail upload in project settings - Add thumbnail upload section to project settings page - Wire up upload/delete API calls - Handle upload success and error states - Display toast notifications for user feedback - _Requirements: 2.1.1, 2.1.12_ - [x] 22.3 Update project card to display thumbnails - Add thumbnail image display to project cards - Implement fallback to default placeholder - Use project initials for default display - Add loading skeleton for thumbnails - Implement lazy loading for performance - _Requirements: 2.1.7, 2.1.8_ - [x] 22.4 Update project type definitions - Add thumbnail_url field to Project interface - Update project service to handle thumbnail URLs - _Requirements: 2.1.7_ - [ ]* 22.5 Write tests for thumbnail functionality - Write backend tests for upload/delete endpoints - Write frontend tests for upload component - Test project card thumbnail display - Test authentication and access control - _Requirements: 2.1_ ## Asset Detail Panel Feature - [x] 26. Implement asset detail panel with tabbed interface - Create comprehensive asset detail panel similar to shot detail panel - Implement tabbed interface for organizing asset information - Integrate with asset browser for seamless navigation - _Requirements: 26_ - [x] 26.1 Create AssetDetailPanel component structure - Create AssetDetailPanel.vue component in frontend/src/components/asset/ - Implement panel header with asset name, category badge, and status badge - Add asset information section (description, dates) - Add progress overview section with task completion statistics - Implement tabbed interface with four tabs (Tasks, Notes, References, Versions) - Add close button and click-outside-to-close functionality - Implement slide-in animation from right side - _Requirements: 26.1, 26.2, 26.7, 26.8, 26.11_ - [x] 26.2 Implement Tasks tab - Set Tasks as the default tab - Integrate existing TaskList component with asset_id filter - Load tasks automatically when panel opens - Add "Add Task" action button (coordinators/admins only) - Implement task selection to open TaskDetailPanel - Add loading states and error handling - Display empty state when no tasks exist - _Requirements: 26.3, 26.9, 26.10_ - [x] 26.3 Implement Notes tab - Create notes display section using existing note components - Add "Add Note" action button (coordinators/admins only) - Display threaded notes with timestamps and user avatars - Implement note creation dialog - Add loading states and empty state - _Requirements: 26.4, 26.10_ - [x] 26.4 Implement References tab - Create reference files gallery view - Add "Upload Reference" action button (all users) - Implement file upload functionality - Display reference files with thumbnails - Add file preview, download, and delete actions - Add loading states and empty state - _Requirements: 26.5, 26.10_ - [x] 26.5 Implement Versions tab - Create version history display - Add "Publish Version" action button (artists/coordinators/admins) - Display version list with timestamps and user info - Implement version comparison functionality - Add download previous versions feature - Add loading states and empty state - _Requirements: 26.6, 26.10_ - [x] 26.6 Integrate AssetDetailPanel with AssetBrowser - Update AssetBrowser to handle asset card clicks - Implement panel open/close state management - Update URL with asset ID when panel opens - Maintain asset browser state when panel is open - Handle browser back button to close panel - Ensure proper z-index layering - _Requirements: 26.1, 26.8, 26.12_ - [x] 26.7 Add role-based permissions to action buttons - Implement permission checks for "Add Task" button - Implement permission checks for "Add Note" button - Implement permission checks for "Upload Reference" button - Implement permission checks for "Publish Version" button - Hide/disable buttons based on user role - _Requirements: 26.10_ - [ ]* 26.8 Add asset detail panel tests - Write component tests for AssetDetailPanel - Test tab switching functionality - Test task loading and display - Test permission-based button visibility - Test panel open/close behavior - _Requirements: 26_