diff --git a/packages/shared-frontend-utils/src/formatUtil.ts b/packages/shared-frontend-utils/src/formatUtil.ts
index cb1a0d1a3..032d1c9ed 100644
--- a/packages/shared-frontend-utils/src/formatUtil.ts
+++ b/packages/shared-frontend-utils/src/formatUtil.ts
@@ -75,6 +75,17 @@ export function formatSize(value?: number) {
return `${parseFloat((bytes / Math.pow(k, i)).toFixed(2))} ${sizes[i]}`
}
+/**
+ * Formats a commit hash by truncating long (40-char) hashes to 7 chars.
+ * Returns the original string if not a valid full commit hash.
+ */
+export function formatCommitHash(value: string): string {
+ if (/^[a-f0-9]{40}$/i.test(value)) {
+ return value.slice(0, 7)
+ }
+ return value
+}
+
/**
* Returns various filename components.
* Example:
diff --git a/src/components/common/SystemStatsPanel.vue b/src/components/common/SystemStatsPanel.vue
index 1d3612aa2..5d3cd8965 100644
--- a/src/components/common/SystemStatsPanel.vue
+++ b/src/components/common/SystemStatsPanel.vue
@@ -9,29 +9,31 @@
{{ col.header }}
- {{ formatValue(systemInfo[col.field], col.field) }}
+ {{ getDisplayValue(col) }}
-
+
+
-
-
- {{ $t('g.devices') }}
-
-
-
-
-
-
-
-
+
+
+ {{ $t('g.devices') }}
+
+
+
+
+
+
+
+
+
@@ -42,8 +44,9 @@ import TabView from 'primevue/tabview'
import { computed } from 'vue'
import DeviceInfo from '@/components/common/DeviceInfo.vue'
+import { isCloud } from '@/platform/distribution/types'
import type { SystemStats } from '@/schemas/apiSchema'
-import { formatSize } from '@/utils/formatUtil'
+import { formatCommitHash, formatSize } from '@/utils/formatUtil'
const props = defineProps<{
stats: SystemStats
@@ -54,20 +57,53 @@ const systemInfo = computed(() => ({
argv: props.stats.system.argv.join(' ')
}))
-const systemColumns: { field: keyof SystemStats['system']; header: string }[] =
- [
- { field: 'os', header: 'OS' },
- { field: 'python_version', header: 'Python Version' },
- { field: 'embedded_python', header: 'Embedded Python' },
- { field: 'pytorch_version', header: 'Pytorch Version' },
- { field: 'argv', header: 'Arguments' },
- { field: 'ram_total', header: 'RAM Total' },
- { field: 'ram_free', header: 'RAM Free' }
- ]
+const hasDevices = computed(() => props.stats.devices.length > 0)
-const formatValue = (value: any, field: string) => {
- if (['ram_total', 'ram_free'].includes(field)) {
- return formatSize(value)
+type SystemInfoKey = keyof SystemStats['system']
+
+type ColumnDef = {
+ field: SystemInfoKey
+ header: string
+ format?: (value: string) => string
+ formatNumber?: (value: number) => string
+}
+
+/** Columns for local distribution */
+const localColumns: ColumnDef[] = [
+ { field: 'os', header: 'OS' },
+ { field: 'python_version', header: 'Python Version' },
+ { field: 'embedded_python', header: 'Embedded Python' },
+ { field: 'pytorch_version', header: 'Pytorch Version' },
+ { field: 'argv', header: 'Arguments' },
+ { field: 'ram_total', header: 'RAM Total', formatNumber: formatSize },
+ { field: 'ram_free', header: 'RAM Free', formatNumber: formatSize }
+]
+
+/** Columns for cloud distribution */
+const cloudColumns: ColumnDef[] = [
+ { field: 'cloud_version', header: 'Cloud Version' },
+ {
+ field: 'comfyui_version',
+ header: 'ComfyUI Version',
+ format: formatCommitHash
+ },
+ {
+ field: 'comfyui_frontend_version',
+ header: 'Frontend Version',
+ format: formatCommitHash
+ },
+ { field: 'workflow_templates_version', header: 'Templates Version' }
+]
+
+const systemColumns = computed(() => (isCloud ? cloudColumns : localColumns))
+
+const getDisplayValue = (column: ColumnDef) => {
+ const value = systemInfo.value[column.field]
+ if (column.formatNumber && typeof value === 'number') {
+ return column.formatNumber(value)
+ }
+ if (column.format && typeof value === 'string') {
+ return column.format(value)
}
return value
}
diff --git a/src/schemas/apiSchema.ts b/src/schemas/apiSchema.ts
index abf2a0b78..653dbcf5d 100644
--- a/src/schemas/apiSchema.ts
+++ b/src/schemas/apiSchema.ts
@@ -334,7 +334,11 @@ const zSystemStats = z.object({
required_frontend_version: z.string().optional(),
argv: z.array(z.string()),
ram_total: z.number(),
- ram_free: z.number()
+ ram_free: z.number(),
+ // Cloud-specific fields
+ cloud_version: z.string().optional(),
+ comfyui_frontend_version: z.string().optional(),
+ workflow_templates_version: z.string().optional()
}),
devices: z.array(zDeviceStats)
})
diff --git a/src/stores/aboutPanelStore.ts b/src/stores/aboutPanelStore.ts
index 869550e60..f2f0829c3 100644
--- a/src/stores/aboutPanelStore.ts
+++ b/src/stores/aboutPanelStore.ts
@@ -2,8 +2,10 @@ import { defineStore } from 'pinia'
import { computed } from 'vue'
import { useExternalLink } from '@/composables/useExternalLink'
+import { isCloud } from '@/platform/distribution/types'
import type { AboutPageBadge } from '@/types/comfy'
import { electronAPI, isElectron } from '@/utils/envUtil'
+import { formatCommitHash } from '@/utils/formatUtil'
import { useExtensionStore } from './extensionStore'
import { useSystemStatsStore } from './systemStatsStore'
@@ -24,10 +26,10 @@ export const useAboutPanelStore = defineStore('aboutPanel', () => {
label: `ComfyUI ${
isElectron()
? 'v' + electronAPI().getComfyUIVersion()
- : coreVersion.value
+ : formatCommitHash(coreVersion.value)
}`,
- url: staticUrls.github,
- icon: 'pi pi-github'
+ url: isCloud ? staticUrls.comfyOrg : staticUrls.github,
+ icon: isCloud ? 'pi pi-cloud' : 'pi pi-github'
},
{
label: `ComfyUI_frontend v${frontendVersion}`,