react-native-paystack for RN 0.60* and below

[tolu360]

Hi All,

Before you submit a new issue, please ensure you are on v3.4.0 or higher for react-native-paystack and have followed the instructions below:

Suggested update path should follow the following steps:

• npm/yarn remove react-native-paystack
• Go give the README a read again, new instructions have been added that you should totally be aware of, to know how to proceed. !Important
• Understand how auto-linking works in RN 0.59 and below as against how it works in RN 0.60 (essentially no linking is required on RN 60 and above) - follow whichever applies to your app.
• Clean your project on Android, run cd android followed by ./gradlew clean
• npm install react-native-paystack or yarn add react-native-paystack
• Build your app and profit.
• The latest release is 3.4.0 and is tested and works perfectly in *RN 60. and below**!

Cheers!

[Ifunanyacollins]

using the test Key I get this error but on the live key its a success. Any pointers?

[tolu360]

Either include the error from Android logcat or console.log(error.message) in js - both of them may even be more helpful. And also your version of RN? But a transaction error just shows you are doing something wrong in your own code! Check keys again too!

On Thu, Sep 5, 2019, 5:39 PM Collins ogbuzuru notifications@github.com wrote:

After updating the SDK I get this error [image: Screenshot_1567697803] https://user-images.githubusercontent.com/31220512/64361218-1870c100-d004-11e9-870a-4060ccf6251a.png

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/tolu360/react-native-paystack/issues/38?email_source=notifications&email_token=AA53YZQV35U36SMXWPSRGFDQIEY4VA5CNFSM4ITVKVZ2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD57ZEIA#issuecomment-528454176, or mute the thread https://github.com/notifications/unsubscribe-auth/AA53YZSXFV6OWYXMF6SKZYTQIEY4VANCNFSM4ITVKVZQ .

[lucasdozie]

Hi, I followed pretty much all the steps listed on the README file, removed and added the package again. It works on android but doesn't work on iOS (Note: I am not new to manual linking),

• I added to library from the node_modules -> react-native-paystack -> ios -> RNPaystack.xcodeproj
  • Dragged the libRNPaystack.a file from product to -> Build Phase -> link binaries with Libraries
  • Added the library path to -> Build Settings -> Header search paths.

Info: react-native-cli: 2.0.1 react-native: 0.57.1

react-native-paystack: "^3.4.0"

Please help attend to this email: lucasatwon@gmail.com

[tolu360]

Hi @lucasdozie, I don't know why you resorted to manual linking, but it is very much unnecessary - the section of the README under auto-linking for iOS for RN 0.59 and lower would be adequate to set up on iOS - please go over the steps again. And more importantly, I also don't see where you mentioned installing the CocoaPods dependencies on the list of things you did to set up your project. Make your Podfile look like the example in the docs and run pod install afterwards form the /ios directory. If you are new to CocoaPods, check the docs again for how to set it up. Finally, note that you cannot get it to work without installing the native dependencies via CocoaPods, it is the only step that brings the Paystack framework into your project!

[lucasdozie]

Hi @tolu360 Thanks for the swift response, so like you suggested I tried the Pod Install as instructed the docs. but got another error google::LogMessage::LogMessage(char const*, int, int)", referenced from... So I cleared/delete the pod folder and the podfile.lock -> did another pod install and I got same old 'Paystack/Paystack.h' file not found

[tolu360]

@lucasdozie, so try to clean your Xcode project (Product > Clean Build Folder) and then build again.

If you still have issues, this is weird by the way, let us start from the scratch (show me your Podfile before you begin steps below - copy and paste the content here, if possible):

1. Unlink the library, run react-native unlink react-native-paystack.
2. Reverse all the steps you took for manual linking on iOS.
3. Exit Xcode and remove pods, not by deleting folders but by running pod deintegrate from the /ios directory.
4. Link the library, run react-native link react-native-paystack from the /ios directory.
5. Install dependencies again by running pod install from the /ios directory.
6. Open your project again in Xcode with the .xcworkspace file not the .xcodeproj file.
7. Build again and revert.

[lucasdozie]

Podfile

# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'

target 'thrive' do
  # Comment the next line if you don't want to use dynamic frameworks
  use_frameworks!

  # Pods for thrive
  # Pods for _YOUR_PROJECT_TARGET_
  pod 'React', :path => '../node_modules/react-native', :subspecs => [
  'Core',
  'CxxBridge',
  'DevSupport',
  'RCTText',
  'RCTImage',
  'RCTNetwork',
  'RCTWebSocket',
  'RCTSettings',
  'RCTAnimation',
  'RCTLinkingIOS',
  # Add any other subspecs you want to use in your project
  # Remove any subspecs you don't want to use in your project
  ]

  pod "yoga", :path => "../node_modules/react-native/ReactCommon/yoga"
  pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
  pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec'
  pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'
  # This should already be auto-added for you, if not add the line below
  pod 'react-native-paystack', :path => '../node_modules/react-native-paystack'
  # pod 'Paystack'

  pod 'react-native-simple-toast', :path => '../node_modules/react-native-simple-toast'

  target 'thriveTests' do
    inherit! :search_paths
    # Pods for testing
  end

end

target 'thrive-tvOS' do
  # Comment the next line if you don't want to use dynamic frameworks
  use_frameworks!

  # Pods for thrive-tvOS

  target 'thrive-tvOSTests' do
    inherit! :search_paths
    # Pods for testing
  end

end

[tolu360]

So, I am going to clean that up a little and disable dynamic frameworks:

platform :ios, '9.0'

target 'thrive' do
  # use_frameworks!

  # Pods for thrive
  pod 'React', :path => '../node_modules/react-native', :subspecs => [
    'Core',
    'CxxBridge',
    'DevSupport',
    'RCTText',
    'RCTImage',
    'RCTNetwork',
    'RCTWebSocket',
    'RCTSettings',
    'RCTAnimation',
    'RCTLinkingIOS',
    # Add any other subspecs you want to use in your project
    # Remove any subspecs you don't want to use in your project
  ]

  pod "yoga", :path => "../node_modules/react-native/ReactCommon/yoga"
  pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
  pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec'
  pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'
  pod 'react-native-paystack', :path => '../node_modules/react-native-paystack'
  pod 'react-native-simple-toast', :path => '../node_modules/react-native-simple-toast'

end

Use this with the steps I provided above earlier and revert

[lucasdozie]

So I tried the above solution but I'm now getting this error Xcode build error linker command failed with exit code 1

[tolu360]

You may still have remnants of your previous failed attempts you need to remove and clean up. The linker error referenced by you is not complete - it usually shows what could not be found or what is missing, e.g:

ld: so-and-so not found..... blah blah
clang: error: linker command failed with exit code 1 (use -v to see invocation)

Can you provide the reported missing file or library along with the error? And make sure that after installing pods, you open your project again in Xcode with the .xcworkspace file not the .xcodeproj file. Or you may find it is easier to just start a new project altogether from react-native init newAppHere and pull in pods and libraries afresh! If at all, you opt for RN 0.60 or higher, please read about how linking works there in the README as you would need to do things differently as far as setting up is concerned.

[lucasdozie]

Thanks a lot man Yea I saw the bug and I fixed it(Cleared the Paystack.h not found), but currently getting error response of E_BUSY

[tolu360]

@lucasdozie if you are getting an error code of E_BUSY, you may be calling methods off of the library in too rapid successions, such that you are not allowing a request to the API finish before making a new one. You should employ the use of loaders/spinners and deactivating your pay buttons when a payment request is in progress e.g.

chargeCard() {
        // deactivate pay button here <-------
        // show spinner here <-------

       RNPaystack.chargeCardWithAccessCode({
              cardNumber: '4123450131001381', 
              expiryMonth: '10', 
              expiryYear: '19', 
              cvc: '883',
              accessCode: '2p3j42th639duy4'
       })
       .then(response => {
          console.log(response); // do stuff with the token
               // hide spinner here <-------
               // activate pay button here or show success message  <-------
      })
      .catch(error => {
           console.log(error.message);
                // activate pay button here <-------
                // hide spinner here <-------
    })
}

[lucasdozie]

Sorry for just replying now, since iOS was kinda buggy i left to to focus on android. Now that I am done with android, I tried iOS again this time I am getting Another request is still being processed, please wait just by tapping the pay button

[lucasdozie]

Also I am getting Error charging card

[lucasdozie]

@tolu360 Here is my script, its works on android but iOS tends to initiate a double call, but the first console.log only shows once when that happens

Also somethings after pressing the payment btn, the loader loads for ever

chargeCard = async () => {
        console.log("chager card is Initiatelizing paystack charge card...  chargeCard state:.", this.state)
        this.setState({paymentLoadingStatus: true})
        await RNPaystack.chargeCard({
                cardNumber: this.state.cardNumber,
                expiryMonth: this.state.expiryMonth, 
                expiryYear: this.state.expiryYear,
                cvc: this.state.cvc,
                email: this.state.email,
                amountInKobo: this.state.amount * 100,
                reference: this.state.txref
                }
            )
            .then((response) => {
                console.log(response)
                if(Platform.OS === "ios"){
                    Alert.alert(
                        'Wawu!! Congratulation',
                        response.message,
                        [{text: 'Awesome', onPress: () => {
                            this.setState({
                                paymentLoadingStatus: false,
                             })
                             this.props.navigation.pop(2)
                        }}
                      ],{cancelable: false},
                    );
                }else{
                    this.setState({paymentLoadingStatus: false, resCode: "green",paymentModalResponseStatus: true, paymentModalResponseMsg: response.message})
                }   
            })
            .catch(error => {
                console.log(error)
                if(Platform.OS === "ios"){
                    Alert.alert(
                        'Oops!',
                        error.message,
                        [{text: 'Try Again', onPress: () => {
                            this.setState({
                                paymentLoadingStatus: false,
                             })
                        }}
                      ],{cancelable: false},
                    );
                }else{
                    this.setState({
                        paymentLoadingStatus: false, 
                        resCode: "red",
                        paymentModalResponseStatus: true, 
                        paymentModalResponseMsg: error.message
                    })
                }
            })
    }

[tobilastik]

@tolu360 I am still experiencing this on iOS, any solution please?

[osammy]

@tolu360 I keep getting this error Error: Another request is still being processed, please wait even though the button is clicked once. Is there a solution for this ?

[osammy]

@tolu360 I am still experiencing this on iOS, any solution please?

46 fixed this for me. check it out and adjust your code accordingly