Cobalt assisted flow is a frontend SDK that allows you to embed cobalt connect into your React application. You can easily let your users authorize and manage integration configuration. It makes credential handling more secure and seamless.

To get started, follow the 3 steps:

  1. Generate session token
  2. Install frontend SDK
  3. Open Cobalt connect

​
Generate session token

To use Assisted flow, you will need to first get the session token. This can be achieved by making a POST request to the Session Token API to create a valid session for a user along with the hosted url, hereafter referred to as the Linked account ID.

​
Install frontend SDK

To open Cobalt Connect with React, you will need to initialise the React SDK with the below call

npm install --save @cobaltio/react-cobalt-js

​
Open Cobalt Connect

// import Provider & Config components
import { Provider, Config } from "@cobaltio/react-cobalt-js";

// Config component needs to be wrapped inside the Provider component.
// And pass the Cobalt session token (that you generated using the Cobalt backend SDK) to the provider.
<Provider sessionToken={ cobaltToken }>
    {
        // ideally you'd render the Config component inside a modal.
        // the component only gets rendered when `slug` is passed.
        <Config
            id="SOME_UNIQUE_CONFIG_ID" // Optional
            slug="APP_SLUG" // application type / slug
            // dynamic fields payload (optional)
            fields={{ /* PAYLOAD */ }}
            // you can override the component's container style if you want
            style={{
                borderRadius: 8,
                maxWidth: 450,
            }}
        />
    }
</Provider>

For example implementation, you can check out the App.js file in the example directory.

Hosted FlowSeamless Flow