@taskforcehq/taskforce 0.3.170 → 0.3.300

package/dist/components/views/PlanComparisonPage.js

@@ -0,0 +1,196 @@
+import { Fragment as _Fragment, jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from 'react';
+import { CheckCircle2, Loader2 } from 'lucide-react';
+import taskforceStyles from '../../Taskforce.module.css';
+import styles from './PlansPage.module.css';
+function isDebugModeEnabled() {
+    const runtimeOverride = globalThis.__DEBUG_MODE__;
+    if (typeof runtimeOverride === 'boolean')
+        return runtimeOverride;
+    return typeof __DEBUG_MODE__ !== 'undefined' && __DEBUG_MODE__;
+}
+function formatPricingSource(pricingSource) {
+    const environment = String(pricingSource?.environment || '').trim();
+    const runtimeMode = String(pricingSource?.runtimeMode || '').trim();
+    if (!environment && !runtimeMode)
+        return null;
+    if (environment && runtimeMode)
+        return `${environment} (${runtimeMode})`;
+    return environment || runtimeMode || null;
+}
+function formatCurrency(amount, currency) {
+    if (amount == null || !currency)
+        return 'Contact Sales';
+    try {
+        return new Intl.NumberFormat('en-US', {
+            style: 'currency',
+            currency: currency.toUpperCase(),
+            minimumFractionDigits: 0
+        }).format(amount / 100);
+    }
+    catch {
+        return `${currency.toUpperCase()} ${amount / 100}`;
+    }
+}
+function renderFreePriceAmount() {
+    return '$0.00';
+}
+function isSelectablePrice(price) {
+    if (!price)
+        return false;
+    if (price.pricingType === 'free')
+        return true;
+    return price.unitAmount != null && price.currency != null;
+}
+function renderPriceLabel(price) {
+    if (!price)
+        return 'Unavailable';
+    if (price.pricingType === 'free')
+        return renderFreePriceAmount();
+    return formatCurrency(price.unitAmount, price.currency);
+}
+function getPlanSortRank(plan) {
+    const prices = [plan.pricing.month, plan.pricing.year].filter(Boolean);
+    if (prices.some((price) => price.pricingType === 'free'))
+        return 0;
+    const numericAmounts = prices
+        .map((price) => (price.pricingType === 'stripe' && typeof price.unitAmount === 'number' ? price.unitAmount : null))
+        .filter((amount) => amount != null);
+    if (numericAmounts.length > 0)
+        return Math.min(...numericAmounts);
+    return Number.POSITIVE_INFINITY;
+}
+function isActiveEntitlementState(raw) {
+    const value = String(raw || '').trim().toLowerCase();
+    return value === 'active' || value === 'trialing' || value === 'grace';
+}
+export function PlanComparisonPage({ heading, subtitle, variant = 'app', chrome, footer, isAuthenticated, authSessionResolved = true, currentPlanId, currentPlanVersionId, currentEntitlementState, canManageCurrentPlan = true, pricingEndpoint, statusBanner, onBack, backLabel, topActions, shellOwnsScroll = false, showPageBackButton = true, fallbackPricingSource = null, onSelectPlan }) {
+    const [plans, setPlans] = useState([]);
+    const [pricingSource, setPricingSource] = useState(null);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    const [retryNonce, setRetryNonce] = useState(0);
+    useEffect(() => {
+        let active = true;
+        const fetchPricing = async () => {
+            const endpoint = String(pricingEndpoint || '/api/taskforce/public/pricing').trim() || '/api/taskforce/public/pricing';
+            if (active) {
+                setLoading(true);
+                setError(null);
+            }
+            try {
+                const res = await fetch(endpoint, { method: 'GET', credentials: 'include' });
+                const body = await res.json().catch(() => ({}));
+                if (res.ok) {
+                    if (active) {
+                        setPlans(Array.isArray(body?.plans) ? body.plans : []);
+                        setPricingSource(body?.pricingSource && typeof body.pricingSource === 'object' ? body.pricingSource : null);
+                    }
+                    return;
+                }
+                throw new Error(String(body?.error || `Failed to load pricing (${res.status})`));
+            }
+            catch (err) {
+                if (active) {
+                    const message = err instanceof Error ? err.message : 'Failed to load pricing';
+                    setError(message || 'Failed to load pricing');
+                    setPricingSource(null);
+                }
+            }
+            finally {
+                if (active)
+                    setLoading(false);
+            }
+        };
+        void fetchPricing();
+        return () => { active = false; };
+    }, [pricingEndpoint, retryNonce]);
+    const sortedPlans = useMemo(() => [...plans].sort((a, b) => {
+        const aRank = getPlanSortRank(a);
+        const bRank = getPlanSortRank(b);
+        if (aRank !== bRank)
+            return aRank - bRank;
+        const aDefault = a.defaultVersion?.versionNumber || 0;
+        const bDefault = b.defaultVersion?.versionNumber || 0;
+        if (aDefault !== bDefault)
+            return aDefault - bDefault;
+        return String(a.displayName || a.planId).localeCompare(String(b.displayName || b.planId));
+    }), [plans]);
+    const pricingSourceLabel = useMemo(() => formatPricingSource(pricingSource || fallbackPricingSource), [fallbackPricingSource, pricingSource]);
+    const contentClassName = `${styles.plansWrapper} ${shellOwnsScroll ? styles.shellOwnsScroll : 'tf-scrollbar'} ${variant === 'site' ? styles.siteVariant : ''} ${chrome ? styles.withChrome : ''}`.trim();
+    const wrapPage = (content) => {
+        if (shellOwnsScroll) {
+            return (_jsxs(_Fragment, { children: [chrome, content, footer] }));
+        }
+        return (_jsxs("div", { className: taskforceStyles.standaloneWrapper, "data-theme": "dark", children: [chrome, content, footer] }));
+    };
+    if (loading || !authSessionResolved) {
+        return wrapPage(_jsx(_Fragment, { children: _jsx("div", { className: contentClassName, children: _jsx("div", { className: styles.contentFrame, children: _jsxs("div", { className: styles.loader, children: [_jsx(Loader2, { size: 48, className: styles.spinner }), _jsx("p", { children: "Loading plans..." })] }) }) }) }));
+    }
+    if (error) {
+        return wrapPage(_jsx(_Fragment, { children: _jsx("div", { className: contentClassName, children: _jsx("div", { className: styles.contentFrame, children: _jsxs("div", { className: styles.emptyState, children: [_jsx("h2", { children: "Connecting to plan pricing..." }), _jsx("p", { children: error }), _jsx("button", { className: styles.backBtn, onClick: () => setRetryNonce((value) => value + 1), children: "Retry" })] }) }) }) }));
+    }
+    return wrapPage(_jsx(_Fragment, { children: _jsx("div", { className: contentClassName, children: _jsxs("div", { className: styles.contentFrame, children: [_jsxs("div", { className: styles.header, children: [!chrome && (showPageBackButton || topActions) && (_jsxs("div", { className: styles.headerBar, children: [_jsx("div", { children: showPageBackButton ? (_jsx("button", { className: styles.backBtn, onClick: onBack, children: backLabel })) : null }), _jsx("div", { className: styles.headerActions, children: topActions })] })), _jsx("h1", { className: styles.title, children: heading }), subtitle && _jsx("p", { className: styles.subtitle, children: subtitle }), isDebugModeEnabled() && pricingSourceLabel ? (_jsxs("p", { className: styles.debugMeta, children: ["Pricing source: ", pricingSourceLabel] })) : null, statusBanner && (_jsx("div", { className: `${styles.statusBanner} ${statusBanner.type === 'success' ? styles.successBanner : styles.errorBanner}`, children: statusBanner.message }))] }), sortedPlans.length === 0 ? (_jsxs("div", { className: `${styles.emptyState} ${styles.marketingEmptyState}`, children: [_jsx("span", { className: styles.emptyBadge, children: "Coming Soon" }), _jsx("h2", { children: "Paid plans are getting their final polish." }), _jsx("p", { children: "Taskforce pricing is on the way with flexible options for solo operators, teams, and larger rollouts. Check back soon for launch tiers, feature bundles, and early access details." }), _jsxs("div", { className: styles.emptyHighlights, "aria-label": "Upcoming pricing highlights", children: [_jsx("span", { children: "Launch-ready tiers" }), _jsx("span", { children: "Team billing controls" }), _jsx("span", { children: "Feature-based packaging" })] })] })) : (_jsx("div", { className: styles.grid, children: sortedPlans.map((plan) => {
+                            const monthPrice = plan.pricing.month;
+                            const yearPrice = plan.pricing.year;
+                            const hasMonth = isSelectablePrice(monthPrice);
+                            const hasYear = isSelectablePrice(yearPrice);
+                            const planVersionId = String(plan.defaultVersion?.planVersionId || '').trim();
+                            const isCurrent = Boolean(planVersionId
+                                && currentPlanVersionId
+                                && currentPlanVersionId === planVersionId
+                                && isActiveEntitlementState(currentEntitlementState)) || (!currentPlanVersionId
+                                && Boolean(currentPlanId && currentPlanId === plan.planId));
+                            const defaultInterval = hasMonth ? 'month' : (hasYear ? 'year' : null);
+                            const defaultPrice = defaultInterval === 'year' ? yearPrice : monthPrice;
+                            const canSelectCard = Boolean(planVersionId) && (isCurrent ? canManageCurrentPlan : Boolean(defaultInterval));
+                            const handleCardSelect = () => {
+                                if (!planVersionId)
+                                    return;
+                                if (isCurrent) {
+                                    if (!canManageCurrentPlan)
+                                        return;
+                                    void onSelectPlan({
+                                        planId: plan.planId,
+                                        planVersionId,
+                                        interval: defaultInterval || 'month',
+                                        pricingType: defaultPrice?.pricingType || 'stripe',
+                                        isCurrentPlan: true
+                                    });
+                                    return;
+                                }
+                                if (!defaultInterval)
+                                    return;
+                                void onSelectPlan({
+                                    planId: plan.planId,
+                                    planVersionId,
+                                    interval: defaultInterval,
+                                    pricingType: defaultPrice?.pricingType || 'stripe',
+                                    isCurrentPlan: false
+                                });
+                            };
+                            return (_jsxs("div", { className: `${styles.planCard} ${isCurrent ? styles.activePlanCard : ''} ${canSelectCard ? styles.clickablePlanCard : ''}`, "data-testid": `plan-card-${plan.planId}`, role: canSelectCard ? 'button' : undefined, tabIndex: canSelectCard ? 0 : undefined, onClick: canSelectCard ? handleCardSelect : undefined, onKeyDown: canSelectCard ? (event) => {
+                                    if (event.key === 'Enter' || event.key === ' ') {
+                                        event.preventDefault();
+                                        handleCardSelect();
+                                    }
+                                } : undefined, children: [isCurrent && _jsx("span", { className: styles.currentBadge, children: "Current Plan" }), _jsx("h3", { className: styles.planName, children: plan.displayName }), _jsx("div", { className: styles.featuresList, children: Array.isArray(plan.features) && plan.features.length > 0 ? plan.features.map((feature, idx) => (_jsxs("div", { className: styles.featureItem, children: [_jsx(CheckCircle2, { className: styles.featureIcon }), _jsx("span", { className: styles.featureText, children: String(feature.featureKey || '').replace(/[_\-.]+/g, ' ').replace(/\b\w/g, (c) => c.toUpperCase()) })] }, `${feature.featureKey}-${idx}`))) : (_jsx("span", { className: styles.featureText, children: "No additional features included" })) }), _jsxs("div", { className: styles.priceRows, children: [_jsxs("div", { className: styles.priceRow, children: [_jsx("span", { className: styles.priceRowAmount, children: renderPriceLabel(monthPrice) }), _jsx("span", { className: styles.priceRowInterval, children: "/ month" })] }), _jsxs("div", { className: styles.priceRow, children: [_jsx("span", { className: styles.priceRowAmount, children: renderPriceLabel(yearPrice) }), _jsx("span", { className: styles.priceRowInterval, children: "/ year" })] })] }), isCurrent ? (_jsx("button", { className: `${styles.callToAction} ${styles.currentCta}`, "data-testid": `plan-manage-${plan.planId}`, onClick: (event) => {
+                                            event.stopPropagation();
+                                            if (!canManageCurrentPlan)
+                                                return;
+                                            void onSelectPlan({ planId: plan.planId, planVersionId, interval: defaultInterval || 'month', pricingType: defaultPrice?.pricingType || 'stripe', isCurrentPlan: true });
+                                        }, disabled: !planVersionId || !canManageCurrentPlan, children: isAuthenticated
+                                            ? (canManageCurrentPlan ? 'Manage Plan' : 'Current Plan')
+                                            : 'Current Plan' })) : (_jsxs("div", { className: styles.ctaRow, children: [_jsx("button", { className: `${styles.callToAction} ${styles.secondaryCta}`, "data-testid": `plan-select-${plan.planId}-month`, onClick: (event) => {
+                                                    event.stopPropagation();
+                                                    void onSelectPlan({ planId: plan.planId, planVersionId, interval: 'month', pricingType: monthPrice?.pricingType || 'stripe', isCurrentPlan: false });
+                                                }, disabled: !planVersionId || !hasMonth, children: monthPrice?.pricingType === 'free'
+                                                    ? (isAuthenticated ? 'Select Free' : 'Get Started Free')
+                                                    : (isAuthenticated ? 'Choose Monthly' : 'Get Started Monthly') }), _jsx("button", { className: `${styles.callToAction} ${styles.primaryCta}`, "data-testid": `plan-select-${plan.planId}-year`, onClick: (event) => {
+                                                    event.stopPropagation();
+                                                    void onSelectPlan({ planId: plan.planId, planVersionId, interval: 'year', pricingType: yearPrice?.pricingType || 'stripe', isCurrentPlan: false });
+                                                }, disabled: !planVersionId || !hasYear, children: yearPrice?.pricingType === 'free'
+                                                    ? (isAuthenticated ? 'Select Free' : 'Get Started Free')
+                                                    : (isAuthenticated ? 'Choose Yearly' : 'Get Started Yearly') })] }))] }, plan.planId));
+                        }) }))] }) }) }));
+}

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

@@ -0,0 +1,251 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
+import { within } from '@testing-library/react';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import { PlanComparisonPage } from './PlanComparisonPage';
+describe('PlanComparisonPage', () => {
+    beforeEach(() => {
+        globalThis.__DEBUG_MODE__ = false;
+        vi.stubGlobal('fetch', vi.fn(async () => ({
+            ok: true,
+            json: async () => ({
+                pricingSource: {
+                    environment: 'production',
+                    runtimeMode: 'cloud'
+                },
+                plans: [
+                    {
+                        planId: 'starter',
+                        displayName: 'Starter',
+                        status: 'active',
+                        defaultVersion: {
+                            planVersionId: 'starter-v1',
+                            versionNumber: 1,
+                            seatLimit: null,
+                            metadata: {}
+                        },
+                        features: [],
+                        pricing: {
+                            month: { pricingType: 'free', stripePriceId: null, unitAmount: null, currency: null, interval: 'month' },
+                            year: null
+                        }
+                    },
+                    {
+                        planId: 'collab',
+                        displayName: 'Collab',
+                        status: 'active',
+                        defaultVersion: {
+                            planVersionId: 'collab-v2',
+                            versionNumber: 2,
+                            seatLimit: 5,
+                            metadata: {}
+                        },
+                        features: [],
+                        pricing: {
+                            month: { pricingType: 'stripe', stripePriceId: 'price_collab_month', unitAmount: 2000, currency: 'usd', interval: 'month' },
+                            year: { pricingType: 'stripe', stripePriceId: 'price_collab_year', unitAmount: 20000, currency: 'usd', interval: 'year' }
+                        }
+                    }
+                ]
+            })
+        })));
+    });
+    afterEach(() => {
+        delete globalThis.__DEBUG_MODE__;
+        vi.unstubAllGlobals();
+    });
+    it('shows pricing source details only when debug mode is enabled', async () => {
+        globalThis.__DEBUG_MODE__ = true;
+        render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: false, onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
+        expect(await screen.findByText('Pricing source: production (cloud)')).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 () => ({
+            ok: true,
+            json: async () => ({
+                plans: [
+                    {
+                        planId: 'starter',
+                        displayName: 'Starter',
+                        status: 'active',
+                        defaultVersion: {
+                            planVersionId: 'starter-v1',
+                            versionNumber: 1,
+                            seatLimit: null,
+                            metadata: {}
+                        },
+                        features: [],
+                        pricing: {
+                            month: { pricingType: 'free', stripePriceId: null, unitAmount: null, currency: null, interval: 'month' },
+                            year: null
+                        }
+                    }
+                ]
+            })
+        })));
+        render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: false, fallbackPricingSource: { environment: 'performance', runtimeMode: 'local' }, onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
+        expect(await screen.findByText('Pricing source: performance (local)')).toBeInTheDocument();
+    });
+    it('keeps pricing source details hidden when debug mode is disabled', async () => {
+        render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: false, onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
+        await screen.findByRole('heading', { name: 'Subscription Plans' });
+        expect(screen.queryByText('Pricing source: production (cloud)')).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: "collab", currentPlanVersionId: "collab-v1", currentEntitlementState: "active", onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
+        expect(await screen.findByRole('heading', { name: 'Subscription Plans' })).toBeInTheDocument();
+        expect(screen.queryByText('Current Plan')).not.toBeInTheDocument();
+    });
+    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 }));
+        await screen.findByRole('heading', { name: 'Subscription Plans' });
+        const starterHeading = screen.getByRole('heading', { name: 'Starter' });
+        const starterCard = starterHeading.closest('[role="button"]');
+        expect(starterCard).toBeTruthy();
+        expect(within(starterCard).getByText('$0.00')).toBeInTheDocument();
+        expect(within(starterCard).getByText('/ month')).toBeInTheDocument();
+        fireEvent.click(starterCard);
+        await waitFor(() => {
+            expect(onSelectPlan).toHaveBeenCalledWith({
+                planId: 'starter',
+                planVersionId: 'starter-v1',
+                interval: 'month',
+                pricingType: 'free',
+                isCurrentPlan: false
+            });
+        });
+    });
+    it('does not trigger current-plan actions when the current plan is not Stripe-managed', async () => {
+        const onSelectPlan = vi.fn();
+        render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: true, currentPlanId: "starter", currentPlanVersionId: "starter-v1", currentEntitlementState: "active", canManageCurrentPlan: false, onBack: () => { }, backLabel: "Back", onSelectPlan: onSelectPlan }));
+        await screen.findByRole('heading', { name: 'Subscription Plans' });
+        const currentButton = screen.getByRole('button', { name: 'Current Plan' });
+        expect(currentButton).toBeDisabled();
+        expect(onSelectPlan).not.toHaveBeenCalled();
+    });
+    it('loads pricing from the provided cloud endpoint', async () => {
+        const fetchMock = vi.fn().mockResolvedValue({
+            ok: true,
+            json: async () => ({
+                pricingSource: {
+                    environment: 'performance',
+                    runtimeMode: 'cloud'
+                },
+                plans: [
+                    {
+                        planId: 'starter',
+                        displayName: 'Starter',
+                        status: 'active',
+                        defaultVersion: {
+                            planVersionId: 'starter-v1',
+                            versionNumber: 1,
+                            seatLimit: null,
+                            metadata: {}
+                        },
+                        features: [],
+                        pricing: {
+                            month: { pricingType: 'free', stripePriceId: null, unitAmount: 0, currency: null, interval: 'month' },
+                            year: null
+                        }
+                    }
+                ]
+            })
+        });
+        vi.stubGlobal('fetch', fetchMock);
+        render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: false, pricingEndpoint: "https://performance-app.example/api/taskforce/public/pricing", onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
+        expect(await screen.findByRole('heading', { name: 'Starter' })).toBeInTheDocument();
+        expect(fetchMock).toHaveBeenCalledTimes(1);
+        expect(fetchMock).toHaveBeenCalledWith('https://performance-app.example/api/taskforce/public/pricing', {
+            method: 'GET',
+            credentials: 'include'
+        });
+        expect(screen.queryByText('Connecting to plan pricing...')).not.toBeInTheDocument();
+    });
+    it('orders plans from free to highest priced tier', async () => {
+        const fetchMock = vi.fn().mockResolvedValue({
+            ok: true,
+            json: async () => ({
+                pricingSource: {
+                    environment: 'production',
+                    runtimeMode: 'cloud'
+                },
+                plans: [
+                    {
+                        planId: 'enterprise',
+                        displayName: 'Enterprise',
+                        status: 'active',
+                        defaultVersion: {
+                            planVersionId: 'enterprise-v3',
+                            versionNumber: 3,
+                            seatLimit: 100,
+                            metadata: {}
+                        },
+                        features: [],
+                        pricing: {
+                            month: { pricingType: 'stripe', stripePriceId: 'price_enterprise_month', unitAmount: 12000, currency: 'usd', interval: 'month' },
+                            year: { pricingType: 'stripe', stripePriceId: 'price_enterprise_year', unitAmount: 120000, currency: 'usd', interval: 'year' }
+                        }
+                    },
+                    {
+                        planId: 'starter',
+                        displayName: 'Starter',
+                        status: 'active',
+                        defaultVersion: {
+                            planVersionId: 'starter-v1',
+                            versionNumber: 1,
+                            seatLimit: null,
+                            metadata: {}
+                        },
+                        features: [],
+                        pricing: {
+                            month: { pricingType: 'free', stripePriceId: null, unitAmount: 0, currency: null, interval: 'month' },
+                            year: null
+                        }
+                    },
+                    {
+                        planId: 'pro',
+                        displayName: 'Pro',
+                        status: 'active',
+                        defaultVersion: {
+                            planVersionId: 'pro-v2',
+                            versionNumber: 2,
+                            seatLimit: 10,
+                            metadata: {}
+                        },
+                        features: [],
+                        pricing: {
+                            month: { pricingType: 'stripe', stripePriceId: 'price_pro_month', unitAmount: 3000, currency: 'usd', interval: 'month' },
+                            year: { pricingType: 'stripe', stripePriceId: 'price_pro_year', unitAmount: 30000, currency: 'usd', interval: 'year' }
+                        }
+                    }
+                ]
+            })
+        });
+        vi.stubGlobal('fetch', fetchMock);
+        render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: false, onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
+        await screen.findByRole('heading', { name: 'Subscription Plans' });
+        const planNames = screen.getAllByRole('heading', { level: 3 }).map((node) => node.textContent);
+        expect(planNames).toEqual(['Starter', 'Pro', 'Enterprise']);
+    });
+    it('defaults to the same-origin pricing endpoint', async () => {
+        const fetchMock = vi.fn().mockResolvedValue({
+            ok: true,
+            json: async () => ({
+                pricingSource: {
+                    environment: 'production',
+                    runtimeMode: 'cloud'
+                },
+                plans: []
+            })
+        });
+        vi.stubGlobal('fetch', fetchMock);
+        render(_jsx(PlanComparisonPage, { heading: "Subscription Plans", isAuthenticated: false, onBack: () => { }, backLabel: "Back", onSelectPlan: () => { } }));
+        await screen.findByText('Paid plans are getting their final polish.');
+        expect(fetchMock).toHaveBeenCalledWith('/api/taskforce/public/pricing', {
+            method: 'GET',
+            credentials: 'include'
+        });
+    });
+});

package/dist/components/views/PlansPage.d.ts

@@ -0,0 +1,14 @@
+interface PlansPageProps {
+    isAuthenticated: boolean;
+    runtimeMode: string;
+    authSessionResolved: boolean;
+    currentTheme?: import('../../types').TaskforceTheme;
+    projectName?: string | null;
+    currentWorkspaceId?: string | null;
+    apiBaseUrl?: string | null;
+    connectedEnvironmentSource?: string | null;
+    embedded?: boolean;
+    shellOwnsScroll?: boolean;
+}
+export declare function PlansPage({ isAuthenticated, runtimeMode, authSessionResolved, currentTheme, projectName, currentWorkspaceId, apiBaseUrl, connectedEnvironmentSource, embedded, shellOwnsScroll }: PlansPageProps): import("react/jsx-runtime").JSX.Element;
+export {};