Add scroll to pairing modal (#60)

* Add scrolling to pairing modal

* Set wallet connect state empty before populating

---------

Co-authored-by: Adw8 <adwait@deepstacksoft.com>

src/components/PairingModal.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react';
-import { Image, View, Modal } from 'react-native';
+import { Image, View, Modal, ScrollView } from 'react-native';
 import { Button, Text } from 'react-native-paper';
 
 import { SessionTypes } from '@walletconnect/types';
@@ -39,6 +39,11 @@ const PairingModal = ({
     }
     const { params } = currentProposal;
     const { requiredNamespaces } = params;
+    setWalletConnectData({
+      walletConnectMethods: [],
+      walletConnectEvents: [],
+      walletConnectChains: [],
+    });
     Object.keys(requiredNamespaces).forEach(key => {
       switch (key) {
         case 'eip155':
@@ -176,8 +181,10 @@ const PairingModal = ({
 
   return (
     <Modal visible={visible} animationType="slide" transparent>
-      <View style={styles.container}>
+      <View style={{ flex: 1 }}>
         <View style={styles.modalContentContainer}>
+          <ScrollView showsVerticalScrollIndicator={true}>
+            <View style={styles.container}>
               {icon && (
                 <Image
                   style={styles.dappLogo}
@@ -218,6 +225,8 @@ const PairingModal = ({
                 </Button>
               </View>
             </View>
+          </ScrollView>
+        </View>
       </View>
     </Modal>
   );

src/styles/stylesheet.js

@@ -150,6 +150,7 @@ const styles = StyleSheet.create({
     flex: 1,
     alignItems: 'center',
     justifyContent: 'center',
+    marginBottom: 10,
   },
   modalContentContainer: {
     display: 'flex',