@umituz/web-payment 0.0.0-stage → 1.0.1

package/src/presentation/portal/utils/index.ts

@@ -0,0 +1,27 @@
+
+export {
+  formatNumber,
+  formatPrice,
+  calculateDiscount,
+  calculateProratedAmount,
+  getPlanPrice,
+  calculateUsagePercentage,
+  isNearLimit,
+  getStatusTone,
+  getStatusLabel,
+  getInvoiceStatusTone,
+  getInvoiceStatusLabel,
+  formatCardNumber,
+  formatExpiry,
+  getDaysRemaining,
+  isTrialExpiringSoon,
+  getNextBillingDate,
+  groupInvoicesByStatus,
+  calculateInvoiceTotal,
+  sortInvoicesByDate,
+  formatFeature,
+  isPopularPlan,
+  getTrialDaysText,
+} from './billing';
+
+export { transformProductToPlan, transformProducts } from './plans';

package/src/presentation/portal/utils/plans.ts

@@ -0,0 +1,71 @@
+
+import type { ProductPrice, Product } from '../../../domain/entities';
+import type { PlanTier } from '../types';
+import { CURRENCY, type Currency } from '../constants';
+
+const MONTHS_IN_YEAR = 12;
+
+const KNOWN_CURRENCIES: ReadonlySet<string> = new Set(Object.values(CURRENCY));
+
+const productFeatures = (product: Product): string[] =>
+  product.benefits
+    .map((benefit) => benefit.description ?? '')
+    .filter((description) => description.length > 0);
+
+const toCurrency = (raw: string): Currency => {
+  const upper = raw.toUpperCase();
+  if (KNOWN_CURRENCIES.has(upper)) return upper as Currency;
+  throw new Error(`Unsupported currency: ${raw}`);
+};
+
+const toMonthlyAmount = (amount: number, interval: string | undefined): number => {
+  if (interval === 'monthly') return amount;
+  if (interval === 'yearly') return amount / MONTHS_IN_YEAR;
+  throw new Error(
+    `Cannot convert price to monthly: unsupported interval "${interval ?? 'undefined'}"`,
+  );
+};
+
+export function transformProductToPlan(product: Product, price: ProductPrice): PlanTier {
+  const interval = price.recurringInterval;
+  const monthlyAmount = toMonthlyAmount(price.amount ?? 0, interval);
+  const yearlyAmount = interval === 'yearly' ? price.amount ?? 0 : (price.amount ?? 0) * MONTHS_IN_YEAR;
+
+  return {
+    id: product.id,
+    name: product.name,
+    description: product.description ?? '',
+    monthlyPrice: Math.round(monthlyAmount),
+    yearlyPrice: Math.round(yearlyAmount),
+    currency: toCurrency(price.currency),
+    features: productFeatures(product),
+  };
+}
+
+export function transformProducts(products: Product[]): PlanTier[] {
+  const tiers: PlanTier[] = [];
+  for (const product of products) {
+    if (product.isArchived) continue;
+    const recurring = product.prices.filter(
+      (price) => !price.isArchived && price.recurringInterval !== undefined,
+    );
+    const monthly = recurring.find((price) => price.recurringInterval === 'monthly');
+    const yearly = recurring.find((price) => price.recurringInterval === 'yearly');
+    if (monthly && yearly) {
+      tiers.push({
+        id: product.id,
+        name: product.name,
+        description: product.description ?? '',
+        monthlyPrice: Math.round(monthly.amount ?? 0),
+        yearlyPrice: Math.round(yearly.amount ?? 0),
+        currency: toCurrency(monthly.currency),
+        features: productFeatures(product),
+      });
+    } else if (monthly) {
+      tiers.push(transformProductToPlan(product, monthly));
+    } else if (yearly) {
+      tiers.push(transformProductToPlan(product, yearly));
+    }
+  }
+  return tiers;
+}

package/src/presentation/theme/visual-tokens.ts

@@ -0,0 +1,103 @@
+
+export const VisualTokens = Object.freeze({
+  spacing: Object.freeze({
+    none: 0,
+    xs: 4,
+    sm: 6,
+    md: 8,
+    lg: 12,
+    xl: 16,
+    xxl: 20,
+    section: 24,
+    page: 32,
+  }),
+
+  radius: Object.freeze({
+    sm: 6,
+    md: 8,
+    lg: 12,
+    pill: 999,
+  }),
+
+  fontSize: Object.freeze({
+    caption: 12,
+    body: 14,
+    title: 18,
+    display: 24,
+  }),
+
+  fontWeight: Object.freeze({
+    regular: 400,
+    medium: 500,
+    strong: 600,
+  }),
+
+  lineHeight: Object.freeze({
+    tight: 1.25,
+    normal: 1.5,
+  }),
+
+  opacity: Object.freeze({
+    muted: 0.7,
+    disabled: 0.6,
+    hover: 0.85,
+  }),
+
+  color: Object.freeze({
+    textPrimary: '#111827',
+    textMuted: '#6b7280',
+    textOnPrimary: '#ffffff',
+    textInverse: '#ffffff',
+    textError: '#b91c1c',
+    textOnError: '#ffffff',
+
+    surfacePrimary: '#ffffff',
+    surfaceMuted: '#f9fafb',
+    surfaceSubtle: '#f3f4f6',
+    surfaceWarning: '#fef3c7',
+    surfaceDanger: '#fee2e2',
+    surfaceDangerMuted: '#fef2f2',
+
+    borderSubtle: '#e5e7eb',
+    borderStrong: '#d1d5db',
+    borderWarning: '#fecaca',
+
+    brandPrimary: '#2563eb',
+    brandPrimaryHover: '#1d4ed8',
+    brandDanger: '#dc2626',
+    brandDangerHover: '#b91c1c',
+    brandDangerText: '#991b1b',
+
+    badgeNeutralBg: '#e5e7eb',
+    badgeNeutralFg: '#111827',
+    badgeActiveBg: '#dcfce7',
+    badgeActiveFg: '#166534',
+    badgeWarningBg: '#fef3c7',
+    badgeWarningFg: '#92400e',
+    badgeDangerBg: '#fee2e2',
+    badgeDangerFg: '#991b1b',
+  }),
+
+  transition: Object.freeze({
+    instant: '120ms ease',
+  }),
+
+  layout: Object.freeze({
+    cardMinWidth: 260,
+    benefitListMax: 5,
+  }),
+} as const);
+
+export type VisualTone = 'neutral' | 'active' | 'warning' | 'danger';
+
+export interface VisualTonePair {
+  readonly bg: string;
+  readonly fg: string;
+}
+
+export const TONE_PAIRS: Readonly<Record<VisualTone, VisualTonePair>> = Object.freeze({
+  neutral: { bg: VisualTokens.color.badgeNeutralBg, fg: VisualTokens.color.badgeNeutralFg },
+  active: { bg: VisualTokens.color.badgeActiveBg, fg: VisualTokens.color.badgeActiveFg },
+  warning: { bg: VisualTokens.color.badgeWarningBg, fg: VisualTokens.color.badgeWarningFg },
+  danger: { bg: VisualTokens.color.badgeDangerBg, fg: VisualTokens.color.badgeDangerFg },
+});

package/src/presentation/utils/cancellation-reason-catalog.ts

@@ -0,0 +1,18 @@
+
+import type { CancellationReason } from '../../domain/entities/cancellation.entity';
+
+export interface CancellationReasonOption {
+  readonly value: CancellationReason;
+  readonly label: string;
+}
+
+export const CANCELLATION_REASON_CATALOG: ReadonlyArray<CancellationReasonOption> = Object.freeze([
+  { value: 'too_expensive', label: 'Too expensive' },
+  { value: 'missing_features', label: 'Missing features' },
+  { value: 'switched_service', label: 'Switched to a different service' },
+  { value: 'unused', label: 'Not using it' },
+  { value: 'customer_service', label: 'Poor customer service' },
+  { value: 'low_quality', label: 'Quality is too low' },
+  { value: 'too_complex', label: 'Too complex' },
+  { value: 'other', label: 'Other' },
+]);

package/src/presentation/utils/checkout-button-visual.ts

@@ -0,0 +1,50 @@
+
+import { VisualTokens } from '../theme/visual-tokens';
+import type { CheckoutButtonVariant } from '../components/CheckoutButton';
+
+export interface CheckoutButtonVisualInput {
+  variant: CheckoutButtonVariant;
+  disabled: boolean;
+  loading: boolean;
+}
+
+interface ButtonColorScheme {
+  backgroundColor: string;
+  color: string;
+  border: string;
+}
+
+const VARIANT_COLOR_SCHEMES: Readonly<Record<CheckoutButtonVariant, ButtonColorScheme>> = Object.freeze({
+  primary: Object.freeze({
+    backgroundColor: VisualTokens.color.brandPrimary,
+    color: VisualTokens.color.textOnPrimary,
+    border: `1px solid ${VisualTokens.color.brandPrimary}`,
+  }),
+  secondary: Object.freeze({
+    backgroundColor: VisualTokens.color.surfacePrimary,
+    color: VisualTokens.color.textPrimary,
+    border: `1px solid ${VisualTokens.color.borderStrong}`,
+  }),
+  danger: Object.freeze({
+    backgroundColor: VisualTokens.color.brandDanger,
+    color: VisualTokens.color.textOnPrimary,
+    border: `1px solid ${VisualTokens.color.brandDanger}`,
+  }),
+});
+
+export class CheckoutButtonVisual {
+  static resolve({ variant, disabled, loading }: CheckoutButtonVisualInput): React.CSSProperties {
+    const scheme = VARIANT_COLOR_SCHEMES[variant];
+    const isInactive = disabled || loading;
+    return {
+      ...scheme,
+      padding: `${VisualTokens.spacing.lg}px ${VisualTokens.spacing.xl}px`,
+      fontSize: VisualTokens.fontSize.body,
+      fontWeight: VisualTokens.fontWeight.strong,
+      borderRadius: VisualTokens.radius.md,
+      cursor: isInactive ? 'not-allowed' : 'pointer',
+      opacity: isInactive ? VisualTokens.opacity.disabled : 1,
+      transition: VisualTokens.transition.instant,
+    };
+  }
+}

package/src/presentation/utils/inline-error-visual.ts

@@ -0,0 +1,21 @@
+
+import { createElement, type CSSProperties, type ReactNode } from 'react';
+import { VisualTokens } from '../theme/visual-tokens';
+
+export class InlineErrorVisual {
+  static style(): CSSProperties {
+    return {
+      color: VisualTokens.color.textError,
+      fontSize: VisualTokens.fontSize.caption,
+    };
+  }
+
+  static element(message: string | null | undefined): ReactNode {
+    if (!message) return null;
+    return createElement(
+      'span',
+      { role: 'alert', style: InlineErrorVisual.style() },
+      message,
+    );
+  }
+}

package/src/presentation/utils/product-pricing.ts

@@ -0,0 +1,33 @@
+
+import type { BillingCycle, Product, ProductPrice } from '../../domain/entities';
+
+export const FALLBACK_PRICE_LABEL = 'Custom';
+
+export class ProductPricing {
+  static recurringPrice(product: Product, cycle?: BillingCycle): ProductPrice | null {
+    const recurring = product.prices.filter(
+      (p) => p.recurringInterval !== undefined,
+    );
+    if (recurring.length === 0) {
+      return product.prices[0] ?? null;
+    }
+    if (cycle) {
+      const match = recurring.find((p) => p.recurringInterval === cycle);
+      if (match) return match;
+    }
+    return recurring[0] ?? null;
+  }
+
+  static displayLine(
+    product: Product,
+    formatter: (amount: number | undefined, currency: string | undefined) => string,
+    cycle?: BillingCycle,
+  ): { amount: string; interval: string | null } {
+    const price = ProductPricing.recurringPrice(product, cycle);
+    if (!price) {
+      return { amount: FALLBACK_PRICE_LABEL, interval: null };
+    }
+    const amount = formatter(price.amount, price.currency);
+    return { amount, interval: price.recurringInterval ?? null };
+  }
+}

package/src/presentation/utils/status-label.ts

@@ -0,0 +1,23 @@
+
+import type { SubscriptionStatusValue } from '../../domain/enums/subscription-status.enum';
+
+export class StatusLabel {
+  private static readonly MAP: Readonly<Record<SubscriptionStatusValue, string>> = Object.freeze({
+    active: 'Active',
+    trialing: 'Trial',
+    past_due: 'Past due',
+    incomplete: 'Incomplete',
+    canceled: 'Canceled',
+    revoked: 'Revoked',
+    unpaid: 'Unpaid',
+    incomplete_expired: 'Expired',
+    none: 'Free',
+  });
+
+  static forStatus(
+    status: SubscriptionStatusValue,
+    overrides?: Partial<Record<SubscriptionStatusValue, string>>,
+  ): string {
+    return overrides?.[status] ?? StatusLabel.MAP[status] ?? 'Free';
+  }
+}

package/src/presentation/utils/status-tone.ts

@@ -0,0 +1,25 @@
+
+import { TONE_PAIRS, type VisualTone, type VisualTonePair } from '../theme/visual-tokens';
+import type { SubscriptionStatusValue } from '../../domain/enums/subscription-status.enum';
+
+export class StatusTone {
+  private static readonly MAP: Readonly<Record<SubscriptionStatusValue, VisualTone>> = Object.freeze({
+    active: 'active',
+    trialing: 'active',
+    past_due: 'warning',
+    incomplete: 'warning',
+    canceled: 'danger',
+    revoked: 'danger',
+    unpaid: 'danger',
+    incomplete_expired: 'danger',
+    none: 'neutral',
+  });
+
+  static forStatus(status: SubscriptionStatusValue): VisualTone {
+    return StatusTone.MAP[status] ?? 'neutral';
+  }
+
+  static pairFor(status: SubscriptionStatusValue): VisualTonePair {
+    return TONE_PAIRS[StatusTone.forStatus(status)];
+  }
+}

package/src/products.ts

@@ -0,0 +1,20 @@
+
+export {
+  ProductRepository,
+  BillingApiError,
+  isBillingApiError,
+  getProducts,
+  getProductById,
+  getAllProducts,
+} from './infrastructure/services/product.repository';
+export type {
+  ProductApiConfig,
+  ProductRequestOptions,
+} from './infrastructure/services/product.repository';
+
+export { FetchHttpClient } from './infrastructure/http/http-client';
+export type {
+  HttpClient,
+  HttpRequest,
+  HttpResponse,
+} from './infrastructure/http/http-client';

package/src/react.tsx

@@ -0,0 +1,63 @@
+
+export * from './core';
+
+export { BillingProvider } from './presentation/components/BillingProvider';
+export type { BillingProviderProps } from './presentation/components/BillingProvider';
+export { CheckoutButton } from './presentation/components/CheckoutButton';
+export type {
+  CheckoutButtonProps,
+  CheckoutButtonVariant,
+  CheckoutButtonLabels,
+} from './presentation/components/CheckoutButton';
+export { SubscriptionStatusBadge } from './presentation/components/SubscriptionStatusBadge';
+export type {
+  SubscriptionStatusBadgeProps,
+  SubscriptionStatusBadgeLabels,
+} from './presentation/components/SubscriptionStatusBadge';
+export { PricingTable } from './presentation/components/PricingTable';
+export type { PricingTableProps, PricingTableLabels } from './presentation/components/PricingTable';
+export { BillingHistoryList } from './presentation/components/BillingHistoryList';
+export type {
+  BillingHistoryListProps,
+  BillingHistoryListLabels,
+} from './presentation/components/BillingHistoryList';
+export { CustomerPortalLink } from './presentation/components/CustomerPortalLink';
+export type {
+  CustomerPortalLinkProps,
+  CustomerPortalLinkLabels,
+} from './presentation/components/CustomerPortalLink';
+export { CancelSubscriptionButton } from './presentation/components/CancelSubscriptionButton';
+export type {
+  CancelSubscriptionButtonProps,
+  CancelSubscriptionButtonLabels,
+} from './presentation/components/CancelSubscriptionButton';
+
+export { BillingContext, useBilling } from './presentation/context/billing-context';
+export type { BillingContextValue } from './presentation/context/billing-context';
+export { useCheckoutButton } from './presentation/hooks/useCheckoutButton';
+export type {
+  UseCheckoutButtonOptions,
+  UseCheckoutButtonResult,
+} from './presentation/hooks/useCheckoutButton';
+export { useCancelSubscription } from './presentation/hooks/useCancelSubscription';
+export type {
+  UseCancelSubscriptionOptions,
+  UseCancelSubscriptionResult,
+} from './presentation/hooks/useCancelSubscription';
+export { useProducts } from './presentation/hooks/useProducts';
+export type {
+  UseProductsOptions,
+  UseProductsResult,
+} from './presentation/hooks/useProducts';
+
+export {
+  WindowNavigationStrategy,
+  NoopNavigationStrategy,
+} from './presentation/navigation/navigation.strategy';
+export type { NavigationStrategy } from './presentation/navigation/navigation.strategy';
+
+export { VisualTokens, TONE_PAIRS } from './presentation/theme/visual-tokens';
+export type { VisualTone, VisualTonePair } from './presentation/theme/visual-tokens';
+
+export { CANCELLATION_REASON_CATALOG } from './presentation/utils/cancellation-reason-catalog';
+export type { CancellationReasonOption } from './presentation/utils/cancellation-reason-catalog';

package/src/server.ts

@@ -0,0 +1,79 @@
+export {
+  BillingClient,
+  PolarBillingClient,
+  createPaymentClient,
+  SANDBOX_API_BASE_URL,
+} from './infrastructure/services/billing.client';
+export type {
+  BillingClientConfig,
+  PaymentClientConfig,
+  PaymentServerClient,
+  CheckoutSessionParams,
+  CheckoutSession,
+  CheckoutMetadata,
+  CreateProductParams,
+  CreatedProduct,
+  SubscriptionRecord,
+  PortalSession,
+} from './infrastructure/services/billing.client';
+
+export {
+  PAYMENT_PROVIDER,
+  PAYMENT_PROVIDER_VALUES,
+  isKnownPaymentProvider,
+} from './domain/enums/payment-provider.enum';
+export type { PaymentProvider } from './domain/enums/payment-provider.enum';
+
+export {
+  DEFAULT_WEBHOOK_TOLERANCE_MS,
+  verifyWebhook,
+  verifyPolarWebhook,
+} from './infrastructure/webhook/verify-webhook';
+export type {
+  WebhookHeadersLike,
+  VerifyWebhookOptions,
+} from './infrastructure/webhook/verify-webhook';
+
+export {
+  parseWebhookEvent,
+  parsePolarWebhookEvent,
+  asCheckoutCompleted,
+  asSubscriptionChanged,
+  asOrderPaid,
+} from './infrastructure/webhook/parse-event';
+export type {
+  WebhookEvent,
+  CheckoutCompleted,
+  SubscriptionChanged,
+  OrderPaid,
+} from './infrastructure/webhook/parse-event';
+
+export { BillingApiError, isBillingApiError } from './infrastructure/services/product.repository';
+export { API_BASE_URL } from './infrastructure/constants/billing.constants';
+
+export {
+  CHECKOUT_ID_PARAM,
+  CHECKOUT_ID_PLACEHOLDER,
+  parseProductIds,
+  productIdOf,
+  successUrlWithCheckoutId,
+} from './infrastructure/config/billing-env';
+export type { ProductIdMap } from './infrastructure/config/billing-env';
+
+export {
+  createBillingClient,
+  createPolarClient,
+  sandboxEnabled,
+} from './infrastructure/services/create-billing-client';
+
+export {
+  buildCheckoutMetadata,
+  readCheckoutMetadata,
+} from './infrastructure/utils/checkout-metadata';
+export type {
+  BuildCheckoutMetadataInput,
+  CheckoutOrderMetadata,
+} from './infrastructure/utils/checkout-metadata';
+
+export { formatReceiptNumber } from './infrastructure/utils/receipt.util';
+