From d83c3122ab3f17f7fa7fd5e3d49ecde580e329be Mon Sep 17 00:00:00 2001
From: Christian Byrne <cbyrne@comfy.org>
Date: Thu, 11 Dec 2025 06:58:14 -0800
Subject: [PATCH] fix: consistent subscription dialog width (#7378)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Summary
- Remove conditional width logic that caused race condition when feature
flags loaded after dialog shown
- Dialog now always uses wide variant (`min(1200px, 95vw)`) with rounded
corners styling

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7378-fix-consistent-subscription-dialog-width-2c66d73d36508165b3def17fcf2c97f0)
by [Unito](https://www.unito.io)

---------

Co-authored-by: GitHub Action <action@github.com>
---
 .../composables/useSubscriptionDialog.ts      | 35 ++++++-------------
 1 file changed, 10 insertions(+), 25 deletions(-)

diff --git a/src/platform/cloud/subscription/composables/useSubscriptionDialog.ts b/src/platform/cloud/subscription/composables/useSubscriptionDialog.ts
index d79fdc4d8..ee78936ba 100644
--- a/src/platform/cloud/subscription/composables/useSubscriptionDialog.ts
+++ b/src/platform/cloud/subscription/composables/useSubscriptionDialog.ts
@@ -1,7 +1,4 @@
-import { computed, defineAsyncComponent } from 'vue'
-
-import { useFeatureFlags } from '@/composables/useFeatureFlags'
-import { isCloud } from '@/platform/distribution/types'
+import { defineAsyncComponent } from 'vue'
 import { useDialogService } from '@/services/dialogService'
 import { useDialogStore } from '@/stores/dialogStore'
 
@@ -10,14 +7,6 @@ const DIALOG_KEY = 'subscription-required'
 export const useSubscriptionDialog = () => {
   const dialogService = useDialogService()
   const dialogStore = useDialogStore()
-  const { flags } = useFeatureFlags()
-
-  const showStripeDialog = computed(
-    () =>
-      flags.subscriptionTiersEnabled &&
-      isCloud &&
-      window.__CONFIG__?.subscription_required
-  )
 
   function hide() {
     dialogStore.closeDialog({ key: DIALOG_KEY })
@@ -34,19 +23,15 @@ export const useSubscriptionDialog = () => {
         onClose: hide
       },
       dialogComponentProps: {
-        style: showStripeDialog.value
-          ? 'width: min(1200px, 95vw); max-height: 90vh;'
-          : 'width: 700px;',
-        pt: showStripeDialog.value
-          ? {
-              root: {
-                class: '!rounded-[32px] overflow-visible'
-              },
-              content: {
-                class: '!p-0 bg-transparent'
-              }
-            }
-          : undefined
+        style: 'width: min(1200px, 95vw); max-height: 90vh;',
+        pt: {
+          root: {
+            class: '!rounded-[32px] overflow-visible'
+          },
+          content: {
+            class: '!p-0 bg-transparent'
+          }
+        }
       }
     })
   }