fix: Use await on addListener (#658)

Author: jcesarmobile

src/pages/App.tsx

@@ -29,35 +29,39 @@ const AppPage: React.FC = () => {
   let restoredResultHandler: PluginListenerHandle;
 
   useIonViewDidEnter(() => {
-    stateChangeHandler = App.addListener(
+    setListeners();
+
+    getLaunchUrl();
+  });
+
+  const setListeners = async () => {
+    stateChangeHandler = await App.addListener(
       'appStateChange',
       (state: AppState) => {
         console.log('App state changed', state);
       },
     );
 
-    pauseHandler = App.addListener('pause', async () => {
+    pauseHandler = await App.addListener('pause', async () => {
       console.log('App paused');
     });
 
-    resumeHandler = App.addListener('resume', () => {
+    resumeHandler = await App.addListener('resume', () => {
       console.log('App resumed');
     });
 
-    urlOpenHandler = App.addListener('appUrlOpen', (data: any) => {
+    urlOpenHandler = await App.addListener('appUrlOpen', (data: any) => {
       alert('APP URL OPEN: ' + data.url);
     });
 
-    restoredResultHandler = App.addListener(
+    restoredResultHandler = await App.addListener(
       'appRestoredResult',
       (data: any) => {
         alert('Got restored result');
         console.log('Restored result:', data);
       },
     );
-
-    getLaunchUrl();
-  });
+  };
 
   const getLaunchUrl = async () => {
     const ret = await App.getLaunchUrl();

src/pages/Browser.tsx

@@ -28,7 +28,7 @@ const BrowserPage: React.FC = () => {
 
   const autoCloseAfterDelay = async () => {
     loadedHandler?.remove();
-    loadedHandler = Browser.addListener('browserPageLoaded', async () => {
+    loadedHandler = await Browser.addListener('browserPageLoaded', async () => {
       await timeout(1000);
       await Browser.close();
       await timeout(200);
@@ -37,12 +37,14 @@ const BrowserPage: React.FC = () => {
   };
 
   useIonViewDidEnter(() => {
-    finishedHandler = Browser.addListener('browserFinished', async () => {
+    setListeners();
+  });
+  const setListeners = async () => {
+    finishedHandler = await Browser.addListener('browserFinished', async () => {
       await timeout(200);
       alert(`You closed the window`);
     });
-  });
-
+  };
   useIonViewDidLeave(() => {
     finishedHandler?.remove();
     loadedHandler?.remove();

src/pages/Keyboard.tsx

@@ -23,13 +23,17 @@ const KeyboardPage: React.FC = () => {
   let scrollEnabled = true;
 
   useIonViewDidEnter(() => {
-    showHandler = Keyboard.addListener('keyboardWillShow', info => {
+    setListeners();
+  });
+
+  const setListeners = async () => {
+    showHandler = await Keyboard.addListener('keyboardWillShow', info => {
       console.log('keyboard show', info);
     });
-    hideHandler = Keyboard.addListener('keyboardWillHide', () => {
+    hideHandler = await Keyboard.addListener('keyboardWillHide', () => {
       console.log('keyboard hide');
     });
-  });
+  };
 
   useIonViewDidLeave(() => {
     hideHandler.remove();

src/pages/Network.tsx

@@ -33,7 +33,11 @@ class NetworkPage extends React.Component<{}, NetworkPageState> {
 
   ionViewDidEnter() {
     this.updateNetworkStatus();
-    const handler = Network?.addListener(
+    this.setListeners();
+  }
+
+  setListeners = async () => {
+    const handler = await Network?.addListener(
       'networkStatusChange',
       (status: ConnectionStatus) => {
         this.setState({
@@ -42,7 +46,7 @@ class NetworkPage extends React.Component<{}, NetworkPageState> {
       },
     );
     this.setState({ handler: handler });
-  }
+  };
 
   ionViewDidLeave() {
     this.state.handler?.remove();

src/pages/ScreenReader.tsx

@@ -24,10 +24,14 @@ const ScreenReaderPage: React.FC = () => {
   const [sentence, setSentence] = useState('Hello World?');
 
   useIonViewDidEnter(() => {
-    handler = ScreenReader.addListener('stateChange', ({ value }: any) =>
+    setListeners();
+  });
+
+  const setListeners = async () => {
+    handler = await ScreenReader.addListener('stateChange', ({ value }: any) =>
       alert(`State Change! Screen Reader on? ${value}`),
     );
-  });
+  };
 
   useIonViewDidLeave(() => {
     handler.remove();