From eb04dc20f3ccf780653343c59809eaf4ce6fea39 Mon Sep 17 00:00:00 2001
From: Christian Byrne <cbyrne@comfy.org>
Date: Sat, 13 Dec 2025 17:41:17 -0800
Subject: [PATCH] fix: staging badge shown in cloud settings panel (#7444)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Summary

Fixes issue where settings panel on cloud was showing a "Staging" badge
because the badge's logic was being dictated by the buildtime config.
Adds the same pattern used everywhere else where, if cloud distribution,
use runtime config; otherwise, fallback to buildtime config. Allows
cloud to switch between staging and prod at runtime while local switches
at buildtime.

After fix:

<img width="2062" height="811" alt="image"
src="https://github.com/user-attachments/assets/e53547c5-3dcc-42ea-9e75-602fe7f855a2"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7444-fix-staging-badge-shown-in-cloud-settings-panel-2c86d73d36508154a788e8e2a6dd025a)
by [Unito](https://www.unito.io)
---
 .../dialog/header/SettingDialogHeader.vue     |  4 +---
 src/config/staging.ts                         | 20 +++++++++++++++++++
 2 files changed, 21 insertions(+), 3 deletions(-)
 create mode 100644 src/config/staging.ts

diff --git a/src/components/dialog/header/SettingDialogHeader.vue b/src/components/dialog/header/SettingDialogHeader.vue
index 66765846f..959cfa14d 100644
--- a/src/components/dialog/header/SettingDialogHeader.vue
+++ b/src/components/dialog/header/SettingDialogHeader.vue
@@ -15,9 +15,7 @@
 <script setup lang="ts">
 import Tag from 'primevue/tag'
 
-// Global variable from vite build defined in global.d.ts
-// eslint-disable-next-line no-undef
-const isStaging = !__USE_PROD_CONFIG__
+import { isStaging } from '@/config/staging'
 </script>
 
 <style scoped>
diff --git a/src/config/staging.ts b/src/config/staging.ts
new file mode 100644
index 000000000..df525f0b2
--- /dev/null
+++ b/src/config/staging.ts
@@ -0,0 +1,20 @@
+import { computed } from 'vue'
+
+import { isCloud } from '@/platform/distribution/types'
+import { remoteConfig } from '@/platform/remoteConfig/remoteConfig'
+
+const BUILD_TIME_IS_STAGING = !__USE_PROD_CONFIG__
+
+/**
+ * Returns whether the current environment is staging.
+ * - Cloud builds use runtime configuration (firebase_config.projectId containing '-dev')
+ * - OSS / localhost builds fall back to the build-time config determined by __USE_PROD_CONFIG__
+ */
+export const isStaging = computed(() => {
+  if (!isCloud) {
+    return BUILD_TIME_IS_STAGING
+  }
+
+  const projectId = remoteConfig.value.firebase_config?.projectId
+  return projectId?.includes('-dev') ?? BUILD_TIME_IS_STAGING
+})