connector task react component (#3980)

* connector task react component

* fix broken link

* adjust existing references in connectors docs

* resolve build

* add actual react component reference

docs/components/connectors/out-of-the-box-connectors/amazon-dynamodb.md

@@ -17,7 +17,9 @@ Use Camunda secrets to store credentials so you don't expose sensitive informati
 
 ## Create an Amazon DynamoDB Connector task
 
-To use the **Amazon DynamoDB Connector** in your process, either change the type of existing task by clicking on it and using the **wrench-shaped** change type context menu icon, or create a new Connector task by using the **Append Connector** context menu. Follow our [guide to using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your Amazon DynamoDB Connector executable
 

docs/components/connectors/out-of-the-box-connectors/amazon-eventbridge.md

@@ -30,7 +30,9 @@ Use Camunda secrets to avoid exposing your AWS IAM credentials as plain text. Re
 
 ## Create an Amazon EventBridge Connector task
 
-To use the **Amazon EventBridge Connector** in your process, you can either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task by using the **Append Connector** context menu. Refer to our [guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Configure the Amazon EventBridge Connector
 

docs/components/connectors/out-of-the-box-connectors/amazon-sagemaker.md

@@ -28,9 +28,9 @@ Use Camunda secrets to store credentials and avoid exposing sensitive informatio
 
 ## Create an Amazon SageMaker Connector task
 
-To use the **Amazon SageMaker Connector** in your process, either change the type of existing task by clicking on it
-and using the wrench-shaped **Change type** context menu icon, or create a new Connector task using the
-**Append Connector** context menu. Follow our [guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your Amazon SageMaker Connector executable
 

docs/components/connectors/out-of-the-box-connectors/amazon-sns.md

@@ -28,7 +28,9 @@ Use Camunda secrets to avoid exposing your AWS IAM credentials as plain text. Re
 
 ## Create an Amazon SNS Connector task
 
-To use the **Amazon SNS Connector** in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task by using the **Append Connector** context menu. Follow our [guide to using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your Amazon SNS Connector for sending messages executable
 

docs/components/connectors/out-of-the-box-connectors/amazon-sqs.md

@@ -30,7 +30,9 @@ Use Camunda secrets to avoid exposing your AWS IAM credentials as plain text. Re
 
 ## Create an Amazon SQS Connector task
 
-To use the **Amazon SQS Connector** in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task by using the **Append Connector** context menu. Follow our [guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your Amazon SQS Connector for sending messages executable
 

docs/components/connectors/out-of-the-box-connectors/asana.md

@@ -17,9 +17,9 @@ Use Camunda secrets to avoid exposing your Asana personal access token as plain
 
 ## Create an Asana Connector task
 
-To use the **Asana Connector** in your process, either change the type of existing task by clicking on it and using
-the wrench-shaped **Change type** context menu icon, or create a new Connector task by using the **Append Connector** context menu.
-Follow our [guide to using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Authentication
 

docs/components/connectors/out-of-the-box-connectors/automation-anywhere.md

@@ -12,7 +12,9 @@ You also need a user account with the `AAE_Queue Admin` role to query and manage
 
 ## Create an Automation Anywhere Connector task
 
-To use an **Automation Anywhere Connector** in your process, either change the type of existing task using the wrench-shaped **Change type** context menu or create a new Connector task by using the **Append Connector** context menu. Follow [our guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your Automation Anywhere Connector executable
 

docs/components/connectors/out-of-the-box-connectors/aws-lambda.md

@@ -16,7 +16,9 @@ Use Camunda secrets to avoid exposing your AWS IAM credentials as plain text. Re
 
 ## Create an AWS Lambda Connector task
 
-To use an **AWS Lambda Connector** in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task by using the **Append Connector** context menu. Follow our [guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Invoking your AWS Lambda function
 

docs/components/connectors/out-of-the-box-connectors/azure-open-ai.md

@@ -25,7 +25,9 @@ Learn more at the [official Azure OpenAI portal entry](https://learn.microsoft.c
 
 ## Create an Azure OpenAI Connector task
 
-To use the **Azure OpenAI Connector** in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task using the **Append Connector** context menu. Follow our [guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your Azure OpenAI Connector executable
 

docs/components/connectors/out-of-the-box-connectors/blueprism.md

@@ -10,7 +10,9 @@ To start using the Connector, you must have a running Blue Prism instance config
 
 ## Create a Blue Prism Connector task
 
-To use a **Blue Prism Connector** in your process, either change the type of existing task using the wrench-shaped **Change type** context menu, or create a new Connector task using the **Append Connector** context menu. Follow [our guide on using Connectors](../use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Authentication
 

docs/components/connectors/out-of-the-box-connectors/easy-post.md

@@ -17,7 +17,9 @@ Use Camunda secrets to avoid exposing your EasyPost API key as plain text. Refer
 
 ## Create an EasyPost Connector task
 
-To use the **EasyPost Connector** in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task using the **Append Connector** context menu. Follow our [guide to using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Authentication
 

docs/components/connectors/out-of-the-box-connectors/github.md

@@ -29,7 +29,9 @@ Refer to our documentation on [managing secrets](/components/console/manage-clus
 
 ## Create a GitHub Connector task
 
-To use the **GitHub Connector** in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task using the **Append Connector** context menu. Follow our [guide to using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Authentication
 

docs/components/connectors/out-of-the-box-connectors/gitlab.md

@@ -18,7 +18,9 @@ Use Camunda secrets to avoid exposing your GitLab access token credentials as pl
 
 ## Create a GitLab Connector task
 
-To use the **GitLab Connector** in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task by using the **Append Connector** context menu. Follow our [guide to using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Add endpoint and authentication
 

docs/components/connectors/out-of-the-box-connectors/google-maps-platform.md

@@ -9,7 +9,9 @@ The **Google Maps Platform Connector** in an inbound Connector that allows you t
 
 ## Create a Google Maps Platform Connector task
 
-To use a **Google Maps Platform Connector** in your process, either change the type of existing task using the wrench-shaped **Change type** context menu or create a new Connector task by using the **Append Connector** context menu. Follow [our guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your Google Maps Platform Connector executable
 

docs/components/connectors/out-of-the-box-connectors/google-sheets.md

@@ -30,8 +30,9 @@ Currently, the Google Sheets Connector supports next operations:
 - [Get spreadsheet details](#get-spreadsheet-details)
 - [Get worksheet data](#get-worksheet-data)
 
-To use a **Google Sheets Connector** in your process, either change the type of existing task by clicking on it and
-using the wrench-shaped **Change type** context menu icon or create a new Connector task by using the **Append Connector** context menu. Follow our [guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your Google Sheets Connector executable
 

docs/components/connectors/out-of-the-box-connectors/googledrive.md

@@ -14,7 +14,9 @@ To start working with the **Google Drive Connector**, a relevant OAuth token mus
 
 Currently, the Google Drive Connector supports two types of operations: create a folder and create a file from a template.
 
-To use a **Google Drive Connector** in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon or create a new Connector task by using the **Append Connector** context menu. Follow our [guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your Google Drive Connector executable
 

docs/components/connectors/out-of-the-box-connectors/hugging-face.md

@@ -16,9 +16,9 @@ and a model deployed with [Inference API](https://huggingface.co/docs/api-infere
 
 ## Create a Hugging Face Connector task
 
-To use the **Hugging Face Connector** in your process, either change the type of existing task by clicking on it
-and using the wrench-shaped **Change type** context menu icon, or create a new Connector task using the
-**Append Connector** context menu. Follow our [guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your Hugging Face Connector executable
 

docs/components/connectors/out-of-the-box-connectors/kafka.md

@@ -25,7 +25,9 @@ Use Camunda secrets to avoid exposing your sensitive data as plain text. Follow
 
 ## Create a Kafka Producer Connector task
 
-To use the **Kafka Producer Connector** in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task by using the **Append Connector** context menu. Follow our [guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your Kafka Producer Connector for publishing messages executable
 

docs/components/connectors/out-of-the-box-connectors/microsoft-o365-mail.md

@@ -22,7 +22,9 @@ Refer to our documentation on [managing secrets](/components/console/manage-clus
 
 ## Create a Microsoft 365 Connector task
 
-To use the **Microsoft 365 Connector** in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task by using the **Append Connector** context menu. Follow our [guide to using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Access control
 

docs/components/connectors/out-of-the-box-connectors/microsoft-teams.md

@@ -22,8 +22,9 @@ Use Camunda secrets to store credentials so you don't expose sensitive informati
 
 ## Create a Microsoft Teams Connector task
 
-To use the **Microsoft Teams Connector** in your process, either change the type of existing task by clicking on it and
-using the wrench-shaped **Change type** context menu icon, or create a new Connector task by using the **Append Connector** context menu. Follow our [guide to using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your Microsoft Teams Connector executable
 

docs/components/connectors/out-of-the-box-connectors/openai.md

@@ -20,7 +20,9 @@ Use Camunda secrets to avoid exposing your sensitive data, such as your OpenAI A
 
 ## Create an OpenAI Connector task
 
-To use the **OpenAI Connector** in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task using the **Append Connector** context menu. Follow our [guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your OpenAI Connector executable
 

docs/components/connectors/out-of-the-box-connectors/operate.md

@@ -28,8 +28,9 @@ Use Camunda secrets to store credentials so you don't expose sensitive informati
 
 ## Create an Operate Connector task
 
-To use the **Operate Connector** in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task using the **Append Connector** context menu.
-Follow our [guide to using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Enter your cluster information
 

docs/components/connectors/out-of-the-box-connectors/rabbitmq-outbound.md

@@ -29,9 +29,9 @@ Ensure you enter the correct exchange name and routing key, as the **RabbitMQ Co
 
 ## Create a RabbitMQ Connector task
 
-To use the **RabbitMQ Connector** in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task by using the **Append Connector** context menu.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
 
-Follow our [guide to using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+<ConnectorTask/>
 
 ## Connecting to RabbitMQ and sending messages
 
@@ -129,7 +129,7 @@ Using Camunda secrets to store credentials is recommended so you do not expose s
 
 ## Create a RabbitMQ Connector event
 
-To use the **RabbitMQ Consumer Connector** in your process, either change the type of existing event by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector event using the **Append Connector** context menu. Follow our [guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+See [create a RabbitMQ Connector task](#create-a-rabbitmq-connector-task) for additional details.
 
 1. Add a **Start Event** or an **Intermediate Event** to your BPMN diagram to get started.
 2. Change its template to a RabbitMQ Connector.

docs/components/connectors/out-of-the-box-connectors/salesforce.md

@@ -16,9 +16,9 @@ Use Camunda secrets to avoid exposing your _Salesforce Connected App_ client ID
 
 ## Create a Salesforce Connector task
 
-To use the **Salesforce Connector** in your process, either change the type of existing task by clicking on it and using
-the wrench-shaped **Change type** context menu icon, or create a new Connector task by using the **Append Connector** context menu.
-Follow our [guide to using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Instance
 

docs/components/connectors/out-of-the-box-connectors/sendgrid.md

@@ -21,7 +21,9 @@ The SendGrid Connector comes with two options:
 
 #### Create a SendGrid Email Connector Task
 
-To use a **SendGrid Connector** in your process, either change the type of an existing task to **SendGrid: Send Email** using the wrench-shaped **Change type** context menu, or create a new **SendGrid: Send Email** Connector task using the **Append Connector** context menu. Follow [our guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 #### Make your SendGrid Email Connector executable
 
@@ -81,7 +83,7 @@ While you are editing your template, you can test how your email would look by s
 
 #### Create a SendGrid Email template Connector task
 
-To use this **SendGrid Connector** in your process, either change the type of an existing task to **SendGrid: Send Email via Template** using the wrench-shaped **Change type** context menu, or create a new **SendGrid: Send Email via Template** Connector task by using the **Append Connector** context menu. Follow [our guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+See [create a SendGrid email Connector task](#create-a-sendgrid-email-connector-task) for additional details.
 
 #### Make your SendGrid Email Template Connector executable
 

docs/components/connectors/out-of-the-box-connectors/slack.md

@@ -23,7 +23,9 @@ To use the Slack Connector, a Slack app must be registered with the Slack worksp
 
 ## Create a Slack Connector task
 
-To use a **Slack Connector** in your process, either change the type of an existing task by clicking on it and using the wrench-shaped **Change type** context menu, or create a new Connector task by using the **Append Connector** context menu. Follow [our guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your Slack Connector executable
 

docs/components/connectors/out-of-the-box-connectors/sql.md

@@ -15,7 +15,9 @@ To avoid exposing your sensitive data as plain text, use Camunda secrets. Follow
 
 ## Create an SQL Connector task
 
-To use the **SQL Connector** in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task by using the **Append Connector** context menu. Follow our [guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your SQL Connector executable
 

docs/components/connectors/out-of-the-box-connectors/twilio.md

@@ -28,7 +28,9 @@ Use Camunda secrets to store your account SID and auth token so you don't expose
 
 ## Create a Twilio Connector task
 
-To use the Twilio Connector in your process, either change the type of existing task by clicking on it and using the wrench-shaped **Change type** context menu icon, or create a new Connector task by using the **Append Connector** context menu. Follow our [guide to using Connectors](https://docs.camunda.org/manual/latest/user-guide/process-engine/connectors/) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Make your Twilio Connector executable
 

docs/components/connectors/out-of-the-box-connectors/uipath.md

@@ -12,7 +12,9 @@ To use the **UiPath Connector**, you need to have a [UiPath](https://cloud.uipat
 
 ## Create a UiPath Connector task
 
-To use a **UiPath Connector** in your process, either change the type of existing task using the wrench-shaped **Change type** context menu, or create a new Connector task by using the **Append Connector** context menu. Follow [our guide on using Connectors](/components/connectors/use-connectors/index.md) to learn more.
+import ConnectorTask from '../../../components/react-components/connector-task.md'
+
+<ConnectorTask/>
 
 ## Operation types