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 (
-
+