@taskforcehq/taskforce 0.3.305 → 0.3.307

package/dist/components/views/PlanComparisonPage.test.js

@@ -9,6 +9,8 @@ describe('PlanComparisonPage', () => {
         vi.stubGlobal('fetch', vi.fn(async () => ({
             ok: true,
             json: async () => ({
+                pageTitle: 'Subscription Plans',
+                pageDescription: 'Manage your subscription and explore available features. Your current plan is highlighted below.',
                 pricingSource: {
                     environment: 'production',
                     runtimeMode: 'cloud'
@@ -17,6 +19,7 @@ describe('PlanComparisonPage', () => {
                     {
                         planId: 'free',
                         displayName: 'Free',
+                        description: 'Start using Taskforce at no cost.',
                         status: 'active',
                         defaultVersion: {
                             planVersionId: 'free-v1',
@@ -33,6 +36,7 @@ describe('PlanComparisonPage', () => {
                     {
                         planId: 'team-5',
                         displayName: 'Team 5',
+                        description: 'For small collaborative teams.',
                         status: 'active',
                         defaultVersion: {
                             planVersionId: 'team-5-v2',
@@ -59,6 +63,28 @@ describe('PlanComparisonPage', () => {
         render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: false, onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
         expect(await screen.findByText('Pricing source: production (cloud)')).toBeInTheDocument();
     });
+    it('renders plan descriptions when provided by the pricing payload', async () => {
+        render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: false, onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
+        expect(await screen.findByText('Start using Taskforce at no cost.')).toBeInTheDocument();
+        expect(screen.getByText('For small collaborative teams.')).toBeInTheDocument();
+    });
+    it('prefers pricing payload header copy when provided', async () => {
+        vi.stubGlobal('fetch', vi.fn(async () => ({
+            ok: true,
+            json: async () => ({
+                pageTitle: 'Choose Your Taskforce Plan',
+                pageDescription: 'Compare plans and pick the right fit for your team.',
+                pricingSource: {
+                    environment: 'production',
+                    runtimeMode: 'cloud'
+                },
+                plans: []
+            })
+        })));
+        render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", subtitle: "Fallback subtitle", isAuthenticated: false, onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
+        expect(await screen.findByRole('heading', { name: 'Choose Your Taskforce Plan' })).toBeInTheDocument();
+        expect(screen.getByText('Compare plans and pick the right fit for your team.')).toBeInTheDocument();
+    });
     it('falls back to provided pricing source details when the pricing response omits them', async () => {
         globalThis.__DEBUG_MODE__ = true;
         vi.stubGlobal('fetch', vi.fn(async () => ({
@@ -92,6 +118,188 @@ describe('PlanComparisonPage', () => {
         await screen.findByRole('heading', { name: 'Subscription Plans' });
         expect(screen.queryByText('Pricing source: production (cloud)')).not.toBeInTheDocument();
     });
+    it('renders public feature copy when provided by the pricing payload', async () => {
+        vi.stubGlobal('fetch', vi.fn(async () => ({
+            ok: true,
+            json: async () => ({
+                pricingSource: {
+                    environment: 'production',
+                    runtimeMode: 'cloud'
+                },
+                plans: [
+                    {
+                        planId: 'team-5',
+                        displayName: 'Team 5',
+                        status: 'active',
+                        defaultVersion: {
+                            planVersionId: 'team-5-v2',
+                            versionNumber: 2,
+                            seatLimit: 5,
+                            metadata: {}
+                        },
+                        features: [
+                            {
+                                featureKey: 'collaboration.ai_profiles',
+                                access: 'enabled',
+                                label: 'AI Profiles',
+                                publicLabel: 'AI teammates',
+                                publicDescription: 'Add reusable AI teammates to your workspace.'
+                            }
+                        ],
+                        pricing: {
+                            month: { pricingType: 'stripe', stripePriceId: 'price_team_5_month', unitAmount: 2000, currency: 'usd', interval: 'month' },
+                            year: null
+                        }
+                    }
+                ]
+            })
+        })));
+        render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: false, onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
+        expect(await screen.findByText('AI teammates')).toBeInTheDocument();
+        expect(screen.getByText('Add reusable AI teammates to your workspace.')).toBeInTheDocument();
+        expect(screen.queryByText('Collaboration Ai Profiles')).not.toBeInTheDocument();
+    });
+    it('renders inline numeric feature limits next to each feature label', async () => {
+        vi.stubGlobal('fetch', vi.fn(async () => ({
+            ok: true,
+            json: async () => ({
+                pricingSource: {
+                    environment: 'production',
+                    runtimeMode: 'cloud'
+                },
+                plans: [
+                    {
+                        planId: 'free',
+                        displayName: 'Free',
+                        status: 'active',
+                        defaultVersion: {
+                            planVersionId: 'free-v1',
+                            versionNumber: 1,
+                            seatLimit: 12,
+                            metadata: {}
+                        },
+                        features: [
+                            {
+                                featureKey: 'workspace.workspaces',
+                                access: 'enabled',
+                                label: 'Workspaces',
+                                config: { maxWorkspaces: 1 }
+                            },
+                            {
+                                featureKey: 'collaboration.ai_profiles',
+                                access: 'limited',
+                                label: 'AI Profiles',
+                                publicLabel: 'AI Agents',
+                                config: { maxAiProfiles: 4 }
+                            },
+                            {
+                                featureKey: 'context.uploads',
+                                access: 'enabled',
+                                label: 'Cloud Storage',
+                                config: { storageLimitMb: 24 }
+                            },
+                            {
+                                featureKey: 'collaboration.team_management',
+                                access: 'enabled',
+                                label: 'Team Management'
+                            }
+                        ],
+                        pricing: {
+                            month: { pricingType: 'free', stripePriceId: null, unitAmount: null, currency: null, interval: 'month' },
+                            year: null
+                        }
+                    }
+                ]
+            })
+        })));
+        const { container } = render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: false, onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
+        const freeCard = await screen.findByTestId('plan-card-free');
+        const featureTextNodes = Array.from(freeCard.querySelectorAll('span')).map((node) => node.textContent);
+        expect(featureTextNodes).toContain('1x Workspaces');
+        expect(featureTextNodes).toContain('4x AI Agents');
+        expect(featureTextNodes).toContain('24MB Cloud Storage');
+        expect(featureTextNodes).toContain('12x Team Management');
+        expect(container.querySelector('[class*="featureLimitUnit"]')?.textContent).toBe('MB');
+    });
+    it('renders the storage unit suffix in a smaller accent span', async () => {
+        vi.stubGlobal('fetch', vi.fn(async () => ({
+            ok: true,
+            json: async () => ({
+                pricingSource: {
+                    environment: 'production',
+                    runtimeMode: 'cloud'
+                },
+                plans: [
+                    {
+                        planId: 'free',
+                        displayName: 'Free',
+                        status: 'active',
+                        defaultVersion: {
+                            planVersionId: 'free-v1',
+                            versionNumber: 1,
+                            seatLimit: null,
+                            metadata: {}
+                        },
+                        features: [
+                            {
+                                featureKey: 'context.uploads',
+                                access: 'enabled',
+                                label: 'Cloud Storage',
+                                config: { storageLimitMb: 64 }
+                            }
+                        ],
+                        pricing: {
+                            month: { pricingType: 'free', stripePriceId: null, unitAmount: null, currency: null, interval: 'month' },
+                            year: null
+                        }
+                    }
+                ]
+            })
+        })));
+        const { container } = render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: false, onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
+        await screen.findByText('Cloud Storage');
+        const accent = container.querySelector('[class*="featureLimitAccent"]');
+        const unit = container.querySelector('[class*="featureLimitUnit"]');
+        expect(accent?.textContent).toBe('64MB');
+        expect(unit?.textContent).toBe('MB');
+    });
+    it('hides missing yearly pricing rows and buttons instead of rendering unavailable state', async () => {
+        vi.stubGlobal('fetch', vi.fn(async () => ({
+            ok: true,
+            json: async () => ({
+                pricingSource: {
+                    environment: 'production',
+                    runtimeMode: 'cloud'
+                },
+                plans: [
+                    {
+                        planId: 'operator',
+                        displayName: 'Operator',
+                        status: 'active',
+                        defaultVersion: {
+                            planVersionId: 'operator-v1',
+                            versionNumber: 1,
+                            seatLimit: null,
+                            metadata: {}
+                        },
+                        features: [],
+                        pricing: {
+                            month: { pricingType: 'stripe', stripePriceId: 'price_operator_month', unitAmount: 999, currency: 'usd', interval: 'month' },
+                            year: null
+                        }
+                    }
+                ]
+            })
+        })));
+        render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: true, onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
+        const operatorCard = await screen.findByTestId('plan-card-operator');
+        expect(within(operatorCard).getByText('$9.99')).toBeInTheDocument();
+        expect(within(operatorCard).getByText('/ month')).toBeInTheDocument();
+        expect(within(operatorCard).queryByText('/ year')).not.toBeInTheDocument();
+        expect(within(operatorCard).queryByText('Unavailable')).not.toBeInTheDocument();
+        expect(within(operatorCard).getByRole('button', { name: 'Choose Monthly' })).toBeInTheDocument();
+        expect(within(operatorCard).queryByRole('button', { name: 'Choose Yearly' })).not.toBeInTheDocument();
+    });
     it('does not mark a plan current when only the plan id matches but the version does not', async () => {
         render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: true, currentPlanId: "team-5", currentPlanVersionId: "team-5-v1", currentEntitlementState: "active", onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
         expect(await screen.findByRole('heading', { name: 'Subscription Plans' })).toBeInTheDocument();
@@ -102,15 +310,64 @@ describe('PlanComparisonPage', () => {
         expect(await screen.findByRole('heading', { name: 'Subscription Plans' })).toBeInTheDocument();
         expect(screen.getByText('Current Plan')).toBeInTheDocument();
     });
+    it('can show the current plan as a non-interactive indicator when billing is managed from page chrome', async () => {
+        const onSelectPlan = vi.fn();
+        render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: true, currentPlanId: "team-5", currentPlanVersionId: "team-5-v2", currentEntitlementState: "active", canManageCurrentPlan: true, currentPlanCardActionMode: "indicator", onBack: () => { }, backLabel: "Back", onSelectPlan: onSelectPlan }));
+        expect(await screen.findByRole('heading', { name: 'Subscription Plans' })).toBeInTheDocument();
+        const currentCard = screen.getByTestId('plan-card-team-5');
+        expect(currentCard).not.toHaveAttribute('role', 'button');
+        expect(screen.queryByTestId('plan-manage-team-5')).not.toBeInTheDocument();
+        expect(screen.queryByRole('button', { name: 'Manage Plan' })).not.toBeInTheDocument();
+        expect(screen.getByTestId('plan-current-team-5')).toBeDisabled();
+        fireEvent.click(currentCard);
+        expect(onSelectPlan).not.toHaveBeenCalled();
+    });
+    it('can render the page header bar even when shell chrome is present', async () => {
+        render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: true, chrome: _jsx("div", { children: "Shell chrome" }), showHeaderBarWithChrome: true, topActions: _jsx("button", { type: "button", children: "Manage billing" }), onBack: () => { }, backLabel: "Back to App", onSelectPlan: () => { } }));
+        expect(await screen.findByRole('heading', { name: 'Subscription Plans' })).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: 'Back to App' })).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: 'Manage billing' })).toBeInTheDocument();
+    });
     it('does not mark a canceled entitlement as current through the plan-id fallback path', async () => {
         render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: true, currentPlanId: "team-5", currentPlanVersionId: null, currentEntitlementState: "canceled", onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
         expect(await screen.findByRole('heading', { name: 'Subscription Plans' })).toBeInTheDocument();
         expect(screen.queryByText('Current Plan')).not.toBeInTheDocument();
     });
+    it('does not mark a linked pending-plan-selection entitlement as the current plan', async () => {
+        render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: true, currentPlanId: "team-5", currentPlanVersionId: "team-5-v2", currentEntitlementState: "pending_plan_selection", canManageCurrentPlan: true, onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
+        expect(await screen.findByRole('heading', { name: 'Subscription Plans' })).toBeInTheDocument();
+        expect(screen.queryByRole('button', { name: 'Manage Plan' })).not.toBeInTheDocument();
+        expect(screen.queryByText('Current Plan')).not.toBeInTheDocument();
+        expect(screen.getByRole('button', { name: 'Choose Monthly' })).toBeInTheDocument();
+    });
     it('can disable the page back button while onboarding remains blocked', async () => {
         render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: true, onBack: () => { }, backLabel: "Back to App", backDisabled: true, onSelectPlan: () => { } }));
         expect(await screen.findByRole('button', { name: 'Back to App' })).toBeDisabled();
     });
+    it('shows pricing before auth resolves but keeps plan selection disabled until bootstrap finishes', async () => {
+        const onSelectPlan = vi.fn();
+        const view = render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: false, authSessionResolved: false, onBack: () => { }, backLabel: "Back", onSelectPlan: onSelectPlan }));
+        expect(await screen.findByRole('heading', { name: 'Subscription Plans' })).toBeInTheDocument();
+        const freeCard = screen.getByTestId('plan-card-free');
+        expect(screen.getByRole('button', { name: 'Get Started Free' })).toBeDisabled();
+        expect(screen.getByRole('button', { name: 'Get Started Monthly' })).toBeDisabled();
+        expect(freeCard).not.toHaveAttribute('role', 'button');
+        view.rerender(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: false, authSessionResolved: true, onBack: () => { }, backLabel: "Back", onSelectPlan: onSelectPlan }));
+        const enabledFreeCard = screen.getByTestId('plan-card-free');
+        expect(screen.getByRole('button', { name: 'Get Started Free' })).toBeEnabled();
+        expect(screen.getByRole('button', { name: 'Get Started Monthly' })).toBeEnabled();
+        expect(enabledFreeCard).toHaveAttribute('role', 'button');
+        fireEvent.click(screen.getByRole('button', { name: 'Get Started Free' }));
+        await waitFor(() => {
+            expect(onSelectPlan).toHaveBeenCalledWith({
+                planId: 'free',
+                planVersionId: 'free-v1',
+                interval: 'month',
+                pricingType: 'free',
+                isCurrentPlan: false
+            });
+        });
+    });
     it('selects the whole plan card using the default available interval', async () => {
         const onSelectPlan = vi.fn();
         render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: false, onBack: () => { }, backLabel: "Back", onSelectPlan: onSelectPlan }));

package/dist/components/views/PlansPage.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useLocation, useNavigate } from 'react-router-dom';
 import { User } from 'lucide-react';
@@ -9,16 +9,29 @@ import { resolveTaskforceCloudEnvironmentFromBaseUrl } from '../../config/cloudE
 import { ACCOUNT_PROFILE_SUMMARY_PATH, invalidateAccountProfileSummaryCache, loadAccountProfileSummaryCached } from '../../utils/accountProfileSummaryCache';
 import { isCommercialEntitlementActive, resolveCommercialLifecyclePresentation } from '../../utils/commercialLifecyclePresentation';
 const TRANSIENT_CHECKOUT_QUERY_CLEAR_DELAY_MS = 1600;
-const CHECKOUT_CONFIRM_RETRY_DELAYS_MS = [0, 500, 1000, 2000];
+const CHECKOUT_CONFIRM_INITIAL_RETRY_DELAYS_MS = [0, 500, 1000, 2000];
+const CHECKOUT_CONFIRM_RETRY_INTERVAL_MS = 5000;
+const CHECKOUT_CONFIRM_MAX_AUTO_RETRY_MS = 45000;
+const HIDDEN_GATE_MESSAGE = 'Choose a plan to continue.';
 function shouldRetryCheckoutConfirmation(statusCode, errorCode) {
     if (statusCode === 401) {
         return true;
     }
-    return String(errorCode || '').trim().toUpperCase() === 'CHECKOUT_SESSION_INCOMPLETE';
+    const normalizedErrorCode = String(errorCode || '').trim().toUpperCase();
+    return normalizedErrorCode === 'CHECKOUT_SESSION_INCOMPLETE'
+        || normalizedErrorCode === 'CHECKOUT_PLAN_VERSION_UNRESOLVED';
 }
 function parseInterval(raw) {
     return raw === 'year' ? 'year' : 'month';
 }
+function normalizeIntervalValue(raw) {
+    const normalized = String(raw || '').trim().toLowerCase();
+    if (normalized === 'year')
+        return 'year';
+    if (normalized === 'month')
+        return 'month';
+    return null;
+}
 function normalizeApiBaseUrl(raw) {
     const trimmed = String(raw || '').trim();
     if (!trimmed)
@@ -40,16 +53,19 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
     const location = useLocation();
     const [accountProfileSummary, setAccountProfileSummary] = useState(null);
     const [actionBusy, setActionBusy] = useState(false);
+    const [continueActionBusy, setContinueActionBusy] = useState(false);
     const [feedback, setFeedback] = useState(null);
     const checkoutStartRan = useRef(false);
-    const checkoutSuccessHandledRef = useRef(null);
+    const checkoutSuccessSettledRef = useRef(null);
     const transientQueryClearTimeoutRef = useRef(null);
+    const onContinueToTaskforceRef = useRef(onContinueToTaskforce);
     const query = useMemo(() => new URLSearchParams(location.search), [location.search]);
     const checkoutState = String(query.get('checkout') || '').trim().toLowerCase();
     const gateState = String(query.get('gate') || '').trim().toLowerCase();
     const queryPlanId = String(query.get('planId') || '').trim();
     const queryPlanVersionId = String(query.get('planVersionId') || '').trim();
     const queryInterval = parseInterval(query.get('interval'));
+    const queryIntervalValue = normalizeIntervalValue(query.get('interval'));
     const querySessionId = String(query.get('session_id') || '').trim();
     const normalizedApiBaseUrl = useMemo(() => normalizeApiBaseUrl(apiBaseUrl), [apiBaseUrl]);
     const normalizedConnectedEnvironmentSource = useMemo(() => normalizeApiBaseUrl(connectedEnvironmentSource), [connectedEnvironmentSource]);
@@ -80,16 +96,15 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
         const nextQuery = params.toString();
         navigate(`/${nextQuery ? `?${nextQuery}` : ''}${location.hash || ''}`);
     }, [location.hash, location.search, navigate]);
-    const pricingEndpoints = useMemo(() => {
-        const endpoints = [
-            normalizedApiBaseUrl ? `${normalizedApiBaseUrl}/api/taskforce/public/pricing` : '',
-            '/api/taskforce/public/pricing'
-        ].map((value) => String(value || '').trim()).filter((value, index, all) => value && all.indexOf(value) === index);
-        return endpoints;
-    }, [normalizedApiBaseUrl]);
+    const pricingEndpoint = useMemo(() => buildCloudBillingUrl('/api/taskforce/public/pricing'), [buildCloudBillingUrl]);
     const lifecyclePresentation = useMemo(() => resolveCommercialLifecyclePresentation(accountProfileSummary, gateState), [accountProfileSummary, gateState]);
     const hasResolvedActiveEntitlement = useMemo(() => lifecyclePresentation.allowReturnToApp, [lifecyclePresentation.allowReturnToApp]);
-    const gateMessage = useMemo(() => lifecyclePresentation.message, [lifecyclePresentation.message]);
+    const gateMessage = useMemo(() => {
+        const message = String(lifecyclePresentation.message || '').trim();
+        if (!message || message === HIDDEN_GATE_MESSAGE)
+            return null;
+        return message;
+    }, [lifecyclePresentation.message]);
     const clearTransientQueryState = useCallback(() => {
         const next = new URLSearchParams(location.search);
         next.delete('checkout');
@@ -110,6 +125,9 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
             transientQueryClearTimeoutRef.current = null;
         }, TRANSIENT_CHECKOUT_QUERY_CLEAR_DELAY_MS);
     }, [clearTransientQueryState]);
+    useEffect(() => {
+        onContinueToTaskforceRef.current = onContinueToTaskforce;
+    }, [onContinueToTaskforce]);
     const loadAccountProfileSummary = useCallback(async (options) => {
         const accountProfileSummaryUrl = buildCloudBillingUrl(ACCOUNT_PROFILE_SUMMARY_PATH);
         if (!isAuthenticated) {
@@ -131,11 +149,14 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
             return null;
         }
     }, [authUserId, buildCloudBillingUrl, isAuthenticated, onAccountProfileSummaryChange]);
-    const resolveRecoveryMessage = useCallback((summary, fallback) => {
+    const resolveRecoveryMessage = useCallback((summary, fallback, options) => {
+        const normalizedFallback = String(fallback || '').trim();
+        if (options?.preferFallback && normalizedFallback)
+            return normalizedFallback;
         const message = resolveCommercialLifecyclePresentation(summary, gateState).message;
         if (message)
             return message;
-        return String(fallback || 'Unable to confirm checkout completion.').trim() || 'Unable to confirm checkout completion.';
+        return normalizedFallback || 'Unable to confirm checkout completion.';
     }, [gateState]);
     const shouldAutoContinueAfterActivation = useCallback((summary, fallbackGate) => {
         return !resolveCommercialLifecyclePresentation(summary, fallbackGate).allowReturnToApp;
@@ -226,6 +247,47 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
                 retryable: false
             };
         }
+        const confirmViaSummary = async () => {
+            invalidateAccountProfileSummaryCache(buildCloudBillingUrl(ACCOUNT_PROFILE_SUMMARY_PATH), { identityKey: authUserId });
+            const summary = await loadAccountProfileSummary({ force: true });
+            const summaryState = String(summary?.entitlementState || '').trim().toLowerCase();
+            if (!isCommercialEntitlementActive(summaryState)) {
+                return false;
+            }
+            const expectedPlanId = queryPlanId;
+            const expectedPlanVersionId = queryPlanVersionId;
+            const expectedInterval = queryIntervalValue;
+            const currentPlanId = String(summary?.planId || '').trim();
+            const currentPlanVersionId = String(summary?.planVersionId || '').trim();
+            const currentInterval = normalizeIntervalValue(summary?.billingInterval ?? null);
+            const preSummary = options?.preConfirmationSummary ?? null;
+            const preState = String(preSummary?.entitlementState || '').trim().toLowerCase();
+            const preWasActive = isCommercialEntitlementActive(preState);
+            const prePlanId = String(preSummary?.planId || '').trim();
+            const prePlanVersionId = String(preSummary?.planVersionId || '').trim();
+            const preInterval = normalizeIntervalValue(preSummary?.billingInterval ?? null);
+            if (expectedPlanId && currentPlanId && currentPlanId !== expectedPlanId) {
+                return false;
+            }
+            if (expectedPlanVersionId && currentPlanVersionId && currentPlanVersionId !== expectedPlanVersionId) {
+                return false;
+            }
+            if (expectedInterval && currentInterval && currentInterval !== expectedInterval) {
+                return false;
+            }
+            if (preWasActive) {
+                const requestedPlanChanged = Boolean(expectedPlanId) && currentPlanId === expectedPlanId && prePlanId !== currentPlanId;
+                const requestedPlanVersionChanged = Boolean(expectedPlanVersionId) && currentPlanVersionId === expectedPlanVersionId && prePlanVersionId !== currentPlanVersionId;
+                const requestedIntervalChanged = Boolean(expectedInterval) && currentInterval === expectedInterval && preInterval !== currentInterval;
+                if (!requestedPlanChanged && !requestedPlanVersionChanged && !requestedIntervalChanged) {
+                    return false;
+                }
+            }
+            if (options?.autoContinueOnActivation === true) {
+                await onContinueToTaskforceRef.current?.();
+            }
+            return true;
+        };
         try {
             const res = await fetch(buildCloudBillingUrl('/api/taskforce/billing/checkout-session/confirm'), {
                 method: 'POST',
@@ -236,17 +298,18 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
             const payload = await res.json().catch(() => ({}));
             if (!res.ok) {
                 const errorCode = String(payload?.code || '').trim();
+                const retryable = shouldRetryCheckoutConfirmation(res.status, errorCode);
+                if (retryable && await confirmViaSummary()) {
+                    return { confirmed: true };
+                }
                 return {
                     confirmed: false,
                     errorMessage: String(payload?.error || 'Unable to confirm checkout completion.'),
-                    retryable: shouldRetryCheckoutConfirmation(res.status, errorCode)
+                    retryable
                 };
             }
-            invalidateAccountProfileSummaryCache(buildCloudBillingUrl(ACCOUNT_PROFILE_SUMMARY_PATH), { identityKey: authUserId });
-            const summary = await loadAccountProfileSummary({ force: true });
-            const summaryState = String(summary?.entitlementState || '').trim().toLowerCase();
-            if (options?.autoContinueOnActivation === true && isCommercialEntitlementActive(summaryState)) {
-                await onContinueToTaskforce?.();
+            if (await confirmViaSummary()) {
+                return { confirmed: true };
             }
             return { confirmed: true };
         }
@@ -257,14 +320,14 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
                 retryable: true
             };
         }
-    }, [authUserId, buildCloudBillingUrl, loadAccountProfileSummary, onContinueToTaskforce]);
+    }, [authUserId, buildCloudBillingUrl, loadAccountProfileSummary, queryIntervalValue, queryPlanId, queryPlanVersionId]);
     const openBillingPortal = useCallback(async () => {
         if (!isAuthenticated) {
             navigate(`/login?mode=login&next=${encodeURIComponent(buildEmbeddedPlansPath())}`);
             return;
         }
         setActionBusy(true);
-        setFeedback(null);
+        setFeedback({ type: 'info', message: 'Opening billing portal...' });
         try {
             const res = await fetch(buildCloudBillingUrl('/api/taskforce/billing/portal-session'), {
                 method: 'POST',
@@ -289,6 +352,17 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
             setActionBusy(false);
         }
     }, [buildCloudBillingUrl, isAuthenticated, navigate]);
+    const handleContinueToTaskforce = useCallback(async () => {
+        if (!onContinueToTaskforce || continueActionBusy || continueBusy)
+            return;
+        setContinueActionBusy(true);
+        try {
+            await onContinueToTaskforce();
+        }
+        finally {
+            setContinueActionBusy(false);
+        }
+    }, [continueActionBusy, continueBusy, onContinueToTaskforce]);
     useEffect(() => {
         void loadAccountProfileSummary();
     }, [loadAccountProfileSummary]);
@@ -306,7 +380,7 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
     }, []);
     useEffect(() => {
         if (checkoutState !== 'success') {
-            checkoutSuccessHandledRef.current = null;
+            checkoutSuccessSettledRef.current = null;
         }
     }, [checkoutState]);
     useEffect(() => {
@@ -326,7 +400,8 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
         if (checkoutState === 'success') {
             checkoutStartRan.current = true;
             setFeedback({ type: 'success', message: 'Checkout completed successfully. Finalizing your plan...' });
-            if (!authSessionResolved) {
+            const shouldWaitForAuthBootstrap = !isAuthenticated && !authSessionResolved;
+            if (shouldWaitForAuthBootstrap) {
                 return () => {
                     cancelled = true;
                     pendingRetryTimeouts.forEach((timeoutId) => window.clearTimeout(timeoutId));
@@ -342,33 +417,40 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
                 };
             }
             const successFlowKey = querySessionId || '__missing_session__';
-            if (checkoutSuccessHandledRef.current === successFlowKey) {
+            if (checkoutSuccessSettledRef.current === successFlowKey) {
                 return () => {
                     cancelled = true;
                     pendingRetryTimeouts.forEach((timeoutId) => window.clearTimeout(timeoutId));
                     pendingRetryTimeouts.clear();
                 };
             }
-            checkoutSuccessHandledRef.current = successFlowKey;
             void (async () => {
+                const autoConfirmStartedAt = Date.now();
                 const preConfirmationSummary = await loadAccountProfileSummary({ force: true });
                 if (cancelled)
                     return;
                 let confirmation = querySessionId
                     ? { confirmed: false, errorMessage: 'Unable to confirm checkout completion.', retryable: true }
                     : { confirmed: false, errorMessage: 'Checkout session is missing.', retryable: false };
-                for (const delayMs of CHECKOUT_CONFIRM_RETRY_DELAYS_MS) {
+                let attemptIndex = 0;
+                while (true) {
+                    const delayMs = attemptIndex < CHECKOUT_CONFIRM_INITIAL_RETRY_DELAYS_MS.length
+                        ? CHECKOUT_CONFIRM_INITIAL_RETRY_DELAYS_MS[attemptIndex]
+                        : CHECKOUT_CONFIRM_RETRY_INTERVAL_MS;
+                    attemptIndex += 1;
                     await waitForRetry(delayMs);
                     if (cancelled)
                         return;
                     confirmation = querySessionId
                         ? await confirmCheckoutSession(querySessionId, {
-                            autoContinueOnActivation: shouldAutoContinueAfterActivation(preConfirmationSummary, gateState)
+                            autoContinueOnActivation: shouldAutoContinueAfterActivation(preConfirmationSummary, gateState),
+                            preConfirmationSummary
                         })
                         : { confirmed: false, errorMessage: 'Checkout session is missing.', retryable: false };
                     if (cancelled)
                         return;
                     if (confirmation.confirmed) {
+                        checkoutSuccessSettledRef.current = successFlowKey;
                         setFeedback({ type: 'success', message: 'Checkout completed successfully.' });
                         scheduleTransientQueryClear();
                         return;
@@ -376,6 +458,9 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
                     if (!confirmation.retryable) {
                         break;
                     }
+                    if ((Date.now() - autoConfirmStartedAt) >= CHECKOUT_CONFIRM_MAX_AUTO_RETRY_MS) {
+                        break;
+                    }
                 }
                 if (cancelled)
                     return;
@@ -383,11 +468,18 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
                     const summary = await loadAccountProfileSummary({ force: true });
                     if (cancelled)
                         return;
+                    if (!confirmation.retryable) {
+                        checkoutSuccessSettledRef.current = successFlowKey;
+                    }
                     setFeedback({
                         type: 'error',
-                        message: resolveRecoveryMessage(summary, confirmation.errorMessage)
+                        message: resolveRecoveryMessage(summary, confirmation.errorMessage, {
+                            preferFallback: !confirmation.retryable
+                        })
                     });
-                    scheduleTransientQueryClear();
+                    if (!confirmation.retryable) {
+                        scheduleTransientQueryClear();
+                    }
                     return;
                 }
             })();
@@ -464,7 +556,7 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
     }, [accountProfileSummary, gateState, isAuthenticated, navigate, openBillingPortal, shouldAutoContinueAfterActivation, startCheckout]);
     const handleBack = useCallback(() => {
         if (hasResolvedActiveEntitlement && onContinueToTaskforce) {
-            void onContinueToTaskforce();
+            void handleContinueToTaskforce();
             return;
         }
         if (embedded) {
@@ -476,9 +568,8 @@ export function PlansPage({ isAuthenticated, authUserId, runtimeMode, authSessio
             return;
         }
         navigate('/');
-    }, [closeEmbeddedPlansScreen, embedded, hasResolvedActiveEntitlement, navigate, onContinueToTaskforce]);
-    const continueAction = hasResolvedActiveEntitlement && onContinueToTaskforce ? (_jsx("button", { className: styles.navAction, onClick: () => { void onContinueToTaskforce(); }, disabled: continueBusy || actionBusy, children: "Take Me to Taskforce" })) : null;
-    const topActions = embedded ? (_jsxs(_Fragment, { children: [continueAction, isAuthenticated && accountProfileSummary?.stripeCustomerId && (_jsx("button", { className: styles.navAction, onClick: () => { void openBillingPortal(); }, disabled: actionBusy, children: "Manage billing" }))] })) : (_jsxs(_Fragment, { children: [_jsx("button", { className: styles.navAction, onClick: handleBack, disabled: continueBusy || (isAuthenticated && !hasResolvedActiveEntitlement), children: hasResolvedActiveEntitlement ? 'Take Me to Taskforce' : 'Back' }), isAuthenticated && accountProfileSummary?.stripeCustomerId && (_jsx("button", { className: styles.navAction, onClick: () => { void openBillingPortal(); }, disabled: actionBusy, children: "Manage billing" })), !isAuthenticated && (_jsxs("button", { className: styles.navAction, onClick: () => navigate(`/login?mode=login&next=${encodeURIComponent(buildEmbeddedPlansPath())}`), children: [_jsx(User, { size: 16, style: { marginRight: '8px', verticalAlign: 'text-bottom' } }), "Sign In"] }))] }));
-    const chrome = embedded ? null : (_jsx(AppShellHeader, { projectName: projectName, currentWorkspaceId: currentWorkspaceId, runtimeMode: runtimeMode === 'cloud' ? 'cloud' : 'local', theme: currentTheme, actions: topActions }));
-    return (_jsx(PlanComparisonPage, { chrome: chrome, heading: "Subscription Plans", subtitle: "Manage your subscription and explore available features. Your current plan is highlighted below.", isAuthenticated: isAuthenticated, authSessionResolved: authSessionResolved, currentPlanId: String(accountProfileSummary?.planId || queryPlanId || '').trim() || null, currentPlanVersionId: String(accountProfileSummary?.planVersionId || queryPlanVersionId || '').trim() || null, currentEntitlementState: String(accountProfileSummary?.entitlementState || '').trim() || null, canManageCurrentPlan: Boolean(accountProfileSummary?.stripeCustomerId), pricingEndpoint: pricingEndpoints[0], statusBanner: feedback, onBack: handleBack, backLabel: hasResolvedActiveEntitlement ? 'Take Me to Taskforce' : (embedded ? 'Back to Board' : 'Back to App'), backDisabled: continueBusy || (isAuthenticated && !hasResolvedActiveEntitlement), topActions: embedded ? topActions : null, shellOwnsScroll: shellOwnsScroll, showPageBackButton: !embedded, fallbackPricingSource: fallbackPricingSource, onSelectPlan: handleSelectPlan }));
+    }, [closeEmbeddedPlansScreen, embedded, handleContinueToTaskforce, hasResolvedActiveEntitlement, navigate, onContinueToTaskforce]);
+    const headerActions = embedded ? null : (_jsxs(_Fragment, { children: [_jsx("button", { className: styles.navAction, onClick: handleBack, disabled: continueBusy || continueActionBusy || (isAuthenticated && !hasResolvedActiveEntitlement), children: hasResolvedActiveEntitlement ? 'Take Me to Taskforce' : 'Back' }), isAuthenticated && accountProfileSummary?.stripeCustomerId && (_jsx("button", { className: styles.navAction, onClick: () => { void openBillingPortal(); }, disabled: actionBusy, children: "Manage billing" })), !isAuthenticated && (_jsxs("button", { className: styles.navAction, onClick: () => navigate(`/login?mode=login&next=${encodeURIComponent(buildEmbeddedPlansPath())}`), children: [_jsx(User, { size: 16, style: { marginRight: '8px', verticalAlign: 'text-bottom' } }), "Sign In"] }))] }));
+    const chrome = embedded ? null : (_jsx(AppShellHeader, { projectName: projectName, currentWorkspaceId: currentWorkspaceId, runtimeMode: runtimeMode === 'cloud' ? 'cloud' : 'local', theme: currentTheme, onBrandClick: handleBack, actions: headerActions }));
+    return (_jsx(PlanComparisonPage, { chrome: chrome, heading: "Subscription Plans", subtitle: "Manage your subscription and explore available features. Your current plan is highlighted below.", isAuthenticated: isAuthenticated, authSessionResolved: authSessionResolved, currentPlanId: String(accountProfileSummary?.planId || queryPlanId || '').trim() || null, currentPlanVersionId: String(accountProfileSummary?.planVersionId || queryPlanVersionId || '').trim() || null, currentEntitlementState: String(accountProfileSummary?.entitlementState || '').trim() || null, markCurrentPlan: lifecyclePresentation.markCurrentPlan, canManageCurrentPlan: Boolean(accountProfileSummary?.stripeCustomerId), pricingEndpoint: pricingEndpoint, statusBanner: feedback, onBack: handleBack, backLabel: hasResolvedActiveEntitlement ? 'Take Me to Taskforce' : (embedded ? 'Back to Board' : 'Back to App'), backDisabled: continueBusy || continueActionBusy || (isAuthenticated && !hasResolvedActiveEntitlement), topActions: null, shellOwnsScroll: shellOwnsScroll, showPageBackButton: false, showHeaderBarWithChrome: false, currentPlanCardActionMode: "manage", fallbackPricingSource: fallbackPricingSource, onSelectPlan: handleSelectPlan }));
 }