Error in createPlatformPayPaymentMethod: Attempt to present <PKPaymentAuthorizationViewController: 0x1357b87c0> on <UIViewController: 0x135784bd0> (from <UIViewController: 0x135784bd0>) whose view is not in the window hierarchy.

[TheoNikos]

I try to set apple pay as payment method in my react native app. I use initStripe like this:

const STRIPE_CONFIG_GR = {
  publishableKey: "...",
  merchantIdentifier: "...",
};
useEffect(() => {
      /* S T R I P E  S E T U P */
      initStripe(
        STRIPE_CONFIG_GR
      );
    }
  }, []);

The issue that the createPlatformPayPaymentMethod fails, but with no error. I know that it fails there because of various logs that I placed. The only thing that i can see in the console is: Attempt to present <PKPaymentAuthorizationViewController: 0x1357b87c0> on <UIViewController: 0x135784bd0> (from <UIViewController: 0x135784bd0>) whose view is not in the window hierarchy. Could it be that i have configured something wrong in my xcode? I also tried to implement it with StripeProvider with no luck. I cannot remove createPlatformPayPaymentMethod because the backend needs the payment method id to provide a client secret.

The versions that I use are: react-native: 0.77.1 @stripe/stripe-react-native: 0.41.0, xcode: 16.2 ios simulator: 18.2

import React, { useState, useEffect, useContext } from "react";
import { TouchableOpacity, Image, Platform } from "react-native";
import { styles } from "./styles";
import { confirmPlatformPayPayment, usePlatformPay } from "@stripe/stripe-react-native";
import useAnalyticsCustomEvent from "../../services/customHooks/useAnalyticsCustomEvent";
import UserContext from "../../services/contexts/UserContext";

function GoogleORApplePay({ postCard, onPress = () => {} }) {
  const { isPlatformPaySupported, createPlatformPayPaymentMethod } =
    usePlatformPay();
  
  const [isSupported, setIsSupported] = useState(false);
  const [analyticsCustomEvent] = useAnalyticsCustomEvent();
  const userContext = useContext(UserContext);

  useEffect(() => {
    if (Platform.OS === "ios") {
      isPlatformPaySupported({ applePay: {} }).then(res => setIsSupported(res));
    } else {
      isPlatformPaySupported({ googlePay: {} }).then(res => setIsSupported(res));
    }
  }, [isPlatformPaySupported]);

  async function platformPayPressed() {
    console.log("Entered function", isSupported)
    // Google analytics
    analyticsCustomEvent({
      screen: "AddCardScreen",
      element: Platform.OS === "ios" ? "ApplePay" : "GooglePay",
      action: "press",
    });
    const presentRes = await createPlatformPayPaymentMethod({
      applePay:{
        cartItems: [{ label: "label", amount: "0.1", paymentType: "Immediate" }],
        merchantCountryCode: userContext?.countryCode,
        currencyCode: "EUR",
      },
      googlePay:{
        testEnv:false,
        merchantName: 'PPC Blue',
        merchantCountryCode: userContext?.countryCode,
      }
    });
        
    if (presentRes?.paymentMethod?.id) {
      const apiRes = await postCard(presentRes?.paymentMethod?.id, Platform.OS === "ios" ? "ApplePay" : "GooglePay");
      
      if (apiRes?.payment_intent?.client_secret) {
        await confirmPlatformPayPayment(apiRes.payment_intent.client_secret, { applePay:{}, googlePay:{} });
      }
    }
  }
  if (!isSupported) return null;
  return (
    <>
      <TouchableOpacity
        style={styles.button}
        onPress={() => {
          onPress();
          platformPayPressed();
        }}
      >
        {Platform.OS === "ios" ? (
          <Image
            style={styles.logo}
            source={require("../../../assets/apple-pay.png")}
          />
        ) : (
          <Image
            style={styles.logo}
            source={require("../../../assets/google-pay.png")}
          />
        )}
      </TouchableOpacity>
    </>
  );
}

export default GoogleORApplePay;

Update: If I skip the createPlatformPayPaymentMethod step and call directly confirmPlatformPayPayment with the same arguments (cartItems, etc.), the apple pay popup is displayed on the screen. But I need the createPlatformPayPaymentMethod to get the client secret.