feat(KB-192): move progress bars to top of definition tab
- Reposition progress indicator bars to the top of the definition tab in TaskDetailModal - Add changeset for the UI improvement
This commit is contained in:
@@ -706,6 +706,28 @@ export function TaskDetailModal({
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
<div className="detail-section detail-step-progress">
|
||||
<h4>Progress</h4>
|
||||
{task.steps && task.steps.length > 0 ? (
|
||||
<div className="step-progress-wrapper">
|
||||
<div className="step-progress-bar">
|
||||
{task.steps.map((step, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className={`step-progress-segment step-progress-segment--${step.status}`}
|
||||
data-tooltip={`${step.name} (${step.status})`}
|
||||
style={{ backgroundColor: getStepStatusColor(step.status) }}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
<span className="step-progress-label">
|
||||
{task.steps.filter(s => s.status === "done").length}/{task.steps.length} steps
|
||||
</span>
|
||||
</div>
|
||||
) : (
|
||||
<div className="step-progress-empty">(no steps defined)</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="detail-section">
|
||||
{task.prompt ? (
|
||||
<div className="markdown-body">
|
||||
@@ -884,28 +906,6 @@ export function TaskDetailModal({
|
||||
})()}
|
||||
</div>
|
||||
</div>
|
||||
<div className="detail-section detail-step-progress">
|
||||
<h4>Progress</h4>
|
||||
{task.steps && task.steps.length > 0 ? (
|
||||
<div className="step-progress-wrapper">
|
||||
<div className="step-progress-bar">
|
||||
{task.steps.map((step, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className={`step-progress-segment step-progress-segment--${step.status}`}
|
||||
data-tooltip={`${step.name} (${step.status})`}
|
||||
style={{ backgroundColor: getStepStatusColor(step.status) }}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
<span className="step-progress-label">
|
||||
{task.steps.filter(s => s.status === "done").length}/{task.steps.length} steps
|
||||
</span>
|
||||
</div>
|
||||
) : (
|
||||
<div className="step-progress-empty">(no steps defined)</div>
|
||||
)}
|
||||
</div>
|
||||
{/* PR Section - only for in-review tasks */}
|
||||
{task.column === "in-review" && (
|
||||
<PrSection
|
||||
|
||||
Reference in New Issue
Block a user