Refactor UpdateStage component in AppUpdateProgress to streamline progress display and detail rendering, enhancing clarity and organization of update status information.
This commit is contained in:
parent
90204e4f10
commit
77ef061c15
@ -101,28 +101,28 @@ const UpdateStage = ({ stage, status, percent, detail }) => {
|
||||
: StageIcon
|
||||
|
||||
return (
|
||||
<Flex vertical gap={4}>
|
||||
<Flex align='center' gap='middle'>
|
||||
<StatusIcon style={{ fontSize: 20, color, flexShrink: 0 }} />
|
||||
<Flex align='center' gap='small' style={{ flex: 1, minWidth: 0 }}>
|
||||
<Text style={{ flexShrink: 0, minWidth: 96 }}>
|
||||
{config.labels[resolvedStatus]}
|
||||
</Text>
|
||||
{showProgress && (
|
||||
<Flex align='center' gap='middle'>
|
||||
<StatusIcon style={{ fontSize: 20, color, flexShrink: 0 }} />
|
||||
<Flex align='center' gap='small' style={{ flex: 1, minWidth: 0 }}>
|
||||
<Text style={{ flexShrink: 0, minWidth: 96 }}>
|
||||
{config.labels[resolvedStatus]}
|
||||
</Text>
|
||||
{showProgress && (
|
||||
<Flex vertical gap={4}>
|
||||
<Progress
|
||||
percent={resolvedPercent}
|
||||
status={getProgressStatus(resolvedStatus)}
|
||||
showInfo={typeof resolvedPercent === 'number'}
|
||||
style={{ flex: 1, margin: 0 }}
|
||||
/>
|
||||
)}
|
||||
</Flex>
|
||||
{detail && (
|
||||
<Text type='secondary' style={{ marginLeft: 36 }}>
|
||||
{detail}
|
||||
</Text>
|
||||
)}
|
||||
</Flex>
|
||||
)}
|
||||
</Flex>
|
||||
{detail && (
|
||||
<Text type='secondary' style={{ marginLeft: 36 }}>
|
||||
{detail}
|
||||
</Text>
|
||||
)}
|
||||
</Flex>
|
||||
)
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user