✨ Add pull to refresh in Proof

src/modules/membership/MembershipContainer.js

@@ -56,6 +56,7 @@ class MembershipContainer extends Component {
       return (
         <ProofContainer
           user={this.props.user}
+          isFetchingUserData={this.props.isFetchingUserData}
           isAuthenticated={this.props.isAuthenticated}
           userToken={this.state.userToken}
           fetchUser={this.fetchUser}

src/modules/membership/Proof.js

@@ -1,5 +1,5 @@
-import React, { useEffect, useState, useRef } from 'react';
-import { Image, ScrollView, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
+import React, { useEffect, useRef } from 'react';
+import { Image, ScrollView, StyleSheet, Text, TouchableOpacity, View, RefreshControl } from 'react-native';
 import { Button, Text as NBText, Spinner } from 'native-base';
 import Confetti from 'react-native-confetti';
 
@@ -121,6 +121,8 @@ const MembershipName = ({ user }) => {
 const Proof = ({
   chargeError,
   user,
+  fetchUser,
+  isFetchingUserData,
   isChargingMembership,
   isLoadingMembershipType,
   membershipPrice,
@@ -128,7 +130,6 @@ const Proof = ({
   onLogoutPress,
 }) => {
   const CONFETTI_TIMEOUT = 15000;
-
   const confettiRef = useRef(null);
 
   useEffect(() => {
@@ -151,7 +152,7 @@ const Proof = ({
   return (
     <View>
       <UserConfetti user={user} confettiRef={confettiRef} />
-      <ScrollView>
+      <ScrollView refreshControl={<RefreshControl refreshing={isFetchingUserData} onRefresh={fetchUser} />}>
         <View style={[styles.card, { paddingVertical: 16 }]}>
           <MembershipName user={user} />
           <Logo user={user} />

src/modules/membership/ProofContainer.js

@@ -13,13 +13,6 @@ stripe.setOptions({
 });
 
 class ProofContainer extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      refreshing: false,
-    };
-  }
-
   getPrice(membershipTypes) {
     if (!membershipTypes) {
       return 0;
@@ -31,8 +24,9 @@ class ProofContainer extends Component {
   render() {
     return (
       <Proof
-        {...this.state}
         user={this.props.user}
+        fetchUser={this.props.fetchUser}
+        isFetchingUserData={this.props.isFetchingUserData}
         isChargingMembership={this.props.isChargingMembership}
         isLoadingMembershipType={this.props.data.loading}
         chargeError={this.props.chargeError ? this.props.chargeError : ''}