new playlist page 2

app/(dashboard)/playlist/PlaylistClient.tsx

@@ -38,6 +38,7 @@ interface PlaylistVersion {
   posterUrl: string | null;
   fps: number;
   approvalStatus: string;
+  taskTitle: string;
 }
 
 interface PlaylistShot {
@@ -315,6 +316,7 @@ function ShotThumbnail({
       {/* Info */}
       <div className="flex-1 min-w-0 pt-0.5">
         <p className="font-mono text-xs font-semibold text-white truncate">{shot.shotCode}</p>
+        <p className="text-[10px] text-zinc-500 truncate">{shot.latestVersion.taskTitle}</p>
         <div className={cn(
           "flex items-center gap-1 mt-0.5 text-[10px]",
           APPROVAL_COLORS[shot.latestVersion.approvalStatus]?.split(" ").find(c => c.startsWith("text-")) ?? "text-zinc-400"

app/api/playlist/route.ts

@@ -13,13 +13,14 @@ export async function GET(req: NextRequest) {
     return NextResponse.json({ error: "projectId required" }, { status: 400 });
   }
 
+  // All versions are linked to tasks (taskId), not directly to shots.
+  // We query shots with their tasks, and for each task get the latest version.
   const shots = await db.shot.findMany({
     where: {
       projectId,
-      versions: {
+      tasks: {
         some: {
-          shotId: { not: null },
+          versions: { some: { isLatest: true } },
-          mimeType: { startsWith: "video/" },
         },
       },
     },
@@ -30,36 +31,60 @@ export async function GET(req: NextRequest) {
       episode: true,
       status: true,
       thumbnailUrl: true,
-      versions: {
+      tasks: {
-        where: {
-          isLatest: true,
-          mimeType: { startsWith: "video/" },
-        },
-        take: 1,
         select: {
           id: true,
-          versionNumber: true,
+          title: true,
-          fileUrl: true,
+          versions: {
-          thumbnailUrl: true,
+            where: { isLatest: true },
-          posterUrl: true,
+            take: 1,
-          fps: true,
+            orderBy: { createdAt: "desc" },
-          approvalStatus: true,
+            select: {
+              id: true,
+              versionNumber: true,
+              fileUrl: true,
+              thumbnailUrl: true,
+              posterUrl: true,
+              fps: true,
+              approvalStatus: true,
+              mimeType: true,
+              createdAt: true,
+            },
+          },
         },
       },
     },
   });
 
-  // Only return shots that actually have a latest video version
+  // For each shot, pick the most recently uploaded latest version across all tasks
   const playlist = shots
-    .map((shot) => ({
+    .map((shot) => {
-      id: shot.id,
+      const versions = shot.tasks
-      shotCode: shot.shotCode,
+        .flatMap((t) => t.versions.map((v) => ({ ...v, taskTitle: t.title })))
-      episode: shot.episode,
+        .sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());
-      status: shot.status,
+
-      thumbnailUrl: shot.thumbnailUrl,
+      const latest = versions[0] ?? null;
-      latestVersion: shot.versions[0] ?? null,
+      if (!latest) return null;
-    }))
+
-    .filter((shot) => shot.latestVersion !== null);
+      return {
+        id: shot.id,
+        shotCode: shot.shotCode,
+        episode: shot.episode,
+        status: shot.status,
+        thumbnailUrl: shot.thumbnailUrl,
+        latestVersion: {
+          id: latest.id,
+          versionNumber: latest.versionNumber,
+          fileUrl: latest.fileUrl,
+          thumbnailUrl: latest.thumbnailUrl,
+          posterUrl: latest.posterUrl,
+          fps: latest.fps,
+          approvalStatus: latest.approvalStatus,
+          taskTitle: latest.taskTitle,
+        },
+      };
+    })
+    .filter((s): s is NonNullable<typeof s> => s !== null);
 
   return NextResponse.json({ shots: playlist });
 }