diff --git a/web/src/components/repo/pipeline/PipelineStepList.vue b/web/src/components/repo/pipeline/PipelineStepList.vue
index a54f11cb1..7290fd603 100644
--- a/web/src/components/repo/pipeline/PipelineStepList.vue
+++ b/web/src/components/repo/pipeline/PipelineStepList.vue
@@ -140,14 +140,17 @@ defineEmits<{
 }>();
 
 const pipeline = toRef(props, 'pipeline');
+const selectedStepId = toRef(props, 'selectedStepId');
 const { prettyRef } = usePipeline(pipeline);
 
 const workflowsCollapsed = ref<Record<PipelineStep['id'], boolean>>(
-  props.pipeline.workflows && props.pipeline.workflows.length > 1
-    ? (props.pipeline.workflows || []).reduce(
+  pipeline.value.workflows && pipeline.value.workflows.length > 1
+    ? (pipeline.value.workflows || []).reduce(
         (collapsed, workflow) => ({
           ...collapsed,
-          [workflow.id]: ['success', 'skipped', 'blocked'].includes(workflow.state),
+          [workflow.id]:
+            ['success', 'skipped', 'blocked'].includes(workflow.state) &&
+            !workflow.children.some((child) => child.pid === selectedStepId.value),
         }),
         {},
       )
diff --git a/web/src/views/repo/pipeline/Pipeline.vue b/web/src/views/repo/pipeline/Pipeline.vue
index 5d64d6582..565bffdd2 100644
--- a/web/src/views/repo/pipeline/Pipeline.vue
+++ b/web/src/views/repo/pipeline/Pipeline.vue
@@ -122,7 +122,13 @@ const selectedStepId = computed({
   get() {
     if (stepId.value !== '' && stepId.value !== null && stepId.value !== undefined) {
       const id = parseInt(stepId.value, 10);
-      const step = pipeline.value?.workflows?.reduce(
+
+      let step = pipeline.value.workflows?.find((workflow) => workflow.pid === id)?.children[0];
+      if (step) {
+        return step.pid;
+      }
+
+      step = pipeline.value?.workflows?.reduce(
         (prev, p) => prev || p.children?.find((c) => c.pid === id),
         undefined as PipelineStep | undefined,
       );