Connection Methods

StackOne offers three ways to let end-users connect their accounts to your application.

Method	Best For	User Experience
Embedded Hub	Production apps	In-app, branded
Auth Link	Email flows, demos	Standalone page
Dashboard	Internal testing	Admin-only

Embedded Hub

Embed the StackOne Hub directly in your app. End-users select a connector and authenticate without leaving your application.

Use Cases
How It Works

Production applications with custom UX
Branded, in-app connection experience
Full control over the integration flow

Embedding Guide →

Complete guide for React and non-React implementations

Auth Link

Secure URLs that open the StackOne Hub in a standalone browser tab. Generate from the dashboard or via API.

Use Cases
How It Works

Onboarding emails asking end-users to connect their HRIS
Quick demos without frontend integration work
Sales-led onboarding flows

Auth Links Guide →

To trigger a workflow when an account is linked via Auth Link, subscribe to account webhooks since there’s no frontend callback available.

Dashboard Linking

Connect accounts directly from the StackOne dashboard for internal testing.

Use Cases
How It Works

Testing API integration during development
Debugging connection issues
Internal demos

Go to Accounts
Click Link Account, then choose Authenticate Now
Enter origin owner details, then select a connector and enter credentials
Use resulting account_id in API calls

Dashboard linking is for internal use only. End-users should use the Embedded Hub or Auth Links.

Connection Events

Get notified when accounts are connected, updated, or disconnected.

Frontend Callbacks (Embedded Hub)

When using the Embedded Hub, handle connection events directly in your frontend:

Hub
Legacy Hub

import { StackOneHub } from "@stackone/hub";

function App() {
  return (
    <StackOneHub
      onSuccess={(account) => {
        console.log('Account linked:', account.id);
        // Trigger your onboarding flow
      }}
      onCancel={() => console.log('User cancelled')}
      onClose={() => console.log('Hub closed')}
    />
  );
}

import { useStackOneHub } from '@stackone/react-hub';

const LinkAccountButton = () => {
  const { startConnect } = useStackOneHub();

  const startFlow = async () => {
    const { token } = await retrieveConnectSessionToken();
    startConnect({
      sessionToken: token,
      onSuccess: (account) => {
        console.log('Account linked:', account.id);
      },
      onCancel: () => console.log('User cancelled'),
    });
  };

  return <button onClick={startFlow}>Connect Account</button>;
};

Webhooks

For backend notifications (required for Auth Links, recommended for all methods), subscribe to account webhooks:

Event	Triggered When
`account.created`	New account linked
`account.updated`	Account credentials refreshed or modified
`account.deleted`	Account disconnected

Example webhook payload

{
  "event": "account.created",
  "data": {
    "id": "acme-corp-bamboohr",
    "provider": "bamboohr",
    "origin_owner_id": "cust_12345",
    "status": "active"
  }
}

Webhooks Guide

Full setup and event reference

Next Steps

Embed the Hub

Full guide for React and script embedding

Auth Links

Generate and send connection links

Managing Accounts

View and manage connected accounts

Backend Setup

Generate session tokens securely

Quickstart

Connect Tools

Dashboard

Build Connectors

Connection Methods

Embedded Hub

Embedding Guide →

Auth Link

Auth Links Guide →

Dashboard Linking

Connection Events

Frontend Callbacks (Embedded Hub)

Webhooks

Webhooks Guide

Next Steps

Embed the Hub

Auth Links

Managing Accounts

Backend Setup

​Embedded Hub

Embedding Guide →

​Auth Link

Auth Links Guide →

​Dashboard Linking

​Connection Events

​Frontend Callbacks (Embedded Hub)

​Webhooks

Webhooks Guide

​Next Steps

Embed the Hub

Auth Links

Managing Accounts

Backend Setup

Embedded Hub

Auth Link

Dashboard Linking

Connection Events

Frontend Callbacks (Embedded Hub)

Webhooks

Next Steps