iVGyMHgw

1import React from 'react';
2import Rave from 'react-native-rave';
3import { StyleSheet, Text, View } from 'react-native';
4
5export default class PaymentScreen extends React.Component {
6  static navigationOptions = {
7    component: PaymentScreen,
8    title: 'Rave Payment'
9  };
10
11  constructor(props) {
12    super(props);
13    this.onSuccess = this.onSuccess.bind(this);
14    this.onFailure = this.onFailure.bind(this);
15    this.state = {
16      price: this.props.navigation.state.params.price,
17      product: this.props.navigation.state.params.product,
18      firstname: this.props.navigation.state.params.firstname,
19      lastname: this.props.navigation.state.params.lastname,
20      email: this.props.navigation.state.params.email,
21    };
22  }
23
24  onSuccess(data) {
25    console.log("success", data);
26
27  }
28
29  onFailure(data) {
30    console.log("error", data);
31  }
32
33  render() {
34    let itemAmount; 
35    itemAmount = this.state.price.substring(1);
36    
37    return ( <Rave amount = {itemAmount}
38      country = "NG"
39      currency = "NGN"
40      email = {this.state.email}
41      firstname = {this.state.firstname}
42      lastname = {this.state.lastname}
43      publickey = "FLWPUBK-92e93a5c487ad64939327052e113c813-X"
44      secretkey = "FLWSECK-61037cfe3cfc53b03e339ee201fa98f5-X"
45      paymenttype = "card"
46      meta = {
47        [{
48          metaname: "color",
49          metavalue: "red"
50        }, {
51          metaname: "storelocation",
52          metavalue: "ikeja"
53        }]
54      }
55      production = {
56        false  // Set production value to false if you are using ravesandbox public and private keys or test enviroment, Set to true if you are ready to go live
57      }
58      onSuccess = {
59        res => this.onSuccess(res)
60      }
61      onFailure = {
62        e => this.onFailure(e)
63      }
64      />
65    );
66  }
67}
68
69const styles = StyleSheet.create({
70    container: {
71      flex: 1,
72      backgroundColor: '#fff',
73      alignItems: 'center',
74      justifyContent: 'center',
75    },
76});