Flatpeak’s integration flow has two core parts, designed to work together but modular enough to adapt to the user experience you require:

​
1. General Connect flow

This handles:
  • Provider selection.
  • Postal address input.
  • Market tariff connection.
  • Manual tariff input.
  • Tariff display and editing.
This part can be fully customised by us or implemented natively in your app by integrating the Connect API. You are free to fork our reference implementation, host it yourself, or rebuild it natively in your app—so long as it follows our routing and token flow structure.

​
2. DIRECT Provider auth flow segment

Triggered by Connect flow when customer authorisation with their energy provider is required.
  • Secure login flow with the energy provider (aka supplier or utility).
  • Standalone and must be displayed in a WebView.
Once completed, it redirects the customer back into your app via the connect_web_uri parameter that you specify when creating a connect token.

​
Purpose of connect_web_uri and callback_uri parameters

When creating a connect token you can specify connect_web_uri and callback_uri:
  • The connect_web_uri is used mid-session by the DIRECT flow to redirect the browsing session back into the general flow after the DIRECT Provider auth flow segment has been completed.
  • The callback_uri is used at the very end of the entire flow once the customer completes the tariff summary page and taps “Save”, their browsing session is redirected to callback_uri so you can return it to your app or platform.
Use the following parameter combination when calling create a connect token endpoint:

​
Option 1. Testing while self-hosting our Web-based reference implementation

{
  "connect_web_uri": "https://connect.yourapp.com",
  "callback_uri": "https://yourapp.com/flatpeak/callback"
}

​
Option 2. Your native app using Web-based Connect

Still relying on web Connect (e.g. hosted or forked UI), but want the rest of the experience native: 
{
  "connect_web_uri": "https://connect.yourapp.com",
  "callback_uri": "yourapp://flatpeak/callback"
}
You’ve implemented Connect UI natively: 
{
  "connect_web_uri": "yourapp://tariff/connect",
  "callback_uri": "yourapp://tariff/callback"
}
In this case:
  • DIRECT flow redirects back into the app to connect_web_uri after login.
  • After the customer hits “Save” in your native implementation of tariff summary page, you can optionally use callback_uri for final navigation—or ignore it entirely.