From c972dca61ef4147e4f16bfb2dfeecdcf761c74b2 Mon Sep 17 00:00:00 2001
From: Benjamin Lu <benjaminlu1107@gmail.com>
Date: Sun, 22 Feb 2026 00:40:43 -0800
Subject: [PATCH] fix: remove duplicate running indicator from queue header
 (#9032)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Summary
Remove the extra running-workflow indicator from the expanded Queue
Progress Overlay header to avoid duplicate running-count signals.

## Changes
- Remove `showConcurrentIndicator` and `concurrentWorkflowCount` props
from `QueueOverlayHeader`.
- Stop passing those props through `QueueOverlayExpanded` and
`QueueProgressOverlay`.
- Simplify `QueueOverlayHeader` tests to reflect the updated header
behavior.

## Why
The expanded header was showing redundant running status information
alongside existing running/queued summaries.

Prevent this:
<img width="240" height="92" alt="image"
src="https://github.com/user-attachments/assets/f4b1775c-b347-46f7-8668-3a1054365ada"
/>

Design:
https://www.figma.com/design/LVilZgHGk5RwWOkVN6yCEK/Queue-Progress-Modal?node-id=4024-28147&m=dev

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-9032-fix-remove-duplicate-running-indicator-from-queue-header-30d6d73d365081d19041de2f1b0c8886)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Johnpaul Chiwetelu <49923152+Myestery@users.noreply.github.com>
Co-authored-by: GitHub Action <action@github.com>
---
 src/components/queue/QueueOverlayExpanded.vue |  4 ----
 .../queue/QueueOverlayHeader.test.ts          | 19 ++-----------------
 src/components/queue/QueueOverlayHeader.vue   | 14 --------------
 src/components/queue/QueueProgressOverlay.vue |  9 ---------
 .../assets/components/MediaVideoTop.test.ts   |  1 -
 5 files changed, 2 insertions(+), 45 deletions(-)

diff --git a/src/components/queue/QueueOverlayExpanded.vue b/src/components/queue/QueueOverlayExpanded.vue
index f7a5be55d..cfde91f63 100644
--- a/src/components/queue/QueueOverlayExpanded.vue
+++ b/src/components/queue/QueueOverlayExpanded.vue
@@ -2,8 +2,6 @@
   <div class="flex w-full flex-col gap-4">
     <QueueOverlayHeader
       :header-title="headerTitle"
-      :show-concurrent-indicator="showConcurrentIndicator"
-      :concurrent-workflow-count="concurrentWorkflowCount"
       :queued-count="queuedCount"
       @clear-history="$emit('clearHistory')"
       @clear-queued="$emit('clearQueued')"
@@ -60,8 +58,6 @@ import JobGroupsList from './job/JobGroupsList.vue'
 
 defineProps<{
   headerTitle: string
-  showConcurrentIndicator: boolean
-  concurrentWorkflowCount: number
   queuedCount: number
   selectedJobTab: JobTab
   selectedWorkflowFilter: 'all' | 'current'
diff --git a/src/components/queue/QueueOverlayHeader.test.ts b/src/components/queue/QueueOverlayHeader.test.ts
index 9487bd30b..8f72ac4bb 100644
--- a/src/components/queue/QueueOverlayHeader.test.ts
+++ b/src/components/queue/QueueOverlayHeader.test.ts
@@ -51,7 +51,6 @@ const i18n = createI18n({
       g: { more: 'More' },
       sideToolbar: {
         queueProgressOverlay: {
-          running: 'running',
           queuedSuffix: 'queued',
           clearQueued: 'Clear queued',
           clearQueueTooltip: 'Clear queue',
@@ -69,8 +68,6 @@ const mountHeader = (props = {}) =>
   mount(QueueOverlayHeader, {
     props: {
       headerTitle: 'Job queue',
-      showConcurrentIndicator: true,
-      concurrentWorkflowCount: 2,
       queuedCount: 3,
       ...props
     },
@@ -86,21 +83,9 @@ describe('QueueOverlayHeader', () => {
     mockSetSetting.mockClear()
   })
 
-  it('renders header title and concurrent indicator when enabled', () => {
-    const wrapper = mountHeader({ concurrentWorkflowCount: 3 })
-
+  it('renders header title', () => {
+    const wrapper = mountHeader()
     expect(wrapper.text()).toContain('Job queue')
-    const indicator = wrapper.find('.inline-flex.items-center.gap-1')
-    expect(indicator.exists()).toBe(true)
-    expect(indicator.text()).toContain('3')
-    expect(indicator.text()).toContain('running')
-  })
-
-  it('hides concurrent indicator when flag is false', () => {
-    const wrapper = mountHeader({ showConcurrentIndicator: false })
-
-    expect(wrapper.text()).toContain('Job queue')
-    expect(wrapper.find('.inline-flex.items-center.gap-1').exists()).toBe(false)
   })
 
   it('shows clear queue text and emits clear queued', async () => {
diff --git a/src/components/queue/QueueOverlayHeader.vue b/src/components/queue/QueueOverlayHeader.vue
index 3de6005cb..d7a427fe8 100644
--- a/src/components/queue/QueueOverlayHeader.vue
+++ b/src/components/queue/QueueOverlayHeader.vue
@@ -4,18 +4,6 @@
   >
     <div class="min-w-0 flex-1 px-2 text-[14px] font-normal text-text-primary">
       <span>{{ headerTitle }}</span>
-      <span
-        v-if="showConcurrentIndicator"
-        class="ml-4 inline-flex items-center gap-1 text-blue-100"
-      >
-        <span class="inline-block size-2 rounded-full bg-blue-100" />
-        <span>
-          <span class="font-bold">{{ concurrentWorkflowCount }}</span>
-          <span class="ml-1">{{
-            t('sideToolbar.queueProgressOverlay.running')
-          }}</span>
-        </span>
-      </span>
     </div>
     <div
       class="inline-flex h-6 items-center gap-2 text-[12px] leading-none text-text-primary"
@@ -48,8 +36,6 @@ import { buildTooltipConfig } from '@/composables/useTooltipConfig'
 
 defineProps<{
   headerTitle: string
-  showConcurrentIndicator: boolean
-  concurrentWorkflowCount: number
   queuedCount: number
 }>()
 
diff --git a/src/components/queue/QueueProgressOverlay.vue b/src/components/queue/QueueProgressOverlay.vue
index d6eca5ed4..d5f909876 100644
--- a/src/components/queue/QueueProgressOverlay.vue
+++ b/src/components/queue/QueueProgressOverlay.vue
@@ -17,8 +17,6 @@
         v-model:selected-sort-mode="selectedSortMode"
         class="flex-1 min-h-0"
         :header-title="headerTitle"
-        :show-concurrent-indicator="showConcurrentIndicator"
-        :concurrent-workflow-count="concurrentWorkflowCount"
         :queued-count="queuedCount"
         :displayed-job-groups="displayedJobGroups"
         :has-failed-jobs="hasFailedJobs"
@@ -183,13 +181,6 @@ const headerTitle = computed(() => {
   })
 })
 
-const concurrentWorkflowCount = computed(
-  () => executionStore.runningWorkflowCount
-)
-const showConcurrentIndicator = computed(
-  () => concurrentWorkflowCount.value > 1
-)
-
 const {
   selectedJobTab,
   selectedWorkflowFilter,
diff --git a/src/platform/assets/components/MediaVideoTop.test.ts b/src/platform/assets/components/MediaVideoTop.test.ts
index dcc82e379..d871145bb 100644
--- a/src/platform/assets/components/MediaVideoTop.test.ts
+++ b/src/platform/assets/components/MediaVideoTop.test.ts
@@ -49,7 +49,6 @@ describe('MediaVideoTop', () => {
     expect(wrapper.find('video').exists()).toBe(true)
     expect(wrapper.find('source').exists()).toBe(false)
   })
-
   it('emits playback events and hides paused overlay while playing', async () => {
     const wrapper = mount(MediaVideoTop, {
       props: {