From d82bce90eae3360a256e305bd513fa0ecde06335 Mon Sep 17 00:00:00 2001
From: Hunter <huntcsg@users.noreply.github.com>
Date: Thu, 12 Mar 2026 21:07:07 -0400
Subject: [PATCH] feat: bake frontend commit hash into build (#9832)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Summary

Bake the frontend git commit hash into the build so it no longer needs
to be fetched from the server via `/api/system_stats`.

## Changes

- **What**: Add `__COMFYUI_FRONTEND_COMMIT__` build-time constant (via
Vite `define`) sourced from `git rev-parse HEAD` at build time. Falls
back to `"unknown"` if git is unavailable. `SystemStatsPanel` uses this
baked-in value for the "Frontend Version" row in cloud mode instead of
the server-provided `comfyui_frontend_version` field.

## Testing
Confirmed to display the actual commit.
<img width="1448" height="908" alt="Screenshot 2026-03-12 at 7 09 52 PM"
src="https://github.com/user-attachments/assets/2b42348a-5c3e-4509-aa84-1a259bba5f3f"
/>


## Review Focus

- The `getDisplayValue` override for `comfyui_frontend_version` —
cleanest way to swap the data source without restructuring the column
system.
- No cloud-side changes needed: the `sync-frontend-build` workflow
already checks out the frontend repo at the exact commit ref, so `git
rev-parse HEAD` returns the correct hash.
---
 eslint.config.ts                           |  1 +
 global.d.ts                                |  1 +
 src/components/common/SystemStatsPanel.vue |  8 +++++++-
 vite.config.mts                            | 17 +++++++++++++++++
 4 files changed, 26 insertions(+), 1 deletion(-)

diff --git a/eslint.config.ts b/eslint.config.ts
index f59be99063..b2635663ef 100644
--- a/eslint.config.ts
+++ b/eslint.config.ts
@@ -24,6 +24,7 @@ const extraFileExtensions = ['.vue']
 const commonGlobals = {
   ...globals.browser,
   __COMFYUI_FRONTEND_VERSION__: 'readonly',
+  __COMFYUI_FRONTEND_COMMIT__: 'readonly',
   __DISTRIBUTION__: 'readonly',
   __IS_NIGHTLY__: 'readonly'
 } as const
diff --git a/global.d.ts b/global.d.ts
index 84171df1f7..e0a154c311 100644
--- a/global.d.ts
+++ b/global.d.ts
@@ -1,4 +1,5 @@
 declare const __COMFYUI_FRONTEND_VERSION__: string
+declare const __COMFYUI_FRONTEND_COMMIT__: string
 declare const __SENTRY_ENABLED__: boolean
 declare const __SENTRY_DSN__: string
 declare const __ALGOLIA_APP_ID__: string
diff --git a/src/components/common/SystemStatsPanel.vue b/src/components/common/SystemStatsPanel.vue
index 76389290e5..4c46fa9da7 100644
--- a/src/components/common/SystemStatsPanel.vue
+++ b/src/components/common/SystemStatsPanel.vue
@@ -59,6 +59,8 @@ import type { SystemStats } from '@/schemas/apiSchema'
 import { formatCommitHash, formatSize } from '@/utils/formatUtil'
 import { cn } from '@/utils/tailwindUtil'
 
+const frontendCommit = __COMFYUI_FRONTEND_COMMIT__
+
 const props = defineProps<{
   stats: SystemStats
 }>()
@@ -77,6 +79,7 @@ type SystemInfoKey = keyof SystemStats['system']
 type ColumnDef = {
   field: SystemInfoKey
   header: string
+  getValue?: () => string
   format?: (value: string) => string
   formatNumber?: (value: number) => string
 }
@@ -104,6 +107,7 @@ const cloudColumns: ColumnDef[] = [
   {
     field: 'comfyui_frontend_version',
     header: 'Frontend Version',
+    getValue: () => frontendCommit,
     format: formatCommitHash
   },
   { field: 'workflow_templates_version', header: 'Templates Version' }
@@ -119,7 +123,9 @@ function isOutdated(column: ColumnDef): boolean {
 }
 
 function getDisplayValue(column: ColumnDef) {
-  const value = systemInfo.value[column.field]
+  const value = column.getValue
+    ? column.getValue()
+    : systemInfo.value[column.field]
   if (column.formatNumber && typeof value === 'number') {
     return column.formatNumber(value)
   }
diff --git a/vite.config.mts b/vite.config.mts
index 9033ea16ab..f14d6d26d9 100644
--- a/vite.config.mts
+++ b/vite.config.mts
@@ -1,6 +1,7 @@
 import { sentryVitePlugin } from '@sentry/vite-plugin'
 import tailwindcss from '@tailwindcss/vite'
 import vue from '@vitejs/plugin-vue'
+import { execSync } from 'child_process'
 import { config as dotenvConfig } from 'dotenv'
 import type { IncomingMessage, ServerResponse } from 'http'
 import { Readable } from 'stream'
@@ -55,6 +56,21 @@ const DISTRIBUTION: 'desktop' | 'localhost' | 'cloud' =
 // Can be overridden via IS_NIGHTLY env var for testing
 const IS_NIGHTLY = process.env.IS_NIGHTLY === 'true'
 
+// Resolve the frontend git commit hash at build time.
+// Priority: FRONTEND_COMMIT_HASH env var → git rev-parse HEAD → 'unknown'
+// FRONTEND_COMMIT_HASH is an escape hatch for non-git environments (e.g. Docker
+// build containers without .git) where the commit hash can be injected externally.
+let GIT_COMMIT = process.env.FRONTEND_COMMIT_HASH || ''
+if (!GIT_COMMIT) {
+  try {
+    GIT_COMMIT = execSync('git rev-parse HEAD', { timeout: 5000 })
+      .toString()
+      .trim()
+  } catch {
+    GIT_COMMIT = 'unknown'
+  }
+}
+
 // Disable Vue DevTools for production cloud distribution
 const DISABLE_VUE_PLUGINS =
   process.env.DISABLE_VUE_PLUGINS === 'true' ||
@@ -586,6 +602,7 @@ export default defineConfig({
     __COMFYUI_FRONTEND_VERSION__: JSON.stringify(
       process.env.npm_package_version
     ),
+    __COMFYUI_FRONTEND_COMMIT__: JSON.stringify(GIT_COMMIT),
     __SENTRY_ENABLED__: JSON.stringify(
       !(process.env.NODE_ENV === 'development' || !process.env.SENTRY_DSN)
     ),