Add Activepieces integration for workflow automation

- Add Activepieces fork with SmoothSchedule custom piece
- Create integrations app with Activepieces service layer
- Add embed token endpoint for iframe integration
- Create Automations page with embedded workflow builder
- Add sidebar visibility fix for embed mode
- Add list inactive customers endpoint to Public API
- Include SmoothSchedule triggers: event created/updated/cancelled
- Include SmoothSchedule actions: create/update/cancel events, list resources/services/customers

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
poduck
2025-12-18 22:59:37 -05:00
parent 9848268d34
commit 3aa7199503
16292 changed files with 1284892 additions and 4708 deletions

View File

@@ -0,0 +1,32 @@
---
title: "Show/Hide Pieces"
description: ""
icon: "puzzle"
---
<Snippet file="enterprise-feature.mdx" />
<Snippet file="replace-oauth2-apps.mdx" />
If you would like to only show specific pieces to your embedding users, we recommend you do the following:
<Steps>
<Step title="Tag Pieces">
Tag the pieces you would like to show to your user by going to **Platform Admin -> Setup -> Pieces**, selecting the pieces you would like to tag and hit **Apply Tags**
![Bulk Tag](../resources/screenshots/tag-pieces.png)
</Step>
<Step title="Add Tags to Provision Token">
You need to specify the tags of pieces in the token, check how to generate token in [provisioning users](./provision-users).
You should specify the `pieces` claim like this:
```json
{
/// Other claims
"piecesFilterType": "ALLOWED",
"piecesTags": [ "free" ]
}
```
Each time the token is used by the embedding SDK, it will sync all pieces with these tags to the token's project.
The project will only contain the pieces that contain these tags.
</Step>
</Steps>

View File

@@ -0,0 +1,91 @@
---
title: "Embed Builder"
description: ""
icon: "wrench"
---
<Snippet file="enterprise-feature.mdx" />
This documentation explains how to embed the Activepieces iframe inside your application and customize it.
## Configure SDK
Adding the embedding SDK script will initialize an object in your window called `activepieces`, which has a method called `configure` that you should call after the container has been rendered.
<Tip>
The following scripts shouldn't contain the `async` or `defer` attributes.
</Tip>
<Tip>
These steps assume you have already generated a JWT token from the backend. If not, please check the [provision-users](./provision-users) page.
</Tip>
```html
<script src="https://cdn.activepieces.com/sdk/embed/0.8.1.js">
</script>
<script>
const instanceUrl = 'YOUR_INSTANCE_URL';
const jwtToken = 'GENERATED_JWT_TOKEN';
const containerId = 'YOUR_CONTAINER_ID';
activepieces.configure({
instanceUrl,
jwtToken,
prefix: "/",
embedding: {
containerId,
builder: {
disableNavigation: false,
hideFlowName: false
},
dashboard: {
hideSidebar: false
},
hideFolders: false,
navigation: {
handler: ({ route }) => {
// The iframe route has changed, make sure you check the navigation section.
}
}
},
});
</script>
```
<Tip>
`configure` returns a promise which is resolved after authentication is done.
</Tip>
<Tip>
Please check the [navigation](./navigation) section, as it's very important to understand how navigation works and how to supply an auto-sync experience.
</Tip>
**Configure Parameters:**
| Parameter Name | Required | Type | Description |
| --- | --- | --- | --- |
| instanceUrl| ✅ | string | The url of the instance hosting Activepieces, could be https://cloud.activepieces.com if you are a cloud user. |
| jwtToken | ✅ | string | The jwt token you generated to authenticate your users to Activepieces. |
| prefix | ❌ | string | Some customers have an embedding prefix, like this `<embedding_url_prefix>/<Activepieces_url>`. For example if the prefix is `/automation` and the Activepieces url is `/flows` the full url would be `/automation/flows`. |
| embedding.containerId | ❌ | string | The html element's id that is going to be containing Activepieces's iframe. |
| embedding.builder.disableNavigation | ❌ | boolean \| `keep_home_button_only` | Hides the folder name, home button (if not set to [`keep_home_button_only`](./sdk-changelog#20%2F05%2F2025-0-4-0)) and delete option in the builder, by default it is false. |
| embedding.builder.hideFlowName | ❌ | boolean | Hides the flow name and flow actions dropdown in the builder's header, by default it is false. |
| embedding.builder.homeButtonClickedHandler | ❌ | `()=>void` | Callback that stops home button from navigating to dashboard and overrides it with this handler (added in [0.4.0](./sdk-changelog#20%2F05%2F2025-0-4-0))
| embedding.builder.homeButtonIcon | ❌ | `logo` \| `back` | if set to **`back`** the tooltip shown on hovering the home button is removed (added in [0.5.0](./sdk-changelog#03%2F07%2F2025-0-5-0))
| embedding.dashboard.hideSidebar | ❌ | boolean | Controls the visibility of the sidebar in the dashboard, by default it is false. |
| embedding.dashboard.hideFlowsPageNavbar | ❌ | boolean | Controls the visibility of the navbar showing flows,issues and runs above the flows table in the dashboard, by default it is false. (added in [0.6.0](./sdk-changelog#07%2F07%2F2025-0-6-0)) |
| embedding.dashboard.hidePageHeader | ❌ | boolean | Hides the page header in the dashboard by default it is false. (added in [0.8.0](./sdk-changelog#09%2F21%2F2025-0-8-0)) |
| embedding.hideFolders | ❌ | boolean | Hides all things related to folders in both the flows table and builder by default it is false. |
| embedding.styling.fontUrl | ❌ | string | The url of the font to be used in the embedding, by default it is `https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap`. |
| embedding.styling.fontFamily | ❌ | string | The font family to be used in the embedding, by default it is `Roboto`. |
| embedding.styling.mode | ❌ | `light` \| `dark` | Controls light/dark mode (added in [0.5.0](./sdk-changelog#03%2F07%2F2025-0-5-0))|
| embedding.hideExportAndImportFlow | ❌ | boolean | Hides the option to export or import flows (added in [0.4.0](./sdk-changelog#20%2F05%2F2025-0-4-0)) |
| embedding.hideDuplicateFlow | ❌ | boolean | Hides the option to duplicate a flow (added in [0.5.0](./sdk-changelog#03%2F07%2F2025-0-5-0))|
| embedding.locale | ❌ | `en` \| `nl` \| `de` \| `fr` \| `es` \| `ja` \| `zh` \| `pt` \| `zh-TW` \| `ru` \| | it takes [ISO 639-1](https://en.wikipedia.org/wiki/List_of_ISO_639_language_codes) locale codes (added in [0.5.0](./sdk-changelog#03%2F07%2F2025-0-5-0))|
| navigation.handler | ❌ | `({route:string}) => void` | This callback will be triggered each time a route in Activepieces changes, you can read more about it [here](/embedding/navigation) |
<Tip>
For the font to be loaded, you need to set both the `fontUrl` and `fontFamily` properties.
If you only set one of them, the default font will be used.
The default font is `Roboto`.
The font weights we use are the default font-weights from [tailwind](https://tailwindcss.com/docs/font-weight).
</Tip>

View File

@@ -0,0 +1,74 @@
---
title: "Create/Update Connections"
description: ""
icon: "cards"
---
<Info>
**Requirements:**
* Activepieces version 0.34.5 or higher
* SDK version 0.3.2 or higher
</Info>
<Snippet file="replace-oauth2-apps.mdx" />
<Info>
"connectionName" is the externalId of the connection (you can get it by hovering the connection name in the connections table). <br />
We kept the same parameter name for backward compatibility, anyone upgrading their instance from < 0.35.1, will not face issues in that regard.
</Info>
<Warning>
**Breaking Change:** <br/><br/> If your Activepieces instance version is < 0.45.0 and (you are using the connect method from the embed sdk, and need the connection externalId to be returned after the user creates it OR if you want to reconnect a specific connection with an externalId), you must upgrade your instance to >= 0.45.0
</Warning>
- You can use the embedded SDK in your SaaS to allow your users to create connections and store them in Activepieces.
<Steps>
<Step title="Initialize the SDK">
Follow the instructions in the [Embed Builder](./embed-builder).
</Step>
<Step title="Call Connect Method">
After initializing the SDK, you will have access to a property called `activepieces` inside your `window` object. Call its `connect` method to open a new connection dialog as follows.
```html
<script>
activepieces.connect({pieceName:'@activepieces/piece-google-sheets'});
</script>
```
**Connect Parameters:**
| Parameter Name | Required | Type | Description |
| -------------- | -------- | ------ | ------------------------------------------- |
| pieceName | ✅ | string | The name of the piece you want to create a connection for.
| connectionName | ❌ | string | The external Id of the connection (you can get it by hovering the connection name in the connections table), when provided the connection created/upserted will use this as the external Id and display name.
| newWindow | ❌ | \{ width?: number, height?: number, top?: number, left?: number \} | If set the connection dialog will be opened in a new window instead of an iframe taking the full page.
**Connect Result**
The `connect` method returns a `promise` that resolves to the following:
```ts
{
connection?: {
id: string,
name: string
}
}
```
<Info>
`name` is the externalId of the connection.
`connection` is undefined if the user closes the dialog and doesn't create a connection.
</Info>
<Tip>
You can use the `connections` piece in the builder to retrieve the created connection using its name.
![Connections in Builder](/resources/screenshots/connections-piece.png)
![Connections in Builder](/resources/screenshots/connections-piece-usage.png)
</Tip>
</Step>
</Steps>

View File

@@ -0,0 +1,87 @@
---
title: "Navigation"
description: ""
icon: "signs-post"
---
By default, navigating within your embedded instance of Activepieces doesn't affect the client's browser history or viewed URL. Activepieces only provide a **handler**, that trigger on every route change in the **iframe**.
## Automatically Sync URL
You can use the following snippet when configuring the SDK, which will implement a handler that syncs the Activepieces iframe with your browser:
<Tip>
The following snippet listens when the user clicks backward, so it syncs the route back to the iframe using `activepieces.navigate` and in the handler, it updates the URL of the browser.
</Tip>
```js
const instanceUrl = 'YOUR_INSTANCE_URL';
const jwtToken = 'YOUR_GENERATED_JWT_TOKEN';
const containerId = 'YOUR_CONTAINER_ID';
activepieces.configure({
instanceUrl,
jwtToken,
embedding: {
containerId,
builder: {
disableNavigation: false,
hideFlowName: false
},
dashboard: {
hideSidebar: false
},
hideFolders: false,
navigation: {
handler: ({ route }) => {
//route can include search params at the end of it
if (!window.location.href.endsWith(route)) {
window.history.pushState({}, "", window.location.origin + route);
}
}
}
},
});
window.addEventListener("popstate", () => {
const route = activepieces.extractActivepiecesRouteFromUrl({ vendorUrl: window.location.href });
activepieces.navigate({ route });
});
```
## Navigate Method
If you use `activepieces.navigate({ route: '/flows' })` this will tell the embedded sdk where to navigate to.
Here is the list for routes the sdk can navigate to:
| Route | Description |
| --- | --- |
| `/flows` | Flows table
| `/flows/{flowId}` | Opens up a flow in the builder
| `/runs` | Runs table
| `/runs/{runId}` | Opens up a run in the builder
| `/connections` | Connections table
| `/tables` | Tables table
| `/tables/{tableId}` | Opens up a table
| `todos` | Todos table
| `todos/{todoId}` | Opens up a todo
## Navigate to Initial Route
You can call the `navigate` method after initializing the sdk using the `configure` sdk:
```js
const flowId = '1234';
const instanceUrl = 'YOUR_INSTANCE_URL';
const jwtToken = 'YOUR_GENERATED_JWT_TOKEN';
activepieces.configure({
instanceUrl,
jwtToken,
}).then(() => {
activepieces.navigate({
route: `/flows/${flowId}`
})
});
```

View File

@@ -0,0 +1,33 @@
---
title: 'Overview'
description: 'Understanding how embedding works'
icon: "cube"
---
<Snippet file="enterprise-feature.mdx" />
This section provides an overview of how to embed the Activepieces builder in your application and automatically provision the user.
The embedding process involves the following steps:
<Steps>
<Step title="Provision Users" >
Generate a JSON Web Token (JWT) to identify your customer and pass it to the SDK, read more [here](./provision-users).
</Step>
<Step title="Embed Builder">
You can use the SDK to embed and customize Activepieces in your SaaS, read more [here](./embed-builder).
</Step>
</Steps>
Here is an example of how it looks like in one of the SaaS that embed Activepieces:
![Embedding Example](../resources/screenshots/embedding-example.png)
<Tip>
In case, you need to gather connections from your users in your SaaS. You can do this with the SDK. Find more info [here](./embed-connections).
</Tip>
<Tip>
If you are looking for a way to communicate between Activpieces and the SaaS embedding it through a piece, we recommend you check the [custom property doc](/build-pieces/piece-reference/properties#custom-property-beta)
</Tip>

View File

@@ -0,0 +1,257 @@
---
title: "Predefined Connection"
icon: "Link"
---
Use predefined connections to allow users to access your piece in the embedded app without re-entering authentication credentials.
The high-level steps are:
- Create a global connection for a project using the API in the platform admin. Only platform admins can edit or delete global connections.
- (Optional) Hide the connections dropdown in the piece settings.
### Prerequisites
- [Run the Enterprise Edition](/handbook/engineering/playbooks/run-ee)
- [Create your piece](/build-pieces/building-pieces/overview). Later we will customize the piece logic to use predefined connections.
### Create a Predefined Connection
<Steps>
<Step title="Create an API Key">
Go to **Platform Admin → Security → API Keys** and create an API key. Save it for use in the next step.
![Create API Key](/resources/screenshots/create-api-key.png)
</Step>
<Step title="Create a Global Connection via API">
Add the following snippet to your backend to create a global connection each time you generate the <b>JWT token</b>.
The snippet does the following:
- Create Project If it doesn't exist.
- Create a global connection for the project with certain naming convention.
```js
const apiKey = 'YOUR_API_KEY';
const instanceUrl = 'https://cloud.activepieces.com';
// The name of the user / organization in your SAAS
const externalProjectId = 'org_1234';
const pieceName = '@activepieces/piece-gelato';
// This will depend on what your piece auth type is, can be one of this ['PLATFORM_OAUTH2','SECRET_TEXT','BASIC_AUTH','CUSTOM_AUTH']
const pieceAuthType = "CUSTOM_AUTH"
const connectionProps = {
// Fill in the props required by your piece's auth
}
const { id: projectId, externalId } = await getOrCreateProject({
projectExternalId: externalProjectId,
apiKey,
instanceUrl,
});
await createGlobalConnection({
projectId,
externalProjectId,
apiKey,
instanceUrl,
pieceName,
props,
pieceAuthType
});
```
Implementation:
```js
async function getOrCreateProject({
projectExternalId,
apiKey,
instanceUrl,
}: {
projectExternalId: string,
apiKey: string,
instanceUrl: string
}): Promise<{ id: string, externalId: string }> {
const projects = await fetch(`${instanceUrl}/api/v1/projects?externalId=${projectExternalId}`, {
method: 'GET',
headers: {
'Authorization': `Bearer ${apiKey}`,
'Content-Type': 'application/json'
},
})
.then(response => response.json())
.then(data => data.data)
.catch(err => {
console.error('Error fetching projects:', err);
return [];
});
if (projects.length > 0) {
return {
id: projects[0].id,
externalId: projects[0].externalId
};
}
const newProject = await fetch(`${instanceUrl}/api/v1/projects`, {
method: 'POST',
headers: {
'Authorization': `Bearer ${apiKey}`,
'Content-Type': 'application/json'
},
body: JSON.stringify({
displayName: projectExternalId,
metadata: {},
externalId: projectExternalId
})
})
.then(response => response.json())
.catch(err => {
console.error('Error creating project:', err);
throw err;
});
return {
id: newProject.id,
externalId: newProject.externalId
};
}
async function createGlobalConnection({
projectId,
externalProjectId,
apiKey,
instanceUrl,
pieceName,
props,
pieceAuthType
}: {
projectId: string,
externalProjectId: string,
apiKey: string,
instanceUrl: string,
pieceName: string,
props: Record<string, any>,
pieceAuthType
}) {
const displayName = 'Gelato Connection';
const connectionExternalId = 'gelato_' + externalProjectId;
return fetch(`${instanceUrl}/api/v1/global-connections`, {
method: 'POST',
headers: {
'Authorization': `Bearer ${apiKey}`,
'Content-Type': 'application/json'
},
body: JSON.stringify({
displayName,
pieceName,
metadata: {},
type: pieceAuthType,
value: {
type: pieceAuthType,
props
},
scope: 'PLATFORM',
projectIds: [projectId],
externalId: connectionExternalId
})
});
}
```
</Step>
</Steps>
### Hide the Connections Dropdown (Optional)
<Steps>
<Step title="Modify Trigger / Action Definition">
Wherever you call `createTrigger` or `createAction` set `requireAuth` to `false`, this will hide the connections dropdown in the piece settings in the builder,
next we need to fetch it based on a naming convention.
</Step>
<Step title="Fetch the connection">
Here is example how you can fetch the connection value based on naming convention, make sure this naming convention is followed when creating a global connection.
```js
import {
ConnectionsManager,
Property,
TriggerStrategy
} from "@activepieces/pieces-framework";
import {
createTrigger
} from "@activepieces/pieces-framework";
import {
isNil
} from "@activepieces/shared";
// Add this import from the index.ts file, where it contains the definition of the auth object.
import { auth } from '../..';
const fetchConnection = async (
connections: ConnectionsManager,
projectExternalId: string | undefined,
): Promise<PiecePropValueSchema<typeof auth>> => {
if (isNil(projectExternalId)) {
throw new Error('This project is missing an external id');
}
// the naming convention here is gelato_projectExternalId
const connection = await connections.get(`gelato_${projectExternalId}`);
if (isNil(connection)) {
throw new Error(`Connection not found for project ${projectExternalId}`);
}
return connection as PiecePropValueSchema<typeof auth>;
};
export const newFlavorCreated = createTrigger({
requireAuth: false,
name: 'newFlavorCreated',
displayName: 'new flavor created',
description: 'triggers when a new icecream flavor is created.',
props: {
dropdown: Property.Dropdown({
displayName: 'Dropdown',
required: true,
refreshers: [],
options: async (_, {
connections,
project
}) => {
const connection = await fetchConnection(connections, (await project.externalId()));
// your logic
return {
options: [{
label: 'test',
value: 'test'
}]
}
}
})
},
sampleData: {},
type: TriggerStrategy.POLLING,
async test({connections,project}) {
const connection = await fetchConnection(connections, (await project.externalId()));
// use the connection with your own logic
return []
},
async onEnable({connections,project}) {
const connection = await fetchConnection(connections, (await project.externalId()));
// use the connection with your own logic
},
async onDisable({connections,project}) {
const connection = await fetchConnection(connections, (await project.externalId()));
// use the connection with your own logic
},
async run({connections,project}) {
const connection = await fetchConnection(connections, (await project.externalId()));
// use the connection with your own logic
return []
},
});
```
</Step>
</Steps>

View File

@@ -0,0 +1,113 @@
---
title: "Provision Users"
description: "Automatically authenticate your SaaS users to your Activepieces instance"
icon: 'user'
---
<Snippet file="enterprise-feature.mdx" />
## Overview
In Activepieces, there are **Projects** and **Users**. Each project is provisioned with their corresponding workspace, project, or team in your SaaS. The users are then mapped to the respective users in Activepieces.
To achieve this, the backend will generate a signed token that contains all the necessary information to automatically create a user and project. If the user or project already exists, it will skip the creation and log in the user directly.
<Steps>
<Step title="Step 1: Obtain Signing Key">
You can generate a signing key by going to **Platform Settings -> Signing Keys -> Generate Signing Key**.
This will generate a public and private key pair. The public key will be used by Activepieces to verify the signature of the JWT tokens you send. The private key will be used by you to sign the JWT tokens.
![Create Signing Key](../resources/screenshots/create-signing-key.png)
<Warning>
Please store your private key in a safe place, as it will not be stored in Activepieces.
</Warning>
</Step>
<Step title="Step 2: Generate a JWT">
The signing key will be used to generate JWT tokens for the currently logged-in user on your website, which will then be sent to the Activepieces Iframe as a query parameter to authenticate the user and exchange the token for a longer lived token.
To generate these tokens, you will need to add code in your backend to generate the token using the RS256 algorithm, so the JWT header would look like this:
<Tip>
To obtain the `SIGNING_KEY_ID`, refer to the signing key table and locate the value in the first column.
![Signing Key ID](../resources/screenshots/signing-key-id.png)
</Tip>
```json
{
"alg": "RS256",
"typ": "JWT",
"kid": "SIGNING_KEY_ID"
}
```
The signed tokens must include these claims in the payload:
```json
{
"version": "v3",
"externalUserId": "user_id",
"externalProjectId": "user_project_id",
"firstName": "John",
"lastName": "Doe",
"role": "EDITOR",
"piecesFilterType": "NONE",
"exp": 1856563200,
"tasks": 50000,
"aiCredits": 250
}
```
| Claim | Description |
|-------------------|-------------------------------------------------|
| externalUserId | Unique identification of the user in **your** software |
| externalProjectId | Unique identification of the user's project in **your** software |
| projectDisplayName| Display name of the user's project |
| firstName | First name of the user |
| lastName | Last name of the user |
| role | Role of the user in the Activepieces project (e.g., **EDITOR**, **VIEWER**, **ADMIN**) |
| exp | Expiry timestamp for the token (Unix timestamp) |
| piecesFilterType | Customize the project pieces, check [customize pieces](/embedding/customize-pieces) |
| piecesTags | Customize the project pieces, check [customize pieces](/embedding/customize-pieces) |
| tasks | Customize the tasks limit for your user's project |
| aiCredits | Customize the ai credits limit for your user's project |
You can use any JWT library to generate the token. Here is an example using the jsonwebtoken library in Node.js:
<Tip>
**Friendly Tip #1**: You can also use this [tool](https://dinochiesa.github.io/jwt/) to generate a quick example.
</Tip>
<Tip>
**Friendly Tip #2**: Make sure the expiry time is very short, as it's a temporary token and will be exchanged for a longer-lived token.
</Tip>
```javascript Node.js
const jwt = require('jsonwebtoken');
// JWT NumericDates specified in seconds:
const currentTime = Math.floor(Date.now() / 1000);
let token = jwt.sign(
{
version: "v3",
externalUserId: "user_id",
externalProjectId: "user_project_id",
firstName: "John",
lastName: "Doe",
role: "EDITOR",
piecesFilterType: "NONE",
exp: currentTime + (60 * 60), // 1 hour from now
},
process.env.ACTIVEPIECES_SIGNING_KEY,
{
algorithm: "RS256",
header: {
kid: signingKeyID, // Include the "kid" in the header
},
}
);
```
Once you have generated the token, please check the embedding docs to know how to embed the token in the iframe.
</Step>
</Steps>

View File

@@ -0,0 +1,129 @@
---
title: "SDK Changelog"
description: "A log of all notable changes to Activepieces SDK"
icon: "code-commit"
---
<Warning>
**Breaking Change:** <br></br> <br></br> If your Activepieces image version is < 0.45.0 and (you are using the connect method from the embed SDk, and need the connection externalId to be returned after the user creates it OR if you want to reconnect a specific connection with an externalId), you must upgrade your Activepieces image to >= 0.45.0
</Warning>
<Warning>
Between Acitvepieces image version 0.32.1 and 0.46.4 the navigation handler was including the project id in the path, this might have broken implementation logic for people using the navigation handler, this has been fixed from 0.46.5 and onwards, the handler won't show the project id prepended to routes.
</Warning>
Change log format: MM/DD/YYYY (version)
### 10/27/2025 (0.8.1)
- SDK URL: https://cdn.activepieces.com/sdk/embed/0.8.1.js
- Fixed a bug where if you didn't start your navigation route with '/' it would redirect you to '/flows'
### 09/21/2025 (0.8.0)
- SDK URL: https://cdn.activepieces.com/sdk/embed/0.8.0.js
- This version requires you to **upgrade Activepieces to [0.70.0](https://github.com/activepieces/activepieces/releases/tag/0.70.0)**.
- Removed `embedding.dashboard.hideSettings`.
- Added `embedding.dashboard.hidePageHeader` parameter to the [configure](./embed-builder#configure-parameters) method **(value: true | false)**.
### 07/30/2025 (0.7.0)
- SDK URL: https://cdn.activepieces.com/sdk/embed/0.7.0.js
- This version requires you to **upgrade Activepieces to [0.66.7](https://github.com/activepieces/activepieces/releases/tag/0.66.7)**
- Added `embedding.dashboard.hideSettings` parameter to the [configure](./embed-builder#configure-parameters) method **(value: true | false)**.
### 07/07/2025 (0.6.0)
- SDK URL: https://cdn.activepieces.com/sdk/embed/0.6.0.js
- This version requires you to **upgrade Activepieces to [0.66.1](https://github.com/activepieces/activepieces/releases/tag/0.66.1)**
- Added `embedding.dashboard.hideFlowsPageNavbar` parameter to the [configure](./embed-builder#configure-parameters) method **(value: true | false)**.
- **(Breaking Change)** `embedding.dashboard.hideSidebar` used to hide the navbar above the flows table in the dashboard now it relies on `embedding.dashboard.hideFlowsPageNavbar`.
### 03/07/2025 (0.5.0)
- SDK URL: https://cdn.activepieces.com/sdk/embed/0.5.0.js
- This version requires you to **upgrade Activepieces to [0.64.2](https://github.com/activepieces/activepieces/releases/tag/0.64.2)**
- Added `embedding.hideDuplicateFlow` parameter to the [configure](./embed-builder#configure-parameters) method **(value: true | false)**.
- Added `embedding.builder.homeButtonIcon` parameter to the [configure](./embed-builder#configure-parameters) method **(value: 'logo' | 'back')**, if set to **'back'** the tooltip shown on hovering the home button is removed.
- Added `embedding.locale` parameter to the [configure](./embed-builder#configure-parameters) method, it takes [ISO 639-1](https://en.wikipedia.org/wiki/List_of_ISO_639_language_codes) locale codes, here are the ones supported: **('en' | 'nl' | 'it' | 'de' | 'fr' | 'bg' | 'uk' | 'hu' | 'es' | 'ja' | 'id' | 'vi' | 'zh' | 'pt')**
- Added `embedding.styling.mode` parameter to [configure](./embed-builder#configure-parameters) method **(value: 'light' | 'dark')**
- **(Breaking Change)** Removed `embedding.builder.hideLogo` parameter from the [configure](./embed-builder#configure-parameters) method.
- **(Breaking Change)** Removed MCP methods from sdk.
### 17/06/2025 (0.5.0-rc.1)
- SDK URL: https://cdn.activepieces.com/sdk/embed/0.5.0-rc.1.js
- This version requires you to **upgrade Activepieces to [0.64.0-rc.0](https://github.com/activepieces/activepieces/pkgs/container/activepieces/438888138?tag=0.64.0-rc.0)**
- Revert back the `prefix` parameter from the [configure](./embed-builder#configure-parameters) method.
### 16/06/2025 (0.5.0-rc.0)
- SDK URL: https://cdn.activepieces.com/sdk/embed/0.5.0-rc.0.js
- This version requires you to **upgrade Activepieces to [0.64.0-rc.0](https://github.com/activepieces/activepieces/pkgs/container/activepieces/438888138?tag=0.64.0-rc.0)**
- Added `embedding.hideDuplicateFlow` parameter to the [configure](./embed-builder#configure-parameters) method **(value: true | false)**.
- Added `embedding.builder.homeButtonIcon` parameter to the [configure](./embed-builder#configure-parameters) method **(value: 'logo' | 'back')**, if set to **'back'** the tooltip shown on hovering the home button is removed.
- Added `embedding.locale` parameter to the [configure](./embed-builder#configure-parameters) method, it takes [ISO 639-1](https://en.wikipedia.org/wiki/List_of_ISO_639_language_codes) locale codes, here are the ones supported: **('en' | 'nl' | 'it' | 'de' | 'fr' | 'bg' | 'uk' | 'hu' | 'es' | 'ja' | 'id' | 'vi' | 'zh' | 'pt')**
- Added `embedding.styling.mode` parameter to [configure](./embed-builder#configure-parameters) method **(value: 'light' | 'dark')**
- **(Breaking Change)** Removed `prefix` parameter from the [configure](./embed-builder#configure-parameters) method.
- **(Breaking Change)** Removed `embedding.builder.hideLogo` parameter from the [configure](./embed-builder#configure-parameters) method.
### 26/05/2025 (0.4.1)
- Fixed an issue where sometimes the embed HTML file was getting cached.
### 20/05/2025 (0.4.0)
-- Note: we didn't consider adding optional new parameters as a breaking change so we were bumping the patch version, but that was wrong and we will begin bumping the minor version for those changes from now on, and patch version will only get bumped for bug fixes.
- This version requires you to update Activepieces to 0.56.0
- Added `embedding.hideExportAndImportFlow` parameter to the [configure](./embed-builder#configure-parameters) method.
- Added new possible value to the configure method param `embed.builder.disableNavigation` which is "keep_home_button_only" that keeps only the home button and hides the folder name with the delete flow action.
- Added new param to the configure method `embed.builder.homeButtonClickedHandler`, that overrides the navigation behaviour on clicking the home button.
### 17/04/2025 (0.3.7)
- Added MCP methods to update MCP configurations.
### 16/04/2025 (0.3.6)
- Added the [request](./sdk-server-requests) method which allows you to call our backend API.
### 24/2/2025 (0.3.5)
- Added a new parameter to the connect method to make the connection dialog a popup instead of an iframe taking the full page.
- Fixed a bug where the returned promise from the connect method was always resolved to \{connection: undefined\}
- Now when you use the connect method with the "connectionName" parameter, the user will reconnect to the connection with the matching externalId instead of creating a new one.
### 04/02/2025 (0.3.4)
- This version requires you to update Activepieces to 0.41.0
- Adds the ability to pass font family name and font url to the embed sdk
### 26/01/2025 (0.3.3)
- This version requires you to update Activepieces to 0.39.8
- activepieces.configure method was being resolved before the user was authenticated, this is fixed now, so you can use activepieces.navigate method to navigate to your desired initial route.
### 04/12/2024 (0.3.0)
- add custom navigation handler ([#4500](https://github.com/activepieces/activepieces/pull/4500))
- allow passing a predefined name for connection in connect method ([#4485](https://github.com/activepieces/activepieces/pull/4485))
- add changelog ([#4503](https://github.com/activepieces/activepieces/pull/4503))

View File

@@ -0,0 +1,46 @@
---
title: "API Requests"
description: "Send requests to your Activepieces instance from the embedded app"
icon: "server"
---
<Info>
**Requirements:**
* Activepieces version 0.34.5 or higher
* SDK version 0.3.6 or higher
</Info>
You can use the embedded SDK to send requests to your instance and retrieve data.
<Steps>
<Step title="Initialize the SDK">
Follow the instructions in the [Embed Builder](./embed-builder) to initialize the SDK.
</Step>
<Step title="Call (request) Method">
```html
<script>
activepieces.request({path:'/flows',method:'GET'}).then(console.log);
</script>
```
**Request Parameters:**
| Parameter Name | Required | Type | Description |
| -------------- | -------- | ------ | ------------------------------------------- |
| path | ✅ | string | The path within your instance you want to hit (we prepend the path with your_instance_url/api/v1)
| method | ✅ | string | The http method to use 'GET', 'POST','PUT', 'DELETE', 'OPTIONS', 'PATCH' and 'HEAD
| body | ❌ | JSON object | The json body of your request
| queryParams | ❌ | Record\<string,string\> | The query params to include in your request
</Step>
</Steps>