@tagadapay/plugin-sdk 2.8.10 → 3.0.1

package/dist/v2/react/hooks/useOfferQuery.d.ts

@@ -0,0 +1,109 @@
+/**
+ * useOffer Hook - Single offer workflow with checkout session management
+ *
+ * Behavior copied from useOffersQuery but simplified for a single offer:
+ * 1. Fetches offer data
+ * 2. Auto-initializes checkout session when mainOrderId is provided
+ * 3. Fetches order summary with variant options
+ * 4. Updates line items when variant/quantity changes
+ * 5. Pays with payOffer
+ */
+import { Offer } from '../../core/resources/offers';
+export type { Offer };
+/**
+ * Line item displayed in the UI
+ */
+export interface OfferLineItem {
+    id: string;
+    variantId: string;
+    variantName: string;
+    productId: string;
+    productName: string;
+    productDescription: string | null;
+    imageUrl: string | null;
+    quantity: number;
+    unitAmount: number;
+    currency: string;
+}
+/**
+ * Available variant option for a product
+ */
+export interface AvailableVariant {
+    variantId: string;
+    variantName: string;
+    sku: string | null;
+    imageUrl: string | null;
+    unitAmount: number;
+    currency: string;
+    isDefault: boolean;
+}
+/**
+ * User selection for a line item
+ */
+export interface LineItemSelection {
+    variantId: string;
+    quantity: number;
+}
+/**
+ * Summary derived from offer with user selections
+ */
+export interface OfferPreviewSummary {
+    items: OfferLineItem[];
+    currency: string;
+    totalAmount: number;
+    totalAdjustedAmount: number;
+}
+export interface UseOfferQueryOptions {
+    /**
+     * The offer ID to fetch (required)
+     */
+    offerId: string;
+    /**
+     * Whether to fetch the offer automatically
+     * @default true
+     */
+    enabled?: boolean;
+    /**
+     * Main order ID - when provided, auto-inits checkout session
+     */
+    mainOrderId?: string;
+}
+export interface UseOfferQueryResult {
+    /** The fetched offer */
+    offer: Offer | null;
+    /** Loading state */
+    isLoading: boolean;
+    /** Whether order summary is being updated */
+    isUpdatingSummary: boolean;
+    /** Fetch error */
+    error: Error | null;
+    /** Preview summary with current selections */
+    summary: OfferPreviewSummary | null;
+    /** Line items with current selections */
+    lineItems: OfferLineItem[];
+    /** Get available variants for a product */
+    getAvailableVariants: (productId: string) => AvailableVariant[];
+    /** Select a variant for a product */
+    selectVariant: (productId: string, variantId: string) => void;
+    /** Update variant for a product (same as selectVariant) */
+    updateVariant: (productId: string, variantId: string) => void;
+    /** Update quantity for a product */
+    updateQuantity: (productId: string, quantity: number) => void;
+    /** Current selections per product */
+    selections: Record<string, LineItemSelection>;
+    /** Pay for the offer */
+    payOffer: (orderId?: string) => Promise<{
+        checkoutUrl: string;
+    }>;
+    /** Payment in progress */
+    isPaying: boolean;
+    /** Payment error */
+    paymentError: Error | null;
+    /** Checkout session ID (set after init) */
+    checkoutSessionId: string | null;
+    /** Whether checkout session is initializing */
+    isInitializing: boolean;
+    /** Whether variant is loading for a product */
+    isLoadingVariant: (productId: string) => boolean;
+}
+export declare function useOfferQuery(options: UseOfferQueryOptions): UseOfferQueryResult;

package/dist/v2/react/hooks/useOfferQuery.js

@@ -0,0 +1,483 @@
+/**
+ * useOffer Hook - Single offer workflow with checkout session management
+ *
+ * Behavior copied from useOffersQuery but simplified for a single offer:
+ * 1. Fetches offer data
+ * 2. Auto-initializes checkout session when mainOrderId is provided
+ * 3. Fetches order summary with variant options
+ * 4. Updates line items when variant/quantity changes
+ * 5. Pays with payOffer
+ */
+import { useMutation, useQuery } from '@tanstack/react-query';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { OffersResource } from '../../core/resources/offers';
+import { useTagadaContext } from '../providers/TagadaProvider';
+import { getGlobalApiClient } from './useApiQuery';
+import { usePluginConfig } from './usePluginConfig';
+export function useOfferQuery(options) {
+    const { offerId, enabled = true, mainOrderId } = options;
+    const { storeId } = usePluginConfig();
+    const { isSessionInitialized, session } = useTagadaContext();
+    // ─────────────────────────────────────────────────────────────────────────
+    // State
+    // ─────────────────────────────────────────────────────────────────────────
+    const [checkoutSession, setCheckoutSession] = useState({
+        checkoutSessionId: null,
+        orderSummary: null,
+        selectedVariants: {},
+        loadingVariants: {},
+        isUpdatingSummary: false,
+    });
+    const [isInitializing, setIsInitializing] = useState(false);
+    const [isPaying, setIsPaying] = useState(false);
+    const [paymentError, setPaymentError] = useState(null);
+    // Use ref to break dependency cycles in callbacks
+    const checkoutSessionRef = useRef(checkoutSession);
+    checkoutSessionRef.current = checkoutSession;
+    // Track if we've already initialized to prevent duplicate calls
+    const hasInitializedRef = useRef(false);
+    // ─────────────────────────────────────────────────────────────────────────
+    // Initialize offers resource
+    // ─────────────────────────────────────────────────────────────────────────
+    const offersResource = useMemo(() => {
+        try {
+            return new OffersResource(getGlobalApiClient());
+        }
+        catch (error) {
+            throw new Error('Failed to initialize offers resource: ' +
+                (error instanceof Error ? error.message : 'Unknown error'));
+        }
+    }, []);
+    // ─────────────────────────────────────────────────────────────────────────
+    // 1. Fetch offer data
+    // ─────────────────────────────────────────────────────────────────────────
+    const { data: offer, isLoading: isOfferLoading, error, } = useQuery({
+        queryKey: ['offer', offerId, storeId],
+        queryFn: async () => {
+            if (!storeId) {
+                throw new Error('Store ID not found');
+            }
+            const offers = await offersResource.getOffersByIds(storeId, [offerId]);
+            return offers[0] || null;
+        },
+        enabled: enabled && !!offerId && !!storeId && isSessionInitialized,
+        staleTime: 5 * 60 * 1000,
+        refetchOnWindowFocus: false,
+    });
+    // ─────────────────────────────────────────────────────────────────────────
+    // Mutations
+    // ─────────────────────────────────────────────────────────────────────────
+    const { mutateAsync: initCheckoutSessionAsync } = useMutation({
+        mutationFn: async ({ offerId, orderId, customerId }) => {
+            return await offersResource.initCheckoutSession(offerId, orderId, customerId);
+        },
+    });
+    const { mutateAsync: payWithCheckoutSessionAsync } = useMutation({
+        mutationFn: async ({ checkoutSessionId, orderId }) => {
+            return await offersResource.payWithCheckoutSession(checkoutSessionId, orderId);
+        },
+    });
+    // ─────────────────────────────────────────────────────────────────────────
+    // Helper: Fetch order summary from checkout session
+    // ─────────────────────────────────────────────────────────────────────────
+    const fetchOrderSummary = useCallback(async (sessionId) => {
+        if (!isSessionInitialized)
+            return null;
+        try {
+            setCheckoutSession(prev => ({
+                ...prev,
+                isUpdatingSummary: true,
+            }));
+            const summaryResult = await offersResource.getOrderSummary(sessionId, true);
+            if (summaryResult) {
+                // Sort items by productId to ensure consistent order
+                const sortedItems = [...summaryResult.items].sort((a, b) => a.productId.localeCompare(b.productId));
+                const orderSummary = {
+                    ...summaryResult,
+                    items: sortedItems,
+                };
+                // Initialize selected variants based on the summary
+                const initialVariants = {};
+                sortedItems.forEach((item) => {
+                    if (item.productId && item.variantId) {
+                        initialVariants[item.productId] = item.variantId;
+                    }
+                });
+                setCheckoutSession(prev => ({
+                    ...prev,
+                    orderSummary,
+                    selectedVariants: initialVariants,
+                    isUpdatingSummary: false,
+                }));
+                return orderSummary;
+            }
+            return null;
+        }
+        catch (error) {
+            console.error('Failed to fetch order summary:', error);
+            setCheckoutSession(prev => ({
+                ...prev,
+                isUpdatingSummary: false,
+            }));
+            return null;
+        }
+    }, [offersResource, isSessionInitialized]);
+    // ─────────────────────────────────────────────────────────────────────────
+    // Helper: Initialize checkout session
+    // ─────────────────────────────────────────────────────────────────────────
+    const initCheckoutSession = useCallback(async (offerId, orderId, customerId) => {
+        if (!isSessionInitialized) {
+            throw new Error('Cannot initialize checkout session: CMS session is not initialized');
+        }
+        const effectiveCustomerId = customerId || session?.customerId;
+        if (!effectiveCustomerId) {
+            throw new Error('Customer ID is required. Make sure the session is properly initialized.');
+        }
+        return await initCheckoutSessionAsync({
+            offerId,
+            orderId,
+            customerId: effectiveCustomerId,
+        });
+    }, [initCheckoutSessionAsync, session?.customerId, isSessionInitialized]);
+    // ─────────────────────────────────────────────────────────────────────────
+    // 2. Auto-initialize checkout session when mainOrderId is provided
+    // ─────────────────────────────────────────────────────────────────────────
+    useEffect(() => {
+        if (!offer || !mainOrderId || !isSessionInitialized)
+            return;
+        if (checkoutSession.checkoutSessionId || isInitializing || hasInitializedRef.current)
+            return;
+        const initSession = async () => {
+            hasInitializedRef.current = true;
+            setIsInitializing(true);
+            try {
+                const result = await initCheckoutSession(offerId, mainOrderId);
+                setCheckoutSession(prev => ({
+                    ...prev,
+                    checkoutSessionId: result.checkoutSessionId,
+                }));
+                // Fetch order summary after session is initialized
+                await fetchOrderSummary(result.checkoutSessionId);
+            }
+            catch (err) {
+                console.error('Failed to init checkout session:', err);
+                hasInitializedRef.current = false; // Allow retry on error
+            }
+            finally {
+                setIsInitializing(false);
+            }
+        };
+        initSession();
+    }, [offer, mainOrderId, offerId, isSessionInitialized, checkoutSession.checkoutSessionId, isInitializing, initCheckoutSession, fetchOrderSummary]);
+    // ─────────────────────────────────────────────────────────────────────────
+    // Derive line items from order summary or static offer data
+    // ─────────────────────────────────────────────────────────────────────────
+    const lineItems = useMemo(() => {
+        // Prefer dynamic data from order summary
+        if (checkoutSession.orderSummary?.items) {
+            return checkoutSession.orderSummary.items.map((item) => ({
+                id: item.id || `${item.productId}-${item.variantId}`,
+                variantId: item.variantId,
+                variantName: item.variant?.name || item.variantName || '',
+                productId: item.productId,
+                productName: item.product?.name || item.productName || '',
+                productDescription: item.product?.description || null,
+                imageUrl: item.variant?.imageUrl || item.imageUrl || null,
+                quantity: item.quantity,
+                unitAmount: item.unitAmount || 0,
+                currency: checkoutSession.orderSummary?.currency || 'USD',
+            }));
+        }
+        // Fallback to static offer data
+        if (!offer?.offerLineItems)
+            return [];
+        const items = [];
+        for (const item of offer.offerLineItems) {
+            const price = item.price;
+            const variant = price?.variant;
+            const product = variant?.product;
+            if (!variant || !product)
+                continue;
+            const currency = offer.summaries?.[0]?.currency || 'USD';
+            const currencyOption = price?.currencyOptions?.[currency];
+            const unitAmount = currencyOption?.amount ?? variant.price ?? 0;
+            items.push({
+                id: item.id,
+                variantId: variant.id,
+                variantName: variant.name,
+                productId: product.id,
+                productName: product.name,
+                productDescription: product.description,
+                imageUrl: variant.imageUrl,
+                quantity: item.quantity,
+                unitAmount,
+                currency,
+            });
+        }
+        return items;
+    }, [offer, checkoutSession.orderSummary]);
+    // ─────────────────────────────────────────────────────────────────────────
+    // Derive selections from order summary or line items
+    // ─────────────────────────────────────────────────────────────────────────
+    const selections = useMemo(() => {
+        if (Object.keys(checkoutSession.selectedVariants).length > 0) {
+            const result = {};
+            for (const item of lineItems) {
+                result[item.productId] = {
+                    variantId: checkoutSession.selectedVariants[item.productId] || item.variantId,
+                    quantity: item.quantity,
+                };
+            }
+            return result;
+        }
+        // Fallback to line items
+        const result = {};
+        for (const item of lineItems) {
+            if (!result[item.productId]) {
+                result[item.productId] = {
+                    variantId: item.variantId,
+                    quantity: item.quantity,
+                };
+            }
+        }
+        return result;
+    }, [lineItems, checkoutSession.selectedVariants]);
+    // ─────────────────────────────────────────────────────────────────────────
+    // Summary calculation
+    // ─────────────────────────────────────────────────────────────────────────
+    const summary = useMemo(() => {
+        // Prefer dynamic data from order summary
+        if (checkoutSession.orderSummary) {
+            return {
+                items: lineItems,
+                currency: checkoutSession.orderSummary.currency || 'USD',
+                totalAmount: checkoutSession.orderSummary.totalAmount || 0,
+                totalAdjustedAmount: checkoutSession.orderSummary.totalAdjustedAmount || 0,
+            };
+        }
+        // Fallback to static calculation
+        if (lineItems.length === 0)
+            return null;
+        const currency = lineItems[0]?.currency || 'USD';
+        let totalAmount = 0;
+        for (const item of lineItems) {
+            totalAmount += item.unitAmount * item.quantity;
+        }
+        const offerSummary = offer?.summaries?.[0];
+        const discountRatio = offerSummary && offerSummary.totalAmount > 0
+            ? offerSummary.totalAdjustedAmount / offerSummary.totalAmount
+            : 1;
+        return {
+            items: lineItems,
+            currency,
+            totalAmount,
+            totalAdjustedAmount: Math.round(totalAmount * discountRatio),
+        };
+    }, [lineItems, offer, checkoutSession.orderSummary]);
+    // ─────────────────────────────────────────────────────────────────────────
+    // Get available variants for a product
+    // ─────────────────────────────────────────────────────────────────────────
+    const getAvailableVariants = useCallback((productId) => {
+        // Get variants from order summary options (dynamic, from checkout session)
+        const orderSummary = checkoutSession.orderSummary;
+        if (orderSummary?.options?.[productId]) {
+            const currency = orderSummary.currency || 'USD';
+            return orderSummary.options[productId].map((variant) => ({
+                variantId: variant.id,
+                variantName: variant.name,
+                sku: variant.sku || null,
+                imageUrl: variant.imageUrl || null,
+                unitAmount: variant.prices?.[0]?.currencyOptions?.[currency]?.amount ?? 0,
+                currency,
+                isDefault: variant.default ?? false,
+            }));
+        }
+        // Fallback to static offer data
+        if (!offer?.offerLineItems)
+            return [];
+        const variants = [];
+        const currency = offer.summaries?.[0]?.currency || 'USD';
+        for (const item of offer.offerLineItems) {
+            const price = item.price;
+            const variant = price?.variant;
+            const product = variant?.product;
+            if (!variant || !product || product.id !== productId)
+                continue;
+            if (variants.some(v => v.variantId === variant.id))
+                continue;
+            const currencyOption = price?.currencyOptions?.[currency];
+            const unitAmount = currencyOption?.amount ?? variant.price ?? 0;
+            variants.push({
+                variantId: variant.id,
+                variantName: variant.name,
+                sku: variant.sku || null,
+                imageUrl: variant.imageUrl,
+                unitAmount,
+                currency,
+                isDefault: variant.default ?? false,
+            });
+        }
+        return variants;
+    }, [checkoutSession.orderSummary, offer]);
+    // ─────────────────────────────────────────────────────────────────────────
+    // Check if variant is loading
+    // ─────────────────────────────────────────────────────────────────────────
+    const isLoadingVariant = useCallback((productId) => {
+        return checkoutSession.loadingVariants[productId] ?? false;
+    }, [checkoutSession.loadingVariants]);
+    // ─────────────────────────────────────────────────────────────────────────
+    // Select/Update variant for a product
+    // ─────────────────────────────────────────────────────────────────────────
+    const selectVariant = useCallback(async (productId, variantId) => {
+        if (!isSessionInitialized) {
+            throw new Error('Cannot select variant: CMS session is not initialized');
+        }
+        const currentSession = checkoutSessionRef.current;
+        if (!currentSession.checkoutSessionId || !currentSession.orderSummary) {
+            throw new Error('Checkout session not initialized');
+        }
+        const sessionId = currentSession.checkoutSessionId;
+        // Set loading state
+        setCheckoutSession(prev => ({
+            ...prev,
+            loadingVariants: {
+                ...prev.loadingVariants,
+                [productId]: true,
+            },
+        }));
+        try {
+            // Find the current item to get its quantity
+            const currentItem = currentSession.orderSummary.items.find((item) => item.productId === productId);
+            if (!currentItem) {
+                throw new Error('Current item not found');
+            }
+            // Update selected variants state optimistically
+            setCheckoutSession(prev => ({
+                ...prev,
+                selectedVariants: {
+                    ...prev.selectedVariants,
+                    [productId]: variantId,
+                },
+            }));
+            // Update line items on the server
+            await offersResource.updateLineItems(sessionId, [
+                {
+                    variantId,
+                    quantity: currentItem.quantity,
+                },
+            ]);
+            // Refetch order summary
+            await fetchOrderSummary(sessionId);
+        }
+        finally {
+            setCheckoutSession(prev => ({
+                ...prev,
+                loadingVariants: {
+                    ...prev.loadingVariants,
+                    [productId]: false,
+                },
+            }));
+        }
+    }, [offersResource, fetchOrderSummary, isSessionInitialized]);
+    // Alias for selectVariant
+    const updateVariant = selectVariant;
+    // ─────────────────────────────────────────────────────────────────────────
+    // Update quantity for a product
+    // ─────────────────────────────────────────────────────────────────────────
+    const updateQuantity = useCallback(async (productId, quantity) => {
+        if (quantity < 1)
+            return;
+        if (!isSessionInitialized) {
+            throw new Error('Cannot update quantity: CMS session is not initialized');
+        }
+        const currentSession = checkoutSessionRef.current;
+        if (!currentSession.checkoutSessionId || !currentSession.orderSummary) {
+            throw new Error('Checkout session not initialized');
+        }
+        const sessionId = currentSession.checkoutSessionId;
+        // Find the current item
+        const currentItem = currentSession.orderSummary.items.find((item) => item.productId === productId);
+        if (!currentItem) {
+            throw new Error('Current item not found');
+        }
+        // Set loading state
+        setCheckoutSession(prev => ({
+            ...prev,
+            loadingVariants: {
+                ...prev.loadingVariants,
+                [productId]: true,
+            },
+        }));
+        try {
+            // Update line items on the server
+            await offersResource.updateLineItems(sessionId, [
+                {
+                    variantId: currentItem.variantId,
+                    quantity,
+                },
+            ]);
+            // Refetch order summary
+            await fetchOrderSummary(sessionId);
+        }
+        finally {
+            setCheckoutSession(prev => ({
+                ...prev,
+                loadingVariants: {
+                    ...prev.loadingVariants,
+                    [productId]: false,
+                },
+            }));
+        }
+    }, [offersResource, fetchOrderSummary, isSessionInitialized]);
+    // ─────────────────────────────────────────────────────────────────────────
+    // Pay for the offer
+    // ─────────────────────────────────────────────────────────────────────────
+    const payOffer = useCallback(async (orderId) => {
+        if (!isSessionInitialized) {
+            throw new Error('Cannot pay offer: CMS session is not initialized');
+        }
+        const currentSession = checkoutSessionRef.current;
+        if (!currentSession.checkoutSessionId) {
+            throw new Error('Checkout session not initialized');
+        }
+        setIsPaying(true);
+        setPaymentError(null);
+        try {
+            await payWithCheckoutSessionAsync({
+                checkoutSessionId: currentSession.checkoutSessionId,
+                orderId: orderId || mainOrderId,
+            });
+            return { checkoutUrl: '' };
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error('Payment failed');
+            setPaymentError(error);
+            throw error;
+        }
+        finally {
+            setIsPaying(false);
+        }
+    }, [mainOrderId, payWithCheckoutSessionAsync, isSessionInitialized]);
+    // ─────────────────────────────────────────────────────────────────────────
+    // Return
+    // ─────────────────────────────────────────────────────────────────────────
+    return {
+        offer: offer || null,
+        isLoading: isOfferLoading,
+        isUpdatingSummary: checkoutSession.isUpdatingSummary,
+        error: error,
+        summary,
+        lineItems,
+        getAvailableVariants,
+        selectVariant,
+        updateVariant,
+        updateQuantity,
+        selections,
+        payOffer,
+        isPaying,
+        paymentError,
+        checkoutSessionId: checkoutSession.checkoutSessionId,
+        isInitializing,
+        isLoadingVariant,
+    };
+}

package/dist/v2/react/hooks/useOffersQuery.d.ts

@@ -1,78 +1,12 @@
-/**
- * Offers Hook using TanStack Query
- * Handles offers with automatic caching
- */
-import { Offer, OfferSummary } from '../../core/resources/offers';
-import { CurrencyOptions, OrderSummary } from '../../core/resources/postPurchases';
-export interface UseOffersQueryOptions {
-    /**
-     * Array of offer IDs to fetch
-     */
-    offerIds?: string[];
-    /**
-     * Whether to fetch offers automatically on mount
-     * @default true
-     */
-    enabled?: boolean;
-    /**
-     * Return URL for checkout sessions
-     */
-    returnUrl?: string;
-    /**
-     * Order ID to associate with the offers (required for payments)
-     */
-    orderId?: string;
-    /**
-     * The ID of the currently active offer to preview/fetch summary for.
-     * If provided, the hook will automatically fetch and manage the summary for this offer.
-     */
-    activeOfferId?: string;
-    /**
-     * Whether to skip auto-preview fetching (e.g. during navigation or processing)
-     */
-    skipPreview?: boolean;
-}
-export interface UseOffersQueryResult {
-    offers: Offer[];
+export function useOffersQuery(options?: {}): {
+    offers: import("../../core/resources/offers").Offer[];
     isLoading: boolean;
     error: Error | null;
-    /**
-     * Summary for the active offer (if activeOfferId is provided)
-     * Automatically falls back to static summary while loading dynamic data
-     */
-    activeSummary: OrderSummary | OfferSummary | null;
-    /**
-     * Whether the active offer summary is currently loading
-     */
+    activeSummary: any;
     isActiveSummaryLoading: boolean;
-    /**
-     * Pay for an offer
-     * Initializes a checkout session and pays it
-     */
-    payOffer: (offerId: string, orderId?: string) => Promise<void>;
-    /**
-     * Preview an offer's price/summary
-     */
-    preview: (offerId: string) => Promise<OrderSummary | OfferSummary | null>;
-    /**
-     * Get available variants for a product in an offer
-     */
-    getAvailableVariants: (offerId: string, productId: string) => {
-        variantId: string;
-        variantName: string;
-        variantSku: string | null;
-        variantDefault: boolean | null;
-        variantExternalId: string | null;
-        priceId: string;
-        currencyOptions: CurrencyOptions;
-    }[];
-    /**
-     * Select a variant for a product in an offer
-     */
-    selectVariant: (offerId: string, productId: string, variantId: string) => Promise<OrderSummary | null>;
-    /**
-     * Check if variants are loading for a product
-     */
-    isLoadingVariants: (offerId: string, productId: string) => boolean;
-}
-export declare function useOffersQuery(options?: UseOffersQueryOptions): UseOffersQueryResult;
+    payOffer: (offerId: any, orderId: any) => Promise<void>;
+    preview: (offerId: any) => Promise<any>;
+    getAvailableVariants: (offerId: any, productId: any) => any;
+    selectVariant: (offerId: any, productId: any, variantId: any) => Promise<any>;
+    isLoadingVariants: (offerId: any, productId: any) => any;
+};