@easypayment/medusa-paypal-ui 1.2.2 → 1.2.3

package/src/hooks/usePayPalConfig.ts

@@ -1,96 +1,100 @@
-"use client"
-
-import { useEffect, useMemo, useRef, useState } from "react"
-import { createPayPalStoreApi } from "../client/paypal"
-import type { PayPalConfig } from "../client/types"
-
-type Args = {
-  baseUrl: string
-  publishableApiKey?: string
-  cartId?: string
-  enabled?: boolean
-}
-
-const MAX_CACHE_ENTRIES = 50
-const _cache = new Map<string, { config: PayPalConfig; at: number }>()
-const CACHE_TTL = 5 * 60 * 1000
-
-function cacheSet(key: string, value: { config: PayPalConfig; at: number }) {
-  if (_cache.size >= MAX_CACHE_ENTRIES) {
-    const oldest = _cache.keys().next().value
-    if (oldest !== undefined) _cache.delete(oldest)
-  }
-  _cache.set(key, value)
-}
-
-function cacheKey(baseUrl: string, cartId?: string) {
-  return `${baseUrl}::${cartId ?? ""}`
-}
-
-export function usePayPalConfig({
-  baseUrl,
-  publishableApiKey,
-  cartId,
-  enabled = true,
-}: Args) {
-  const api = useMemo(
-    () => createPayPalStoreApi({ baseUrl, publishableApiKey }),
-    [baseUrl, publishableApiKey]
-  )
-
-  const key = cacheKey(baseUrl, cartId)
-  const hit = _cache.get(key)
-  const seedConfig = hit && Date.now() - hit.at < CACHE_TTL ? hit.config : null
-
-  const [config, setConfig] = useState<PayPalConfig | null>(seedConfig)
-  const [loading, setLoading] = useState<boolean>(seedConfig === null && enabled)
-  const [error, setError] = useState<string | null>(null)
-
-  const fetchIdRef = useRef(0)
-
-  useEffect(() => {
-    if (!enabled) {
-      setLoading(false)
-      setError(null)
-      return
-    }
-
-    const k = cacheKey(baseUrl, cartId)
-    const cached = _cache.get(k)
-    if (cached && Date.now() - cached.at < CACHE_TTL) {
-      setConfig(cached.config)
-      setLoading(false)
-      setError(null)
-      return
-    }
-
-    const id = ++fetchIdRef.current
-    let mounted = true
-    const controller = new AbortController()
-
-    setLoading(true)
-    setError(null)
-
-    ;(async () => {
-      try {
-        const cfg = await api.getConfig(cartId, controller.signal)
-        if (!mounted || id !== fetchIdRef.current) return
-        cacheSet(k, { config: cfg, at: Date.now() })
-        setConfig(cfg)
-      } catch (e: unknown) {
-        if (e instanceof Error && e.name === "AbortError") return
-        if (!mounted || id !== fetchIdRef.current) return
-        setError(e instanceof Error ? e.message : "Failed to load PayPal config")
-      } finally {
-        if (mounted && id === fetchIdRef.current) setLoading(false)
-      }
-    })()
-
-    return () => {
-      mounted = false
-      controller.abort()
-    }
-  }, [api, baseUrl, cartId, enabled])
-
-  return { config, loading, error }
-}
+"use client"
+
+import { useEffect, useMemo, useRef, useState } from "react"
+import { createPayPalStoreApi } from "../client/paypal"
+import type { PayPalConfig } from "../client/types"
+
+type Args = {
+  baseUrl: string
+  publishableApiKey?: string
+  cartId?: string
+  enabled?: boolean
+}
+
+const MAX_CACHE_ENTRIES = 50
+const _cache = new Map<string, { config: PayPalConfig; at: number }>()
+const CACHE_TTL = 5 * 60 * 1000
+
+function cacheSet(key: string, value: { config: PayPalConfig; at: number }) {
+  if (_cache.size >= MAX_CACHE_ENTRIES) {
+    const oldest = _cache.keys().next().value
+    if (oldest !== undefined) _cache.delete(oldest)
+  }
+  _cache.set(key, value)
+}
+
+function cacheKey(baseUrl: string, cartId?: string) {
+  return `${baseUrl}::${cartId ?? ""}`
+}
+
+export function usePayPalConfig({
+  baseUrl,
+  publishableApiKey,
+  cartId,
+  enabled = true,
+}: Args) {
+  const api = useMemo(
+    () => createPayPalStoreApi({ baseUrl, publishableApiKey }),
+    [baseUrl, publishableApiKey]
+  )
+
+  const key = cacheKey(baseUrl, cartId)
+  const hit = _cache.get(key)
+  const seedConfig = hit && Date.now() - hit.at < CACHE_TTL ? hit.config : null
+
+  const [config, setConfig] = useState<PayPalConfig | null>(seedConfig)
+  const [loading, setLoading] = useState<boolean>(
+    seedConfig === null && enabled
+  )
+  const [error, setError] = useState<string | null>(null)
+
+  const fetchIdRef = useRef(0)
+
+  useEffect(() => {
+    if (!enabled) {
+      setLoading(false)
+      setError(null)
+      return
+    }
+
+    const k = cacheKey(baseUrl, cartId)
+    const cached = _cache.get(k)
+    if (cached && Date.now() - cached.at < CACHE_TTL) {
+      setConfig(cached.config)
+      setLoading(false)
+      setError(null)
+      return
+    }
+
+    const id = ++fetchIdRef.current
+    let mounted = true
+    const controller = new AbortController()
+
+    setLoading(true)
+    setError(null)
+
+    ;(async () => {
+      try {
+        const cfg = await api.getConfig(cartId, controller.signal)
+        if (!mounted || id !== fetchIdRef.current) return
+        cacheSet(k, { config: cfg, at: Date.now() })
+        setConfig(cfg)
+      } catch (e: unknown) {
+        if (e instanceof Error && e.name === "AbortError") return
+        if (!mounted || id !== fetchIdRef.current) return
+        setError(
+          e instanceof Error ? e.message : "Failed to load PayPal config"
+        )
+      } finally {
+        if (mounted && id === fetchIdRef.current) setLoading(false)
+      }
+    })()
+
+    return () => {
+      mounted = false
+      controller.abort()
+    }
+  }, [api, baseUrl, cartId, enabled])
+
+  return { config, loading, error }
+}

package/src/hooks/usePayPalPaymentMethods.ts

@@ -1,145 +1,146 @@
-"use client"
-
-
-import { useEffect, useMemo, useRef, useState } from "react"
-import { createPayPalStoreApi } from "../client/paypal"
-
-type Args = {
-  baseUrl: string
-  publishableApiKey?: string
-  cartId?: string
-  enabled?: boolean
-}
-
-type Result = {
-  paypalEnabled: boolean
-  paypalTitle: string
-  cardEnabled: boolean
-  cardTitle: string
-  loading: boolean
-  /**
-   * Non-null when the config fetch failed and the returned flags are the
-   * optimistic defaults rather than the merchant's real settings. Storefronts
-   * can use this to hide or annotate the PayPal options instead of advertising
-   * methods that will fail once selected.
-   */
-  error: string | null
-}
-
-const MAX_CACHE_ENTRIES = 50
-const _cache = new Map<string, { result: Result; at: number }>()
-const CACHE_TTL = 5 * 60 * 1000
-
-function cacheSet(key: string, value: { result: Result; at: number }) {
-  if (_cache.size >= MAX_CACHE_ENTRIES) {
-    const oldest = _cache.keys().next().value
-    if (oldest !== undefined) _cache.delete(oldest)
-  }
-  _cache.set(key, value)
-}
-
-function cacheKey(baseUrl: string, cartId?: string) {
-  return `ppm::${baseUrl}::${cartId ?? ""}`
-}
-
-const DEFAULT_RESULT: Result = {
-  paypalEnabled: true,
-  paypalTitle: "PayPal",
-  cardEnabled: true,
-  cardTitle: "Credit or Debit Card",
-  loading: false,
-  error: null,
-}
-
-export function usePayPalPaymentMethods({
-  baseUrl,
-  publishableApiKey,
-  cartId,
-  enabled = true,
-}: Args): Result {
-  const api = useMemo(
-    () => createPayPalStoreApi({ baseUrl, publishableApiKey }),
-    [baseUrl, publishableApiKey]
-  )
-
-  const key = cacheKey(baseUrl, cartId)
-  const hit = _cache.get(key)
-  const seed = hit && Date.now() - hit.at < CACHE_TTL ? hit.result : null
-
-  const [result, setResult] = useState<Result>(seed ?? { ...DEFAULT_RESULT, loading: enabled })
-  const fetchIdRef = useRef(0)
-
-  useEffect(() => {
-    if (!enabled) {
-      setResult((prev) => ({ ...prev, loading: false }))
-      return
-    }
-
-    const k = cacheKey(baseUrl, cartId)
-    const cached = _cache.get(k)
-    if (cached && Date.now() - cached.at < CACHE_TTL) {
-      setResult(cached.result)
-      return
-    }
-
-    const id = ++fetchIdRef.current
-    let mounted = true
-    const controller = new AbortController()
-
-    setResult((prev) => ({ ...prev, loading: true }))
-
-    ;(async () => {
-      try {
-        const cfg = await api.getConfig(cartId, controller.signal)
-        if (!mounted || id !== fetchIdRef.current) return
-
-        const next: Result = {
-          paypalEnabled: cfg.paypal_enabled !== false,
-          paypalTitle:
-            typeof cfg.paypal_title === "string" && cfg.paypal_title
-              ? cfg.paypal_title
-              : "PayPal",
-          cardEnabled: cfg.card_enabled !== false,
-          cardTitle:
-            typeof cfg.card_title === "string" && cfg.card_title
-              ? cfg.card_title
-              : "Credit or Debit Card",
-          loading: false,
-          error: null,
-        }
-
-        cacheSet(k, { result: next, at: Date.now() })
-        setResult(next)
-      } catch (e: unknown) {
-        const msg = e instanceof Error ? e.message : ""
-        if (e instanceof Error && e.name === "AbortError") return
-        if (!mounted || id !== fetchIdRef.current) return
-
-        if (msg.includes("403") || msg.includes("Forbidden")) {
-          const disabled: Result = {
-            ...DEFAULT_RESULT,
-            paypalEnabled: false,
-            cardEnabled: false,
-            loading: false,
-            error: msg || "PayPal is disabled",
-          }
-          setResult(disabled)
-          return
-        }
-
-        setResult({
-          ...DEFAULT_RESULT,
-          loading: false,
-          error: msg || "Failed to load PayPal payment methods",
-        })
-      }
-    })()
-
-    return () => {
-      mounted = false
-      controller.abort()
-    }
-  }, [api, baseUrl, cartId, enabled])
-
-  return result
-}
+"use client"
+
+import { useEffect, useMemo, useRef, useState } from "react"
+import { createPayPalStoreApi } from "../client/paypal"
+
+type Args = {
+  baseUrl: string
+  publishableApiKey?: string
+  cartId?: string
+  enabled?: boolean
+}
+
+type Result = {
+  paypalEnabled: boolean
+  paypalTitle: string
+  cardEnabled: boolean
+  cardTitle: string
+  loading: boolean
+  /**
+   * Non-null when the config fetch failed and the returned flags are the
+   * optimistic defaults rather than the merchant's real settings. Storefronts
+   * can use this to hide or annotate the PayPal options instead of advertising
+   * methods that will fail once selected.
+   */
+  error: string | null
+}
+
+const MAX_CACHE_ENTRIES = 50
+const _cache = new Map<string, { result: Result; at: number }>()
+const CACHE_TTL = 5 * 60 * 1000
+
+function cacheSet(key: string, value: { result: Result; at: number }) {
+  if (_cache.size >= MAX_CACHE_ENTRIES) {
+    const oldest = _cache.keys().next().value
+    if (oldest !== undefined) _cache.delete(oldest)
+  }
+  _cache.set(key, value)
+}
+
+function cacheKey(baseUrl: string, cartId?: string) {
+  return `ppm::${baseUrl}::${cartId ?? ""}`
+}
+
+const DEFAULT_RESULT: Result = {
+  paypalEnabled: true,
+  paypalTitle: "PayPal",
+  cardEnabled: true,
+  cardTitle: "Credit or Debit Card",
+  loading: false,
+  error: null,
+}
+
+export function usePayPalPaymentMethods({
+  baseUrl,
+  publishableApiKey,
+  cartId,
+  enabled = true,
+}: Args): Result {
+  const api = useMemo(
+    () => createPayPalStoreApi({ baseUrl, publishableApiKey }),
+    [baseUrl, publishableApiKey]
+  )
+
+  const key = cacheKey(baseUrl, cartId)
+  const hit = _cache.get(key)
+  const seed = hit && Date.now() - hit.at < CACHE_TTL ? hit.result : null
+
+  const [result, setResult] = useState<Result>(
+    seed ?? { ...DEFAULT_RESULT, loading: enabled }
+  )
+  const fetchIdRef = useRef(0)
+
+  useEffect(() => {
+    if (!enabled) {
+      setResult((prev) => ({ ...prev, loading: false }))
+      return
+    }
+
+    const k = cacheKey(baseUrl, cartId)
+    const cached = _cache.get(k)
+    if (cached && Date.now() - cached.at < CACHE_TTL) {
+      setResult(cached.result)
+      return
+    }
+
+    const id = ++fetchIdRef.current
+    let mounted = true
+    const controller = new AbortController()
+
+    setResult((prev) => ({ ...prev, loading: true }))
+
+    ;(async () => {
+      try {
+        const cfg = await api.getConfig(cartId, controller.signal)
+        if (!mounted || id !== fetchIdRef.current) return
+
+        const next: Result = {
+          paypalEnabled: cfg.paypal_enabled !== false,
+          paypalTitle:
+            typeof cfg.paypal_title === "string" && cfg.paypal_title
+              ? cfg.paypal_title
+              : "PayPal",
+          cardEnabled: cfg.card_enabled !== false,
+          cardTitle:
+            typeof cfg.card_title === "string" && cfg.card_title
+              ? cfg.card_title
+              : "Credit or Debit Card",
+          loading: false,
+          error: null,
+        }
+
+        cacheSet(k, { result: next, at: Date.now() })
+        setResult(next)
+      } catch (e: unknown) {
+        const msg = e instanceof Error ? e.message : ""
+        if (e instanceof Error && e.name === "AbortError") return
+        if (!mounted || id !== fetchIdRef.current) return
+
+        if (msg.includes("403") || msg.includes("Forbidden")) {
+          const disabled: Result = {
+            ...DEFAULT_RESULT,
+            paypalEnabled: false,
+            cardEnabled: false,
+            loading: false,
+            error: msg || "PayPal is disabled",
+          }
+          setResult(disabled)
+          return
+        }
+
+        setResult({
+          ...DEFAULT_RESULT,
+          loading: false,
+          error: msg || "Failed to load PayPal payment methods",
+        })
+      }
+    })()
+
+    return () => {
+      mounted = false
+      controller.abort()
+    }
+  }, [api, baseUrl, cartId, enabled])
+
+  return result
+}

package/src/index.ts

@@ -1,16 +1,19 @@
-export * from "./client/types"
-export * from "./client/paypal"
-export * from "./hooks/usePayPalConfig"
-export * from "./components/PayPalProvider"
-export * from "./components/PayPalCurrencyNotice"
-export * from "./components/PayPalSmartButtons"
-export * from "./components/PayPalAdvancedCard"
-export * from "./adapters/MedusaNextPayPalAdapter"
-export * from "./components/PayPalPaymentSection"
-export * from "./hooks/usePayPalPaymentMethods"
-export { showProcessingOverlay, hideProcessingOverlay } from "./utils/processing-overlay"
-export {
-  markCartCaptured,
-  wasCartCaptured,
-  clearCartCaptured,
-} from "./utils/captured-state"
+export * from "./client/types"
+export * from "./client/paypal"
+export * from "./hooks/usePayPalConfig"
+export * from "./components/PayPalProvider"
+export * from "./components/PayPalCurrencyNotice"
+export * from "./components/PayPalSmartButtons"
+export * from "./components/PayPalAdvancedCard"
+export * from "./adapters/MedusaNextPayPalAdapter"
+export * from "./components/PayPalPaymentSection"
+export * from "./hooks/usePayPalPaymentMethods"
+export {
+  showProcessingOverlay,
+  hideProcessingOverlay,
+} from "./utils/processing-overlay"
+export {
+  markCartCaptured,
+  wasCartCaptured,
+  clearCartCaptured,
+} from "./utils/captured-state"