Hero Light

​
Import our pre-built React Component

You can find the component on NPM here
1

Install the package in your code:

npm i @panora/embedded-card-react
2

Import the component and the styles in your integrations page:

import "@panora/embedded-card-react/dist/index.css";
import PanoraProviderCard from "@panora/embedded-card-react";
3

Use the catalog in your integrations page:

<PanoraProviderCard
    name={"hubspot"} # name of the provider
    vertical={"crm"} # vertical where provider belongs to
    projectId={"c9a1b1f8-466d-442d-a95e-11cdd00baf49"} # the project id tied to your organization
    returnUrl={"https://acme.inc"} # the url you want to redirect users to after the connection flow is successful
    linkedUserId={"b860d6c1-28f9-485c-86cd-fb09e60f10a2"}  # the linked id of the user if already created in Panora system or user's info in your system
/>
4

You’ll be asked for two informations: an email and an Origin User Identifier. The Origin User Identifier is the id of the user you’re inviting, as represented in your systems.
5

Click Generate. You can now share the link!
The connection will show as status until the user connects to a platform. We recommend listening to webhooks to get notified once a user connects.