feat(platform): add Agent Output Demo field to marketplace submission form (#11538)

## Summary
- Add Agent Output Demo field to marketplace agent submission form,
positioned below the Description field
- Store agent output demo URLs in database for future CoPilot
integration
- Implement proper video/image ordering on marketplace pages
- Add shared YouTube URL validation utility to eliminate code
duplication

## Changes Made

### Frontend
- **Agent submission form**: Added Agent Output Demo field with YouTube
URL validation
- **Edit agent form**: Added Agent Output Demo field for existing
submissions
- **Marketplace display**: Implemented proper video/image ordering:
  1. YouTube/Overview video (if exists)
  2. First image (hero)
  3. Agent Output Demo (if exists) 
  4. Additional images
- **Shared utilities**: Created `validateYouTubeUrl` function in
`src/lib/utils.ts`

### Backend
- **Database schema**: Added `agentOutputDemoUrl` field to
`StoreListingVersion` model
- **Database views**: Updated `StoreAgent` view to include
`agent_output_demo` field
- **API models**: Added `agent_output_demo_url` to submission requests
and `agent_output_demo` to responses
- **Database migration**: Added migration to create new column and
update view
- **Test files**: Updated all test files to include the new required
field

## Test Plan
- [x] Frontend form validation works correctly for YouTube URLs
- [x] Database migration applies successfully 
- [x] Backend API accepts and returns the new field
- [x] Marketplace displays videos in correct order
- [x] Both frontend and backend formatting/linting pass
- [x] All test files include required field to prevent failures

🤖 Generated with [Claude Code](https://claude.ai/code)

---------

Co-authored-by: Claude <[email protected]>

Author: majdyz

autogpt_platform/backend/backend/data/onboarding.py

@@ -432,6 +432,7 @@ async def get_recommended_agents(user_id: str) -> list[StoreAgentDetails]:
             slug=agent.slug,
             agent_name=agent.agent_name,
             agent_video=agent.agent_video or "",
+            agent_output_demo=agent.agent_output_demo or "",
             agent_image=agent.agent_image,
             creator=agent.creator_username,
             creator_avatar=agent.creator_avatar,

autogpt_platform/backend/backend/server/v2/store/db.py

@@ -327,6 +327,7 @@ async def get_store_agent_details(
             slug=agent.slug,
             agent_name=agent.agent_name,
             agent_video=agent.agent_video or "",
+            agent_output_demo=agent.agent_output_demo or "",
             agent_image=agent.agent_image,
             creator=agent.creator_username or "",
             creator_avatar=agent.creator_avatar or "",
@@ -397,6 +398,7 @@ async def get_store_agent_by_version_id(
             slug=agent.slug,
             agent_name=agent.agent_name,
             agent_video=agent.agent_video or "",
+            agent_output_demo=agent.agent_output_demo or "",
             agent_image=agent.agent_image,
             creator=agent.creator_username or "",
             creator_avatar=agent.creator_avatar or "",
@@ -683,6 +685,7 @@ async def create_store_submission(
     slug: str,
     name: str,
     video_url: str | None = None,
+    agent_output_demo_url: str | None = None,
     image_urls: list[str] = [],
     description: str = "",
     instructions: str | None = None,
@@ -777,6 +780,7 @@ async def create_store_submission(
                         agentGraphVersion=agent_version,
                         name=name,
                         videoUrl=video_url,
+                        agentOutputDemoUrl=agent_output_demo_url,
                         imageUrls=image_urls,
                         description=description,
                         instructions=instructions,
@@ -849,6 +853,7 @@ async def edit_store_submission(
     store_listing_version_id: str,
     name: str,
     video_url: str | None = None,
+    agent_output_demo_url: str | None = None,
     image_urls: list[str] = [],
     description: str = "",
     sub_heading: str = "",
@@ -930,6 +935,7 @@ async def edit_store_submission(
                 store_listing_id=current_version.storeListingId,
                 name=name,
                 video_url=video_url,
+                agent_output_demo_url=agent_output_demo_url,
                 image_urls=image_urls,
                 description=description,
                 sub_heading=sub_heading,
@@ -947,6 +953,7 @@ async def edit_store_submission(
                 data=prisma.types.StoreListingVersionUpdateInput(
                     name=name,
                     videoUrl=video_url,
+                    agentOutputDemoUrl=agent_output_demo_url,
                     imageUrls=image_urls,
                     description=description,
                     categories=categories,
@@ -1008,6 +1015,7 @@ async def create_store_version(
     store_listing_id: str,
     name: str,
     video_url: str | None = None,
+    agent_output_demo_url: str | None = None,
     image_urls: list[str] = [],
     description: str = "",
     instructions: str | None = None,
@@ -1077,6 +1085,7 @@ async def create_store_version(
                 agentGraphVersion=agent_version,
                 name=name,
                 videoUrl=video_url,
+                agentOutputDemoUrl=agent_output_demo_url,
                 imageUrls=image_urls,
                 description=description,
                 instructions=instructions,

autogpt_platform/backend/backend/server/v2/store/model.py

@@ -44,6 +44,7 @@ class StoreAgentDetails(pydantic.BaseModel):
     slug: str
     agent_name: str
     agent_video: str
+    agent_output_demo: str
     agent_image: list[str]
     creator: str
     creator_avatar: str
@@ -121,6 +122,7 @@ class StoreSubmission(pydantic.BaseModel):
 
     # Additional fields for editing
     video_url: str | None = None
+    agent_output_demo_url: str | None = None
     categories: list[str] = []
 
 
@@ -157,6 +159,7 @@ class StoreSubmissionRequest(pydantic.BaseModel):
     name: str
     sub_heading: str
     video_url: str | None = None
+    agent_output_demo_url: str | None = None
     image_urls: list[str] = []
     description: str = ""
     instructions: str | None = None
@@ -169,6 +172,7 @@ class StoreSubmissionEditRequest(pydantic.BaseModel):
     name: str
     sub_heading: str
     video_url: str | None = None
+    agent_output_demo_url: str | None = None
     image_urls: list[str] = []
     description: str = ""
     instructions: str | None = None

autogpt_platform/backend/backend/server/v2/store/model_test.py

@@ -62,6 +62,7 @@ def test_store_agent_details():
         slug="test-agent",
         agent_name="Test Agent",
         agent_video="video.mp4",
+        agent_output_demo="demo.mp4",
         agent_image=["image1.jpg", "image2.jpg"],
         creator="creator1",
         creator_avatar="avatar.jpg",

autogpt_platform/backend/backend/server/v2/store/routes.py

@@ -438,6 +438,7 @@ async def create_submission(
         slug=submission_request.slug,
         name=submission_request.name,
         video_url=submission_request.video_url,
+        agent_output_demo_url=submission_request.agent_output_demo_url,
         image_urls=submission_request.image_urls,
         description=submission_request.description,
         instructions=submission_request.instructions,
@@ -481,6 +482,7 @@ async def edit_submission(
         store_listing_version_id=store_listing_version_id,
         name=submission_request.name,
         video_url=submission_request.video_url,
+        agent_output_demo_url=submission_request.agent_output_demo_url,
         image_urls=submission_request.image_urls,
         description=submission_request.description,
         instructions=submission_request.instructions,

autogpt_platform/backend/backend/server/v2/store/routes_test.py

@@ -378,6 +378,7 @@ def test_get_agent_details(
         slug="test-agent",
         agent_name="Test Agent",
         agent_video="video.mp4",
+        agent_output_demo="demo.mp4",
         agent_image=["image1.jpg", "image2.jpg"],
         creator="creator1",
         creator_avatar="avatar1.jpg",

autogpt_platform/backend/migrations/20251204012214_add_marketplace_agent_output_video_column/migration.sql

@@ -0,0 +1,64 @@
+-- AlterTable
+ALTER TABLE "StoreListingVersion" ADD COLUMN     "agentOutputDemoUrl" TEXT;
+
+-- Drop and recreate the StoreAgent view with agentOutputDemoUrl field
+DROP VIEW IF EXISTS "StoreAgent";
+
+CREATE OR REPLACE VIEW "StoreAgent" AS
+WITH latest_versions AS (
+    SELECT 
+        "storeListingId",
+        MAX(version) AS max_version
+    FROM "StoreListingVersion"
+    WHERE "submissionStatus" = 'APPROVED'
+    GROUP BY "storeListingId"
+),
+agent_versions AS (
+    SELECT 
+        "storeListingId",
+        array_agg(DISTINCT version::text ORDER BY version::text) AS versions
+    FROM "StoreListingVersion"
+    WHERE "submissionStatus" = 'APPROVED'
+    GROUP BY "storeListingId"
+)
+SELECT
+    sl.id AS listing_id,
+    slv.id AS "storeListingVersionId",
+    slv."createdAt" AS updated_at,
+    sl.slug,
+    COALESCE(slv.name, '') AS agent_name,
+    slv."videoUrl" AS agent_video,
+    slv."agentOutputDemoUrl" AS agent_output_demo,
+    COALESCE(slv."imageUrls", ARRAY[]::text[]) AS agent_image,
+    slv."isFeatured" AS featured,
+    p.username AS creator_username,  -- Allow NULL for malformed sub-agents
+    p."avatarUrl" AS creator_avatar,  -- Allow NULL for malformed sub-agents
+    slv."subHeading" AS sub_heading,
+    slv.description,
+    slv.categories,
+    slv.search,
+    COALESCE(ar.run_count, 0::bigint) AS runs,
+    COALESCE(rs.avg_rating, 0.0)::double precision AS rating,
+    COALESCE(av.versions, ARRAY[slv.version::text]) AS versions,
+    slv."isAvailable" AS is_available,
+    COALESCE(sl."useForOnboarding", false) AS "useForOnboarding"
+FROM "StoreListing" sl
+JOIN latest_versions lv 
+    ON sl.id = lv."storeListingId"
+JOIN "StoreListingVersion" slv 
+    ON slv."storeListingId" = lv."storeListingId"
+   AND slv.version = lv.max_version
+   AND slv."submissionStatus" = 'APPROVED'
+JOIN "AgentGraph" a 
+    ON slv."agentGraphId" = a.id 
+    AND slv."agentGraphVersion" = a.version
+LEFT JOIN "Profile" p 
+    ON sl."owningUserId" = p."userId"
+LEFT JOIN "mv_review_stats" rs 
+    ON sl.id = rs."storeListingId"
+LEFT JOIN "mv_agent_run_counts" ar 
+    ON a.id = ar."agentGraphId"
+LEFT JOIN agent_versions av 
+    ON sl.id = av."storeListingId"
+WHERE sl."isDeleted" = false
+  AND sl."hasApprovedVersion" = true;

autogpt_platform/backend/schema.prisma

@@ -701,10 +701,11 @@ view StoreAgent {
   storeListingVersionId String
   updated_at            DateTime
 
-  slug        String
-  agent_name  String
-  agent_video String?
-  agent_image String[]
+  slug                String
+  agent_name          String
+  agent_video         String?
+  agent_output_demo   String?
+  agent_image         String[]
 
   featured         Boolean                  @default(false)
   creator_username String?
@@ -833,13 +834,14 @@ model StoreListingVersion {
   AgentGraph        AgentGraph @relation(fields: [agentGraphId, agentGraphVersion], references: [id, version])
 
   // Content fields
-  name         String
-  subHeading   String
-  videoUrl     String?
-  imageUrls    String[]
-  description  String
-  instructions String?
-  categories   String[]
+  name                String
+  subHeading          String
+  videoUrl            String?
+  agentOutputDemoUrl  String?
+  imageUrls           String[]
+  description         String
+  instructions        String?
+  categories          String[]
 
   isFeatured Boolean @default(false)
 

autogpt_platform/backend/snapshots/agt_details

@@ -3,6 +3,7 @@
   "slug": "test-agent",
   "agent_name": "Test Agent",
   "agent_video": "video.mp4",
+  "agent_output_demo": "demo.mp4",
   "agent_image": [
     "image1.jpg",
     "image2.jpg"

autogpt_platform/backend/snapshots/sub_success

@@ -23,6 +23,7 @@
       "reviewed_at": null,
       "changes_summary": null,
       "video_url": "test.mp4",
+      "agent_output_demo_url": null,
       "categories": [
         "test-category"
       ]