auto-save 2026-05-12 19:58 (+1, ~4)

web/app/page.tsx

@@ -16,6 +16,7 @@ import { ThemeToggle } from "@/components/theme-toggle"
 import { Dashboard } from "@/components/dashboard"
 import { addManualFrame, analyzeJob, createJob, getJob, uploadJob, type Job } from "@/lib/api"
 import { FrameLightbox } from "@/components/lightbox"
+import { VideoLightbox } from "@/components/video-lightbox"
 
 const NODE_TYPES = {
   input: InputNode,
@@ -61,6 +62,7 @@ export default function Home() {
   const [analyzing, setAnalyzing] = useState(false)
   const [selectedFrames, setSelectedFrames] = useState<Set<number>>(new Set())
   const [expandedFrame, setExpandedFrame] = useState<number | null>(null)
+  const [videoLightboxOpen, setVideoLightboxOpen] = useState(false)
   const pollRef = useRef<ReturnType<typeof setInterval> | null>(null)
 
   const handleSubmit = useCallback(async (url: string) => {
@@ -181,6 +183,7 @@ export default function Home() {
     onToggleFrame: handleToggleFrame,
     onExpandFrame: setExpandedFrame,
     onAddManualFrame: handleAddManualFrame,
+    onOpenVideoLightbox: () => setVideoLightboxOpen(true),
   }), [job, submitting, analyzing, selectedFrames, handleSubmit, handleUpload, handleAnalyze, handleToggleFrame, handleAddManualFrame])
 
   // 用 useNodesState 让 ReactFlow 自己管位置（避免轮询时重置 drag）
@@ -275,6 +278,14 @@ export default function Home() {
             onToggleSelect={handleToggleFrame}
           />
         )}
+
+        {/* Video lightbox — InputNode 缩略图点击进入 */}
+        <VideoLightbox
+          jobId={job?.id ?? null}
+          open={videoLightboxOpen}
+          onClose={() => setVideoLightboxOpen(false)}
+          onAddFrame={handleAddManualFrame}
+        />
       </main>
     </>
   )