Skip to content

[Frontend] Dashboard multi-GPU display with GPU selector #1300

@shm11C3

Description

@shm11C3

Parent: #1296
Depends on: #1299

Problem

The dashboard always displays real-time data for the first GPU only:

  • DashboardItems.tsx matches GPU data to hardwareInfo.gpus?.[0]
  • Doughnut charts and temperature display reflect only one GPU
  • No way for users to switch between GPUs in the real-time view

Proposed Changes

1. Add GPU selector to dashboard GPU card

When hardwareInfo.gpus has more than one entry, display a selector (tabs or dropdown) in the GPU section header that writes to selectedGpuIdAtom.

For single-GPU systems, no selector is shown — behavior is identical to current.

2. Update real-time data binding

  • Doughnut chart (GPU usage %) reads from the selected GPU's history via graphicUsageHistoryAtom (derived atom from [Frontend] Redesign atoms and event listener for multi-GPU #1299)
  • Temperature display reads from gpuTempAtom filtered by selected GPU name
  • Dedicated memory reads from gpuDedicatedMemoryKbMapAtom[selectedGpuId]
  • Fan speed reads from gpuFanSpeedAtom filtered by selected GPU name

3. Update getTargetInfo helper

Currently returns hardwareInfo.gpus?.[0]. Should return the GPU matching selectedGpuIdAtom, falling back to gpus[0].

4. GPU info table

The info table already loops over hardwareInfo.gpus to display all GPUs — this stays the same.

Affected Files

  • src/features/hardware/dashboard/components/DashboardItems.tsx
  • Potentially src/features/hardware/usage/Usage.tsx (if GPU selector applies to usage page too)

UX Notes

  • GPU selector should persist across page navigation (stored in selectedGpuIdAtom)
  • Default selection: first GPU in the list
  • Each GPU entry in the selector should show the GPU name (e.g., "AMD Radeon RX 7900 XTX", "AMD Radeon Graphics")

Metadata

Metadata

Assignees

No one assigned

    Projects

    Status
    Done

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions