Add Integry Apps to an Existing Marketplace

In this guide, we will use the Integry.JS SDK to add an app to an existing integrations marketplace in your app so your users can connect to that app and setup/run integrations with that app.

Before you proceed, please sign up for a free trial (if you haven't).

Set up the SDK

Follow the steps here.

Add an app card in your marketplace

Add a card/button for each app powered by Integry. Your users will click that card/button to access the onwards experience powered by Integry.

Show the Integry app page

Call the showApp() method when a user clicks the card/button.

integry.showApp(
  "hubspot"
  IntegryJS.RenderModes.INLINE,
  "marketplace-container"
).then(() => {
  console.log("Showing Hubspot Flows!");
}).catch((error) => {
  console.error("Failed to launch Slack:", error);
});

Your users will be asked to connect the app (if they haven't already) or select a connected account (if they have connected multiple accounts). They will then be able to setup/run integrations of Flows with that app.

Listen to events

App connected / disconnected

Subscribe to the app-connected and app-disconnected events that are respectively fired when the user connects or disconnects an app to be able to show the connection status on the card (like it's shown in the Integry Apps Marketplace).

integry.eventEmitter.on('app-connected', (data) => {
    console.log("User connected:" + data.name);
});

Integration created

If you are going to send data from your app to another app, you will need to capture (and store) the unique callback URL for the user's integration so you can trigger it from your app.

Subscribe to the integration-created event and get the callbackURL. This event will fire after your user creates an integration. It will not fire if they edit an existing integration.

integry.eventEmitter.on('integration-created', (data) => {
    console.log("Callback URL: " + data.callbackUrl);
});