grand-girl

As a user or admin, I want to use the Login page so that I can sign in to access my dashboard, upload content, and manage my account. Implement based on the existing Login (v2) JSX design. Includes: form with email/password fields, maroon/gold styling, 'Forgot Password' link, redirect to Dashboard on success. Entry point from Landing for both User and Admin flows.

As a user or guest, I want to use the Home page so that I can browse wedding videos, navigate to Upload, Search, Playlist, and Video pages. Implement based on the existing Home (v2) JSX design. Includes: featured video grid, emotion category filters, cultural header, navigation to Upload/Search/Playlist sections. Central hub in both Guest and User flows.

As a guest, I want to use the Signup page so that I can create an account and start uploading and interacting with wedding content. Implement based on the existing Signup (v2) JSX design. Includes: registration form with name, email, password, city fields, cultural welcome messaging in maroon/gold/ivory theme, redirect to Home on success. Linked from Video and Results pages in the Guest flow.

As a guest or user, I want to view the Landing page so that I can explore platform info, view the Living Memory Lane interactive timeline, and navigate to Login or Signup. Implement based on the existing Landing (v2) JSX design. Includes: NavBar, HeroSplash, LivingMemoryTimeline, EmotionHighlights, HowItWorks, FeaturedMoments, CulturalHeritageStrip, Testimonials, CallToAction, Footer sections. Animated henna/floral SVG background, floating rose petal keyframes, gold particle dust overlay. Entry point for all user flows (Admin, Guest, User).

As an admin, I want to use the Dashboard page so that I can view platform statistics, access the moderation queue, manage users, and monitor activity. Implement based on the existing Dashboard (v2) JSX design. Includes: TopBar, Sidebar, WelcomeBanner, StatsOverview, RecentUploads, ModerationQueue, EmotionInsights, ActivityFeed, QuickActions, DashboardFooter sections. Deep maroon-black dark theme with gold accents and glassmorphism cards. Linked from Login in the Admin flow.

As a user, I want to use the Upload page so that I can upload wedding videos, add metadata, tag emotions, link to playlists, and submit content to the platform. Implement based on the existing Upload (v2) JSX design. Includes: NavBar, UploadHero, DropZone (drag-and-drop with progress), VideoDetailsForm, EmotionTagSelector, EventLinker, UploadSidebar, UploadGuidelines, Footer sections. Supports up to 4K video uploads. Linked from Home in the User flow.

As a user or guest, I want to use the Search page so that I can search for wedding videos by emotion tags, event types, or keywords and navigate to the Results page. Implement based on the existing Search (v2) JSX design. Includes: search bar with filters for emotions/event types/date, suggested searches, cultural styling in maroon/gold/ivory. Linked from Home in both Guest and User flows.

As a user or guest, I want to use the Video page so that I can watch a wedding video, react with emoji (like, heart, cry), leave comments, and share the video with family via social media or direct link. Implement based on the existing Video (v2) JSX design. Includes: full video player with maroon/gold styling, reaction bar, comments section with avatar chips, share panel, related videos sidebar. Guests are prompted to sign up to react/comment. Linked from Results and Home.

As a user, I want to use the Playlist page so that I can create, view, and manage playlists of wedding videos for specific events (e.g., sister's wedding, bride's farewell). Implement based on the existing Playlist (v2) JSX design. Includes: playlist header with event name, video grid with drag-to-reorder, add/remove video controls, share playlist button, emotional tagging summary. Linked from Home in the User flow.

As a user, I want to use the backend API for video upload so that I can submit wedding videos up to 4K resolution, receive upload confirmation, and have the video stored securely. Build FastAPI endpoint POST /api/videos/upload supporting multipart file upload, file validation (MP4/MOV/AVI, max size), and storage integration. Returns video ID and metadata on success.

As an admin, I want to use the Moderation page so that I can review flagged content, approve or remove videos, and maintain cultural platform guidelines. Implement based on the existing Moderation (v2) JSX design. Includes: ModerationTopBar, AdminSidebar, ModerationStatsBar, ModerationFiltersToolbar, ContentQueueTable, VideoPreviewPanel, ModerationActionBar, ModerationActivityLog, ModerationFooter sections. Linked from Dashboard in the Admin flow.

As a user or guest, I want to use the Results page so that I can view search results filtered by emotion tags or event types, click through to Video pages, or sign up if not registered. Implement based on the existing Results (v2) JSX design. Includes: results grid, active filter pills, video thumbnail cards with emotion badges, pagination, Signup CTA for guest users. Linked from Search in both Guest and User flows.

As an admin, I want to use the Users page so that I can manage user accounts, view user details, suspend or delete accounts, and oversee platform membership. Implement based on the existing Users (v2) JSX design. Includes: AdminTopBar, AdminSidebar, UsersPageHeader, UsersStatsRow, UsersFilterBar, UsersTable, UserDetailDrawer, UsersPagination sections. Ivory admin theme with maroon/gold accents. Linked from Dashboard in the Admin flow.

As a user, I want to use the backend API for playlists so that I can create, update, delete, and retrieve playlists of wedding videos for specific events. Build FastAPI endpoints: POST /api/playlists, GET /api/playlists/{id}, PUT /api/playlists/{id}, DELETE /api/playlists/{id}, POST /api/playlists/{id}/videos, DELETE /api/playlists/{id}/videos/{video_id}.

As an admin, I want to use the backend API for content moderation so that I can review flagged videos, approve or remove content, and maintain cultural platform guidelines. Build FastAPI endpoints: GET /api/moderation/queue, POST /api/moderation/videos/{id}/approve, POST /api/moderation/videos/{id}/remove, GET /api/moderation/activity-log. Includes flagging system and audit trail.

As a user, I want to use the backend API for video sharing so that I can generate shareable links and share videos to social media platforms. Build FastAPI endpoint POST /api/videos/{id}/share that generates a short shareable URL and returns platform-specific share links (WhatsApp, Facebook, Instagram). Tracks share analytics per video.

As a user, I want to use the backend API for reactions and comments so that I can react to videos with emoji (like, heart, cry) and post/view comments. Build FastAPI endpoints: POST /api/videos/{id}/reactions, GET /api/videos/{id}/reactions, POST /api/videos/{id}/comments, GET /api/videos/{id}/comments with pagination. Reaction types: like, heart, cry.

As a user, I want to use the backend API for emotion tagging so that I can tag my uploaded videos with emotions (crying, joy, laughter, etc.) and have those tags stored and searchable. Build FastAPI endpoints POST /api/videos/{id}/tags and GET /api/emotions to manage emotion tag creation, assignment, and retrieval.

As a user or guest, I want to use the backend API for video search so that I can find wedding videos by emotion tags, event types, or keywords. Build FastAPI endpoint GET /api/videos/search with query params for keyword, emotion, event_type, date_range, and pagination. Returns paginated video results with metadata and thumbnails.

As an admin, I want to use the backend API for user management so that I can list, search, suspend, and delete user accounts, and view user activity. Build FastAPI endpoints: GET /api/admin/users (with filters), GET /api/admin/users/{id}, PUT /api/admin/users/{id}/suspend, DELETE /api/admin/users/{id}, GET /api/admin/users/{id}/activity. Role-based access control enforced.

As an admin, I want to use the backend API for dashboard statistics so that I can view platform-wide metrics including total videos, reactions, playlists, pending moderation count, and activity trends. Build FastAPI endpoint GET /api/admin/dashboard/stats returning aggregate counts, trend data, and recent activity feed.

As a developer, I want to connect all frontend pages to their corresponding backend APIs so that the application is fully functional end-to-end. Tasks include: integrating Upload page with video upload API, Search/Results pages with search API, Video page with reactions/comments/share APIs, Playlist page with playlist CRUD API, Dashboard/Moderation/Users admin pages with admin APIs. Use axios/fetch with proper error handling, loading states, and PKT timezone display.