github-issue-tower-defence-management 2.10.2 → 2.12.0

package/src/adapter/entry-points/cli/index.ts

@@ -34,6 +34,7 @@ import { projectCacheDirectory } from '../../repositories/localStorageCacheDirec
 import { NodeLocalCommandRunner } from '../../repositories/NodeLocalCommandRunner';
 import { NodeTmuxSessionRepository } from '../../repositories/NodeTmuxSessionRepository';
 import { ProcTakeOwnershipSpawnRepository } from '../../repositories/ProcTakeOwnershipSpawnRepository';
+import { CliGitHubGraphqlRateLimitRepository } from '../../repositories/CliGitHubGraphqlRateLimitRepository';
 import { DEFAULT_THRESHOLD_FOR_DISPATCH_LOOP } from '../../../domain/usecases/resolveNextStepAgentDispatchRepetition';
 import { ProxyClaudeTokenUsageRepository } from '../../repositories/ProxyClaudeTokenUsageRepository';
 import { SystemDateRepository } from '../../repositories/SystemDateRepository';
@@ -324,7 +325,7 @@ program
   )
   .option(
     '--fleetConfigFilePath <path>',
-    'Path to the fleet-wide YAML config file holding the preparationWorker mapping (normalConcurrentLimit); falls back to the TDPM_FLEET_CONFIG environment variable, and to the built-in values when neither is set',
+    'Path to the fleet-wide YAML config file holding the preparationWorker mapping (normalConcurrentLimit, maxConcurrentWorkers, graphqlRateLimitFloor); falls back to the TDPM_FLEET_CONFIG environment variable, and to the built-in values when neither is set',
   )
   .action(async (options: StartDaemonOptions) => {
     const token = process.env.GH_TOKEN;
@@ -423,8 +424,18 @@ program
     );
     const preparationWorkerSettings =
       loadPreparationWorkerSettings(fleetConfigFilePath);
+    const fleetConfigSource =
+      fleetConfigFilePath !== null
+        ? ' (source: fleetConfig)'
+        : ' (source: built-in default)';
     console.log(
-      `Effective normalConcurrentLimit: ${preparationWorkerSettings.normalConcurrentLimit}${fleetConfigFilePath !== null ? ' (source: fleetConfig)' : ' (source: built-in default)'}`,
+      `Effective normalConcurrentLimit: ${preparationWorkerSettings.normalConcurrentLimit}${fleetConfigSource}`,
+    );
+    console.log(
+      `Effective maxConcurrentWorkers: ${preparationWorkerSettings.maxConcurrentWorkers}${fleetConfigSource}`,
+    );
+    console.log(
+      `Effective graphqlRateLimitFloor: ${preparationWorkerSettings.graphqlRateLimitFloor}${fleetConfigSource}`,
     );
 
     const projectName = config.projectName ?? 'default';
@@ -496,6 +507,7 @@ program
       localCommandRunner,
       claudeTokenUsageRepository,
       new ProcTakeOwnershipSpawnRepository(),
+      new CliGitHubGraphqlRateLimitRepository(localCommandRunner),
     );
 
     const rawAllowedIssueAuthors = config.allowedIssueAuthors;
@@ -545,6 +557,8 @@ program
       labelsAsLlmAgentName: config.labelsAsLlmAgentName ?? null,
       agents: config.agents ?? null,
       normalConcurrentLimit: preparationWorkerSettings.normalConcurrentLimit,
+      maxConcurrentWorkers: preparationWorkerSettings.maxConcurrentWorkers,
+      graphqlRateLimitFloor: preparationWorkerSettings.graphqlRateLimitFloor,
     });
     if (preparationResult.rotationOrder !== null) {
       writeRotationOrderFile(preparationResult.rotationOrder);

package/src/adapter/entry-points/console/consoleTabNames.ts

@@ -6,6 +6,7 @@ export const CONSOLE_LIST_TAB_NAMES: ConsoleTabName[] = [
   'failed-preparation',
   'todo-by-human',
   'todo-by-agent',
+  'queued',
   'stories',
 ];
 

package/src/adapter/entry-points/console/ui/e2e/consoleScenario.spec.ts

@@ -533,6 +533,47 @@ test('changes the color of a story row via the color palette in the stories tab'
   await expect(palette).toHaveCount(0);
 });
 
+test('shows queued items grouped by story with colored status badges and navigates to detail on row click', async ({
+  page,
+}) => {
+  await page.goto(harness.appRootUrl);
+
+  await tabByLabel(page, 'Queued').click();
+  await expect(activeTabLabel(page)).toHaveText('Queued');
+  await expect(tabBadge(page, 'Queued')).toHaveText('2');
+
+  const awaitingRow = itemRowByText(
+    page,
+    'Add telemetry to the TDPM cost dashboard',
+  );
+  const prepRow = itemRowByText(
+    page,
+    'Migrate the rate-limit store to a shared Redis backend',
+  );
+  await expect(awaitingRow).toBeVisible();
+  await expect(prepRow).toBeVisible();
+
+  const awaitingStatusBadge = awaitingRow
+    .locator('.console-queued-item-badge')
+    .first();
+  await expect(awaitingStatusBadge).toHaveText('Awaiting Workspace');
+  const awaitingStyle = await awaitingStatusBadge.getAttribute('style');
+  expect(awaitingStyle).toContain('rgba(56, 139, 253');
+
+  const prepStatusBadge = prepRow.locator('.console-queued-item-badge').first();
+  await expect(prepStatusBadge).toHaveText('Preparation');
+  const prepStyle = await prepStatusBadge.getAttribute('style');
+  expect(prepStyle).toContain('rgba(187, 128, 9');
+
+  const prepAgentBadge = prepRow.locator('.console-queued-item-badge').nth(1);
+  await expect(prepAgentBadge).toHaveText('developer');
+
+  await awaitingRow.click();
+  await expect(page).toHaveURL(/PVTI_lADOABCD1234zgQUE00930/, {
+    timeout: 3000,
+  });
+});
+
 test('posts a comment and moves the item to Awaiting Workspace when the Comment & Awaiting Workspace button is clicked', async ({
   page,
 }) => {

package/src/adapter/entry-points/console/ui/e2e/consoleTestHarness.ts

@@ -87,8 +87,10 @@ type ConsoleFixtureSnapshot = {
   pjcode: string;
   generatedAt: string;
   statusOptions: ConsoleFixtureFieldOption[];
+  agentOptions: ConsoleFixtureFieldOption[];
   storyOptions: ConsoleFixtureFieldOption[];
   storyColors: Record<string, { color: string }>;
+  storyOrder: string[];
   items: ConsoleFixtureListItem[];
 };
 
@@ -132,6 +134,11 @@ const STATUS_OPTIONS: ConsoleFixtureFieldOption[] = [
   { id: 'e9f6a726', name: 'In Tmux by agent', color: 'YELLOW' },
 ];
 
+const AGENT_OPTIONS: ConsoleFixtureFieldOption[] = [
+  { id: 'agt00001', name: 'developer', color: 'BLUE' },
+  { id: 'agt00002', name: 'chore', color: 'GRAY' },
+];
+
 const STORY_OPTIONS: ConsoleFixtureFieldOption[] = [
   { id: '1491051e', name: 'TDPM Console port', color: 'BLUE' },
   { id: '28415d6c', name: 'regular / workflow improvement', color: 'GRAY' },
@@ -204,12 +211,16 @@ const pullRequestItem = (
 
 const buildSnapshot = (
   items: ConsoleFixtureListItem[],
+  agentOptions: ConsoleFixtureFieldOption[] = [],
+  storyOrder: string[] = [],
 ): ConsoleFixtureSnapshot => ({
   pjcode: CONSOLE_E2E_PJCODE,
   generatedAt: '2026-06-18T01:22:09.000Z',
   statusOptions: STATUS_OPTIONS,
+  agentOptions,
   storyOptions: STORY_OPTIONS,
   storyColors: STORY_COLORS,
+  storyOrder,
   items,
 });
 
@@ -265,6 +276,29 @@ export const CONSOLE_E2E_TAB_ITEMS: Record<string, ConsoleFixtureListItem[]> = {
       agent: 'developer',
     },
   ],
+  queued: [
+    {
+      ...issueItem(
+        930,
+        'Add telemetry to the TDPM cost dashboard',
+        'QUE00930',
+        'TDPM Console port',
+        '2026-06-18T02:00:00.000Z',
+      ),
+      status: 'Awaiting Workspace',
+    },
+    {
+      ...issueItem(
+        931,
+        'Migrate the rate-limit store to a shared Redis backend',
+        'QUE00931',
+        'regular / workflow improvement',
+        '2026-06-18T02:30:00.000Z',
+      ),
+      status: 'Preparation',
+      agent: 'developer',
+    },
+  ],
 };
 
 const CONSOLE_E2E_STORIES_SNAPSHOT = {
@@ -310,13 +344,20 @@ const CONSOLE_E2E_STORIES_SNAPSHOT = {
   defaultNameWithOwner: REPO_NAME_WITH_OWNER,
 };
 
+const QUEUED_STORY_ORDER = [
+  'TDPM Console port',
+  'regular / workflow improvement',
+];
+
 const writeFixtureData = (consoleDataOutputDir: string): void => {
   for (const [tab, items] of Object.entries(CONSOLE_E2E_TAB_ITEMS)) {
     const tabDir = path.join(consoleDataOutputDir, CONSOLE_E2E_PJCODE, tab);
     fs.mkdirSync(tabDir, { recursive: true });
+    const agentOptions = tab === 'queued' ? AGENT_OPTIONS : [];
+    const storyOrder = tab === 'queued' ? QUEUED_STORY_ORDER : [];
     fs.writeFileSync(
       path.join(tabDir, 'list.json'),
-      JSON.stringify(buildSnapshot(items)),
+      JSON.stringify(buildSnapshot(items, agentOptions, storyOrder)),
     );
   }
   const storiesTabDir = path.join(
@@ -367,7 +408,16 @@ const buildE2eProject = (): Project => ({
   remainingEstimationMinutes: null,
   dependedIssueUrlSeparatedByComma: null,
   completionDate50PercentConfidence: null,
-  agent: null,
+  agent: {
+    name: 'Agent',
+    fieldId: 'PVTSSF_agent',
+    options: AGENT_OPTIONS.map((option) => ({
+      id: option.id,
+      name: option.name,
+      color: option.color as Project['status']['statuses'][number]['color'],
+      description: '',
+    })),
+  },
 });
 
 const buildIssueForUrl = (url: string): Issue => ({

package/src/adapter/entry-points/console/ui/src/features/console/components/layout/ConsoleTabList.stories.tsx

@@ -36,6 +36,7 @@ const counts: Record<ConsoleTabName, number> = {
   'failed-preparation': 2,
   'todo-by-human': 66,
   'todo-by-agent': 24,
+  queued: 8,
   stories: 3,
 };
 
@@ -63,6 +64,7 @@ export const ZeroCountTabsHidden: Story = {
       'failed-preparation': 0,
       'todo-by-human': 18,
       'todo-by-agent': 0,
+      queued: 0,
       stories: 0,
     },
   },
@@ -77,6 +79,7 @@ export const ZeroCountActiveTabStaysVisible: Story = {
       'failed-preparation': 0,
       'todo-by-human': 18,
       'todo-by-agent': 0,
+      queued: 0,
       stories: 0,
     },
   },
@@ -91,6 +94,7 @@ export const AfterAutoAdvanceToNextTab: Story = {
       'failed-preparation': 2,
       'todo-by-human': 4,
       'todo-by-agent': 0,
+      queued: 0,
       stories: 0,
     },
     onSelectTab: () => {},

package/src/adapter/entry-points/console/ui/src/features/console/components/layout/ConsoleTabList.test.tsx

@@ -8,6 +8,7 @@ const counts: Record<ConsoleTabName, number> = {
   'failed-preparation': 0,
   'todo-by-human': 2,
   'todo-by-agent': 3,
+  queued: 0,
   stories: 0,
 };
 

package/src/adapter/entry-points/console/ui/src/features/console/components/list/ConsoleItemList.stories.tsx

@@ -3,6 +3,7 @@ import { buildConsoleListRows } from '../../logic/grouping';
 import type { ConsoleOverlay } from '../../logic/types';
 import {
   consoleListItemsFixture,
+  consoleStatusOptionsFixture,
   consoleStoryColorsFixture,
 } from '../../testing/fixtures';
 import { ConsoleItemList } from './ConsoleItemList';
@@ -10,7 +11,10 @@ import { ConsoleItemList } from './ConsoleItemList';
 const meta: Meta<typeof ConsoleItemList> = {
   title: 'Console/ConsoleItemList',
   component: ConsoleItemList,
-  args: { now: Date.parse('2026-06-19T12:00:00.000Z') },
+  args: {
+    now: Date.parse('2026-06-19T12:00:00.000Z'),
+    statusOptions: consoleStatusOptionsFixture,
+  },
 };
 
 export default meta;

package/src/adapter/entry-points/console/ui/src/features/console/components/list/ConsoleItemList.tsx

@@ -3,6 +3,7 @@ import {
   resolveStoryColorEnum,
 } from '../../logic/grouping';
 import type {
+  ConsoleFieldOption,
   ConsoleListItem,
   ConsoleStoryColorSource,
 } from '../../logic/types';
@@ -12,6 +13,7 @@ import { ConsoleStorySummary } from './ConsoleStorySummary';
 export type ConsoleListViewProps = {
   rows: ConsoleListRow[];
   storyColors: ConsoleStoryColorSource;
+  statusOptions?: ConsoleFieldOption[];
   activeItemId: string | null;
   now: number;
   isLoading: boolean;
@@ -22,6 +24,7 @@ export type ConsoleListViewProps = {
 export const ConsoleItemList = ({
   rows,
   storyColors,
+  statusOptions = [],
   activeItemId,
   now,
   isLoading,
@@ -61,6 +64,7 @@ export const ConsoleItemList = ({
               item={row.item}
               isActive={row.item.itemId === activeItemId}
               now={now}
+              statusOptions={statusOptions}
               onSelect={onSelectItem}
             />
           </li>

package/src/adapter/entry-points/console/ui/src/features/console/components/list/ConsoleItemSummary.stories.tsx

@@ -1,11 +1,18 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
-import { consoleListItemsFixture } from '../../testing/fixtures';
+import {
+  consoleListItemsFixture,
+  consoleStatusOptionsFixture,
+} from '../../testing/fixtures';
 import { ConsoleItemSummary } from './ConsoleItemSummary';
 
 const meta: Meta<typeof ConsoleItemSummary> = {
   title: 'Console/ConsoleItemSummary',
   component: ConsoleItemSummary,
-  args: { onSelect: () => {}, now: Date.parse('2026-06-19T12:00:00.000Z') },
+  args: {
+    onSelect: () => {},
+    now: Date.parse('2026-06-19T12:00:00.000Z'),
+    statusOptions: consoleStatusOptionsFixture,
+  },
 };
 
 export default meta;

package/src/adapter/entry-points/console/ui/src/features/console/components/list/ConsoleItemSummary.test.tsx

@@ -1,6 +1,9 @@
 import { fireEvent, render } from '@testing-library/react';
 import { formatFullTimestamp } from '../../logic/relativeTime';
-import { consoleListItemsFixture } from '../../testing/fixtures';
+import {
+  consoleListItemsFixture,
+  consoleStatusOptionsFixture,
+} from '../../testing/fixtures';
 import { ConsoleItemSummary } from './ConsoleItemSummary';
 
 const now = Date.parse('2026-06-19T12:00:00.000Z');
@@ -174,4 +177,37 @@ describe('ConsoleItemSummary', () => {
     );
     expect(queryByText('Agent')).not.toBeInTheDocument();
   });
+
+  it('applies the Project V2 status color from statusOptions to the status badge', () => {
+    const awaitingWorkspaceItem = {
+      ...prItem,
+      status: 'Awaiting Workspace',
+    };
+    const { getByText } = render(
+      <ConsoleItemSummary
+        item={awaitingWorkspaceItem}
+        isActive={false}
+        now={now}
+        statusOptions={consoleStatusOptionsFixture}
+        onSelect={() => {}}
+      />,
+    );
+    const badge = getByText('Awaiting Workspace');
+    expect(badge.style.backgroundColor).toBe('rgba(56, 139, 253, 0.1)');
+    expect(badge.style.color).toBe('rgb(56, 139, 253)');
+  });
+
+  it('applies gray color to the status badge when statusOptions is empty', () => {
+    const { getByText } = render(
+      <ConsoleItemSummary
+        item={prItem}
+        isActive={false}
+        now={now}
+        statusOptions={[]}
+        onSelect={() => {}}
+      />,
+    );
+    const badge = getByText(prItem.status as string);
+    expect(badge.style.backgroundColor).toBe('rgba(110, 118, 129, 0.1)');
+  });
 });

package/src/adapter/entry-points/console/ui/src/features/console/components/list/ConsoleItemSummary.tsx

@@ -1,14 +1,16 @@
+import { badgeStyle } from '../../logic/colors';
 import {
   formatFullTimestamp,
   formatRelativeTime,
 } from '../../logic/relativeTime';
-import type { ConsoleListItem } from '../../logic/types';
+import type { ConsoleFieldOption, ConsoleListItem } from '../../logic/types';
 import { ConsoleItemIcon } from '../detail/ConsoleItemIcon';
 
 export type ConsoleListItemRowProps = {
   item: ConsoleListItem;
   isActive: boolean;
   now: number;
+  statusOptions?: ConsoleFieldOption[];
   onSelect: (item: ConsoleListItem) => void;
 };
 
@@ -16,6 +18,7 @@ export const ConsoleItemSummary = ({
   item,
   isActive,
   now,
+  statusOptions = [],
   onSelect,
 }: ConsoleListItemRowProps) => (
   <button
@@ -68,7 +71,15 @@ export const ConsoleItemSummary = ({
           {item.status !== null && item.status !== '' && (
             <span className="console-item-field">
               <span className="console-item-field-label">Status</span>
-              {item.status}
+              <span
+                className="console-item-status-badge"
+                style={badgeStyle(
+                  statusOptions.find((o) => o.name === item.status)?.color ??
+                    null,
+                )}
+              >
+                {item.status}
+              </span>
             </span>
           )}
           {item.agent !== null && item.agent !== '' && (

package/src/adapter/entry-points/console/ui/src/features/console/components/list/ConsoleQueuedItemRow.stories.tsx

@@ -0,0 +1,50 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import {
+  consoleAgentOptionsFixture,
+  consoleListItemsFixture,
+  consoleStatusOptionsFixture,
+} from '../../testing/fixtures';
+import { ConsoleQueuedItemRow } from './ConsoleQueuedItemRow';
+
+const meta: Meta<typeof ConsoleQueuedItemRow> = {
+  title: 'Console/ConsoleQueuedItemRow',
+  component: ConsoleQueuedItemRow,
+  args: {
+    onSelect: () => {},
+    statusOptions: consoleStatusOptionsFixture,
+    agentOptions: consoleAgentOptionsFixture,
+    isActive: false,
+  },
+};
+
+export default meta;
+
+type Story = StoryObj<typeof ConsoleQueuedItemRow>;
+
+export const AwaitingWorkspaceRow: Story = {
+  args: {
+    item: {
+      ...consoleListItemsFixture[1],
+      status: 'Awaiting Workspace',
+      agent: null,
+    },
+  },
+};
+
+export const PreparationWithAgent: Story = {
+  args: { item: consoleListItemsFixture[5] },
+};
+
+export const PreparationNoAgent: Story = {
+  args: {
+    item: {
+      ...consoleListItemsFixture[1],
+      status: 'Preparation',
+      agent: null,
+    },
+  },
+};
+
+export const ActiveRow: Story = {
+  args: { item: consoleListItemsFixture[5], isActive: true },
+};

package/src/adapter/entry-points/console/ui/src/features/console/components/list/ConsoleQueuedItemRow.test.tsx

@@ -0,0 +1,98 @@
+import { fireEvent, render } from '@testing-library/react';
+import {
+  consoleAgentOptionsFixture,
+  consoleListItemsFixture,
+  consoleStatusOptionsFixture,
+} from '../../testing/fixtures';
+import { ConsoleQueuedItemRow } from './ConsoleQueuedItemRow';
+
+const awaitingWorkspaceItem = {
+  ...consoleListItemsFixture[1],
+  status: 'Awaiting Workspace',
+  agent: null,
+  dependedIssueUrls: [],
+};
+const preparationWithAgentItem = consoleListItemsFixture[5];
+
+describe('ConsoleQueuedItemRow', () => {
+  it('renders the item title', () => {
+    const { getByText } = render(
+      <ConsoleQueuedItemRow
+        item={awaitingWorkspaceItem}
+        isActive={false}
+        statusOptions={consoleStatusOptionsFixture}
+        agentOptions={consoleAgentOptionsFixture}
+        onSelect={() => {}}
+      />,
+    );
+    expect(getByText(awaitingWorkspaceItem.title)).toBeInTheDocument();
+  });
+
+  it('renders the status badge with Project V2 color', () => {
+    const { getByText } = render(
+      <ConsoleQueuedItemRow
+        item={awaitingWorkspaceItem}
+        isActive={false}
+        statusOptions={consoleStatusOptionsFixture}
+        agentOptions={consoleAgentOptionsFixture}
+        onSelect={() => {}}
+      />,
+    );
+    const badge = getByText('Awaiting Workspace');
+    expect(badge.style.backgroundColor).toBe('rgba(56, 139, 253, 0.1)');
+  });
+
+  it('renders the agent badge when the item has an agent', () => {
+    const { getByText } = render(
+      <ConsoleQueuedItemRow
+        item={preparationWithAgentItem}
+        isActive={false}
+        statusOptions={consoleStatusOptionsFixture}
+        agentOptions={consoleAgentOptionsFixture}
+        onSelect={() => {}}
+      />,
+    );
+    expect(getByText('developer')).toBeInTheDocument();
+  });
+
+  it('omits the agent badge when agent is null', () => {
+    const { queryByText } = render(
+      <ConsoleQueuedItemRow
+        item={awaitingWorkspaceItem}
+        isActive={false}
+        statusOptions={consoleStatusOptionsFixture}
+        agentOptions={consoleAgentOptionsFixture}
+        onSelect={() => {}}
+      />,
+    );
+    expect(queryByText('developer')).not.toBeInTheDocument();
+  });
+
+  it('calls onSelect with the item on click', () => {
+    const onSelect = jest.fn();
+    const { getByRole } = render(
+      <ConsoleQueuedItemRow
+        item={awaitingWorkspaceItem}
+        isActive={false}
+        statusOptions={consoleStatusOptionsFixture}
+        agentOptions={consoleAgentOptionsFixture}
+        onSelect={onSelect}
+      />,
+    );
+    fireEvent.click(getByRole('button'));
+    expect(onSelect).toHaveBeenCalledWith(awaitingWorkspaceItem);
+  });
+
+  it('marks the active row with data-active', () => {
+    const { getByRole } = render(
+      <ConsoleQueuedItemRow
+        item={awaitingWorkspaceItem}
+        isActive
+        statusOptions={consoleStatusOptionsFixture}
+        agentOptions={consoleAgentOptionsFixture}
+        onSelect={() => {}}
+      />,
+    );
+    expect(getByRole('button')).toHaveAttribute('data-active', 'true');
+  });
+});

package/src/adapter/entry-points/console/ui/src/features/console/components/list/ConsoleQueuedItemRow.tsx

@@ -0,0 +1,66 @@
+import { badgeStyle } from '../../logic/colors';
+import type { ConsoleFieldOption, ConsoleListItem } from '../../logic/types';
+import { ConsoleItemIcon } from '../detail/ConsoleItemIcon';
+
+export type ConsoleQueuedItemRowProps = {
+  item: ConsoleListItem;
+  isActive: boolean;
+  statusOptions: ConsoleFieldOption[];
+  agentOptions: ConsoleFieldOption[];
+  onSelect: (item: ConsoleListItem) => void;
+};
+
+const queuedBadgeStyle = (colorEnum: string | null) => ({
+  ...badgeStyle(colorEnum),
+  fontSize: '12px',
+  whiteSpace: 'nowrap' as const,
+  flexShrink: 0,
+});
+
+export const ConsoleQueuedItemRow = ({
+  item,
+  isActive,
+  statusOptions,
+  agentOptions,
+  onSelect,
+}: ConsoleQueuedItemRowProps) => {
+  const statusOption = statusOptions.find((o) => o.name === item.status);
+  const agentOption = agentOptions.find((o) => o.name === item.agent);
+
+  return (
+    <button
+      type="button"
+      className="console-item-row console-queued-item-row"
+      aria-current={isActive ? 'true' : undefined}
+      data-active={isActive ? 'true' : undefined}
+      onClick={() => onSelect(item)}
+    >
+      <ConsoleItemIcon
+        isPr={item.isPr}
+        state="open"
+        merged={false}
+        isDraft={false}
+        stateReason=""
+      />
+      <span className="console-queued-item-title">{item.title}</span>
+      <span className="console-queued-item-badges">
+        {item.status !== null && item.status !== '' && (
+          <span
+            className="console-queued-item-badge"
+            style={queuedBadgeStyle(statusOption?.color ?? null)}
+          >
+            {item.status}
+          </span>
+        )}
+        {item.agent !== null && item.agent !== '' && (
+          <span
+            className="console-queued-item-badge"
+            style={queuedBadgeStyle(agentOption?.color ?? null)}
+          >
+            {item.agent}
+          </span>
+        )}
+      </span>
+    </button>
+  );
+};