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,7 +101,6 @@ const UpdateStage = ({ stage, status, percent, detail }) => {
|
|||||||
: StageIcon
|
: StageIcon
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Flex vertical gap={4}>
|
|
||||||
<Flex align='center' gap='middle'>
|
<Flex align='center' gap='middle'>
|
||||||
<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 }}>
|
||||||
@ -109,21 +108,22 @@ const UpdateStage = ({ stage, status, percent, detail }) => {
|
|||||||
{config.labels[resolvedStatus]}
|
{config.labels[resolvedStatus]}
|
||||||
</Text>
|
</Text>
|
||||||
{showProgress && (
|
{showProgress && (
|
||||||
|
<Flex vertical gap={4}>
|
||||||
<Progress
|
<Progress
|
||||||
percent={resolvedPercent}
|
percent={resolvedPercent}
|
||||||
status={getProgressStatus(resolvedStatus)}
|
status={getProgressStatus(resolvedStatus)}
|
||||||
showInfo={typeof resolvedPercent === 'number'}
|
showInfo={typeof resolvedPercent === 'number'}
|
||||||
style={{ flex: 1, margin: 0 }}
|
style={{ flex: 1, margin: 0 }}
|
||||||
/>
|
/>
|
||||||
)}
|
|
||||||
</Flex>
|
|
||||||
</Flex>
|
|
||||||
{detail && (
|
{detail && (
|
||||||
<Text type='secondary' style={{ marginLeft: 36 }}>
|
<Text type='secondary' style={{ marginLeft: 36 }}>
|
||||||
{detail}
|
{detail}
|
||||||
</Text>
|
</Text>
|
||||||
)}
|
)}
|
||||||
</Flex>
|
</Flex>
|
||||||
|
)}
|
||||||
|
</Flex>
|
||||||
|
</Flex>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user