Merge branch 'master' into lychee-test

docusaurus.config.js

@@ -92,6 +92,23 @@ module.exports = {
                 sidebarPath: require.resolve('./sources/academy/sidebars.js'),
             },
         ],
+        () => ({
+            configureWebpack() {
+                return {
+                    module: {
+                        rules: [
+                            {
+                                test: /@apify-packages\/ui-components\/.*/,
+                                resolve: {
+                                    fullySpecified: false,
+                                },
+                                loader: 'babel-loader',
+                            },
+                        ],
+                    },
+                };
+            },
+        }),
         // TODO this should be somehow computed from all the external sources
         // [
         //     '@docusaurus/plugin-client-redirects',

package.json

@@ -56,7 +56,7 @@
         "typescript": "^5.1.3"
     },
     "dependencies": {
-        "@apify-packages/ui-components": "0.75.17",
+        "@apify-packages/ui-components": "^0.86.0",
         "@apify/docsearch-apify-docs": "3.5.3",
         "@docusaurus/core": "^2.4.1",
         "@docusaurus/plugin-client-redirects": "^2.4.1",

sources/platform/integrations/api.md

@@ -5,8 +5,6 @@ sidebar_position: 11.01
 slug: /integrations/api
 ---
 
-# API
-
 **Learn how to integrate with Apify using the REST API.**
 
 ---
@@ -27,7 +25,7 @@ To access the Apify API in your integrations, you need to authenticate using you
 
 ## Authentication
 
-There are 2 ways how to authenticate the Apify API. You can either pass the token via the `Authorization` HTTP header or the URL `token` query parameter. We always recommend you use the authentication via the HTTP header as this method is more secure.
+You can authenticate the Apify API in two ways. You can either pass the token via the `Authorization` HTTP header or the URL `token` query parameter. We always recommend you use the authentication via the HTTP header as this method is more secure.
 
 > **IMPORTANT**: **Do not share the API token with untrusted parties, or use it directly from client-side code,
 unless you fully understand the consequences!**

sources/platform/integrations/chatgpt.md

@@ -1,7 +1,8 @@
 ---
-title: ChatGPT plugin
+title: Apify ChatGPT plugin
+sidebar_lbel: ChatGPT plugin
 description: Let ChatGPT access up-to-date information on the web. Fetch Google Search results, crawl smaller websites, query web pages found, and download individual web pages or files.
-sidebar_position: 11.23
+sidebar_position: 11.21
 slug: /integrations/chatgpt-plugin
 ---
 

sources/platform/integrations/drive.md

@@ -1,12 +1,11 @@
 ---
 title: Google Drive
+sidebar_label: Google Drive
 description: Learn how to integrate Apify with Google Drive
-sidebar_position: 11.15
+sidebar_position: 11.17
 slug: /integrations/drive
 ---
 
-# Google Drive integration
-
 **Learn how to integrate your Apify Actors with Google Drive. This article shows you how to automatically save results to your drive when an Actor run succeeds.**
 
 ---

sources/platform/integrations/flowise.md

@@ -1,12 +1,10 @@
 ---
 title: Flowise
 description: Learn how to integrate Apify with Flowise.
-sidebar_position: 11.22
+sidebar_position: 11.19
 slug: /integrations/flowise
 ---
 
-# Flowise
-
 **Learn how to integrate Apify with Flowise.**
 
 ---

sources/platform/integrations/github.md

@@ -1,12 +1,11 @@
 ---
 title: GitHub
+sidebar_label: GitHub
 description: Learn how to integrate your Apify Actors with GitHub. This article shows you how to automatically create an issue in your repo when an Actor run fails.
 sidebar_position: 11.11
 slug: /integrations/github
 ---
 
-# GitHub integration
-
 **Learn how to integrate your Apify Actors with GitHub. This article shows you several possible integrations.**
 
 ---

sources/platform/integrations/gmail.md

@@ -1,12 +1,11 @@
 ---
 title: Gmail
+sidebar_label: Gmail
 description: Learn how to integrate Apify with Gmail
-sidebar_position: 11.14
+sidebar_position: 11.16
 slug: /integrations/gmail
 ---
 
-# Gmail integration
-
 **Learn how to integrate your Apify Actors with Gmail. This article shows you how to automatically send an email with results when an Actor run succeeds.**
 
 ---

sources/platform/integrations/langchain.md

@@ -1,12 +1,11 @@
 ---
-title: LangChain
+title: 🦜🔗 LangChain
+sidebar_label: LangChain
 description: Learn how to integrate Apify with 🦜🔗 LangChain, in order to feed vector databases and LLMs with data crawled from the web.
-sidebar_position: 11.20
+sidebar_position: 11.18
 slug: /integrations/langchain
 ---
 
-# 🦜🔗 LangChain
-
 **Learn how to integrate Apify with LangChain, in order to feed vector databases and LLMs with data crawled from the web.**
 
 ---

sources/platform/integrations/llama.md

@@ -1,12 +1,10 @@
 ---
 title: LlamaIndex
 description: Learn how to integrate Apify with LlamaIndex in order to feed vector databases and LLMs with data crawled from the web.
-sidebar_position: 11.22
+sidebar_position: 11.20
 slug: /integrations/llama
 ---
 
-# LlamaIndex
-
 **Learn how to integrate Apify with LlamaIndex to feed vector databases and LLMs with data crawled from the web.**
 
 ---

sources/platform/integrations/make.md

@@ -1,12 +1,11 @@
 ---
 title: Make
+sidebar_label: Make
 description: Learn how to integrate your Apify Actors with Make.
-sidebar_position: 11.12
+sidebar_position: 11.14
 slug: /integrations/make
 ---
 
-# Make integration
-
 **Learn how to integrate your Apify Actors with Make.**
 
 ---

sources/platform/integrations/slack.md

@@ -1,12 +1,11 @@
 ---
 title: Slack
+sidebar_label: Slack
 description: Learn how to integrate your Apify Actors with Slack. This article guides you from installation through to automating your whole workflow in Slack.
-sidebar_position: 11.13
+sidebar_position: 11.15
 slug: /integrations/slack
 ---
 
-# Integration for Slack
-
 **Learn how to integrate your Apify Actors with Slack. This article guides you from installation through to automating your whole workflow in Slack.**
 
 A tutorial can be found [here](https://help.apify.com/en/articles/6454058-apify-integration-for-slack).

sources/platform/integrations/telegram.md

@@ -0,0 +1,115 @@
+---
+title: Telegram integration through Zapier
+sidebar_label: Telegram
+description: Learn how to integrate your Apify Actors with Zapier.
+sidebar_position: 11.13
+slug: /integrations/telegram
+---
+
+**Learn how to integrate your Apify Actors with Telegram through Zapier.**
+
+---
+
+With [Apify integration for Zapier](https://zapier.com/apps/apify/integrations), you can connect your Apify Actors to Slack, Trello, Google Sheets, Dropbox, Salesforce, and loads more.
+
+Your Zapier workflows can start Apify Actors or tasks, fetch items from a dataset, set and get records from key-value stores, or find Actor or task runs.
+
+You can use the Zapier integration to trigger a workflow whenever an Actor or a task finishes.
+
+Completementary to the following guide we've created a detailed video, that will guide you through whole process of setting up your Telegram integratin through Zapier.
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/XldEuQleq3c?si=86qbdrzWpVLoY_fr" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
+
+## Connect Apify with Zapier
+
+To use the Apify integration on Zapier, you will need to:
+
+- Have an [Apify account](https://console.apify.com/).
+- Have a [Zapier account](https://zapier.com/).
+
+### Step 1: Create Zap and find Apify on Zapier
+
+Once you have your Zapier account ready and you are successfully logged in, you can create your first Zap.
+
+Go to the Zaps section and find the **Create Zap** button.
+
+In the create Zap form, you can choose whether you want to use Apify as the trigger or action for the Zap.
+
+Click on Trigger and find Apify using the search box.
+
+![Zapier choosing source of trigger](./images/zapier-trigger.png)
+
+You have two possible triggers that you can choose while setting up your Telegram integration
+
+- Finished Actor Run - triggers upon the completion of a selected Actor run.
+
+- Finished Task Run - triggers upon the completion of a selected Actor task run.
+
+![Zapier choosing trigger event](./images/zapier-zap-choose-event.png)
+
+:::info Available Actors & Tasks
+
+Please note that only Actors or Actor tasks that you previously run will be available to choose from.
+
+:::
+
+### Step 2: Create a connection to your Apify account
+
+The next step is to connect your Apify account.
+
+Click on the "Sign in" button next to the Connect to Apify title. Or you can select an account if you already have one connected.
+
+The connection configuration options open in a new tab in your browser or in a modal window.
+
+![Apify Zapier connection](./images/zapier-new-connection.png)
+
+In connection configuration, you need to provide your Apify API Token. You can find the token in Apify Console by navigating to **Settings > Integrations**.
+
+![Integrations token](./images/apify-integrations-token.png)
+
+Copy the token and paste it into the configuration form and continue with the "Yes, Continue to Apify" button.
+
+The connection is now created and the configuration form closed.
+
+## Connect Telegram bot with Zapier
+
+### Step 1: Create & connect new bot on Telegram
+
+After setting up Apify as your trigger within Zapier, it's time to set up Telegram as the action that will occur based on the trigger.
+
+![Choosing action source within Zapier](./images/zapier-zap-choose-action.png)
+
+You have two possible actions that you can choose while setting up your Telegram integration
+
+- Send Message - sends a message from your bot when trigger activates.
+
+- Send Poll - sends a poll from your bot when trigger activates.
+
+![Zapier choosing action event](./images/zapier-zap-choose-event-2.png)
+
+After you choose your event that will be happening after trigger, you need to connect your Telegram bot that will be responsible for sending the message or sending polls.
+
+![Telegram bot HTTP token](./images/zapier-zap-telegram-access.png)
+
+The best way to do it's to:
+
+1. Start conversation with Telegrams BotFather, a bot that manages bots on Telegram.
+
+    ![BotFather conversation](./images/botfather-start.png)
+
+2. Issue the `/newbot` command in conversation with it and follow the instructions, until you get your HTTP API token.
+
+    ![BotFather conversation with new HTTP API token](./images/botfather-HTTP-API-blurred.png)
+
+
+### Step 2: Create action for your new Telegram bot
+
+Once you've setup your new bot within Zapier, it's time to setup an action.
+
+Start new conversation with your bot and copy the **Chat-Id** and input it within Zapier.
+
+Select **Chat-Id**, **Text Format**, and a **Message Text** that suits your need for example
+
+![Zapier choosing Action event](./images/zapier-zap-action.png)
+
+Once you fill all required fields, you can test your integration and if everything works hit **Publish** and you are done!

sources/platform/integrations/webhooks/actions.md

@@ -27,8 +27,6 @@ For safety reasons, the webhook URL should contain a secret token to ensure only
 
 The payload template is a JSON-like string, whose syntax is extended with the use of variables. This is useful when a custom payload structure is needed, but at the same time dynamic data, that is only known at the time of the webhook's invocation, need to be injected into the payload. Aside from the variables, the string must be a valid JSON.
 
-Variables contained in strings are not injected by default, meaning `"userId": {{userId}}` will result to `"userId": "abf6vtB2nvQZ4nJzo"`, but `"userId": "{{userId}}"` will not. This behavior can be switched on/off by using `shouldInterpolateStrings` field.
-
 The variables need to be enclosed in double curly braces and cannot be chosen arbitrarily. A pre-defined list, [that can be found below](#available-variables), shows all the currently available variables. Using any other variable than one of the pre-defined will result in a validation error.
 
 The syntax of a variable therefore is: `{{oneOfAvailableVariables}}`. The variables support accessing nested properties with dot notation: `{{variable.property}}`.
@@ -68,6 +66,34 @@ The syntax of a variable therefore is: `{{oneOfAvailableVariables}}`. The variab
 }
 ```
 
+#### String interpolation
+
+The payload template _is not_ a valid JSON by default. The resulting payload is, but not the template. In some cases this is limiting, so there is also updated syntax available, that allows to use templates that provide the same functionality, and are valid JSON at the same time.
+
+With this new syntax, the default payload template - resulting in the same payload - looks like this:
+
+```json
+{
+    "userId": "{{userId}}",
+    "createdAt": "{{createdAt}}",
+    "eventType": "{{eventType}}",
+    "eventData": "{{eventData}}",
+    "resource": "{{resource}}"
+}
+```
+
+Notice that `resource` and `eventData` will actually become an object, even though in the template it's a string.
+
+If the string being interpolated only contains the variable, the actual variable value is used in the payload. For example `"{{eventData}}"` results in an object. If the string contains more than just the variable, the string value of the variable will occur in the payload:
+
+```json
+{ "text": "My user id is {{userId}}" }
+{ "text": "My user id is abf6vtB2nvQZ4nJzo" }
+```
+
+
+To turn on this new syntax, use **Interpolate variables in string fields** switch within Apify Console. In API it's called `shouldInterpolateStrings`. The field is always `true` when integrating Actors or tasks.
+
 #### Payload template example
 
 This example shows how you can use the payload template variables to send a custom object that displays the status of a RUN, its ID and a custom property:

sources/platform/integrations/zapier.md

@@ -1,12 +1,11 @@
 ---
 title: Zapier
+sidebar_label: Zapier
 description: Learn how to integrate your Apify Actors with Zapier.
 sidebar_position: 11.12
 slug: /integrations/zapier
 ---
 
-# Zapier integration
-
 **Learn how to integrate your Apify Actors with Zapier.**
 
 ---

src/components/CardWithIcon/styles.module.css

@@ -19,12 +19,16 @@
 }
 
 .cardContentDescription {
-    padding-left: 2.8rem;
+    padding-left: 3.0rem;
 }
 
 .cardContentHeader {
     display: flex;
     align-items: center;
     gap: 0.8rem;
     align-self: stretch;
+}
+
+.cardContentHeader h4 {
+    margin: 0.2rem;
 }

src/components/Cards.module.css

@@ -21,8 +21,9 @@ html[data-theme="dark"] .card-hoverable:hover {
     object-fit: scale-down;
 }
 
-.card-image-container-small {
+.card div.card-image-container-small {
     height: 5rem;
+    padding: 0rem !important;
 }
 
 .card-image-container-small > img {

vale.ini

@@ -2,7 +2,7 @@ StylesPath = .github/styles
 MinAlertLevel = warning
 IgnoredScopes = code, tt, table, tr, td
 
-Vocab = Docs
+vocabularies = Docs
 
 Packages = write-good, Microsoft