initialize error even after successfully resolved

[vivekvardhanadepu]

when I call discoverReaders(or any lib function), it gives First initialize the Stripe Terminal SDK before performing any action

Device: android 12 emulator

To reproduce, Add discoverReaders({ discoveryMethod: 'bluetoothScan', simulated: true }); at line 124 in App.tsx

[billfinn-stripe]

Hi @vivekvardhanadepu -- did you call the initialize function returned from useStripeTerminal ? Do you see the same behavior in the example application?

[vivekvardhanadepu]

Hi @vivekvardhanadepu -- did you call the initialize function returned from useStripeTerminal ? Do you see the same behavior in the example application?

Yes. I have already mentioned the steps to reproduce in the example-app in the above comment

[vivekvardhanadepu]

@billfinn-stripe same is the case with cancelCollectPaymentMethod function call

[billfinn-stripe]

Hi @vivekvardhanadepu -- please follow the pattern in the example app and/or provide a code snippet that exhibits the failure. Unmodified, the example app does not exhibit this problem.

In the future, please fill out the provided template when filling out a bug report.

[vivekvardhanadepu]

Hi @vivekvardhanadepu -- please follow the pattern in the example app and/or provide a code snippet that exhibits the failure. Unmodified, the example app does not exhibit this problem.

In the future, please fill out the provided template when filling out a bug report.

In the example, different screens are used for discovery, connection, payment, etc. But, not everyone does that. We are using the same screen for discovery, connection and payment. So, after initialize is resolved successfully, we are calling discoverReaders like

    initialize()
          .then(({reader, error: err}) => {
            if (err) {
              throw err;
            }
            discoverReaders({ discoveryMethod: 'bluetoothScan', simulated: true });
          })
          .catch(err => {
            ShowError(
              err?.message || 'Cannot display readers. Please try again',
            );
          });
      })

which is throwing First initialize the Stripe Terminal SDK before performing any action

If you want to reproduce it in the example app: Add discoverReaders({ discoveryMethod: 'bluetoothScan', simulated: true }); at line 124 in App.tsx

[billfinn-stripe]

@vivekvardhanadepu -- the isInitialized state update happens asynchronously. Can you put the discovery in a separate useEffect hook (or componentDidUpdate method)? The following patch seems to achieve what you're looking to do, using the example app:

diff --git a/example-app/src/App.tsx b/example-app/src/App.tsx
index 1a5bde2..d374849 100644
--- a/example-app/src/App.tsx
+++ b/example-app/src/App.tsx
@@ -101,7 +101,11 @@ export default function App() {
   const [logs, setlogs] = useState<Log[]>([]);
   const [hasPerms, setHasPerms] = useState<boolean>(false);
   const clearLogs = useCallback(() => setlogs([]), []);
-  const { initialize: initStripe } = useStripeTerminal();
+  const {
+    initialize: initStripe,
+    isInitialized,
+    discoverReaders,
+  } = useStripeTerminal();
 
   useEffect(() => {
     const initAndClear = async () => {
@@ -127,6 +131,12 @@ export default function App() {
     }
   }, [initStripe, hasPerms]);
 
+  useEffect(() => {
+    if (isInitialized) {
+      discoverReaders({ discoveryMethod: 'bluetoothScan', simulated: true });
+    }
+  }, [isInitialized, discoverReaders]);
+
   const handlePermissionsSuccess = useCallback(async () => {
     setHasPerms(true);
   }, []);

[vivekvardhanadepu]

@billfinn-stripe Yeah. This worked for discoverReaders, but, cancelCollectPaymentMethod is still throwing the same error. I am calling cancelCollectPaymentMethod while payment is in progress, which means discoverReaders is already called, implies, it is already initialized

[vivekvardhanadepu]

@billfinn-stripe were you able to reproduce the issue?

[vivekvardhanadepu]

@vivekvardhanadepu -- the isInitialized state update happens asynchronously. Can you put the discovery in a separate useEffect hook (or componentDidUpdate method)? The following patch seems to achieve what you're looking to do, using the example app:

diff --git a/example-app/src/App.tsx b/example-app/src/App.tsx
index 1a5bde2..d374849 100644
--- a/example-app/src/App.tsx
+++ b/example-app/src/App.tsx
@@ -101,7 +101,11 @@ export default function App() {
   const [logs, setlogs] = useState<Log[]>([]);
   const [hasPerms, setHasPerms] = useState<boolean>(false);
   const clearLogs = useCallback(() => setlogs([]), []);
-  const { initialize: initStripe } = useStripeTerminal();
+  const {
+    initialize: initStripe,
+    isInitialized,
+    discoverReaders,
+  } = useStripeTerminal();
 
   useEffect(() => {
     const initAndClear = async () => {
@@ -127,6 +131,12 @@ export default function App() {
     }
   }, [initStripe, hasPerms]);
 
+  useEffect(() => {
+    if (isInitialized) {
+      discoverReaders({ discoveryMethod: 'bluetoothScan', simulated: true });
+    }
+  }, [isInitialized, discoverReaders]);
+
   const handlePermissionsSuccess = useCallback(async () => {
     setHasPerms(true);
   }, []);

if I call cancelCollectPaymentMethod just before discoverReaders, it is not throwing First initialize the Stripe Terminal SDK before performing any action. I have logged isInitialized inside useEffect like so

useEffect(()=>{
    console.log("isinit", isInitialized);
  }, [isInitialized])

As you can see below, isInitialized is not false after once initialized

[billfinn-stripe]

if I call cancelCollectPaymentMethod just before discoverReaders

Why are you calling cancelCollectPaymentMethod before discovering readers? Can you elaborate on your use case here?

were you able to reproduce the issue?

No, I have not been able to reproduce the issue. Can you supply a patch that exposes the issue in the example application?

[vivekvardhanadepu]

Why are you calling cancelCollectPaymentMethod before discovering readers? Can you elaborate on your use case here?

It is not how we are calling cancelCollectPaymentMethod. I wanted to see if it is throwing the same err just after initialisation. I have already mentioned how we are calling cancelCollectPaymentMethod.

@billfinn-stripe Yeah. This worked for discoverReaders, but, cancelCollectPaymentMethod is still throwing the same error. I am calling cancelCollectPaymentMethod while payment is in progress, which means discoverReaders is already called, implies, it is already initialised Could you please read all the comments so that you have a better idea?

No, I have not been able to reproduce the issue. Can you supply a patch that exposes the issue in the example application?

Like I said before, keeping all the processes(discovery, connection, payment) in one screen would trigger the issue. Similar to what is done here https://github.com/theopolisme/react-native-stripe-terminal/blob/master/Example/App.js . Additionally, you just have to call cancelCollectPaymentMethod after calling collectPaymentMethod Still if you are not able to reproduce the issue, I should provide you a patch in a couple of days

[vatsal-gadhiya-searce]

@billfinn-stripe Any update on this? Are you able to reproduce the issue? By calling cancelCollectPaymentMethod?

[billfinn-stripe]

Hi @vatsal-gadhiya-searce -- per your comment:

Still if you are not able to reproduce the issue, I should provide you a patch in a couple of days

Do you have a patch we can apply to the example app to reproduce the issue?

[billfinn-stripe]

Closing this due to inactivity. Feel free to reopen or create a new issue if your issue has not been addressed.