Overview

📘

The Data Importer is a pre-built component that can be added to your app. However, it is entirely powered by the Segna API!
If you want to use your own UI, head over to our APIs section to see how you can hook in Segna's functionality into your own flow!

Overview

The Data Importer is an out-of-the-box component that can be added to your app in minutes. The component renders a button, which then opens a modal that takes your users through a data upload flow.

Example steps:

The Data Importer automatically, and by default, will:

• Identify the header column and data of the uploaded file or Google Sheet (e.g. when surrounded by junk/empty rows/columns)
• Drop any empty rows and columns
• Remove unnecessary whitespaces
• Request the user to select a sheet if they upload an Excel workbook with multiple sheets
• Automatically match the data being uploaded to the desired schema on your Pipeline, and prompt for user confirmation if our confidence is below 80%.
• Perform any transformations specified on the Pipeline such as:
  • Data type conversion (rich text, category, date-time, number)
  • Date-time formats and UTC
  • Dropping rows in columns where missing values are not allowed
• Output to the database of your choice specified on your Pipeline

However, the Data Importer is also completely configurable - you can programmatically specify what steps are presented to your users, as well as configure each step to expose more of Segna's functionality to suit your use case.

Using the Data Importer

📘

Make sure you run segna.initialize in your application before rendering the component! Please refer to the Data Importer Integration guide for details!

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

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

The above component will render a button, which will then open a modal with the data importing flow.