Skip to content

Commit

Permalink
Add topper web sdk
Browse files Browse the repository at this point in the history
  • Loading branch information
andregoncalvesdev committed Jan 18, 2024
1 parent ea9ae01 commit e15b5f1
Show file tree
Hide file tree
Showing 23 changed files with 5,051 additions and 1 deletion.
3 changes: 3 additions & 0 deletions .eslintignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
.eslintcache
dist
node_modules
25 changes: 25 additions & 0 deletions .eslintrc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
{
"root": true,
"env": {
"browser": true,
"es2022": true,
"node": true
},
"parser": "@typescript-eslint/parser",
"parserOptions": {
"ecmaVersion": "latest",
"sourceType": "module",
"project": "./tsconfig.json"
},
"rules": {
"@typescript-eslint/no-explicit-any": ["off"]
},
"plugins": [
"@typescript-eslint"
],
"extends": [
"uphold",
"plugin:@typescript-eslint/recommended",
"prettier"
]
}
26 changes: 26 additions & 0 deletions .github/workflows/ci.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
name: Node CI

on: [push]

jobs:
unit:
runs-on: ubuntu-latest
strategy:
matrix:
node: [18, 20]
name: Node v${{ matrix.node }}

steps:
- name: Checkout code
uses: actions/checkout@v4

- name: Setup Node.js version
uses: actions/setup-node@v4
with:
node-version: ${{ matrix.node }}

- name: Install dependencies
run: yarn

- name: Run lint
run: yarn lint
50 changes: 50 additions & 0 deletions .github/workflows/release.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
name: Release

on:
workflow_dispatch:
inputs:
VERSION_BUMP:
description: 'The version bump'
type: choice
options:
- major
- minor
- patch
default: minor
required: true

jobs:
release:
runs-on: ubuntu-latest
concurrency: 1
environment: release

steps:
- name: Checkout code
uses: actions/checkout@v4
with:
token: ${{ secrets.RELEASE_GITHUB_TOKEN }}

- name: Setup Node.js version
uses: actions/setup-node@v4
with:
node-version: 20

- name: Enable yarn
run: corepack enable

- name: Install dependencies
run: yarn install --frozen-lockfile

- name: Configure git
run: |
git config user.name "Uphold"
git config user.email "[email protected]"
- name: Generate release
env:
GITHUB_TOKEN: ${{ secrets.RELEASE_GITHUB_TOKEN }}
NPM_TOKEN: ${{ secrets.RELEASE_NPM_TOKEN }}
run: |
echo "//registry.npmjs.org/:_authToken=\${NPM_TOKEN}" > .npmrc
npm run release -- --increment "${{ github.event.inputs.VERSION_BUMP }}" -V
4 changes: 4 additions & 0 deletions .husky/pre-commit
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

npx lint-staged
22 changes: 22 additions & 0 deletions .release-it.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
module.exports = {
git: {
changelog: 'echo "## Changelog\n\n$(npx @uphold/github-changelog-generator -f unreleased | tail -n +4 -f)"',
commitMessage: 'Release ${version}',
requireBranch: 'master',
requireCommits: true,
tagName: 'v${version}'
},
github: {
release: true,
releaseName: 'v${version}'
},
hooks: {
'after:bump': [
'echo "$(npx @uphold/github-changelog-generator -f v${version})\n$(tail -n +2 CHANGELOG.md)" > CHANGELOG.md',
'git add CHANGELOG.md --all'
]
},
npm: {
publish: true
}
};
111 changes: 110 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,112 @@
# Topper Web SDK

This web SDK is designed to help developers to integrate Topper into their applications.
This web SDK is designed to help developers to integrate Topper into their web applications.

## Installation

```bash
# Using yarn
$ yarn add @uphold/topper-web-sdk

# Using npm
$ npm install @uphold/topper-web-sdk
```

## Usage

### Creating an instance

First, create an instance of `TopperWebSdk`:

```javascript
import { TopperWebSdk } from '@uphold/topper-web-sdk';

const topper = new TopperWebSdk();
```

### Initiate Topper

You can initiate Topper on a new tab (default), iframe or same tab. The default environment is `production`, and `sandbox` is available.

Example:

```javascript
import { TOPPER_ENVIRONMENTS, TOPPER_VARIANTS, TopperWebSdk } from '@uphold/topper-web-sdk';

const topper = new TopperWebSdk();

// Open in a new tab (default).
topper.initialize({ bootstrapToken: 'XXXX' });

// Open in an iframe.
const topper = new TopperWebSdk({ variant: TOPPER_VARIANTS.iframe });
const topperIframe = document.getElementById('topper-iframe');

topper.initialize({ bootstrapToken: 'XXXX', iframeElement: topperIframe });

// Open in the same tab.
const topper = new TopperWebSdk({ variant: TOPPER_VARIANTS.sameTab });

topper.initialize({ bootstrapToken: 'XXXX' });

// Open sandbox environment.
const topper = new TopperWebSdk({ environment: TOPPER_ENVIRONMENTS.sandbox });

topper.initialize({ bootstrapToken: 'XXXX' });
```

### Event Handling

Listen to single events like order placed or all events:

```javascript
// Single event.
topper.on(TOPPER_EVENTS.orderPlaced, ({ data }) => {});

// All events.
topper.on(TOPPER_EVENTS.all, ({ data, name }) => {});
```

### Multiple instances

You can initiate Topper on multiple instances, and listen to events like:

```javascript
const topperIframe1 = new TopperWebSdk({ variant: TOPPER_VARIANTS.iframe });
const topperIframe2 = new TopperWebSdk({ variant: TOPPER_VARIANTS.iframe });

const topperIframe1Element = document.getElementById('topper-iframe-1');
const topperIframe2Element = document.getElementById('topper-iframe-2');

topperIframe1.initialize({ bootstrapToken: 'XXXX', iframeElement: topperIframe1Element });
topperIframe2.initialize({ bootstrapToken: 'XXXX', iframeElement: topperIframe2Element });

topperIframe1.on(TOPPER_WEB_SDK_EVENTS.orderPlaced, ({ data }) => {});
topperIframe2.on(TOPPER_WEB_SDK_EVENTS.orderPlaced, ({ data }) => {});
```

### Triggering Events

Used by `@uphold/topper-web` to trigger events:

Trigger events:

```javascript
TopperWebSdk.triggerEvent(EVENTS.orderPlaced, data);
```

## Additional Information

For more detailed information, refer to the official [documentation](https://docs.topperpay.com/web-sdk). This guide covers basic usage and setup.

## Issues

For reporting issues, bugs, or feature requests, please use the [GitHub Issues page](https://github.com/uphold/topper-web-sdk/issues).

## Release process

The release of a version is automated via the release GitHub workflow. Run it by clicking the "Run workflow" button.

## License

This project is licensed under the MIT License. See the LICENSE file in the GitHub repository for more details.
66 changes: 66 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
{
"name": "@uphold/topper-web-sdk",
"version": "0.0.0",
"description": "Seamless integration of Topper on Web applications",
"author": "Uphold",
"license": "MIT",
"type": "module",
"main": "dist/index.cjs",
"exports": {
".": {
"import": {
"types": "./dist/index.d.ts",
"default": "./dist/index.js"
},
"require": {
"types": "./dist/index.d.cts",
"default": "./dist/index.cjs"
}
}
},
"repository": {
"type": "git",
"url": "[email protected]:uphold/topper-web-sdk.git"
},
"homepage": "https://github.com/uphold/topper-web-sdk#readme",
"bugs": {
"url": "https://github.com/uphold/topper-web-sdk/issues"
},
"publishConfig": {
"access": "public"
},
"scripts": {
"build": "tsc && tsup",
"lint": "eslint . --ext .ts,.js",
"prepare": "husky install",
"release": "release-it"
},
"dependencies": {
"query-string": "^6.3.0"
},
"devDependencies": {
"@typescript-eslint/eslint-plugin": "^6.9.0",
"@typescript-eslint/parser": "^6.9.0",
"@uphold/github-changelog-generator": "^3.4.0",
"eslint-config-uphold": "^5.0.1",
"eslint": "~8.52.0",
"husky": "^8.0.0",
"lint-staged": "^15.2.0",
"prettier": "^2.8.7",
"release-it": "^17.0.1",
"tsup": "^7.2.0",
"typescript": "^5.2.2"
},
"lint-staged": {
"*.{ts,js}": "yarn lint"
},
"keywords": [
"crypto",
"payment",
"ramp",
"sdk",
"topper",
"web"
],
"types": "dist/index.d.ts"
}
4 changes: 4 additions & 0 deletions src/enums/environments.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
export enum Environments {
PRODUCTION = 'production',
SANDBOX = 'sandbox'
}
5 changes: 5 additions & 0 deletions src/enums/events.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
export enum Events {
ALL = '*',
ORDER_PLACED = 'orderPlaced',
WIDGET_CONTINUE_BUTTON_CLICKED = 'widgetContinueButtonClicked'
}
4 changes: 4 additions & 0 deletions src/enums/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
export * from './environments';
export * from './events';
export * from './urls';
export * from './variants';
5 changes: 5 additions & 0 deletions src/enums/urls.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
export enum Urls {
PRODUCTION = 'https://app.topperpay.com',
SANDBOX = 'https://app.sandbox.topperpay.com',
WEBSITE = 'https://www.topperpay.com/'
}
5 changes: 5 additions & 0 deletions src/enums/variants.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
export enum Variants {
IFRAME = 'iframe',
NEW_TAB = 'new-tab',
SAME_TAB = 'same-tab'
}
7 changes: 7 additions & 0 deletions src/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
export {
Environments as TOPPER_ENVIRONMENTS,
Urls as TOPPER_URLS,
Variants as TOPPER_VARIANTS,
Events as TOPPER_EVENTS
} from './enums';
export { TopperWebSdk } from './topper-web-sdk';
10 changes: 10 additions & 0 deletions src/interfaces/config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import { Environments } from '../enums/environments';
import { Variants } from '../enums/variants';

export interface Config {
environment?: Environments;
is_android_app?: boolean;
is_ios_app?: boolean;
variant?: Variants;
theme?: string;
}
4 changes: 4 additions & 0 deletions src/interfaces/event-payload.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
export interface EventPayload {
name?: string;
data: any;
}
2 changes: 2 additions & 0 deletions src/interfaces/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
export * from './config';
export * from './event-payload';
Loading

0 comments on commit e15b5f1

Please sign in to comment.