Skip to main content
Use the onCompletion callback to react when a payment succeeds, fails, or the checkout is dismissed.

Basic usage

struct CheckoutView: View {
  let clientToken: String
  @State private var paymentCompleted = false
  @State private var paymentResult: PaymentResult?

  var body: some View {
    if paymentCompleted, let result = paymentResult {
      ConfirmationView(result: result)
    } else {
      PrimerCheckout(
        clientToken: clientToken,
        onCompletion: { state in
          switch state {
          case .success(let result):
            paymentResult = result
            paymentCompleted = true
          case .failure(let error):
            // Error is displayed in the checkout UI
            print("Payment failed: \(error.errorId)")
          case .dismissed:
            // User dismissed the checkout
            break
          default:
            break
          }
        }
      )
    }
  }
}

With NavigationStack

struct CheckoutView: View {
  let clientToken: String
  @State private var path = NavigationPath()

  var body: some View {
    NavigationStack(path: $path) {
      PrimerCheckout(
        clientToken: clientToken,
        onCompletion: { state in
          if case .success(let result) = state {
            path.append(result)
          }
        }
      )
      .navigationDestination(for: PaymentResult.self) { result in
        ConfirmationView(result: result)
      }
    }
  }
}

See also

Show success message

Display a custom success UI

SwiftUI navigation

Navigation patterns for checkout