From 675a67cfdaf4556f303d8678efcff06807b4cfc6 Mon Sep 17 00:00:00 2001 From: Benjamin Lu Date: Fri, 2 Jan 2026 17:32:49 -0800 Subject: [PATCH] Support AMD GPUs on Desktop (#7799) Add AMD ROCm GPU option to the desktop installer ## What changed - Add an AMD GPU choice to the installer picker with updated recommended badge logic, logo asset, and i18n copy. - Accept and auto-select the new `amd` device type in the install flow when it is detected. - Update `@comfyorg/comfyui-electron-types` and lockfile entries required for the new device enum. ## Why - Desktop users with AMD GPUs need a first-class install path instead of falling back to CPU/manual options. - This reuses the existing picker/device model to keep the change scoped and consistent with current UX. - Tradeoffs: torch mirror selection still falls back to the CPU mirror for AMD until a dedicated ROCm mirror is available. ## Evidence - Interactive Storybook file `apps/desktop-ui/src/components/install/GpuPicker.stories.ts` image --- THIRD_PARTY_NOTICES.md | 1 + .../public/assets/images/amd-rocm-logo.png | Bin 0 -> 13730 bytes .../components/install/GpuPicker.stories.ts | 84 ++++++++++++++++++ .../src/components/install/GpuPicker.vue | 40 +++++---- .../install/HardwareOption.stories.ts | 5 -- .../src/components/install/HardwareOption.vue | 4 - .../install/InstallLocationPicker.vue | 5 +- .../components/maintenance/TaskListPanel.vue | 1 - apps/desktop-ui/src/views/InstallView.vue | 9 +- apps/desktop-ui/src/views/MaintenanceView.vue | 1 - package.json | 1 + pnpm-lock.yaml | 14 +-- pnpm-workspace.yaml | 2 +- src/locales/en/main.json | 4 +- 14 files changed, 129 insertions(+), 42 deletions(-) create mode 100644 THIRD_PARTY_NOTICES.md create mode 100644 apps/desktop-ui/public/assets/images/amd-rocm-logo.png create mode 100644 apps/desktop-ui/src/components/install/GpuPicker.stories.ts diff --git a/THIRD_PARTY_NOTICES.md b/THIRD_PARTY_NOTICES.md new file mode 100644 index 000000000..ff6a1191d --- /dev/null +++ b/THIRD_PARTY_NOTICES.md @@ -0,0 +1 @@ +AMD and the AMD Arrow logo are trademarks of Advanced Micro Devices, Inc. \ No newline at end of file diff --git a/apps/desktop-ui/public/assets/images/amd-rocm-logo.png b/apps/desktop-ui/public/assets/images/amd-rocm-logo.png new file mode 100644 index 0000000000000000000000000000000000000000..82de495cd439ad1de4f3156b0eaece546a38ed1e GIT binary patch literal 13730 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 literal 0 HcmV?d00001 diff --git a/apps/desktop-ui/src/components/install/GpuPicker.stories.ts b/apps/desktop-ui/src/components/install/GpuPicker.stories.ts new file mode 100644 index 000000000..d49893c38 --- /dev/null +++ b/apps/desktop-ui/src/components/install/GpuPicker.stories.ts @@ -0,0 +1,84 @@ +// eslint-disable-next-line storybook/no-renderer-packages +import type { Meta, StoryObj } from '@storybook/vue3' +import type { + ElectronAPI, + TorchDeviceType +} from '@comfyorg/comfyui-electron-types' +import { ref } from 'vue' + +import GpuPicker from './GpuPicker.vue' + +type Platform = ReturnType +type ElectronAPIStub = Pick +type WindowWithElectron = Window & { electronAPI?: ElectronAPIStub } + +const meta: Meta = { + title: 'Desktop/Components/GpuPicker', + component: GpuPicker, + parameters: { + layout: 'padded', + backgrounds: { + default: 'dark', + values: [ + { name: 'dark', value: '#0a0a0a' }, + { name: 'neutral-900', value: '#171717' }, + { name: 'neutral-950', value: '#0a0a0a' } + ] + } + } +} + +export default meta +type Story = StoryObj + +function createElectronDecorator(platform: Platform) { + function getPlatform() { + return platform + } + + return function ElectronDecorator() { + const windowWithElectron = window as WindowWithElectron + windowWithElectron.electronAPI = { getPlatform } + return { template: '' } + } +} + +function renderWithDevice(device: TorchDeviceType | null) { + return function Render() { + return { + components: { GpuPicker }, + setup() { + const selected = ref(device) + return { selected } + }, + template: ` +
+ +
+ ` + } + } +} + +const windowsDecorator = createElectronDecorator('win32') +const macDecorator = createElectronDecorator('darwin') + +export const WindowsNvidiaSelected: Story = { + decorators: [windowsDecorator], + render: renderWithDevice('nvidia') +} + +export const WindowsAmdSelected: Story = { + decorators: [windowsDecorator], + render: renderWithDevice('amd') +} + +export const WindowsCpuSelected: Story = { + decorators: [windowsDecorator], + render: renderWithDevice('cpu') +} + +export const MacMpsSelected: Story = { + decorators: [macDecorator], + render: renderWithDevice('mps') +} diff --git a/apps/desktop-ui/src/components/install/GpuPicker.vue b/apps/desktop-ui/src/components/install/GpuPicker.vue index 98dddb762..217e99ce5 100644 --- a/apps/desktop-ui/src/components/install/GpuPicker.vue +++ b/apps/desktop-ui/src/components/install/GpuPicker.vue @@ -11,29 +11,32 @@ - + @@ -41,7 +44,6 @@ @@ -81,13 +83,15 @@ const selected = defineModel('device', { const electron = electronAPI() const platform = electron.getPlatform() -const showRecommendedBadge = computed( - () => selected.value === 'mps' || selected.value === 'nvidia' +const recommendedDevices: TorchDeviceType[] = ['mps', 'nvidia', 'amd'] +const showRecommendedBadge = computed(() => + selected.value ? recommendedDevices.includes(selected.value) : false ) const descriptionKeys = { mps: 'appleMetal', nvidia: 'nvidia', + amd: 'amd', cpu: 'cpu', unsupported: 'manual' } as const @@ -97,7 +101,7 @@ const descriptionText = computed(() => { return st(`install.gpuPicker.${key}Description`, '') }) -const pickGpu = (value: TorchDeviceType) => { +function pickGpu(value: TorchDeviceType) { selected.value = value } diff --git a/apps/desktop-ui/src/components/install/HardwareOption.stories.ts b/apps/desktop-ui/src/components/install/HardwareOption.stories.ts index d830af49f..fc0e56713 100644 --- a/apps/desktop-ui/src/components/install/HardwareOption.stories.ts +++ b/apps/desktop-ui/src/components/install/HardwareOption.stories.ts @@ -29,7 +29,6 @@ export const AppleMetalSelected: Story = { imagePath: '/assets/images/apple-mps-logo.png', placeholderText: 'Apple Metal', subtitle: 'Apple Metal', - value: 'mps', selected: true } } @@ -39,7 +38,6 @@ export const AppleMetalUnselected: Story = { imagePath: '/assets/images/apple-mps-logo.png', placeholderText: 'Apple Metal', subtitle: 'Apple Metal', - value: 'mps', selected: false } } @@ -48,7 +46,6 @@ export const CPUOption: Story = { args: { placeholderText: 'CPU', subtitle: 'Subtitle', - value: 'cpu', selected: false } } @@ -57,7 +54,6 @@ export const ManualInstall: Story = { args: { placeholderText: 'Manual Install', subtitle: 'Subtitle', - value: 'unsupported', selected: false } } @@ -67,7 +63,6 @@ export const NvidiaSelected: Story = { imagePath: '/assets/images/nvidia-logo-square.jpg', placeholderText: 'NVIDIA', subtitle: 'NVIDIA', - value: 'nvidia', selected: true } } diff --git a/apps/desktop-ui/src/components/install/HardwareOption.vue b/apps/desktop-ui/src/components/install/HardwareOption.vue index ae254fd8f..9acc9e79c 100644 --- a/apps/desktop-ui/src/components/install/HardwareOption.vue +++ b/apps/desktop-ui/src/components/install/HardwareOption.vue @@ -36,17 +36,13 @@