@habit.analytics/habit-smartlink-reactcomponent NP

Habit Smartlink React Component

A react component for integrating Habit Smartlink into your application

Instalation

You can install the package via npm or yarn:

Example

yarn add habit-smartlink-reactcomponent

Usage

You can use the SmartlinkComponent in your React application:

Example

import { SmartlinkComponent } from 'habit-smartlink-reactcomponent';

const prePaymentMethod = async (quoteId) => {
  // Your application should have a logic to deal with quoteId and get payment data
  return { success: true, payment_id: '12345' };
};
const onPaymentSuccess = (successPaymentData) => {
  // Maybe your aplication has some logic to display data,
  // or some redirection after payment is completed...
  // This function is optional
}

const App = () => (
  <div>
    <h1>Test SmartLink Component</h1>
    <SmartLinkComponent
      hash="sampleHash"
      pin="samplePin"
      prePaymentMethod={prePaymentMethod}
      onPaymentSuccess={onPaymentSuccess}
    />
  </div>
);

export default App;

Props

The SmartLinkComponent accepts the following props:

hash (string): The hash value required for the SmartLink to recognize what payment will be handled;
pin (string, optional): Optional PIN value, in case this payment is PIN protected;
prePaymentMethod (function): The function to handle pre-payment method logic. It receives quoteId as a parameter and should return an object with success and payment_id.
onPaymentSuccess (function): The function triggered on payment success