JavaScript/Typescript

Installation

yarn add @thanksjs/web

Usage

import { configureThanksWidget, displayThanksWidget } from '@thanksjs/web';

/// somewhere in your code
configureThanksWidget({
  partnerId: 'your partner id',
  // other available props, see Thanks Configuration section
});
displayThanksWidget();

It's all comes with TypeScript support, dont worry.

Parameters

Refer to the full Thanks API configuration documentation for more.

Closing widget by request

To close widget by request, for example in case of navigation call corresponding function

import { closeThanksWidget } from '@thanksjs/web';

closeThanksWidget();

this call is equal to low-level window.__thanks.closeWidget() call.

Advanced usage

In order to improve the efficiency of Thanks Widget extra information should be provided.

The important parts are:

providing a customer email. Strictly sha256 hash will be transferred during the widget lifecycle. No sensitive information leaves your application without your permission.
giving permission to send Personal Information to improve efficiency of communications
- subject and info can be used to decide what information to send
  - subject can be notification or autofill of visible UI elements
- info.token is a unique identifier for the request and can be used to trace PII flow further in our systems
keywords, category and items are used to fine-tune ads to display

Example

configureThanksWidget({
  partnerId: 'your partner id',
  // information for the first scren
  statusText: 'Your order has been confirmed',
  emailHash: { sha256: customersEmailHash },
  // or
  email: customerEmail,
  onPersonalInformationRequest: (subject, info) => {
    return {
      email,
      firstName: 'TestUser',
    };
  },

  onDisplay: () => {
    console.log('widget displayed');
  },
  onClose: () => {
    console.log('widget closed');
  },

  keywords: ['violet', 'roses', 'blueberry'],
  items: [
    {
      name: 'Flatwhite',
      value: 4.0,
      currency: 'AUD',
      quantity: 2,
      type: 'coffee',
      category: 'drinks',
      subcategory: 'australian-coffee',
    },
  ],
  categories: ['lifestyle'],
});

displayThanksWidget();