This commit is contained in:
Akinwale Ariwodola 2019-05-03 19:32:39 +01:00
commit f1393ae707
4 changed files with 35 additions and 8 deletions

View file

@ -28,12 +28,15 @@ class CustomRewardCard extends React.PureComponent<Props> {
} }
onClaimPress = () => { onClaimPress = () => {
const { canClaim, notify, submitRewardCode } = this.props; const { canClaim, notify, showVerification, submitRewardCode } = this.props;
const { rewardCode } = this.state; const { rewardCode } = this.state;
Keyboard.dismiss(); Keyboard.dismiss();
if (!canClaim) { if (!canClaim) {
if (showVerification) {
showVerification();
}
notify({ message: 'Unfortunately, you are not eligible to claim this reward at this time.' }); notify({ message: 'Unfortunately, you are not eligible to claim this reward at this time.' });
return; return;
} }

View file

@ -44,10 +44,14 @@ class RewardCard extends React.PureComponent<Props> {
canClaim, canClaim,
claimReward, claimReward,
notify, notify,
reward reward,
showVerification
} = this.props; } = this.props;
if (!canClaim) { if (!canClaim) {
if (showVerification) {
showVerification();
}
notify({ message: 'Unfortunately, you are not eligible to claim this reward at this time.' }); notify({ message: 'Unfortunately, you are not eligible to claim this reward at this time.' });
return; return;
} }

View file

@ -44,6 +44,13 @@ class RewardSummary extends React.Component {
}); });
} }
handleSummaryPressed = () => {
const { showVerification } = this.props;
if (showVerification) {
showVerification();
}
}
render() { render() {
const { fetching, navigation, unclaimedRewardAmount, user } = this.props; const { fetching, navigation, unclaimedRewardAmount, user } = this.props;
@ -59,7 +66,7 @@ class RewardSummary extends React.Component {
} }
return ( return (
<View style={rewardStyle.summaryContainer}> <TouchableOpacity style={rewardStyle.summaryContainer} onPress={this.handleSummaryPressed}>
<View style={rewardStyle.summaryRow}> <View style={rewardStyle.summaryRow}>
<Icon name="award" size={36} color={Colors.White} /> <Icon name="award" size={36} color={Colors.White} />
<Text style={rewardStyle.summaryText}> <Text style={rewardStyle.summaryText}>
@ -67,7 +74,7 @@ class RewardSummary extends React.Component {
</Text> </Text>
</View> </View>
<Button style={rewardStyle.dismissButton} theme={"light"} text={"Dismiss"} onPress={this.onDismissPressed} /> <Button style={rewardStyle.dismissButton} theme={"light"} text={"Dismiss"} onPress={this.onDismissPressed} />
</View> </TouchableOpacity>
); );
} }
} }

View file

@ -24,8 +24,11 @@ class RewardsPage extends React.PureComponent {
isIdentityVerified: false, isIdentityVerified: false,
isRewardApproved: false, isRewardApproved: false,
verifyRequestStarted: false, verifyRequestStarted: false,
revealVerification: false
}; };
scrollView = null;
componentDidMount() { componentDidMount() {
const { fetchRewards, pushDrawerStack, navigation, user } = this.props; const { fetchRewards, pushDrawerStack, navigation, user } = this.props;
@ -73,7 +76,7 @@ class RewardsPage extends React.PureComponent {
<Text style={rewardStyle.title}>Humans Only</Text> <Text style={rewardStyle.title}>Humans Only</Text>
<Text style={rewardStyle.text}>Rewards are for human beings only. You'll have to prove you're one of us before you can claim any rewards.</Text> <Text style={rewardStyle.text}>Rewards are for human beings only. You'll have to prove you're one of us before you can claim any rewards.</Text>
{!this.state.isEmailVerified && <EmailRewardSubcard />} {!this.state.isEmailVerified && <EmailRewardSubcard />}
{!this.state.isIdentityVerified && <PhoneNumberRewardSubcard />} {this.state.isEmailVerified && !this.state.isIdentityVerified && <PhoneNumberRewardSubcard />}
</View> </View>
); );
} }
@ -115,10 +118,11 @@ class RewardsPage extends React.PureComponent {
return ( return (
<View> <View>
{unclaimedRewards.map(reward => <RewardCard key={reward.reward_type} {unclaimedRewards.map(reward => <RewardCard key={reward.reward_type}
showVerification={this.showVerification}
canClaim={!isNotEligible} canClaim={!isNotEligible}
reward={reward} reward={reward}
reward_type={reward.reward_type} />)} reward_type={reward.reward_type} />)}
<CustomRewardCard canClaim={!isNotEligible} /> <CustomRewardCard canClaim={!isNotEligible} showVerification={this.showVerification} />
</View> </View>
); );
} }
@ -135,6 +139,14 @@ class RewardsPage extends React.PureComponent {
} }
} }
showVerification = () => {
this.setState({ revealVerification: true }, () => {
if (this.scrollView) {
this.scrollView.scrollTo({ x: 0, y: 0, animated: true });
}
});
}
render() { render() {
const { user, navigation } = this.props; const { user, navigation } = this.props;
@ -142,11 +154,12 @@ class RewardsPage extends React.PureComponent {
<View style={rewardStyle.container}> <View style={rewardStyle.container}>
<UriBar navigation={navigation} /> <UriBar navigation={navigation} />
<ScrollView <ScrollView
ref={ref => this.scrollView = ref}
keyboardShouldPersistTaps={'handled'} keyboardShouldPersistTaps={'handled'}
style={rewardStyle.scrollContainer} style={rewardStyle.scrollContainer}
contentContainerStyle={rewardStyle.scrollContentContainer}> contentContainerStyle={rewardStyle.scrollContentContainer}>
<RewardSummary navigation={navigation} /> <RewardSummary navigation={navigation} showVerification={this.showVerification} />
{this.renderVerification()} {this.state.revealVerification && this.renderVerification()}
{this.renderUnclaimedRewards()} {this.renderUnclaimedRewards()}
{this.renderClaimedRewards()} {this.renderClaimedRewards()}
</ScrollView> </ScrollView>