diff --git a/.changeset/soft-oranges-act.md b/.changeset/soft-oranges-act.md new file mode 100644 index 0000000000..99ff63395f --- /dev/null +++ b/.changeset/soft-oranges-act.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-scaffolder-react': patch +--- + +Preserve step's time execution for a non-running task. diff --git a/plugins/scaffolder-react/src/next/components/TaskSteps/StepTime.tsx b/plugins/scaffolder-react/src/next/components/TaskSteps/StepTime.tsx index 653fe6e942..3f8fde748c 100644 --- a/plugins/scaffolder-react/src/next/components/TaskSteps/StepTime.tsx +++ b/plugins/scaffolder-react/src/next/components/TaskSteps/StepTime.tsx @@ -31,6 +31,16 @@ export const StepTime = (props: { const [time, setTime] = useState(''); const { step } = props; + const getDelay = () => { + if (step.startedAt && step.endedAt && time) { + return null; + } + if (step.startedAt && step.endedAt) { + return 1; + } + return 1000; + }; + const calculate = useCallback(() => { if (!step.startedAt) { setTime(''); @@ -49,9 +59,8 @@ export const StepTime = (props: { setTime(humanizeDuration(formatted, { round: true })); }, [step.endedAt, step.startedAt]); - useMountEffect(() => calculate()); - - useInterval(() => !step.endedAt && calculate(), 1000); + useMountEffect(calculate); + useInterval(calculate, getDelay()); return {time}; }; diff --git a/plugins/scaffolder-react/src/next/components/TaskSteps/TaskSteps.tsx b/plugins/scaffolder-react/src/next/components/TaskSteps/TaskSteps.tsx index d783351eca..96f0d9d865 100644 --- a/plugins/scaffolder-react/src/next/components/TaskSteps/TaskSteps.tsx +++ b/plugins/scaffolder-react/src/next/components/TaskSteps/TaskSteps.tsx @@ -59,7 +59,7 @@ export const TaskSteps = (props: TaskStepsProps) => { alternativeLabel variant="elevation" > - {props.steps.map((step, index) => { + {props.steps.map(step => { const isCompleted = step.status === 'completed'; const isFailed = step.status === 'failed'; const isActive = step.status === 'processing'; @@ -73,7 +73,7 @@ export const TaskSteps = (props: TaskStepsProps) => { }; return ( - +