Skip to content

Commit c9f1f36

Browse files
committed
fix: changed tab spaces from 3 to 2
1 parent 9d0a237 commit c9f1f36

File tree

1 file changed

+61
-61
lines changed
  • sources/platform/integrations/workflows-and-notifications

1 file changed

+61
-61
lines changed

sources/platform/integrations/workflows-and-notifications/bubble.md

Lines changed: 61 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -51,16 +51,16 @@ For security, avoid hardcoding the token in action settings. Store it on the `Us
5151

5252
1. In Bubble, go to **Data → Data types**, open `User`.
5353
1. Add a new field, for example `apify_api_token` (type: text).
54-
- ![Bubble data type](../images/bubble/data_type_api_key.png)
54+
- ![Bubble data type](../images/bubble/data_type_api_key.png)
5555
1. Go to **Data → Privacy** and check if only the **Current User** is allowed to view their own `apify_api_token`.
56-
- ![Bubble data type](../images/bubble/data_privacy.png)
56+
- ![Bubble data type](../images/bubble/data_privacy.png)
5757

5858
### Point Apify actions to the saved token
5959

6060
When configuring Apify actions in a workflow (check out screenshot below), set the token field dynamically to:
6161

6262
- `Current User's apify_api_token`
63-
- ![Current User's API token](../images/bubble/data_select_user_api_key.png)
63+
- ![Current User's API token](../images/bubble/data_select_user_api_key.png)
6464

6565

6666
## Using the integration
@@ -72,14 +72,14 @@ Once the plugin is configured, you can start building automated workflows.
7272
Apify's Bubble plugin exposes two ways to interact with Apify:
7373

7474
- **Actions (workflow steps)**: Executed inside a Bubble workflow (both page workflows and backend workflows). Use these to trigger side effects like running an Actor or Task, or creating a webhook. They run during the workflow execution and can optionally wait for the result (if timeout is greater than 0).
75-
- Examples: **Run Actor**, **Run Actor Task**, **Create Webhook**, **Delete Webhook**.
76-
- Location in Bubble: **Workflow editor → Add an action → Plugins → Apify**
77-
- ![Apify Plugin's actions](../images/bubble/plugin_actions.png)
75+
- Examples: **Run Actor**, **Run Actor Task**, **Create Webhook**, **Delete Webhook**.
76+
- Location in Bubble: **Workflow editor → Add an action → Plugins → Apify**
77+
- ![Apify Plugin's actions](../images/bubble/plugin_actions.png)
7878

7979
- **Data calls (data sources)**: Used as data sources in element properties and expressions. They fetch data from Apify and return it as lists/objects that you can bind to UI (for example, a repeating group) or use inside expressions.
80-
- Examples: **Fetch Data From Dataset JSON As Data**, **List Actor Runs**, **Get Record As Text/Image/File** from key-value store, **List User Datasets/Actors/Tasks**.
81-
- Location in Bubble: In any property input where a data source is expected click **Insert dynamic data**, under **Data sources** select **Get Data from an External API**, and choose the desired Apify data call.
82-
- ![Apify Plugin's data calls](../images/bubble/data_calls_preview.png)
80+
- Examples: **Fetch Data From Dataset JSON As Data**, **List Actor Runs**, **Get Record As Text/Image/File** from key-value store, **List User Datasets/Actors/Tasks**.
81+
- Location in Bubble: In any property input where a data source is expected click **Insert dynamic data**, under **Data sources** select **Get Data from an External API**, and choose the desired Apify data call.
82+
- ![Apify Plugin's data calls](../images/bubble/data_calls_preview.png)
8383

8484
:::tip Inline documentation
8585

@@ -93,11 +93,11 @@ Each Apify plugin action and data call input in Bubble includes inline documenta
9393
Dynamic values are available across Apify plugin fields. Use Bubble's **Insert dynamic data** to bind values from your app.
9494

9595
- For instance you can source values from:
96-
- **Page/UI elements**: inputs, dropdowns, multi-selects, radio buttons, checkboxes
97-
- **Database Things and fields**
98-
- **Current User**
99-
- **Previous workflow steps** (e.g., Step 1's Run Actor result's `defaultDatasetId` or `runId`)
100-
- **Get Data from an External API**: data calls
96+
- **Page/UI elements**: inputs, dropdowns, multi-selects, radio buttons, checkboxes
97+
- **Database Things and fields**
98+
- **Current User**
99+
- **Previous workflow steps** (e.g., Step 1's Run Actor result's `defaultDatasetId` or `runId`)
100+
- **Get Data from an External API**: data calls
101101

102102
#### Examples
103103

@@ -122,38 +122,38 @@ When inserting dynamic data, Bubble replaces the selected text. Place your curso
122122
Create workflows that run Apify plugin actions in response to events in your Bubble app, such as button clicks or form submissions.
123123

124124
1. Open the **Workflow** tab and create a new workflow (for example, **When Run button is clicked**).
125-
- You can also click `Add workflow` button:
126-
- ![Adding workflow to button](../images/bubble/button_adding_workflow.png)
127-
- Or you can create it manually: `Workflows``+ New``An element is clicked`
128-
- ![Create workflow](../images/bubble/create_workflow.png)
129-
- Then select the correct UI button.
130-
- ![Adding workflow to button](../images/bubble/button_creating_workflow.png)
125+
- You can also click `Add workflow` button:
126+
- ![Adding workflow to button](../images/bubble/button_adding_workflow.png)
127+
- Or you can create it manually: `Workflows``+ New``An element is clicked`
128+
- ![Create workflow](../images/bubble/create_workflow.png)
129+
- Then select the correct UI button.
130+
- ![Adding workflow to button](../images/bubble/button_creating_workflow.png)
131131
1. Click `Add an action``Plugins` → choose one of the Apify actions:
132-
- For example `Run Actor` (run a specific Actor by ID)
133-
- ![Add action to workflow](../images/bubble/add_action_to_workflow.png)
132+
- For example `Run Actor` (run a specific Actor by ID)
133+
- ![Add action to workflow](../images/bubble/add_action_to_workflow.png)
134134
1. Configure the action:
135-
- **API token**: set to `Current User's apify_api_token` (check out the Step 2.3)
136-
- **Actor or Task**: paste an Actor ID
137-
- **Input overrides**: provide JSON and use dynamic expressions from page elements or things
138-
- **Timeout**: set in seconds (0 means no limit). Due to Bubble workflow time limits, set this explicitly. If you do not want to restrict the call duration, set it to 0.
135+
- **API token**: set to `Current User's apify_api_token` (check out the Step 2.3)
136+
- **Actor or Task**: paste an Actor ID
137+
- **Input overrides**: provide JSON and use dynamic expressions from page elements or things
138+
- **Timeout**: set in seconds (0 means no limit). Due to Bubble workflow time limits, set this explicitly. If you do not want to restrict the call duration, set it to 0.
139139

140140
### Where to find your IDs
141141

142142
Find IDs directly in Apify Console. Each resource page shows the ID in the API panel and in the page URL.
143143

144144
- **Actor ID**: Actor detail page → API panel or URL.
145-
- Example URL: `https://console.apify.com/actors/<actorId>`
146-
- Actor name format: owner/name (e.g., `apify/website-scraper`)
145+
- Example URL: `https://console.apify.com/actors/<actorId>`
146+
- Actor name format: owner/name (e.g., `apify/website-scraper`)
147147
- **Task ID**: Task detail page → API panel or URL.
148-
- Example URL: `https://console.apify.com/actors/tasks/<taskId>`
148+
- Example URL: `https://console.apify.com/actors/tasks/<taskId>`
149149
- **Dataset ID**: Storage → Datasets → Dataset detail → API panel or URL.
150-
- Example URL: `https://console.apify.com/storage/datasets/<datasetId>`
151-
- Also available in the table in `Storage → Datasets` page
150+
- Example URL: `https://console.apify.com/storage/datasets/<datasetId>`
151+
- Also available in the table in `Storage → Datasets` page
152152
- **Key-value store ID**: Storage → Key-value stores → Store detail → API panel or URL.
153-
- Example URL: `https://console.apify.com/storage/key-value-stores/<storeId>`
154-
- Also available in the table in `Storage → Key-value stores` page
153+
- Example URL: `https://console.apify.com/storage/key-value-stores/<storeId>`
154+
- Also available in the table in `Storage → Key-value stores` page
155155
- **Webhook ID**: Actors → Actor → Integrations.
156-
- Example URL: `https://console.apify.com/actors/<actor_id>/integrations/<webhook_id>`
156+
- Example URL: `https://console.apify.com/actors/<actor_id>/integrations/<webhook_id>`
157157

158158
You can also discover IDs via the plugin responses and data calls (e.g., **List User Datasets**, **List Actor Runs**), which return objects with `id` fields you can pass into other actions/data calls.
159159

@@ -175,12 +175,12 @@ There are two common approaches:
175175

176176
- This example lists the current user's datasets and displays them in a repeating group.
177177
- Add a **Repeating group** to the page.
178-
1. Add data to a variable: create a custom state (for example, on the page) that will hold the list of datasets, and set it to the plugin's **List User Datasets** data call.
179-
- ![Step 1 — Set variable with user's datasets](../images/bubble/user_dataset_repeating_group_set.png)
180-
1. Set the type: in the repeating group's settings, set **Type of content** to match the dataset object your variable returns.
181-
- ![Step 2 — Repeating group type of content](../images/bubble/user_dataset_repeating_group.png)
182-
1. Bind the variable: set the repeating group's **Data source** to the variable from Step 1.
183-
- ![Step 3 — Repeating group data source](../images/bubble/user_dataset_repeating_group_source.png)
178+
1. Add data to a variable: create a custom state (for example, on the page) that will hold the list of datasets, and set it to the plugin's **List User Datasets** data call.
179+
- ![Step 1 — Set variable with user's datasets](../images/bubble/user_dataset_repeating_group_set.png)
180+
1. Set the type: in the repeating group's settings, set **Type of content** to match the dataset object your variable returns.
181+
- ![Step 2 — Repeating group type of content](../images/bubble/user_dataset_repeating_group.png)
182+
1. Bind the variable: set the repeating group's **Data source** to the variable from Step 1.
183+
- ![Step 3 — Repeating group data source](../images/bubble/user_dataset_repeating_group_source.png)
184184
- Inside the repeating group cell, bind dataset fields (for example, `Current cell's item name`, `id`, `createdAt`).
185185
- ![Step 4 — Repeating group data cell](../images/bubble/user_dataset_repeating_group_cell.png)
186186

@@ -200,30 +200,30 @@ Use this URL as the Apify webhook target. Configure the webhook's authentication
200200

201201

202202
1. Trigger the scrape without waiting
203-
- In a workflow, add **Run Actor** (or **Run Actor Task**) and set **timeout** to 0.
204-
- Actor ID: `aYG0l9s7dbB7j3gbS` (`apify/website-content-crawler`).
205-
- Input: copy the Actor's input from the Actor's Input page, and map `crawlerType` and `url` to values from your UI.
206-
- ![Run scraping actor](../images/bubble/step1_scraping.png)
203+
- In a workflow, add **Run Actor** (or **Run Actor Task**) and set **timeout** to 0.
204+
- Actor ID: `aYG0l9s7dbB7j3gbS` (`apify/website-content-crawler`).
205+
- Input: copy the Actor's input from the Actor's Input page, and map `crawlerType` and `url` to values from your UI.
206+
- ![Run scraping actor](../images/bubble/step1_scraping.png)
207207
1. Notify Bubble when the run finishes
208-
- Create an Apify **Webhook** with event `ACTOR.RUN.SUCCEEDED`.
209-
- Set `actorId` from the Step 1 result.
210-
- Set `databaseId` from the Step 1 result, where actor will store the result.
211-
- Set `idempotencyKey` to random value.
212-
- Set `requestUrl` to your Bubble backend workflow URL, for example: `https://your-app.bubbleapps.io/version-test/api/1.1/wf/webhook`.
213-
- ![Create a webhook](../images/bubble/step2_scraping.png)
208+
- Create an Apify **Webhook** with event `ACTOR.RUN.SUCCEEDED`.
209+
- Set `actorId` from the Step 1 result.
210+
- Set `databaseId` from the Step 1 result, where actor will store the result.
211+
- Set `idempotencyKey` to random value.
212+
- Set `requestUrl` to your Bubble backend workflow URL, for example: `https://your-app.bubbleapps.io/version-test/api/1.1/wf/webhook`.
213+
- ![Create a webhook](../images/bubble/step2_scraping.png)
214214
1. Receive the webhook in Bubble and store the dataset ID
215-
- Create a public data type, for example, `ScrapingResults`.
216-
- Add a text field, for example, `result`, to store the dataset ID from the webhook.
217-
- ![Create a datatype with new field](../images/bubble/step3_scraping.png)
218-
- Create the backend workflow (`webhook`) that Bubble exposes at `/api/1.1/wf/webhook`. The workflow name defines the API route.
219-
- ![Create a backend webhook](../images/bubble/step4_scraping.png)
220-
- In that workflow, for each received webhook call, create a new thing in `ScrapingResults` and set `result` to the dataset ID from the request body. This stores one `datasetId` per call for later processing.
221-
- ![Add new result](../images/bubble/step5_scraping.png)
215+
- Create a public data type, for example, `ScrapingResults`.
216+
- Add a text field, for example, `result`, to store the dataset ID from the webhook.
217+
- ![Create a datatype with new field](../images/bubble/step3_scraping.png)
218+
- Create the backend workflow (`webhook`) that Bubble exposes at `/api/1.1/wf/webhook`. The workflow name defines the API route.
219+
- ![Create a backend webhook](../images/bubble/step4_scraping.png)
220+
- In that workflow, for each received webhook call, create a new thing in `ScrapingResults` and set `result` to the dataset ID from the request body. This stores one `datasetId` per call for later processing.
221+
- ![Add new result](../images/bubble/step5_scraping.png)
222222
1. Pick up the results asynchronously
223-
- In a (periodic) backend workflow, search `ScrapingResults` for pending entries (or for the expected `datasetId`).
224-
- If found, read its `result` (the `datasetId`), fetch items via the appropriate action (for example, **Fetch Data From Dataset JSON As Action**), update the UI or save to your DB, and then delete that `ScrapingResults` entry to avoid reprocessing.
225-
- If not found yet, do nothing and check again later.
226-
- ![Do every time](../images/bubble/step6_scraping.png)
223+
- In a (periodic) backend workflow, search `ScrapingResults` for pending entries (or for the expected `datasetId`).
224+
- If found, read its `result` (the `datasetId`), fetch items via the appropriate action (for example, **Fetch Data From Dataset JSON As Action**), update the UI or save to your DB, and then delete that `ScrapingResults` entry to avoid reprocessing.
225+
- If not found yet, do nothing and check again later.
226+
- ![Do every time](../images/bubble/step6_scraping.png)
227227

228228
This approach avoids Bubble timeouts, keeps the UI responsive, and scales to larger scrapes.
229229

0 commit comments

Comments
 (0)