screencastgen

LipsyncRunPanel

Running lip-sync progress panel with per-page timing and early stop control.

Source: web/frontend/src/components/LipsyncRunPanel.tsx

{
  jobId: string
  progress: ProgressEvent | null
  initialPageTimes?: LipsyncPageTime[]
}

Reads structured progress.data from lip-sync page events.
Displays completed page timings from page_done events.
Shows a ticking elapsed timer while the current page is on the GPU.
Recovers current-page state from page_progress if page_start was missed.
Uses a two-step stop flow to prevent an accidental click from cancelling a long run:
1. Stop & build from completed pages opens an inline warning.
2. Yes, stop and build calls stopJob(jobId); Keep running closes the warning without changing the job.
The warning states that the active page may be discarded and the final video contains only completed pages.
Disables both confirmation actions while the stop request is being sent and displays a retryable error if the API call fails.

initialPageTimes lets the panel show persisted progress after a browser reload.

State	Purpose
`pageTimes`	Completed page durations
`currentPage` / `pageStartRef`	Active-page timer
`showStopConfirm`	Whether the inline confirmation is visible
`stopping`	Prevents duplicate stop requests
`stopError`	User-facing API failure message