1.0.2 • Published 4 years ago

coinforbarter-react v1.0.2

Weekly downloads
-
License
MIT
Repository
github
Last release
4 years ago

CoinForBarter React Library

Integrate cryptocurrency payments for goods and services in your React App

License, MIT npm, coinforbarter-react yarn, coinforbarter-react

Table of Contents


About


This is a react package for implementing CoinForBarter's payment gateway with different payment methods.

Getting Started


These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system. See references for links to dashboard and API documentation.

Installation

$ npm install coinforbarter-react

# or
$ yarn add coinforbarter-react

Usage


Hooks

import React from 'react';
import { useCoinForBarter } from 'coinforbarter-react';

function App() {
  const config = {
    publicKey: 'xxxxxxxxxxxx',
    txRef: 'xxxxxxxxxxx',
    amount: 10000,
    currency: 'NGN',
    customer: 'example@example.com',
    customerFullName: 'John Doe',
    callback: (data) => {
      console.log(data);
    },
    currencies: ['BTC', 'DOGE'],
  };


  const pay = useCoinForBarter(config);

  return (
    <div>
      <button
        onClick={(e) => {
          e.preventDefault();
          pay();
        }}
      >
        Custom Pay
      </button>
    </div>
  );
}

export default App;

Using Button Component

import React from 'react';
import { CoinForBarterButton } from 'coinforbarter-react';

function App() {
  const config = {
    publicKey: 'xxxxxxxxxxxx',
    txRef: 'xxxxxxxxxxx',
    amount: 10000,
    currency: 'NGN',
    customer: 'example@example.com',
    customerFullName: 'John Doe',
    callback: (data) => {
      console.log(data);
    },
    currencies: ['BTC', 'DOGE'],
  };


  return (
    <div>
      <CoinForBarterButton config={config} text="Pay" />
    </div>
  );
}

export default App;

Config Parameters


PropertyRequiredDescription
publicKeytrueyour account public key gotten from your dashboard. You can get your PUBLIC_KEY from the CoinForBarter dashboard. Go here to get your API Keys. - For development, Use TEST API Keys. - For production, use LIVE API KEYS.
txReftruea random id to reference this transaction
amounttrueamount for this charge
currencytruethe currency you have set the amount in
customertrueemail address of the customer
customerFullNamefalsefull name of the customer
customerPhoneNumberfalsephone number of your customer
currenciesfalsean array of currencies you want to accept for this transaction, leave empty to accept all currencies
redirectUrlfalsea url to be opened after a transaction ends. If provided, it is called while the callback function is ignored
customizationsfalsean object to customize the payment screen. E.g: {logo:'https://example.com/logo.png', description:'lorem ipsium', title:'example title'}. See customization type
callbacktruea call back function to call after a transaction ends, this is ignored if a redirect url is provided. A data object is passed to the function. See Callback Param Type for callback data type

Customization Type

PropertyRequiredDescription
titlefalsea title for the payment screen
descriptionfalsea description for the payment screen
logofalsea description for the payment screen

Callback Param Type

PropertyDescription
statusstatus of the transaction. This is either (success. error or cancelled),
transactionIdthe transaction id for this transaction, this can be used to verify the transaction using the verify transaction endpoint
txRefthe transaction ref provided by you in config as txRef
currencythe currency the customer chose to pay in
amountthe amount the customer is to pay in the currency chosen by the customer
amountReceivedthe amount the customer paid in the currency chosen by the customer
customerthe customer details
baseAmountthe amount you had set to receive
baseCurrencythe currency that you had set the amount for this transaction in

Deployment


You can get your PUBLIC_KEY from the CoinForBarter dashboard.

Go here to get your API Keys.

  • For development, Use TEST API Keys.
  • For production, use LIVE API KEYS.

Built Using


  • Typescript
  • React

CoinForBarter API References

Stay in Touch