[backport cloud/1.48] fix(workspace): show subscribe prompt for ended subscriptions (#14510)

## Summary

Backport of #14504 to `cloud/1.48`.

- Resolves the release-branch cherry-pick conflicts while preserving the
existing cancellation behavior.
- Treats `subscription_status: ended` as terminal even when paid-plan
metadata is stale.
- Includes component and cloud E2E regression coverage adapted to this
release branch.

## Validation

- 31 component tests passed
- App and browser typechecks
- Targeted formatting and lint checks
- `knip` push hook

Author: wei-hai

browser_tests/fixtures/data/cloudWorkspace.ts

@@ -1,5 +1,6 @@
+import type { BillingStatusResponse as IngestBillingStatusResponse } from '@comfyorg/ingest-types'
+
 import type {
-  BillingStatusResponse,
   Member,
   Plan,
   WorkspaceWithRole
@@ -70,16 +71,29 @@ export const DEFAULT_TEAM_MEMBERS: Member[] = [
 
 const TEAM_PLAN_SLUG = 'team-pro-monthly'
 
-export const TEAM_BILLING_STATUS: BillingStatusResponse = {
+export const TEAM_BILLING_STATUS = {
   is_active: true,
   subscription_status: 'active',
   subscription_tier: 'PRO',
   subscription_duration: 'MONTHLY',
   plan_slug: TEAM_PLAN_SLUG,
   billing_status: 'paid',
   has_funds: true,
-  renewal_date: '2099-02-20T00:00:00Z'
-}
+  renewal_date: '2099-02-20T00:00:00Z',
+  team_credit_stop: null
+} satisfies IngestBillingStatusResponse
+
+export const ENDED_STANDARD_BILLING_STATUS = {
+  billing_rail: 'stripe',
+  billing_status: 'inactive',
+  has_funds: true,
+  is_active: false,
+  plan_slug: 'standard-monthly',
+  subscription_duration: 'MONTHLY',
+  subscription_status: 'ended',
+  subscription_tier: 'STANDARD',
+  team_credit_stop: null
+} satisfies IngestBillingStatusResponse & { billing_rail: 'stripe' }
 
 export const TEAM_PRO_PLAN: Plan = {
   slug: TEAM_PLAN_SLUG,

browser_tests/fixtures/helpers/CloudWorkspaceMockHelper.ts

@@ -1,7 +1,9 @@
 import type { Page, Route } from '@playwright/test'
+import type { BillingStatusResponse } from '@comfyorg/ingest-types'
 
 import type {
   Member,
+  Plan,
   WorkspaceWithRole
 } from '@/platform/workspace/api/workspaceApi'
 
@@ -45,9 +47,10 @@ export class CloudWorkspaceMockHelper {
 
   async setup(
     members: Member[] = DEFAULT_TEAM_MEMBERS,
-    activeWorkspace: WorkspaceWithRole = TEAM_WORKSPACE
+    activeWorkspace: WorkspaceWithRole = TEAM_WORKSPACE,
+    billingStatus: BillingStatusResponse = TEAM_BILLING_STATUS
   ): Promise<MemberMockState> {
-    const state = await this.mockBoot(members, activeWorkspace)
+    const state = await this.mockBoot(members, activeWorkspace, billingStatus)
     await new CloudAuthHelper(this.page).mockAuth()
     await this.page.addInitScript((workspaceId) => {
       localStorage.setItem('Comfy.userId', 'test-user-e2e')
@@ -58,7 +61,8 @@ export class CloudWorkspaceMockHelper {
 
   private async mockBoot(
     members: Member[],
-    activeWorkspace: WorkspaceWithRole
+    activeWorkspace: WorkspaceWithRole,
+    billingStatus: BillingStatusResponse
   ): Promise<MemberMockState> {
     const state: MemberMockState = {
       members: members.map((m) => ({ ...m })),
@@ -132,7 +136,7 @@ export class CloudWorkspaceMockHelper {
     )
 
     await page.route('**/api/billing/status', (r) =>
-      r.fulfill(jsonRoute(TEAM_BILLING_STATUS))
+      r.fulfill(jsonRoute(billingStatus))
     )
     await page.route('**/api/billing/balance', (r) =>
       r.fulfill(
@@ -145,11 +149,24 @@ export class CloudWorkspaceMockHelper {
         })
       )
     )
+    const currentPlan: Plan =
+      billingStatus.plan_slug && billingStatus.plan_slug !== TEAM_PRO_PLAN.slug
+        ? {
+            ...TEAM_PRO_PLAN,
+            slug: billingStatus.plan_slug,
+            tier:
+              billingStatus.subscription_tier === 'TEAM'
+                ? TEAM_PRO_PLAN.tier
+                : (billingStatus.subscription_tier ?? TEAM_PRO_PLAN.tier),
+            duration:
+              billingStatus.subscription_duration ?? TEAM_PRO_PLAN.duration
+          }
+        : TEAM_PRO_PLAN
     await page.route('**/api/billing/plans', (r) =>
       r.fulfill(
         jsonRoute({
-          current_plan_slug: TEAM_PRO_PLAN.slug,
-          plans: [TEAM_PRO_PLAN]
+          current_plan_slug: currentPlan.slug,
+          plans: [currentPlan]
         })
       )
     )

browser_tests/tests/dialogs/endedSubscription.spec.ts

@@ -0,0 +1,56 @@
+import { expect } from '@playwright/test'
+
+import {
+  cloudAppFixture as test,
+  waitForCloudApp
+} from '@e2e/fixtures/cloudAppFixture'
+import {
+  DEFAULT_TEAM_MEMBERS,
+  ENDED_STANDARD_BILLING_STATUS,
+  TEAM_WORKSPACE
+} from '@e2e/fixtures/data/cloudWorkspace'
+import { CloudWorkspaceMockHelper } from '@e2e/fixtures/helpers/CloudWorkspaceMockHelper'
+import { TestIds } from '@e2e/fixtures/selectors'
+
+test.describe('Ended workspace subscription', { tag: '@cloud' }, () => {
+  test.describe.configure({ timeout: 60_000 })
+
+  test.beforeEach(async ({ page }) => {
+    await new CloudWorkspaceMockHelper(page).setup(
+      DEFAULT_TEAM_MEMBERS,
+      TEAM_WORKSPACE,
+      ENDED_STANDARD_BILLING_STATUS
+    )
+    await page.goto(process.env.PLAYWRIGHT_TEST_URL || 'http://localhost:8188')
+    await waitForCloudApp(page)
+
+    await page
+      .getByRole('button', { name: /^Settings/ })
+      .first()
+      .click()
+    const dialog = page.getByTestId(TestIds.dialogs.settings)
+    await expect(dialog).toBeVisible()
+    await dialog
+      .locator('nav')
+      .getByRole('button', { name: 'Workspace', exact: true })
+      .click()
+  })
+
+  test('shows subscribe prompt instead of stale paid plan metadata', async ({
+    page
+  }) => {
+    const content = page.getByTestId(TestIds.dialogs.settings).getByRole('main')
+
+    await expect(
+      content.getByRole('heading', {
+        name: 'This workspace is not on a subscription'
+      })
+    ).toBeVisible()
+    await expect(
+      content.getByRole('button', { name: 'Subscribe Now' })
+    ).toBeVisible()
+    await expect(
+      content.getByRole('heading', { name: 'Standard' })
+    ).toHaveCount(0)
+  })
+})

src/platform/workspace/components/SubscriptionPanelContentWorkspace.test.ts

@@ -10,6 +10,7 @@ import enMessages from '@/locales/en/main.json'
 import * as tierPricing from '@/platform/cloud/subscription/constants/tierPricing'
 import type {
   BillingStatus,
+  BillingSubscriptionStatus,
   CurrentTeamCreditStop,
   TeamCreditStops
 } from '@/platform/workspace/api/workspaceApi'
@@ -54,7 +55,7 @@ const teamCreditStops: TeamCreditStops = {
   ]
 }
 
-const mockSubscriptionStatus = ref<'active' | 'canceled'>('active')
+const mockSubscriptionStatus = ref<BillingSubscriptionStatus>('active')
 const mockBillingStatus = ref<BillingStatus>('paid')
 const mockSubscriptionDuration = ref<'MONTHLY' | 'ANNUAL'>('MONTHLY')
 const mockHasSubscription = ref(true)
@@ -134,6 +135,7 @@ vi.mock('@/composables/billing/useBillingContext', () => ({
     isActiveSubscription: computed(() => mockIsActiveSubscription.value),
     isFreeTier: computed(() => false),
     billingStatus: mockBillingStatus,
+    subscriptionStatus: mockSubscriptionStatus,
     isTeamPlan: mockIsTeamPlan,
     subscription: mockSubscription,
     teamCreditStops: mockTeamCreditStops,
@@ -472,6 +474,25 @@ describe('SubscriptionPanelContentWorkspace', () => {
     ).not.toBeInTheDocument()
   })
 
+  it('shows subscribe prompt for an ended Standard plan in a Team workspace', () => {
+    mockSubscriptionStatus.value = 'ended'
+    mockSubscriptionTier.value = 'STANDARD'
+    mockPlanSlug.value = 'standard-monthly'
+    renderComponent()
+
+    expect(
+      screen.getByRole('heading', {
+        name: 'This workspace is not on a subscription'
+      })
+    ).toBeInTheDocument()
+    expect(
+      screen.getByRole('button', { name: 'Subscribe Now' })
+    ).toBeInTheDocument()
+    expect(
+      screen.queryByRole('heading', { name: 'Standard' })
+    ).not.toBeInTheDocument()
+  })
+
   it.for(['paid', 'payment_failed', 'paused'] as BillingStatus[])(
     'keeps a %s personal plan visible until it is terminal',
     (billingStatus) => {

src/platform/workspace/components/SubscriptionPanelContentWorkspace.vue

@@ -377,6 +377,7 @@ const {
   isTeamPlan,
   subscription,
   billingStatus,
+  subscriptionStatus,
   isLoading,
   error,
   showSubscriptionDialog,
@@ -401,6 +402,7 @@ const isTerminalPersonalSubscription = computed(
 // stays active until its end date, so it keeps the subscribed treatment.
 const showSubscribePrompt = computed(() => {
   if (!permissions.value.canManageSubscription) return false
+  if (subscriptionStatus.value === 'ended') return true
   if (isTerminalPersonalSubscription.value) return true
   if (isSubscriptionCancelled.value) return false
   if (