Automatically approve the transaction request from app

src/screens/ApproveTransfer.tsx

@@ -2,7 +2,6 @@ import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { Image, ScrollView, View } from 'react-native';
 import {
   ActivityIndicator,
-  Button,
   Text,
   Appbar,
   TextInput,
@@ -41,6 +40,8 @@ import { COSMOS, EIP155, IS_NUMBER_REGEX } from '../utils/constants';
 import TxErrorDialog from '../components/TxErrorDialog';
 import { EIP155_SIGNING_METHODS } from '../utils/wallet-connect/EIP155Data';
 import { COSMOS_METHODS } from '../utils/wallet-connect/COSMOSData';
+import { Button } from '@mui/material';
+import { LoadingButton } from '@mui/lab';
 
 export const MEMO = 'Sending signed tx from Laconic Wallet';
 // Reference: https://ethereum.org/en/developers/docs/gas/#what-is-gas-limit
@@ -708,17 +709,18 @@ const ApproveTransfer = ({ route }: ApproveTransferProps) => {
             )}
           </ScrollView>
           <View style={styles.buttonContainer}>
-            <Button
-              mode="contained"
-              onPress={acceptRequestHandler}
+            <LoadingButton
+              variant="contained"
+              onClick={acceptRequestHandler}
               loading={isTxLoading}
-              disabled={!balance || !fees}>
+              disabled={!balance || !fees}
+              id="approve-transaction-button">
               {isTxLoading ? 'Processing' : 'Yes'}
-            </Button>
+            </LoadingButton>
             <Button
-              mode="contained"
-              onPress={rejectRequestHandler}
-              buttonColor="#B82B0D">
+              variant="contained"
+              onClick={rejectRequestHandler}
+              color="error">
               No
             </Button>
           </View>