npm - @burdenoff/microfe-billing - Versions diffs - 2026.528.1 → 2026.529.1 - Mend

@burdenoff/microfe-billing 2026.528.1 → 2026.529.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (16) hide show

package/dist/billing/modules/plans/pages/PlansListPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PlansListPage.js","names":[],"sources":["../../../../../src/billing/modules/plans/pages/PlansListPage.tsx"],"sourcesContent":["/*\n Plans Module - Plans List Page\n * Displays all available pricing plans\n /\n\nimport { useState, useMemo, type FC } from 'react';\nimport { useBillingNavigate } from '../../../hooks/useBillingNavigate';\nimport { usePlans, usePlanMutations } from '../hooks';\nimport { useBillingPermissions } from '../../../hooks/useBillingPermissions';\nimport { AccessDenied, ServerError } from '../../../shared/components';\nimport {\n formatCurrency,\n formatPlanDuration,\n formatPlanDurationLabel,\n isServerError,\n} from '../../../shared/utils';\nimport type { Plan, PlanDuration, PlanFeature } from '../../../shared/types';\nimport { PricingModel } from '../../../shared/types';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport {\n useDefaultBillingCurrency,\n getDisplayPrice,\n} from '../../../hooks/useDefaultBillingCurrency';\n\ntype ViewMode = 'grid' \| 'list';\n\n/\n Combined quota info for display\n /\ninterface CombinedQuota {\n quotaId: string;\n name: string;\n totalValue: number;\n}\n\n/\n Combines duplicate quotas by quota ID and aggregates their values\n /\nfunction combineQuotas(features: PlanFeature[]): CombinedQuota[] {\n const quotaMap = new Map<string, CombinedQuota>();\n\n for (const feature of features) {\n if (!feature.quota) continue;\n\n const quotaId = feature.quota.id;\n const limits = feature.quota.limits as { value?: number } \| null;\n const limitValue = limits?.value ?? 0;\n\n const existing = quotaMap.get(quotaId);\n if (existing) {\n existing.totalValue += limitValue;\n } else {\n quotaMap.set(quotaId, {\n quotaId,\n name: feature.quota.name ?? 'Unknown Quota',\n totalValue: limitValue,\n });\n }\n }\n\n return Array.from(quotaMap.values());\n}\n\nexport const PlansListPage: FC = () => {\n const { t } = useI18n();\n const tr = (key: string, fallback: string): string => {\n const translated = t(key);\n return translated === key ? fallback : translated;\n };\n const navigateTo = useBillingNavigate();\n const permissions = useBillingPermissions();\n const { plans, isLoading, error, refetch } = usePlans();\n const { togglePlan, isToggling } = usePlanMutations();\n\n const [viewMode, setViewMode] = useState<ViewMode>('grid');\n const [showInactive, setShowInactive] = useState(false);\n const [billingInterval, setBillingInterval] = useState<PlanDuration \| 'all'>('all');\n\n // Permission check\n if (!permissions.canViewPlans) {\n return (\n <AccessDenied\n message={tr(\n 'billing.plans.noViewPermission',\n \"You don't have permission to view pricing plans.\"\n )}\n />\n );\n }\n\n // Filter plans\n const filteredPlans = plans.filter((plan) => {\n if (!showInactive && !plan.isActive) return false;\n if (billingInterval !== 'all' && plan.duration !== billingInterval) return false;\n return true;\n });\n\n const handleTogglePlan = async (plan: Plan) => {\n if (!permissions.canManagePlans) return;\n try {\n await togglePlan(plan.id, !plan.isActive);\n await refetch();\n } catch (err) {\n console.error('Failed to toggle plan:', err);\n }\n };\n\n const handleSelectPlan = (plan: Plan) => {\n navigateTo(`/checkout/${plan.id}`);\n };\n\n const handleViewPlan = (plan: Plan) => {\n navigateTo(`/plans/${plan.id}`);\n };\n\n // Loading state\n if (isLoading && plans.length === 0) {\n return (\n <div className=\"space-y-6 p-6\">\n <div className=\"h-8 w-48 bg-muted animate-pulse rounded\" />\n <div className=\"grid grid-cols-1 md:grid-cols-3 gap-6\">\n {[1, 2, 3].map((i) => (\n <div key={i} className=\"border border-border rounded-lg p-6 space-y-4\">\n <div className=\"h-6 w-24 bg-muted animate-pulse rounded\" />\n <div className=\"h-8 w-32 bg-muted animate-pulse rounded\" />\n <div className=\"space-y-2\">\n {[1, 2, 3, 4].map((j) => (\n <div key={j} className=\"h-4 w-full bg-muted animate-pulse rounded\" />\n ))}\n </div>\n </div>\n ))}\n </div>\n </div>\n );\n }\n\n // Error state - show server error component for 500 errors\n if (error) {\n if (isServerError(error)) {\n return (\n <div className=\"p-6\">\n <ServerError\n title={tr('billing.plans.serverUnavailable', 'Server Unavailable')}\n message={tr(\n 'billing.plans.serverUnavailableMessage',\n 'Unable to load pricing plans. The server might be down or experiencing issues.'\n )}\n onRetry={() => refetch()}\n showRetry\n />\n </div>\n );\n }\n // Generic error for non-server errors\n return (\n <div className=\"flex items-center justify-center h-full min-h-[400px]\">\n <div className=\"text-center space-y-4\">\n <div className=\"size-12 mx-auto rounded-full bg-destructive/10 flex items-center justify-center\">\n <svg\n className=\"size-6 text-destructive\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n />\n </svg>\n </div>\n <h2 className=\"text-lg font-semibold text-foreground\">\n {tr('billing.plans.failedToLoad', 'Failed to load plans')}\n </h2>\n <p className=\"text-sm text-muted-foreground\">{error.message}</p>\n <button\n type=\"button\"\n onClick={() => refetch()}\n className=\"px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n >\n Try Again\n </button>\n </div>\n </div>\n );\n }\n\n return (\n <div className=\"space-y-6 p-6\">\n {/ Header /}\n <div className=\"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between\">\n <div>\n <h1 className=\"text-2xl font-bold text-foreground\">\n {tr('billing.plans.title', 'Pricing Plans')}\n </h1>\n <p className=\"text-sm text-muted-foreground mt-1\">\n {tr('billing.plans.subtitle', 'Choose the plan that best fits your needs')}\n </p>\n </div>\n\n {permissions.canManagePlans && (\n <button\n type=\"button\"\n onClick={() => navigateTo('/plans/new')}\n className=\"inline-flex items-center gap-2 px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n >\n <svg className=\"size-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M12 4v16m8-8H4\"\n />\n </svg>\n Create Plan\n </button>\n )}\n </div>\n\n {/ Filters /}\n <div className=\"flex flex-wrap items-center gap-4 pb-4 border-b border-border\">\n {/ Billing Interval Toggle /}\n <div className=\"inline-flex rounded-lg border border-border p-1 bg-muted/50\">\n <button\n type=\"button\"\n onClick={() => setBillingInterval('all')}\n className={`px-3 py-1.5 text-sm font-medium rounded-md transition-colors ${\n billingInterval === 'all'\n ? 'bg-background text-foreground shadow-sm'\n : 'text-muted-foreground hover:text-foreground'\n }`}\n >\n All\n </button>\n <button\n type=\"button\"\n onClick={() => setBillingInterval('monthly' as PlanDuration)}\n className={`px-3 py-1.5 text-sm font-medium rounded-md transition-colors ${\n billingInterval === 'monthly'\n ? 'bg-background text-foreground shadow-sm'\n : 'text-muted-foreground hover:text-foreground'\n }`}\n >\n Monthly\n </button>\n <button\n type=\"button\"\n onClick={() => setBillingInterval('yearly' as PlanDuration)}\n className={`px-3 py-1.5 text-sm font-medium rounded-md transition-colors ${\n billingInterval === 'yearly'\n ? 'bg-background text-foreground shadow-sm'\n : 'text-muted-foreground hover:text-foreground'\n }`}\n >\n Yearly\n </button>\n </div>\n\n {/ Show Inactive Toggle /}\n {permissions.canManagePlans && (\n <label className=\"flex items-center gap-2 text-sm cursor-pointer\">\n <input\n type=\"checkbox\"\n checked={showInactive}\n onChange={(e) => setShowInactive(e.target.checked)}\n className=\"size-4 rounded border-border text-primary focus:ring-primary\"\n />\n <span className=\"text-muted-foreground\">\n {tr('billing.plans.showInactive', 'Show inactive plans')}\n </span>\n </label>\n )}\n\n {/ View Mode Toggle /}\n <div className=\"ml-auto inline-flex rounded-lg border border-border p-1 bg-muted/50\">\n <button\n type=\"button\"\n onClick={() => setViewMode('grid')}\n className={`p-1.5 rounded-md transition-colors ${\n viewMode === 'grid'\n ? 'bg-background text-foreground shadow-sm'\n : 'text-muted-foreground hover:text-foreground'\n }`}\n title=\"Grid view\"\n >\n <svg className=\"size-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z\"\n />\n </svg>\n </button>\n <button\n type=\"button\"\n onClick={() => setViewMode('list')}\n className={`p-1.5 rounded-md transition-colors ${\n viewMode === 'list'\n ? 'bg-background text-foreground shadow-sm'\n : 'text-muted-foreground hover:text-foreground'\n }`}\n title=\"List view\"\n >\n <svg className=\"size-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M4 6h16M4 12h16M4 18h16\"\n />\n </svg>\n </button>\n </div>\n </div>\n\n {/ Plans Grid/List /}\n {filteredPlans.length === 0 ? (\n <div className=\"flex flex-col items-center justify-center py-12 border border-dashed border-border rounded-lg\">\n <div className=\"size-12 rounded-full bg-muted flex items-center justify-center mb-4\">\n <svg\n className=\"size-6 text-muted-foreground\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"\n />\n </svg>\n </div>\n <h3 className=\"text-lg font-medium text-foreground\">\n {tr('billing.plans.noPlansFound', 'No plans found')}\n </h3>\n <p className=\"text-sm text-muted-foreground mt-1\">\n {showInactive\n ? tr('billing.plans.noPlansFiltered', 'No plans match your current filters.')\n : tr('billing.plans.noActivePlans', 'There are no active plans available.')}\n </p>\n {permissions.canManagePlans && (\n <button\n type=\"button\"\n onClick={() => navigateTo('/plans/new')}\n className=\"mt-4 px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n >\n {tr('billing.plans.createFirstPlan', 'Create your first plan')}\n </button>\n )}\n </div>\n ) : viewMode === 'grid' ? (\n <div className=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6\">\n {filteredPlans.map((plan) => (\n <PlanCard\n key={plan.id}\n plan={plan}\n onSelect={handleSelectPlan}\n onView={handleViewPlan}\n onToggle={handleTogglePlan}\n canSelect={permissions.canCreateSubscription}\n canManage={permissions.canManagePlans}\n isToggling={isToggling}\n />\n ))}\n </div>\n ) : (\n <div className=\"space-y-3\">\n {filteredPlans.map((plan) => (\n <PlanRow\n key={plan.id}\n plan={plan}\n onSelect={handleSelectPlan}\n onView={handleViewPlan}\n onToggle={handleTogglePlan}\n canSelect={permissions.canCreateSubscription}\n canManage={permissions.canManagePlans}\n isToggling={isToggling}\n />\n ))}\n </div>\n )}\n </div>\n );\n};\n\n// ============================================================================\n// Plan Card Component\n// ============================================================================\n\ninterface PlanCardProps {\n plan: Plan;\n onSelect: (plan: Plan) => void;\n onView: (plan: Plan) => void;\n onToggle: (plan: Plan) => void;\n canSelect: boolean;\n canManage: boolean;\n isToggling: boolean;\n}\n\nconst PlanCard: FC<PlanCardProps> = ({\n plan,\n onSelect,\n onView,\n onToggle,\n canSelect,\n canManage,\n isToggling,\n}) => {\n const displayCurrency = useDefaultBillingCurrency();\n const combinedQuotas = useMemo(() => {\n const features = plan.features \|\| [];\n return combineQuotas(features);\n }, [plan.features]);\n\n return (\n <div\n className={`relative border rounded-lg p-6 transition-all hover:shadow-md flex flex-col h-full ${\n plan.isActive\n ? 'border-border bg-card'\n : 'border-dashed border-muted-foreground/30 bg-muted/30'\n }`}\n >\n {/ Status Badge /}\n {!plan.isActive && (\n <span className=\"absolute top-4 right-4 px-2 py-1 text-xs font-medium bg-muted text-muted-foreground rounded\">\n Inactive\n </span>\n )}\n\n {/ Plan Name /}\n <div className=\"mb-4\">\n <h3 className=\"text-xl font-bold text-foreground\">{plan.name}</h3>\n <span className=\"text-sm text-muted-foreground\">\n {formatPlanDurationLabel(plan.duration)}\n </span>\n </div>\n\n {/ Price /}\n <div className=\"flex items-baseline gap-1 mb-1\">\n <span className=\"text-3xl font-bold text-foreground\">\n {(() => {\n const base =\n plan.pricingModel === PricingModel.PER_SEAT && plan.pricePerSeat\n ? { price: plan.pricePerSeat, currency: plan.currency }\n : { price: plan.price, currency: plan.currency };\n const { price, currency } = getDisplayPrice(\n base.price,\n base.currency,\n plan.currencyPrices as Record<string, number> \| null,\n displayCurrency\n );\n return formatCurrency(price, currency);\n })()}\n </span>\n <span className=\"text-muted-foreground\">/ {formatPlanDuration(plan.duration)}</span>\n </div>\n {plan.pricingModel === PricingModel.PER_SEAT && (\n <p className=\"text-xs text-muted-foreground mb-4\">\n per seat\n {plan.minSeats ? ` · min ${plan.minSeats} seat${plan.minSeats !== 1 ? 's' : ''}` : ''}\n </p>\n )}\n {plan.pricingModel !== PricingModel.PER_SEAT && <div className=\"mb-6\" />}\n\n {/ Features - Combined Quotas /}\n {combinedQuotas.length > 0 && (\n <ul className=\"space-y-2 mb-6\">\n {combinedQuotas.slice(0, 5).map((quota) => (\n <li key={quota.quotaId} className=\"flex items-center justify-between text-sm\">\n <div className=\"flex items-center gap-2\">\n <svg\n className=\"size-5 text-status-success-text shrink-0\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M5 13l4 4L19 7\"\n />\n </svg>\n <span className=\"text-foreground\">{quota.name}</span>\n </div>\n <span className=\"font-medium text-foreground\">\n {quota.totalValue.toLocaleString()}\n </span>\n </li>\n ))}\n {combinedQuotas.length > 5 && (\n <li className=\"text-sm text-muted-foreground pl-7\">\n +{combinedQuotas.length - 5} more quotas\n </li>\n )}\n </ul>\n )}\n\n {/ Actions - pushed to bottom with mt-auto /}\n <div className=\"space-y-2 pt-4 border-t border-border mt-auto\">\n {canSelect && plan.isActive && (\n <button\n type=\"button\"\n onClick={() => onSelect(plan)}\n className=\"w-full px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n >\n Select Plan\n </button>\n )}\n <div className=\"flex gap-2\">\n <button\n type=\"button\"\n onClick={() => onView(plan)}\n className=\"flex-1 px-4 py-2 text-sm font-medium border border-border text-foreground rounded-md hover:bg-muted transition-colors\"\n >\n View Details\n </button>\n {canManage && (\n <button\n type=\"button\"\n onClick={() => onToggle(plan)}\n disabled={isToggling}\n className={`px-4 py-2 text-sm font-medium border border-border rounded-md transition-colors ${\n plan.isActive\n ? 'text-destructive hover:bg-destructive/10'\n : 'text-status-success-text hover:bg-status-success-bg-subtle'\n }`}\n >\n {plan.isActive ? 'Deactivate' : 'Activate'}\n </button>\n )}\n </div>\n </div>\n </div>\n );\n};\n\n// ============================================================================\n// Plan Row Component (List View)\n// ============================================================================\n\ninterface PlanRowProps {\n plan: Plan;\n onSelect: (plan: Plan) => void;\n onView: (plan: Plan) => void;\n onToggle: (plan: Plan) => void;\n canSelect: boolean;\n canManage: boolean;\n isToggling: boolean;\n}\n\nconst PlanRow: FC<PlanRowProps> = ({\n plan,\n onSelect,\n onView,\n onToggle,\n canSelect,\n canManage,\n isToggling,\n}) => {\n const displayCurrency = useDefaultBillingCurrency();\n const combinedQuotas = useMemo(() => {\n const features = plan.features \|\| [];\n return combineQuotas(features);\n }, [plan.features]);\n\n return (\n <div\n className={`flex items-center gap-4 p-4 border rounded-lg transition-all hover:shadow-sm ${\n plan.isActive\n ? 'border-border bg-card'\n : 'border-dashed border-muted-foreground/30 bg-muted/30'\n }`}\n >\n {/ Plan Info /}\n <div className=\"flex-1 min-w-0\">\n <div className=\"flex items-center gap-2\">\n <h3 className=\"font-semibold text-foreground truncate\">{plan.name}</h3>\n {!plan.isActive && (\n <span className=\"px-2 py-0.5 text-xs font-medium bg-muted text-muted-foreground rounded\">\n Inactive\n </span>\n )}\n </div>\n <p className=\"text-sm text-muted-foreground\">\n {combinedQuotas.length} quota{combinedQuotas.length !== 1 ? 's' : ''} included\n </p>\n </div>\n\n {/ Price /}\n <div className=\"text-right\">\n <div className=\"font-semibold text-foreground\">\n {(() => {\n const { price, currency } = getDisplayPrice(\n plan.price,\n plan.currency,\n plan.currencyPrices as Record<string, number> \| null,\n displayCurrency\n );\n return formatCurrency(price, currency);\n })()}\n </div>\n <div className=\"text-sm text-muted-foreground\">per {formatPlanDuration(plan.duration)}</div>\n </div>\n\n {/ Actions */}\n <div className=\"flex items-center gap-2\">\n {canSelect && plan.isActive && (\n <button\n type=\"button\"\n onClick={() => onSelect(plan)}\n className=\"px-3 py-1.5 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n >\n Select\n </button>\n )}\n <button\n type=\"button\"\n onClick={() => onView(plan)}\n className=\"px-3 py-1.5 text-sm font-medium border border-border text-foreground rounded-md hover:bg-muted transition-colors\"\n >\n View\n </button>\n {canManage && (\n <button\n type=\"button\"\n onClick={() => onToggle(plan)}\n disabled={isToggling}\n className={`px-3 py-1.5 text-sm font-medium border border-border rounded-md transition-colors ${\n plan.isActive\n ? 'text-destructive hover:bg-destructive/10'\n : 'text-status-success-text hover:bg-status-success-bg-subtle'\n }`}\n >\n {plan.isActive ? 'Deactivate' : 'Activate'}\n </button>\n )}\n </div>\n </div>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"PlansListPage.js","names":[],"sources":["../../../../../src/billing/modules/plans/pages/PlansListPage.tsx"],"sourcesContent":["/*\n Plans Module - Plans List Page\n * Displays all available pricing plans\n /\n\nimport { useState, useMemo, type FC } from 'react';\nimport { useBillingNavigate } from '../../../hooks/useBillingNavigate';\nimport { usePlans, usePlanMutations } from '../hooks';\nimport { useBillingPermissions } from '../../../hooks/useBillingPermissions';\nimport { AccessDenied, ServerError } from '../../../shared/components';\nimport {\n formatCurrency,\n formatPlanDuration,\n formatPlanDurationLabel,\n getPlanFeatureQuantity,\n isServerError,\n} from '../../../shared/utils';\nimport type { Plan, PlanDuration, PlanFeature } from '../../../shared/types';\nimport { PricingModel } from '../../../shared/types';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport {\n useDefaultBillingCurrency,\n getDisplayPrice,\n} from '../../../hooks/useDefaultBillingCurrency';\n\ntype ViewMode = 'grid' \| 'list';\n\n/\n Combined quota info for display\n /\ninterface CombinedQuota {\n quotaId: string;\n name: string;\n totalValue: number;\n}\n\n/\n Combines duplicate quotas by quota ID and aggregates their values\n /\nfunction combineQuotas(features: PlanFeature[]): CombinedQuota[] {\n const quotaMap = new Map<string, CombinedQuota>();\n\n for (const feature of features) {\n if (!feature.quota) continue;\n\n const quotaId = feature.quota.id;\n const limitValue = getPlanFeatureQuantity(feature);\n\n const existing = quotaMap.get(quotaId);\n if (existing) {\n existing.totalValue += limitValue;\n } else {\n quotaMap.set(quotaId, {\n quotaId,\n name: feature.quota.name ?? 'Unknown Quota',\n totalValue: limitValue,\n });\n }\n }\n\n return Array.from(quotaMap.values());\n}\n\nexport const PlansListPage: FC = () => {\n const { t } = useI18n();\n const tr = (key: string, fallback: string): string => {\n const translated = t(key);\n return translated === key ? fallback : translated;\n };\n const navigateTo = useBillingNavigate();\n const permissions = useBillingPermissions();\n const { plans, isLoading, error, refetch } = usePlans();\n const { togglePlan, isToggling } = usePlanMutations();\n\n const [viewMode, setViewMode] = useState<ViewMode>('grid');\n const [showInactive, setShowInactive] = useState(false);\n const [billingInterval, setBillingInterval] = useState<PlanDuration \| 'all'>('all');\n\n // Permission check\n if (!permissions.canViewPlans) {\n return (\n <AccessDenied\n message={tr(\n 'billing.plans.noViewPermission',\n \"You don't have permission to view pricing plans.\"\n )}\n />\n );\n }\n\n // Filter plans\n const filteredPlans = plans.filter((plan) => {\n if (!showInactive && !plan.isActive) return false;\n if (billingInterval !== 'all' && plan.duration !== billingInterval) return false;\n return true;\n });\n\n const handleTogglePlan = async (plan: Plan) => {\n if (!permissions.canManagePlans) return;\n try {\n await togglePlan(plan.id, !plan.isActive);\n await refetch();\n } catch (err) {\n console.error('Failed to toggle plan:', err);\n }\n };\n\n const handleSelectPlan = (plan: Plan) => {\n navigateTo(`/checkout/${plan.id}`);\n };\n\n const handleViewPlan = (plan: Plan) => {\n navigateTo(`/plans/${plan.id}`);\n };\n\n // Loading state\n if (isLoading && plans.length === 0) {\n return (\n <div className=\"space-y-6 p-6\">\n <div className=\"h-8 w-48 bg-muted animate-pulse rounded\" />\n <div className=\"grid grid-cols-1 md:grid-cols-3 gap-6\">\n {[1, 2, 3].map((i) => (\n <div key={i} className=\"border border-border rounded-lg p-6 space-y-4\">\n <div className=\"h-6 w-24 bg-muted animate-pulse rounded\" />\n <div className=\"h-8 w-32 bg-muted animate-pulse rounded\" />\n <div className=\"space-y-2\">\n {[1, 2, 3, 4].map((j) => (\n <div key={j} className=\"h-4 w-full bg-muted animate-pulse rounded\" />\n ))}\n </div>\n </div>\n ))}\n </div>\n </div>\n );\n }\n\n // Error state - show server error component for 500 errors\n if (error) {\n if (isServerError(error)) {\n return (\n <div className=\"p-6\">\n <ServerError\n title={tr('billing.plans.serverUnavailable', 'Server Unavailable')}\n message={tr(\n 'billing.plans.serverUnavailableMessage',\n 'Unable to load pricing plans. The server might be down or experiencing issues.'\n )}\n onRetry={() => refetch()}\n showRetry\n />\n </div>\n );\n }\n // Generic error for non-server errors\n return (\n <div className=\"flex items-center justify-center h-full min-h-[400px]\">\n <div className=\"text-center space-y-4\">\n <div className=\"size-12 mx-auto rounded-full bg-destructive/10 flex items-center justify-center\">\n <svg\n className=\"size-6 text-destructive\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n />\n </svg>\n </div>\n <h2 className=\"text-lg font-semibold text-foreground\">\n {tr('billing.plans.failedToLoad', 'Failed to load plans')}\n </h2>\n <p className=\"text-sm text-muted-foreground\">{error.message}</p>\n <button\n type=\"button\"\n onClick={() => refetch()}\n className=\"px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n >\n Try Again\n </button>\n </div>\n </div>\n );\n }\n\n return (\n <div className=\"space-y-6 p-6\">\n {/ Header /}\n <div className=\"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between\">\n <div>\n <h1 className=\"text-2xl font-bold text-foreground\">\n {tr('billing.plans.title', 'Pricing Plans')}\n </h1>\n <p className=\"text-sm text-muted-foreground mt-1\">\n {tr('billing.plans.subtitle', 'Choose the plan that best fits your needs')}\n </p>\n </div>\n\n {permissions.canManagePlans && (\n <button\n type=\"button\"\n onClick={() => navigateTo('/plans/new')}\n className=\"inline-flex items-center gap-2 px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n >\n <svg className=\"size-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M12 4v16m8-8H4\"\n />\n </svg>\n Create Plan\n </button>\n )}\n </div>\n\n {/ Filters /}\n <div className=\"flex flex-wrap items-center gap-4 pb-4 border-b border-border\">\n {/ Billing Interval Toggle /}\n <div className=\"inline-flex rounded-lg border border-border p-1 bg-muted/50\">\n <button\n type=\"button\"\n onClick={() => setBillingInterval('all')}\n className={`px-3 py-1.5 text-sm font-medium rounded-md transition-colors ${\n billingInterval === 'all'\n ? 'bg-background text-foreground shadow-sm'\n : 'text-muted-foreground hover:text-foreground'\n }`}\n >\n All\n </button>\n <button\n type=\"button\"\n onClick={() => setBillingInterval('monthly' as PlanDuration)}\n className={`px-3 py-1.5 text-sm font-medium rounded-md transition-colors ${\n billingInterval === 'monthly'\n ? 'bg-background text-foreground shadow-sm'\n : 'text-muted-foreground hover:text-foreground'\n }`}\n >\n Monthly\n </button>\n <button\n type=\"button\"\n onClick={() => setBillingInterval('yearly' as PlanDuration)}\n className={`px-3 py-1.5 text-sm font-medium rounded-md transition-colors ${\n billingInterval === 'yearly'\n ? 'bg-background text-foreground shadow-sm'\n : 'text-muted-foreground hover:text-foreground'\n }`}\n >\n Yearly\n </button>\n </div>\n\n {/ Show Inactive Toggle /}\n {permissions.canManagePlans && (\n <label className=\"flex items-center gap-2 text-sm cursor-pointer\">\n <input\n type=\"checkbox\"\n checked={showInactive}\n onChange={(e) => setShowInactive(e.target.checked)}\n className=\"size-4 rounded border-border text-primary focus:ring-primary\"\n />\n <span className=\"text-muted-foreground\">\n {tr('billing.plans.showInactive', 'Show inactive plans')}\n </span>\n </label>\n )}\n\n {/ View Mode Toggle /}\n <div className=\"ml-auto inline-flex rounded-lg border border-border p-1 bg-muted/50\">\n <button\n type=\"button\"\n onClick={() => setViewMode('grid')}\n className={`p-1.5 rounded-md transition-colors ${\n viewMode === 'grid'\n ? 'bg-background text-foreground shadow-sm'\n : 'text-muted-foreground hover:text-foreground'\n }`}\n title=\"Grid view\"\n >\n <svg className=\"size-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z\"\n />\n </svg>\n </button>\n <button\n type=\"button\"\n onClick={() => setViewMode('list')}\n className={`p-1.5 rounded-md transition-colors ${\n viewMode === 'list'\n ? 'bg-background text-foreground shadow-sm'\n : 'text-muted-foreground hover:text-foreground'\n }`}\n title=\"List view\"\n >\n <svg className=\"size-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M4 6h16M4 12h16M4 18h16\"\n />\n </svg>\n </button>\n </div>\n </div>\n\n {/ Plans Grid/List /}\n {filteredPlans.length === 0 ? (\n <div className=\"flex flex-col items-center justify-center py-12 border border-dashed border-border rounded-lg\">\n <div className=\"size-12 rounded-full bg-muted flex items-center justify-center mb-4\">\n <svg\n className=\"size-6 text-muted-foreground\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"\n />\n </svg>\n </div>\n <h3 className=\"text-lg font-medium text-foreground\">\n {tr('billing.plans.noPlansFound', 'No plans found')}\n </h3>\n <p className=\"text-sm text-muted-foreground mt-1\">\n {showInactive\n ? tr('billing.plans.noPlansFiltered', 'No plans match your current filters.')\n : tr('billing.plans.noActivePlans', 'There are no active plans available.')}\n </p>\n {permissions.canManagePlans && (\n <button\n type=\"button\"\n onClick={() => navigateTo('/plans/new')}\n className=\"mt-4 px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n >\n {tr('billing.plans.createFirstPlan', 'Create your first plan')}\n </button>\n )}\n </div>\n ) : viewMode === 'grid' ? (\n <div className=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6\">\n {filteredPlans.map((plan) => (\n <PlanCard\n key={plan.id}\n plan={plan}\n onSelect={handleSelectPlan}\n onView={handleViewPlan}\n onToggle={handleTogglePlan}\n canSelect={permissions.canCreateSubscription}\n canManage={permissions.canManagePlans}\n isToggling={isToggling}\n />\n ))}\n </div>\n ) : (\n <div className=\"space-y-3\">\n {filteredPlans.map((plan) => (\n <PlanRow\n key={plan.id}\n plan={plan}\n onSelect={handleSelectPlan}\n onView={handleViewPlan}\n onToggle={handleTogglePlan}\n canSelect={permissions.canCreateSubscription}\n canManage={permissions.canManagePlans}\n isToggling={isToggling}\n />\n ))}\n </div>\n )}\n </div>\n );\n};\n\n// ============================================================================\n// Plan Card Component\n// ============================================================================\n\ninterface PlanCardProps {\n plan: Plan;\n onSelect: (plan: Plan) => void;\n onView: (plan: Plan) => void;\n onToggle: (plan: Plan) => void;\n canSelect: boolean;\n canManage: boolean;\n isToggling: boolean;\n}\n\nconst PlanCard: FC<PlanCardProps> = ({\n plan,\n onSelect,\n onView,\n onToggle,\n canSelect,\n canManage,\n isToggling,\n}) => {\n const displayCurrency = useDefaultBillingCurrency();\n const combinedQuotas = useMemo(() => {\n const features = plan.features \|\| [];\n return combineQuotas(features);\n }, [plan.features]);\n\n return (\n <div\n className={`relative border rounded-lg p-6 transition-all hover:shadow-md flex flex-col h-full ${\n plan.isActive\n ? 'border-border bg-card'\n : 'border-dashed border-muted-foreground/30 bg-muted/30'\n }`}\n >\n {/ Status Badge /}\n {!plan.isActive && (\n <span className=\"absolute top-4 right-4 px-2 py-1 text-xs font-medium bg-muted text-muted-foreground rounded\">\n Inactive\n </span>\n )}\n\n {/ Plan Name /}\n <div className=\"mb-4\">\n <h3 className=\"text-xl font-bold text-foreground\">{plan.name}</h3>\n <span className=\"text-sm text-muted-foreground\">\n {formatPlanDurationLabel(plan.duration)}\n </span>\n </div>\n\n {/ Price /}\n <div className=\"flex items-baseline gap-1 mb-1\">\n <span className=\"text-3xl font-bold text-foreground\">\n {(() => {\n const base =\n plan.pricingModel === PricingModel.PER_SEAT && plan.pricePerSeat\n ? { price: plan.pricePerSeat, currency: plan.currency }\n : { price: plan.price, currency: plan.currency };\n const { price, currency } = getDisplayPrice(\n base.price,\n base.currency,\n plan.currencyPrices as Record<string, number> \| null,\n displayCurrency\n );\n return formatCurrency(price, currency);\n })()}\n </span>\n <span className=\"text-muted-foreground\">/ {formatPlanDuration(plan.duration)}</span>\n </div>\n {plan.pricingModel === PricingModel.PER_SEAT && (\n <p className=\"text-xs text-muted-foreground mb-4\">\n per seat\n {plan.minSeats ? ` · min ${plan.minSeats} seat${plan.minSeats !== 1 ? 's' : ''}` : ''}\n </p>\n )}\n {plan.pricingModel !== PricingModel.PER_SEAT && <div className=\"mb-6\" />}\n\n {/ Features - Combined Quotas /}\n {combinedQuotas.length > 0 && (\n <ul className=\"space-y-2 mb-6\">\n {combinedQuotas.slice(0, 5).map((quota) => (\n <li key={quota.quotaId} className=\"flex items-center justify-between text-sm\">\n <div className=\"flex items-center gap-2\">\n <svg\n className=\"size-5 text-status-success-text shrink-0\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M5 13l4 4L19 7\"\n />\n </svg>\n <span className=\"text-foreground\">{quota.name}</span>\n </div>\n <span className=\"font-medium text-foreground\">\n {quota.totalValue.toLocaleString()}\n </span>\n </li>\n ))}\n {combinedQuotas.length > 5 && (\n <li className=\"text-sm text-muted-foreground pl-7\">\n +{combinedQuotas.length - 5} more quotas\n </li>\n )}\n </ul>\n )}\n\n {/ Actions - pushed to bottom with mt-auto /}\n <div className=\"space-y-2 pt-4 border-t border-border mt-auto\">\n {canSelect && plan.isActive && (\n <button\n type=\"button\"\n onClick={() => onSelect(plan)}\n className=\"w-full px-4 py-2 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n >\n Select Plan\n </button>\n )}\n <div className=\"flex gap-2\">\n <button\n type=\"button\"\n onClick={() => onView(plan)}\n className=\"flex-1 px-4 py-2 text-sm font-medium border border-border text-foreground rounded-md hover:bg-muted transition-colors\"\n >\n View Details\n </button>\n {canManage && (\n <button\n type=\"button\"\n onClick={() => onToggle(plan)}\n disabled={isToggling}\n className={`px-4 py-2 text-sm font-medium border border-border rounded-md transition-colors ${\n plan.isActive\n ? 'text-destructive hover:bg-destructive/10'\n : 'text-status-success-text hover:bg-status-success-bg-subtle'\n }`}\n >\n {plan.isActive ? 'Deactivate' : 'Activate'}\n </button>\n )}\n </div>\n </div>\n </div>\n );\n};\n\n// ============================================================================\n// Plan Row Component (List View)\n// ============================================================================\n\ninterface PlanRowProps {\n plan: Plan;\n onSelect: (plan: Plan) => void;\n onView: (plan: Plan) => void;\n onToggle: (plan: Plan) => void;\n canSelect: boolean;\n canManage: boolean;\n isToggling: boolean;\n}\n\nconst PlanRow: FC<PlanRowProps> = ({\n plan,\n onSelect,\n onView,\n onToggle,\n canSelect,\n canManage,\n isToggling,\n}) => {\n const displayCurrency = useDefaultBillingCurrency();\n const combinedQuotas = useMemo(() => {\n const features = plan.features \|\| [];\n return combineQuotas(features);\n }, [plan.features]);\n\n return (\n <div\n className={`flex items-center gap-4 p-4 border rounded-lg transition-all hover:shadow-sm ${\n plan.isActive\n ? 'border-border bg-card'\n : 'border-dashed border-muted-foreground/30 bg-muted/30'\n }`}\n >\n {/ Plan Info /}\n <div className=\"flex-1 min-w-0\">\n <div className=\"flex items-center gap-2\">\n <h3 className=\"font-semibold text-foreground truncate\">{plan.name}</h3>\n {!plan.isActive && (\n <span className=\"px-2 py-0.5 text-xs font-medium bg-muted text-muted-foreground rounded\">\n Inactive\n </span>\n )}\n </div>\n <p className=\"text-sm text-muted-foreground\">\n {combinedQuotas.length} quota{combinedQuotas.length !== 1 ? 's' : ''} included\n </p>\n </div>\n\n {/ Price /}\n <div className=\"text-right\">\n <div className=\"font-semibold text-foreground\">\n {(() => {\n const { price, currency } = getDisplayPrice(\n plan.price,\n plan.currency,\n plan.currencyPrices as Record<string, number> \| null,\n displayCurrency\n );\n return formatCurrency(price, currency);\n })()}\n </div>\n <div className=\"text-sm text-muted-foreground\">per {formatPlanDuration(plan.duration)}</div>\n </div>\n\n {/ Actions */}\n <div className=\"flex items-center gap-2\">\n {canSelect && plan.isActive && (\n <button\n type=\"button\"\n onClick={() => onSelect(plan)}\n className=\"px-3 py-1.5 text-sm font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors\"\n >\n Select\n </button>\n )}\n <button\n type=\"button\"\n onClick={() => onView(plan)}\n className=\"px-3 py-1.5 text-sm font-medium border border-border text-foreground rounded-md hover:bg-muted transition-colors\"\n >\n View\n </button>\n {canManage && (\n <button\n type=\"button\"\n onClick={() => onToggle(plan)}\n disabled={isToggling}\n className={`px-3 py-1.5 text-sm font-medium border border-border rounded-md transition-colors ${\n plan.isActive\n ? 'text-destructive hover:bg-destructive/10'\n : 'text-status-success-text hover:bg-status-success-bg-subtle'\n }`}\n >\n {plan.isActive ? 'Deactivate' : 'Activate'}\n </button>\n )}\n </div>\n </div>\n );\n};\n"],"mappings":"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"}

package/dist/billing/shared/utils/index.js CHANGED Viewed

@@ -6,3 +6,4 @@ import "./paymentTheme.js";
 import "./gatewayGraphql.js";
 import "./directBillingGraphql.js";
 import "./directActivityGraphql.js";
+import "./planFeatureQuantity.js";

package/dist/billing/shared/utils/planFeatureQuantity.js ADDED Viewed

@@ -0,0 +1,11 @@
+//#region src/billing/shared/utils/planFeatureQuantity.ts
+function e(e) {
+	let t = e.context;
+	if (t && typeof t.quantity == "number") return t.quantity;
+	let n = e.quota?.limits;
+	return typeof n?.value == "number" ? n.value : 0;
+}
+//#endregion
+export { e as getPlanFeatureQuantity };
+//# sourceMappingURL=planFeatureQuantity.js.map

package/dist/billing/shared/utils/planFeatureQuantity.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"planFeatureQuantity.js","names":[],"sources":["../../../../src/billing/shared/utils/planFeatureQuantity.ts"],"sourcesContent":["/**\n * Source of truth for \"how big is this quota on this plan\":\n * 1. Per-plan override stored on the SubscriptionFeature row's\n * `context.quantity` (autoseed + post-OSS-release createPlan path).\n * 2. Fall back to the catalog default `quota.limits.value` for plans that\n * pre-date per-plan overrides (only the autoseeded Free plan today).\n */\ntype FeatureLike = {\n context?: unknown;\n quota?: { limits?: unknown } | null;\n};\n\nexport function getPlanFeatureQuantity(feature: FeatureLike): number {\n const ctx = feature.context as { quantity?: number } | null | undefined;\n if (ctx && typeof ctx.quantity === 'number') return ctx.quantity;\n\n const limits = feature.quota?.limits as { value?: number } | null | undefined;\n return typeof limits?.value === 'number' ? limits.value : 0;\n}\n"],"mappings":";AAYA,SAAgB,EAAuB,GAA8B;CACnE,IAAM,IAAM,EAAQ;AACpB,KAAI,KAAO,OAAO,EAAI,YAAa,SAAU,QAAO,EAAI;CAExD,IAAM,IAAS,EAAQ,OAAO;AAC9B,QAAO,OAAO,GAAQ,SAAU,WAAW,EAAO,QAAQ"}

package/dist/generated/global-operations.js CHANGED Viewed

@@ -397,6 +397,7 @@ var y = t`
   features {
     id
     quotaId
+    context
     quota {
       id
       name