Refactor UpdateStage in AppUpdateProgress to improve status resolution and progress display logic, ensuring accurate representation of update stages.

This commit is contained in:
Tom Butcher 2026-06-21 19:56:45 +01:00
parent 1b8f0b1445
commit ea7ceea202

View File

@ -86,15 +86,17 @@ const UpdateStage = ({ stage, status, percent, detail }) => {
const { token } = theme.useToken() const { token } = theme.useToken()
const config = STAGE_CONFIG[stage] const config = STAGE_CONFIG[stage]
const StageIcon = config.icon const StageIcon = config.icon
const color = getStageColor(status, token)
const showProgress = status === 'active'
const resolvedPercent = const resolvedPercent =
typeof percent === 'number' ? Math.min(percent, 100) : undefined typeof percent === 'number' ? Math.min(percent, 100) : undefined
const resolvedStatus =
status !== 'error' && resolvedPercent === 100 ? 'complete' : status
const color = getStageColor(resolvedStatus, token)
const showProgress = resolvedStatus === 'active'
const StatusIcon = const StatusIcon =
status === 'complete' resolvedStatus === 'complete'
? CheckCircleIcon ? CheckCircleIcon
: status === 'error' : resolvedStatus === 'error'
? XMarkCircleIcon ? XMarkCircleIcon
: StageIcon : StageIcon
@ -104,12 +106,12 @@ const UpdateStage = ({ stage, status, percent, detail }) => {
<StatusIcon style={{ fontSize: 20, color, flexShrink: 0 }} /> <StatusIcon style={{ fontSize: 20, color, flexShrink: 0 }} />
<Flex align='center' gap='small' style={{ flex: 1, minWidth: 0 }}> <Flex align='center' gap='small' style={{ flex: 1, minWidth: 0 }}>
<Text style={{ flexShrink: 0, minWidth: 96 }}> <Text style={{ flexShrink: 0, minWidth: 96 }}>
{config.labels[status]} {config.labels[resolvedStatus]}
</Text> </Text>
{showProgress && ( {showProgress && (
<Progress <Progress
percent={resolvedPercent} percent={resolvedPercent}
status={getProgressStatus(status)} status={getProgressStatus(resolvedStatus)}
showInfo={typeof resolvedPercent === 'number'} showInfo={typeof resolvedPercent === 'number'}
style={{ flex: 1, margin: 0 }} style={{ flex: 1, margin: 0 }}
/> />