@pradip1995/segment-jewelry-checkout-form 0.1.6 → 0.1.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pradip1995/segment-jewelry-checkout-form",
-  "version": "0.1.6",
+  "version": "0.1.8",
   "license": "MIT",
   "publishConfig": {
     "access": "public"

package/src/address-fields.tsx

@@ -108,8 +108,7 @@ function pickPreferredFromList(
     addresses.find((a) => a.is_default_billing) ||
     addresses.find(
       (a) => a.metadata?.is_default === true || a.metadata?.is_default === "true"
-    ) ||
-    addresses[0]
+    )
   )
 }
 
@@ -156,34 +155,69 @@ function buildInitialValues(
   const matched = findMatchingSavedAddress(cart, addresses)
   const preferred = pickPreferredAddress(customer)
   const shipping = cart?.shipping_address
+  const fallbackCountry =
+    preferred?.country_code ||
+    matched?.country_code ||
+    shipping?.country_code ||
+    cart?.region?.countries?.[0]?.iso_2 ||
+    "in"
+
+  if (preferred) {
+    return addressToFormValues(preferred, {
+      email,
+      phone: customer?.phone,
+      countryCode: fallbackCountry,
+    })
+  }
 
-  if (addresses.length) {
-    const source = preferred || matched
-    if (source) {
-      return addressToFormValues(source, {
-        email,
-        phone: customer?.phone,
-        countryCode: source.country_code || cart?.region?.countries?.[0]?.iso_2 || "in",
-      })
+  if (matched) {
+    return addressToFormValues(matched, {
+      email,
+      phone: customer?.phone,
+      countryCode: fallbackCountry,
+    })
+  }
+
+  if (shipping?.address_1 || shipping?.postal_code) {
+    const fullName = shipping?.first_name
+      ? `${shipping.first_name} ${shipping.last_name === "." ? "" : shipping.last_name || ""}`.trim()
+      : ""
+
+    return {
+      fullName,
+      firstName: shipping?.first_name || "",
+      lastName: shipping?.last_name || "",
+      email,
+      phone: toFormPhoneValue(shipping?.phone || customer?.phone),
+      address1: shipping?.address_1 || "",
+      address2: shipping?.address_2 || "",
+      postalCode: shipping?.postal_code || "",
+      city: shipping?.city || "",
+      province: shipping?.province || "",
+      countryCode: fallbackCountry,
     }
   }
 
-  const fullName = shipping?.first_name
-    ? `${shipping.first_name} ${shipping.last_name === "." ? "" : shipping.last_name || ""}`.trim()
-    : ""
+  if (addresses[0]) {
+    return addressToFormValues(addresses[0], {
+      email,
+      phone: customer?.phone,
+      countryCode: fallbackCountry,
+    })
+  }
 
   return {
-    fullName,
-    firstName: shipping?.first_name || "",
-    lastName: shipping?.last_name || "",
+    fullName: "",
+    firstName: "",
+    lastName: "",
     email,
-    phone: toFormPhoneValue(shipping?.phone || customer?.phone),
-    address1: shipping?.address_1 || "",
-    address2: shipping?.address_2 || "",
-    postalCode: shipping?.postal_code || "",
-    city: shipping?.city || "",
-    province: shipping?.province || "",
-    countryCode: shipping?.country_code || cart?.region?.countries?.[0]?.iso_2 || "in",
+    phone: toFormPhoneValue(customer?.phone),
+    address1: "",
+    address2: "",
+    postalCode: "",
+    city: "",
+    province: "",
+    countryCode: fallbackCountry,
   }
 }
 
@@ -200,7 +234,12 @@ function resolveInitialSelectedId(
   const matched = findMatchingSavedAddress(cart, addresses)
   if (matched?.id) return matched.id
 
-  return NEW_ADDRESS_ID
+  // Cart already has an address (e.g. reorder from a past order) — don't force another saved one.
+  if (cart?.shipping_address?.address_1 || cart?.shipping_address?.postal_code) {
+    return NEW_ADDRESS_ID
+  }
+
+  return addresses[0]?.id || NEW_ADDRESS_ID
 }
 
 function formatAddressParts(address: {

package/src/hosted-checkout.ts

@@ -13,6 +13,9 @@ import {
 } from "@pradip1995/commerce-core/util/payment-providers"
 import { isNextRedirect } from "@pradip1995/segment-primitives/is-next-redirect"
 import type { HttpTypes } from "@medusajs/types"
+import {
+  isOneClickUpi,
+} from "./upi-intent"
 
 type CartLike = HttpTypes.StoreCart & {
   payment_collection?: {
@@ -176,6 +179,33 @@ async function openCashfreeCheckout(options: {
   // Redirect checkout: Cashfree navigates away; order is finalized on return.
 }
 
+export async function startUpiIntentCheckout(options: {
+  cart: CartLike
+  providerId: string
+}): Promise<{ cart: CartLike; session: HttpTypes.StorePaymentSession }> {
+  const { cart, providerId } = options
+  if (!isOneClickUpi(providerId)) {
+    throw new Error(`Not a 1-click UPI provider: ${providerId}`)
+  }
+
+  // Must use the exact UPI provider id — commerce-core init attempts collapse to hosted Razorpay.
+  await initiatePaymentSession(cart, { provider_id: providerId })
+  const updatedCart = await retrieveCartWithPayments(cart.id)
+  if (!updatedCart) {
+    throw new Error("Cart not found after UPI payment initialization")
+  }
+
+  const session = updatedCart.payment_collection?.payment_sessions?.find(
+    (item) => item.provider_id === providerId
+  ) as HttpTypes.StorePaymentSession | undefined
+
+  if (!session) {
+    throw new Error("Could not initialize 1-click UPI")
+  }
+
+  return { cart: updatedCart, session }
+}
+
 export async function openHostedCheckout(options: {
   cart: CartLike
   providerId: string
@@ -183,6 +213,9 @@ export async function openHostedCheckout(options: {
   onDismiss?: () => void
 }): Promise<void> {
   const { cart, providerId, shopName, onDismiss } = options
+  if (isOneClickUpi(providerId)) {
+    throw new Error("Use startUpiIntentCheckout for 1-click UPI")
+  }
   const kind = getPaymentGatewayKind(providerId)
 
   const updatedCart = await initiatePaymentSessionWithFallback(cart, providerId)
@@ -225,8 +258,13 @@ export function partitionPaymentProviders(
 ) {
   const manual: Array<{ id: string }> = []
   const hosted: Array<{ id: string }> = []
+  const upi: Array<{ id: string }> = []
 
   for (const provider of providers ?? []) {
+    if (isOneClickUpi(provider.id)) {
+      upi.push(provider)
+      continue
+    }
     const kind = getPaymentGatewayKind(provider.id)
     if (kind === "manual") {
       manual.push(provider)
@@ -235,7 +273,14 @@ export function partitionPaymentProviders(
     }
   }
 
-  return { manual, hosted }
+  return { manual, hosted, upi }
+}
+
+export function pickUpiPaymentProvider(
+  providers: Array<{ id: string }> | null | undefined
+): string | null {
+  const { upi } = partitionPaymentProviders(providers)
+  return upi.length > 0 ? upi[0].id : null
 }
 
 export function pickHostedPaymentProvider(
@@ -245,7 +290,10 @@ export function pickHostedPaymentProvider(
   const preferred = process.env.NEXT_PUBLIC_PAYMENT_PROVIDER?.trim().toLowerCase()
 
   if (preferred === "razorpay") {
-    const razorpay = hosted.find((provider) => getPaymentGatewayKind(provider.id) === "razorpay")
+    const razorpay = hosted.find(
+      (provider) =>
+        getPaymentGatewayKind(provider.id) === "razorpay" && !isOneClickUpi(provider.id)
+    )
     if (razorpay) return razorpay.id
   }
 
@@ -257,7 +305,10 @@ export function pickHostedPaymentProvider(
   const cashfree = hosted.find((provider) => getPaymentGatewayKind(provider.id) === "cashfree")
   if (cashfree) return cashfree.id
 
-  const razorpay = hosted.find((provider) => getPaymentGatewayKind(provider.id) === "razorpay")
+  const razorpay = hosted.find(
+    (provider) =>
+      getPaymentGatewayKind(provider.id) === "razorpay" && !isOneClickUpi(provider.id)
+  )
   if (razorpay) return razorpay.id
 
   if (hosted.length > 0) return hosted[0].id

package/src/jewelry-checkout-form.css

@@ -994,3 +994,60 @@
     justify-self: start;
   }
 }
+
+.jewelry-checkout-payment__btn--upi {
+  background: #3b1f4e !important;
+  border: 1px solid #3b1f4e !important;
+  color: #ffffff !important;
+}
+
+.jewelry-checkout-payment__btn--upi:hover:not(:disabled) {
+  background: #55306c !important;
+  border-color: #55306c !important;
+  color: #ffffff !important;
+}
+
+.jewelry-checkout-upi {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+}
+
+.jewelry-checkout-upi__qr {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 0.5rem;
+  padding: 1rem;
+  border: 1px solid rgba(59, 31, 78, 0.16);
+  background: #ffffff;
+}
+
+.jewelry-checkout-upi__qr-img {
+  height: auto;
+  width: 100%;
+  max-width: 280px;
+  object-fit: contain;
+  background: #ffffff;
+}
+
+.jewelry-checkout-upi__qr-img--lg {
+  width: 20rem;
+  height: 20rem;
+  max-width: 100%;
+  padding: 0.5rem;
+}
+
+.jewelry-checkout-upi__hint {
+  margin: 0;
+  text-align: center;
+  font-size: 0.8125rem;
+  color: #6b6573;
+}
+
+.jewelry-checkout-upi__open-link {
+  font-size: 0.8125rem;
+  font-weight: 600;
+  color: #3b1f4e;
+  text-decoration: underline;
+}

package/src/payment-block.tsx

@@ -11,12 +11,15 @@ import {
   openHostedCheckout,
   pickHostedPaymentProvider,
   pickManualPaymentProvider,
+  pickUpiPaymentProvider,
   placeCodOrder,
+  startUpiIntentCheckout,
 } from "./hosted-checkout"
 import { prepareCheckoutFromForm } from "./prepare-checkout"
 import { trackAddPaymentInfo } from "@pradip1995/segment-analytics/ecommerce-events"
 import { mapCartToEcommercePayload } from "@pradip1995/commerce-core/analytics/mappers"
 import { getPaymentGatewayKind } from "@pradip1995/commerce-core/util/payment-providers"
+import { UpiIntentPaymentButton } from "./upi-intent-payment-button"
 import "./jewelry-checkout-form.css"
 
 type PaymentBlockProps = {
@@ -29,22 +32,32 @@ type PaymentBlockProps = {
 export default function PaymentBlock({ cart, paymentProviders, disabled, shopName }: PaymentBlockProps) {
   const [error, setError] = useState<string | null>(null)
   const [pending, startTransition] = useTransition()
+  const [upiSession, setUpiSession] = useState<HttpTypes.StorePaymentSession | null>(null)
+  const [upiCart, setUpiCart] = useState<HttpTypes.StoreCart | null>(null)
 
   const providerList = paymentProviders ?? cart.region?.payment_providers ?? []
   const onlineProviderId = pickHostedPaymentProvider(providerList)
+  const upiProviderId = pickUpiPaymentProvider(providerList)
   const codProviderId = pickManualPaymentProvider(providerList)
   const totalLabel = formatPrice(cart.total, cart.currency_code)
   const onlineKind = getPaymentGatewayKind(onlineProviderId ?? undefined)
   const onlineHint =
-    onlineKind === "cashfree"
-      ? `Your delivery address is saved when you pay. Online payments use Cashfree (${
-          process.env.NEXT_PUBLIC_CASHFREE_ENVIRONMENT === "production" ? "live" : "test"
-        } mode).`
-      : onlineKind === "razorpay"
-        ? "Your delivery address is saved when you pay. Online payments use Razorpay (test mode)."
+    upiProviderId || onlineKind === "razorpay"
+      ? "Your delivery address is saved when you pay. 1-click UPI opens your UPI app or shows a QR code."
+      : onlineKind === "cashfree"
+        ? `Your delivery address is saved when you pay. Online payments use Cashfree (${
+            process.env.NEXT_PUBLIC_CASHFREE_ENVIRONMENT === "production" ? "live" : "test"
+          } mode).`
         : "Your delivery address is saved when you pay."
 
-  const runCheckout = (mode: "online" | "cod") => {
+  const onlineLabel =
+    onlineKind === "razorpay"
+      ? "Pay with Razorpay"
+      : onlineKind === "cashfree"
+        ? "Pay with Cashfree"
+        : "Pay online"
+
+  const runCheckout = (mode: "online" | "cod" | "upi") => {
     setError(null)
     startTransition(async () => {
       try {
@@ -56,6 +69,19 @@ export default function PaymentBlock({ cart, paymentProviders, disabled, shopNam
           return
         }
 
+        if (mode === "upi") {
+          if (!upiProviderId) {
+            throw new Error("1-click UPI is not configured for this region.")
+          }
+          const started = await startUpiIntentCheckout({
+            cart: freshCart,
+            providerId: upiProviderId,
+          })
+          setUpiCart(started.cart)
+          setUpiSession(started.session)
+          return
+        }
+
         if (!onlineProviderId) {
           throw new Error("Online payment is not configured.")
         }
@@ -68,16 +94,45 @@ export default function PaymentBlock({ cart, paymentProviders, disabled, shopNam
     })
   }
 
-  const onlineLabel =
-    onlineKind === "razorpay"
-      ? "Pay with Razorpay"
-      : onlineKind === "cashfree"
-        ? "Pay with Cashfree"
-        : "Pay online"
+  if (upiSession && upiCart) {
+    return (
+      <div className="checkout-payment jewelry-checkout-payment">
+        <UpiIntentPaymentButton
+          session={upiSession}
+          cart={upiCart}
+          autoStart
+          totalLabel={totalLabel}
+        />
+        <button
+          type="button"
+          className="checkout-page__btn checkout-page__btn--outline checkout-page__btn--block jewelry-checkout-payment__btn mt-3"
+          onClick={() => {
+            setUpiSession(null)
+            setUpiCart(null)
+            setError(null)
+          }}
+        >
+          Choose another payment method
+        </button>
+        {error && <p className="checkout-payment__error text-sm text-red-600 mt-2">{error}</p>}
+      </div>
+    )
+  }
 
   return (
     <div className="checkout-payment jewelry-checkout-payment">
       <div className="checkout-payment__actions">
+        {upiProviderId ? (
+          <button
+            type="button"
+            onClick={() => runCheckout("upi")}
+            disabled={disabled || pending}
+            className="checkout-page__btn checkout-page__btn--primary checkout-page__btn--block jewelry-checkout-payment__btn jewelry-checkout-payment__btn--upi"
+          >
+            {pending ? "Processing…" : `Pay with 1-click UPI · ${totalLabel}`}
+          </button>
+        ) : null}
+
         {codProviderId ? (
           <button
             type="button"
@@ -94,7 +149,11 @@ export default function PaymentBlock({ cart, paymentProviders, disabled, shopNam
             type="button"
             onClick={() => runCheckout("online")}
             disabled={disabled || pending}
-            className="checkout-page__btn checkout-page__btn--primary checkout-page__btn--block jewelry-checkout-payment__btn jewelry-checkout-payment__btn--online"
+            className={
+              upiProviderId
+                ? "checkout-page__btn checkout-page__btn--outline checkout-page__btn--block jewelry-checkout-payment__btn jewelry-checkout-payment__btn--cod"
+                : "checkout-page__btn checkout-page__btn--primary checkout-page__btn--block jewelry-checkout-payment__btn jewelry-checkout-payment__btn--online"
+            }
           >
             {pending ? "Processing…" : onlineLabel}
           </button>

package/src/upi-intent-payment-button.tsx

@@ -0,0 +1,212 @@
+"use client"
+
+import { useCallback, useEffect, useRef, useState } from "react"
+import { placeOrder } from "@pradip1995/commerce-core/client/actions/cart"
+import { isNextRedirect } from "@pradip1995/segment-primitives/is-next-redirect"
+import type { HttpTypes } from "@medusajs/types"
+import { getUpiQrPaid } from "./upi-qr-status"
+import {
+  getDesktopUpiQrSrc,
+  getRazorpayQrId,
+  getUpiDeepLink,
+  isMobileUpiClient,
+  upiQrImageUrl,
+} from "./upi-intent"
+
+type UpiIntentPaymentButtonProps = {
+  session: HttpTypes.StorePaymentSession
+  cart: HttpTypes.StoreCart
+  notReady?: boolean
+  autoStart?: boolean
+  totalLabel?: string
+}
+
+const POLL_ATTEMPTS = 15
+const POLL_INTERVAL_MS = 2000
+
+function sleep(ms: number): Promise<void> {
+  return new Promise((resolve) => setTimeout(resolve, ms))
+}
+
+export function UpiIntentPaymentButton({
+  session,
+  cart,
+  notReady = false,
+  autoStart = false,
+  totalLabel,
+}: UpiIntentPaymentButtonProps) {
+  const [submitting, setSubmitting] = useState(false)
+  const [errorMessage, setErrorMessage] = useState<string | undefined>()
+  const [intentUrl, setIntentUrl] = useState<string | undefined>()
+  const [paymentStarted, setPaymentStarted] = useState(false)
+  const pollingRef = useRef(false)
+  const autoStartedRef = useRef(false)
+
+  const onPaymentCompleted = useCallback(async () => {
+    await placeOrder(cart.id).catch((err: unknown) => {
+      if (isNextRedirect(err)) {
+        throw err
+      }
+      setErrorMessage(
+        "Waiting for UPI confirmation. Tap “I’ve paid” after completing payment."
+      )
+    })
+  }, [cart.id])
+
+  const pollForOrder = useCallback(
+    async (showOverlay: boolean) => {
+      if (pollingRef.current) {
+        return
+      }
+      pollingRef.current = true
+      if (showOverlay) {
+        setSubmitting(true)
+      }
+      try {
+        const qrId = getRazorpayQrId(session.data)
+        for (let attempt = 0; attempt < POLL_ATTEMPTS; attempt++) {
+          const paid = qrId ? await getUpiQrPaid(qrId) : false
+          if (!paid) {
+            await sleep(POLL_INTERVAL_MS)
+            continue
+          }
+          try {
+            await onPaymentCompleted()
+          } catch (err: unknown) {
+            if (isNextRedirect(err)) {
+              throw err
+            }
+          }
+          await sleep(POLL_INTERVAL_MS)
+        }
+        setErrorMessage(
+          "UPI payment not confirmed yet. Complete the payment in your UPI app, then tap “I’ve paid”."
+        )
+      } finally {
+        pollingRef.current = false
+        setSubmitting(false)
+      }
+    },
+    [onPaymentCompleted, session.data]
+  )
+
+  useEffect(() => {
+    const onVisible = () => {
+      if (document.visibilityState === "visible" && intentUrl) {
+        void pollForOrder(true)
+      }
+    }
+    document.addEventListener("visibilitychange", onVisible)
+    return () => document.removeEventListener("visibilitychange", onVisible)
+  }, [intentUrl, pollForOrder])
+
+  const handlePayment = useCallback(async () => {
+    setErrorMessage(undefined)
+    setSubmitting(true)
+
+    const url = getUpiDeepLink(session.data)
+    const qrSrc = getDesktopUpiQrSrc(session.data)
+    try {
+      if (!url && !qrSrc) {
+        throw new Error(
+          "UPI QR was not created. Try 1-click UPI again, or ask Razorpay to enable UPI QR Codes on this account."
+        )
+      }
+      setPaymentStarted(true)
+      if (url) {
+        setIntentUrl(url)
+      }
+      if (isMobileUpiClient()) {
+        if (url) {
+          window.location.href = url
+        }
+        setSubmitting(false)
+        return
+      }
+      setSubmitting(false)
+      void pollForOrder(false)
+    } catch (err: unknown) {
+      if (isNextRedirect(err)) {
+        throw err
+      }
+      const message =
+        err instanceof Error ? err.message : "Could not start UPI payment"
+      setErrorMessage(message)
+      setSubmitting(false)
+    }
+  }, [pollForOrder, session.data])
+
+  useEffect(() => {
+    if (!autoStart || notReady || autoStartedRef.current) {
+      return
+    }
+    autoStartedRef.current = true
+    void handlePayment()
+  }, [autoStart, handlePayment, notReady])
+
+  const resolvedIntentUrl =
+    (intentUrl && /^upi:/i.test(intentUrl) ? intentUrl : undefined) ||
+    getUpiDeepLink(session.data)
+  const qrSrc =
+    (resolvedIntentUrl ? upiQrImageUrl(resolvedIntentUrl) : undefined) ||
+    getDesktopUpiQrSrc(session.data)
+  const isGeneratedQr = Boolean(resolvedIntentUrl)
+  const isMobile = isMobileUpiClient()
+  const showQr = Boolean(qrSrc) && (!isMobile || !resolvedIntentUrl)
+
+  return (
+    <div className="jewelry-checkout-upi">
+      {showQr && qrSrc ? (
+        <div className="jewelry-checkout-upi__qr">
+          <img
+            alt="Scan to pay with UPI"
+            src={qrSrc}
+            width={isGeneratedQr ? 320 : undefined}
+            height={isGeneratedQr ? 320 : undefined}
+            className={
+              isGeneratedQr
+                ? "jewelry-checkout-upi__qr-img jewelry-checkout-upi__qr-img--lg"
+                : "jewelry-checkout-upi__qr-img"
+            }
+          />
+          <p className="jewelry-checkout-upi__hint">
+            Scan with GPay, PhonePe, Paytm, or any UPI app
+          </p>
+          {resolvedIntentUrl ? (
+            <a href={resolvedIntentUrl} className="jewelry-checkout-upi__open-link">
+              Open in UPI app
+            </a>
+          ) : null}
+        </div>
+      ) : null}
+
+      <button
+        type="button"
+        disabled={submitting || notReady}
+        onClick={async (e) => {
+          e.preventDefault()
+          if (paymentStarted) {
+            await pollForOrder(true)
+            return
+          }
+          await handlePayment()
+        }}
+        className="checkout-page__btn checkout-page__btn--primary checkout-page__btn--block jewelry-checkout-payment__btn jewelry-checkout-payment__btn--upi"
+      >
+        {submitting
+          ? "Confirming…"
+          : showQr || paymentStarted
+            ? "I’ve paid"
+            : totalLabel
+              ? `Pay with 1-click UPI · ${totalLabel}`
+              : "Pay with 1-click UPI"}
+      </button>
+
+      {errorMessage && !submitting ? (
+        <p className="checkout-payment__error text-sm text-red-600 mt-2">
+          {errorMessage}
+        </p>
+      ) : null}
+    </div>
+  )
+}

package/src/upi-intent.ts

@@ -0,0 +1,99 @@
+export const RAZORPAY_UPI_PROVIDER_ID = "pp_razorpay_upi_razorpay_upi"
+
+export function asSessionData(data: unknown): Record<string, unknown> {
+  if (data && typeof data === "object" && !Array.isArray(data)) {
+    return data as Record<string, unknown>
+  }
+  return {}
+}
+
+function readString(
+  data: Record<string, unknown>,
+  key: string
+): string | undefined {
+  const value = data[key]
+  return typeof value === "string" && value.length > 0 ? value : undefined
+}
+
+function readInstrumentIntentUrl(
+  data: Record<string, unknown>
+): string | undefined {
+  const instrument = asSessionData(
+    data.instrumentResponse ?? data.instrument_response
+  )
+  const redirect = asSessionData(
+    instrument.redirectInfo ?? instrument.redirect_info
+  )
+  return (
+    readString(instrument, "intentUrl") ||
+    readString(instrument, "intent_url") ||
+    readString(redirect, "url")
+  )
+}
+
+function isRazorpayQrDownloadUrl(url: string): boolean {
+  return /(?:^https?:\/\/)?(?:www\.)?rzp\.io\//i.test(url)
+}
+
+export function getUpiIntentUrl(data: unknown): string | undefined {
+  const session = asSessionData(data)
+  const nested = asSessionData(session.data)
+  const candidates = [
+    readString(session, "upi_intent_url"),
+    readString(session, "image_content"),
+    readString(session, "payment_url"),
+    readInstrumentIntentUrl(session),
+    readString(nested, "upi_intent_url"),
+    readString(nested, "image_content"),
+    readString(nested, "payment_url"),
+    readInstrumentIntentUrl(nested),
+  ]
+  return (
+    candidates.find((url) => !!url && /^upi:/i.test(url)) ||
+    candidates.find((url) => !!url && !isRazorpayQrDownloadUrl(url))
+  )
+}
+
+export function getUpiDeepLink(data: unknown): string | undefined {
+  const url = getUpiIntentUrl(data)
+  return url && /^upi:/i.test(url) ? url : undefined
+}
+
+export function getRazorpayQrId(data: unknown): string | undefined {
+  const session = asSessionData(data)
+  const nested = asSessionData(session.data)
+  return readString(session, "qr_id") || readString(nested, "qr_id")
+}
+
+export function getRazorpayQrImageUrl(data: unknown): string | undefined {
+  const session = asSessionData(data)
+  const nested = asSessionData(session.data)
+  return readString(session, "image_url") || readString(nested, "image_url")
+}
+
+export function isUpiIntentFlow(data: unknown): boolean {
+  return readString(asSessionData(data), "flow") === "upi_intent"
+}
+
+export function isOneClickUpi(providerId?: string): boolean {
+  return !!providerId && providerId.includes("razorpay_upi")
+}
+
+export function isMobileUpiClient(): boolean {
+  if (typeof navigator === "undefined") {
+    return false
+  }
+  return /Android|iPhone|iPad|iPod/i.test(navigator.userAgent)
+}
+
+export function upiQrImageUrl(intentUrl: string): string {
+  return `https://api.qrserver.com/v1/create-qr-code/?size=320x320&ecc=M&margin=8&data=${encodeURIComponent(intentUrl)}`
+}
+
+export function getDesktopUpiQrSrc(data: unknown): string | undefined {
+  const deepLink = getUpiDeepLink(data)
+  if (deepLink) {
+    return upiQrImageUrl(deepLink)
+  }
+  return getRazorpayQrImageUrl(data)
+}

package/src/upi-qr-status.ts

@@ -0,0 +1,39 @@
+"use client"
+
+/**
+ * Poll Razorpay UPI QR payment status via Medusa store API.
+ * Uses publishable key only — same contract as medusa-payment-provider.
+ */
+export async function getUpiQrPaid(qrId: string): Promise<boolean> {
+  if (!qrId.startsWith("qr_")) {
+    return false
+  }
+
+  const base =
+    process.env.NEXT_PUBLIC_MEDUSA_BACKEND_URL ||
+    process.env.MEDUSA_BACKEND_URL ||
+    "http://localhost:9000"
+  const publishableKey = process.env.NEXT_PUBLIC_MEDUSA_PUBLISHABLE_KEY?.trim()
+
+  try {
+    const url = new URL("/store/upi-intent/status", base)
+    url.searchParams.set("qr_id", qrId)
+
+    const response = await fetch(url.toString(), {
+      method: "GET",
+      headers: publishableKey
+        ? { "x-publishable-api-key": publishableKey }
+        : undefined,
+      cache: "no-store",
+    })
+
+    if (!response.ok) {
+      return false
+    }
+
+    const result = (await response.json()) as { paid?: boolean }
+    return result.paid === true
+  } catch {
+    return false
+  }
+}