Skip to main content

Documentation Index

Fetch the complete documentation index at: https://dev.moonpay.com/llms.txt

Use this file to discover all available pages before exploring further.

Render the Google Pay frame in your app and initiate a transaction with a quote signature. The quote must have executable: true. The provider mounts the frame as a react-native-webview.
Setup Google Pay
import {
  useMoonPay,
  type GooglePayEvent,
} from "@moonpay/platform-sdk-react-native";

export function GooglePayScreen({
  quoteSignature,
}: {
  quoteSignature: string;
}) {
  const { client } = useMoonPay();

  const start = async () => {
    const googlePayResult = await client.setupGooglePay({
      quote: quoteSignature,
      onEvent: (event: GooglePayEvent) => {
        switch (event.kind) {
          case "ready":
            break;
          case "complete":
            console.log(event.payload.transaction);
            break;
          case "quoteExpired":
            // Fetch a new quote, then update the frame:
            // event.payload.setQuote(newQuote.signature);
            break;
          case "challenge":
            // Render the challenge frame at the provided URL
            // See: /platform/guides/handling-challenges
            console.log(event.payload.url);
            break;
          case "error":
            console.error(event.payload.kind, event.payload.message);
            break;
          case "unsupported":
            // Google Pay isn't available in this environment — fall back to another method.
            break;
        }
      },
    });

    if (!googlePayResult.ok) {
      // Handle error
      console.error(googlePayResult.error.kind, googlePayResult.error.message);
      return;
    }

    const googlePay = googlePayResult.value;
  };

  // ...
}

​
Parameters

PropertyTypeRequiredDescription
quotestring✅The quote signature returned from getQuote.
externalTransactionIdstringPartner-assigned identifier for this transaction attempt. Useful for reconciliation.
onEvent(event: GooglePayEvent) => voidCallback invoked for Google Pay flow events. See GooglePayEvent.
This method does not require a separate auth token. The client uses stored credentials from an active connection.

​
GooglePayEvent

onEvent receives events as the Google Pay flow progresses. Use event.kind to decide how to handle each event.
kindPayloadWhen you receive it
"ready"—The Google Pay UI is rendered and ready to be shown.
"complete"{ transaction: FrameTransaction }The Google Pay flow finished. Inspect the FrameTransaction for the outcome.
"challenge"{ kind: "frame"; url: string }Verification required. Render the challenge frame at the provided URL using setupChallenge().
"quoteExpired"{ setQuote: (signature: string) => void }The quote signature expired. Fetch a new quote and call payload.setQuote(...).
"error"GooglePayEventErrorThe flow encountered an error.
"unsupported"—Google Pay isn’t available in the user’s current environment.

​
FrameTransaction

The transaction object returned on "complete". FrameTransaction is a discriminated union — the failure variant carries failureReason, the non-failure variant always carries id.
FieldTypeRequiredDescription
statusstring✅The transaction status. On the failure variant, "failed".
idstringRequired on the non-failure variant; optional when status is "failed" (a transaction may not exist yet on early failure).
failureReasonstringPresent only on the failure variant (status === "failed").

​
GooglePayEventError

FieldTypeRequiredDescription
kind"configurationError" | "invalidQuote" | "quoteExpired" | "genericError"✅The error category.
messagestring✅Developer-friendly details.
Google Pay unavailability is signalled separately through the "unsupported" event, not as an error.

​
Result

client.setupGooglePay() returns a Result<GooglePayFrame, SetupGooglePayError>.

​
Result envelope

Result<GooglePayFrame, SetupGooglePayError>
FieldTypeRequiredDescription
okboolean✅Whether the operation succeeded.
valueGooglePayFramePresent when ok is true.
errorSetupGooglePayErrorPresent when ok is false.

​
GooglePayFrame

FieldTypeRequiredDescription
setQuote(signature: string) => void✅Updates the quote signature used by the frame. Use this in response to quoteExpired.
dispose() => void✅Unmounts the frame. After you call this, no further events are dispatched to your onEvent callback.

​
SetupGooglePayError

FieldTypeRequiredDescription
kind"invalidQuote" | "quoteExpired" | "googlePayUnavailable" | "genericError"✅The error category.
messagestring✅Developer-friendly details.
types.ts
type GooglePayFrame = {
  setQuote: (signature: string) => void;
  dispose: () => void;
};

type FrameTransaction =
  | { id: string; status: string }
  | { id?: string; status: "failed"; failureReason: string };

type GooglePayEvent =
  | { kind: "ready" }
  | {
      kind: "complete";
      payload: { transaction: FrameTransaction };
    }
  | {
      kind: "challenge";
      payload: {
        kind: "frame";
        /** Fully-formed URL to pass directly to setupChallenge(). */
        url: string;
      };
    }
  | {
      kind: "quoteExpired";
      payload: { setQuote: (signature: string) => void };
    }
  | { kind: "error"; payload: GooglePayEventError }
  | { kind: "unsupported" };

type GooglePayEventError = {
  kind: "configurationError" | "invalidQuote" | "quoteExpired" | "genericError";
  message: string;
};

type SetupGooglePayError = {
  kind:
    | "invalidQuote"
    | "quoteExpired"
    | "googlePayUnavailable"
    | "genericError";
  message: string;
};