🤝 Data Importer Integration

📘

Before you begin!

Get your API key

You can find your API key by going to "Settings", under "Account Details":

You can find the link to "Settings" on the right of the Navigation bar

Get your Pipeline ID

You can copy your Pipeline ID from either:

• The Pipelines home page, by clicking the ID of the pipeline you wish to use
• A Pipeline dashboard page, by clicking the ID at the top of the top of the page

Your Pipeline ID will be automatically copied to your clipboard

1. Install

Segna has an SDK with both our UI components as well as our APIs. Install the package:

// yarn
yarn add @segna/segna-sdk

// npm
npm i @segna/segna-sdk

If you want to call our API's directly see our API Reference.

2. Import the SDK and add your API key

Use your API Key to initialize Segna.

import segna from '@segna/segna-sdk';

segna.initialize({apiKey: '<YOUR_API_KEY>'});

3. Render the Data Importer in your app

Add an import at the top of your file:

import { DataImporter } from '@segna/segna-sdk';

And simply render the component where you want your Import button to show:

<DataImporter pipelineId={"<YOUR_PIPELINE_ID>"} />

Make sure you replace "<YOUR_PIPELINE_ID>" with the Pipeline ID.

📘

Learn more about the Data Importer.

4. Get importing!

Here is an example of what the data importer looks like:

Your users will now be able to upload their data through your Data Importer, and the cleaned data will show up at your output destination!

👍

Check out the Data Importer Configuration to learn more about how the component can be customized and configured to fit your FE and use-case.