Frontend Callback

We’re excited to introduce a new feature in our React and JavaScript SDKs - an onComplete event that’s triggered after a user completes a CSV or Excel file import. It's designed so you can easily interact with the cleaned and mapped data from TableFlow allowing you to create custom actions in your frontend application after an import completes.

How it works

You can use the new onComplete event by adding the handler to your SDK configuration:

onComplete: (data, error) => {
  if (error) {
    alert(error); // Handle import error
  } else {
    console.log(data); // Use import data
  }
}

With this callback function you’ll receive two parameters: data and error. data is an object that contains information about the completed import operation such as the number of rows imported and the actual row data, and error contains any errors that occurred during the import. Here’s a simplified example response from the callback:

"data": {
  "id": "f7ecddb4-bfd6-460e-b524-7f13d70d9500",
  ...
  "rows": [
    {
      "index": 0,
      "values": {
        "email": "laura@example.com",
        "first_name": "Laura",
        "last_name": "Jenkins"
      }
    },
    ...
  ]
}

The full documentation can be found here.

Get started

To get started using this new onComplete event, update your React and JavaScript SDK to the latest version and add in your custom handler for the event. 

Using NPM:

npm install @tableflow/react
or 
npm install @tableflow/js

Using Yarn:

yarn add @tableflow/react
or 
yarn add @tableflow/js

If you encounter any issues or need help, don't hesitate to reach out over Slack!