Jesse_ChenandClaude Fable 5
848e39e61f
The worker already persists a phase ladder and durable per-section rows; the waiting screen parsed the progress fields and rendered none of them. Chapter progress now drives the screen: one cell per chapter rather than a percentage bar, since the job percent jumps 0->30 and 90->100. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_016P5RoqzmUQEbeC2qjAkeGr
36 lines
1.3 KiB
TypeScript
36 lines
1.3 KiB
TypeScript
/**
|
|
* Chapter progress for a report that is still being written.
|
|
*
|
|
* One cell per chapter — the bar is the chapter list in compact form, so the
|
|
* two can never disagree. Deliberately not a percentage bar: the job's percent
|
|
* jumps 0→30 and 90→100 in single steps, and only the middle band tracks real
|
|
* work, so a linear percentage would read as motion the backend has not made.
|
|
*
|
|
* Nothing animates on a timer. A chapter under retry looks stalled here
|
|
* because it is stalled.
|
|
*/
|
|
|
|
"use client";
|
|
|
|
import type { ReportProgressView } from "@/lib/personal-report-progress";
|
|
|
|
export function PersonalReportProgressPanel({ progress }: { progress: ReportProgressView }) {
|
|
return (
|
|
<div className="report-progress">
|
|
<ol className="report-progress-track" aria-hidden="true">
|
|
{progress.chapters.map((chapter) => (
|
|
<li key={chapter.id} data-state={chapter.state} />
|
|
))}
|
|
</ol>
|
|
<ul className="report-progress-chapters">
|
|
{progress.chapters.map((chapter) => (
|
|
<li key={chapter.id} data-state={chapter.state}>
|
|
<span className="report-progress-chapter-name">{chapter.label}</span>
|
|
<span className="report-progress-chapter-status">{chapter.statusText}</span>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
);
|
|
}
|