@sync-spider/sdk

v2.1.5

Published

4 years ago

### NPM

Downloads

0High
0Medium
0Low

Installation

NPM

# install sync spider sdk to your project
npm install @sync-spider/sdk --save

Inject script tag

<head>
	<!-- SyncSpider SDK -->
	<script src="https://app.syncspider.com/js/sync-spider-sdk.js"></script>
</head>

And then anywhere in your app you can access SyncSpider:

Usage

Create/edit connection

import { createConnection, editConnection } from '@sync-spider/sdk';

// For creation you need connection code
createConnection({
	token: 'YOUR_TOKEN',
	code: 'CONNECTION_CODE',
})
	.then((result) => {
		// Result is an object that contains
		// id, name, and other useful info
	})
	.catch((error) => {
		// Handle errors
	});

// For edit you need connection id
editConnection({
	token: 'YOUR_TOKEN',
	connectionID: 'CONNECTION_ID',
})
	.then((result) => {
		// Result is an object that contains
		// id, name, and other useful info
	})
	.catch((error) => {
		// Handle errors
	});

Open source configuration

import { openSourceConfig } from '@sync-spider/sdk';

openSourceConfig({
	token: 'YOUR_TOKEN',
	projectID: PROJECT_ID,
	taskID: TASK_ID,

	// Optional
	queryParams: {
		vendor: '1',
	},
})
	.then((result) => {
		// Result is boolean
	})
	.catch((error) => {
		// Handle errors
	});

Open destination configuration

import { openDestinationConfig } from '@sync-spider/sdk';

openDestinationConfig({
	token: 'YOUR_TOKEN',
	projectID: PROJECT_ID,
	taskID: TASK_ID,
	destinationID: DESTINATION_ID,

	// Optional
	queryParams: {
		vendor: '1',
	},
})
	.then((result) => {
		// Result is boolean
	})
	.catch((error) => {
		// Handle errors
	});

Apply design changes to the app

Each function you call from SDK you can pass down additional properties to customize the look and feel.

openSourceConfig({
	// Styles - provide hex color without hashtag
	colorBackground: 'HEX_COLOR',
	colorBackgroundContent: 'HEX_COLOR',
	colorForeground: 'HEX_COLOR',
	colorForegroundContent: 'HEX_COLOR',
	colorForeground1: 'HEX_COLOR',
	colorForegroundContent1: 'HEX_COLOR',
	colorPrimary: 'HEX_COLOR',
	colorPrimaryContent: 'HEX_COLOR',
	colorPrimaryHover: 'HEX_COLOR',
	colorPrimaryHoverContent: 'HEX_COLOR',

	// Image - this will be used instead of SyncSpider default image
	defaultImage: 'URL_TO_DEFAULT_IMAGE',

	// Labels - customize button labels
	submitLabel: 'Confirm',
	cancelLabel: 'Cancel',
});

Contributing

Requirements

NodeJS 14+ (install via nvm)

Inside root directory create .env.local file and inside it copy the stuff from .env file This file will not get into git and you can always change env variables.

npm run dev

This will serve the app on your local machine on http://localhost:3000 or other port if 3000 is busy.

If you want to change baseURL without manually running development mode you can pass baseURL:

import { createConnection } from '@sync-spider/sdk';

// This is useful only during development
createConnection({
	baseURL: 'YOUR_URL',
});

Change env variables

If you want to change some variables refer to .env file. Do know that .env.production is for production build.

Publish to npm

Make sure to bump the version inside package.json file. We follow semantic versioning.

# Build the SDK, compiled files will be inside dist directory
npm run build

# Before publish you need to login to your account
npm publish