OurPass Inline - React.js

This is the React.js library for implementing Ourpass checkout button on your platofrm. This library would help you integrate the button into your system in no time😌

OurPass Checkout Demo

Inorder to have access to the NPM documentation click below

NPM documentation

Installation

NPM Installation

Run the command below in your terminal to install the component

npm i ourpass-checkout-react-button-v1

Importing the react-pass-checkout-button-v1

Go to your component, import the component and add it in your component as suggested below

import { Button } from "react-pass-checkout-button-v1"

Feeding the component with the write data

You are to feed the component with the checkout data using the data prop, and the function you want to run when the checkout is canceled on onClose and the function to run when the checkout is completed on onSuccess

<Button data={clientInfo} />

In clientInfo here you have various variables that is needed to complete checkout

clientInfo parameters

Options	Type	Required	Description
src	string	true	Product image
amount	string	true	Product amount
url	string	true	Merchant's website address
name	string	true	Product name
email	string	false	Email of OurPass user
qty	string	true	Quantity of products being bought
description	string	true	Product description
items	array	true	List of cart items
onClose	function	true	Javascript function that should be called if the customer closes the payment window
onSuccess	function	true	Javascript function that should be called if the payment is successful
api_key	string	true	Your Seller OurPass secret key

    const clientInfo = {
        src: `https://raw.githubusercontent.com/Cheetah-Speed-Technology/website_dstore/master/Cap-front1.png`,
        amount: `10`,
        url: `jumia.com.ng`,
        name: `Cap`,
        email: `[e-mail]`,
        qty: `1`,
        description: `Great Pass Cap`,
        key: `pass_sec_test_ewxaVQBbr5JTt6P2tpIUUAZGdpqzRckV`,
        onClose: function () {
            alert(`It Closed oo`)
        },
        onSuccess: function () {
            alert(`It Succeeded oo`)
        }
    }

You can add the method for closed checkout on onClose() and for completed checkout onSuccess()