stripe / stripe-terminal-react-native

React Native SDK for Stripe Terminal
https://stripe.com/docs/terminal/payments/setup-integration?terminal-sdk-platform=react-native
MIT License
110 stars 50 forks source link

Remove the need to wrap up the whole app in the StripeTerminalProvider component #838

Open marcinnexudus opened 1 week ago

marcinnexudus commented 1 week ago

Is your feature request related to a problem? Please describe. Can we remove the need to wrap the top level App component with the StripeTerminalProvider? Our app supports a number of payment providers. It is only at a certain screen, later in the flow, that an administrator chooses which payment provider they have a reader/terminal for (Stripe or other). Furthermore, it is then a few screens later that the functionality of collecting a payment would be needed. For that reason, wrapping the app at the top level in the StripeTerminalProvider wrapper is not really feasible for us.

Describe the solution you'd like The possibility to initiate the stripe-terminal-react-native SDK at any point in the app without the need of wrapping the app in the StripeTerminalProvider. Alternatively, could you suggest a solution where the StripeTerminalProvider component only wraps up a portion of the app (eg. one screen or one navigator) not at the top App.tsx level. Describe alternatives you've considered Alternatively, is there a way to provide a flag to the StripeTerminalProvider that wraps up the App component that would be in a completely disabled state, having no possible interference on the app (in case a customer is not using the Stripe readers at all)? The token would have to be provided at a later stage in the app when an administrator chooses Stripe as the payment provider they use.

Additional context Our usual app flow would be as follows: The App starts:

  1. A few screens related to an admin authentication (we don't know at this point if a particular business has Stripe or any other reader). ...
  2. PaymentProviderSelectorScreen (here an admin would choose Stripe, so the Stripe SDK can be initialised and it'd go to the next screen, which the customers would be facing.
  3. CustomersProductsScreen (customer chooses a product and goes to the CheckoutScreen)
  4. CheckoutScreen - here a customer would tap the Pay button to initialise the payment collection with Stripe.

Please advise. Thank you in advance.

marcinnexudus commented 1 week ago

I've solved it wrapping a nested navigator in the StripeTerminalProvider component (+ some conditional statements). Still, could you consider changing this functionality.

On a related note, where would be the best place to ask questions / seek advice on the react native app implementation (whenever it's not a bug or a feature request)? @csanghvi-stripe @nazli-stripe

nazli-stripe commented 1 day ago

@marcinnexudus we don't currently have the bandwidth to implement this, but will keep in mind for the future.

You can still create issues here for general advice questions and community discussions.