Merge branch 'appdefinition-architecture-revamp' into feat/react-moveable-integration

.do/deploy.template.yaml

@@ -5,7 +5,7 @@ spec:
     image:
       registry_type: DOCKER_HUB
       registry: tooljet
-      repository: tooljet-ce
+      repository: tooljet
       tag: latest
     run_command: "./server/scripts/digitalocean-postbuild.sh"
     instance_size_slug: "basic-s"

.github/workflows/cypress-appbuilder.yml

@@ -14,7 +14,7 @@ jobs:
   Cypress-App-Builder:
     runs-on: ubuntu-22.04
 
-    if: ${{ github.event.action == 'labeled' && github.event.label.name == 'run-cypress-app-builder' }}
+    if: ${{ github.event.action == 'labeled' && (github.event.label.name == 'run-cypress-app-builder' || github.event.label.name == 'run-cypress') }}
 
     steps:
       - name: Setup Node.js
@@ -191,6 +191,9 @@ jobs:
             sleep 5
           done'
 
+      - name: Seeding
+        run: docker exec Tooljet-app npm run db:seed:prod
+
       - name: Create Cypress environment file
         id: create-json
         uses: jsdaniell/create-json@1.1.2

.github/workflows/cypress-marketplace.yml

@@ -14,7 +14,7 @@ jobs:
   Cypress-Marketplace:
     runs-on: ubuntu-22.04
 
-    if: ${{ github.event.action == 'labeled' && github.event.label.name == 'run-cypress-marketplace' }}
+    if: ${{ github.event.action == 'labeled' && (github.event.label.name == 'run-cypress-marketplace' || github.event.label.name == 'run-cypress') }}
 
     steps:
       - name: Checkout
@@ -82,6 +82,9 @@ jobs:
             sleep 5
           done'
 
+      - name: Seeding
+        run: docker exec Tooljet-app npm run db:seed:prod
+
       - name: Create Cypress environment file
         id: create-json
         uses: jsdaniell/create-json@1.1.2
@@ -178,6 +181,9 @@ jobs:
             sleep 5
           done'
 
+      - name: Seeding
+        run: docker exec Tooljet-app npm run db:seed:prod
+
       - name: Create Cypress environment file
         id: create-json
         uses: jsdaniell/create-json@1.1.2

.github/workflows/cypress-platform.yml

@@ -14,7 +14,7 @@ jobs:
   Cypress-Platform:
     runs-on: ubuntu-22.04
 
-    if: ${{ github.event.action == 'labeled' && github.event.label.name == 'run-cypress-workspace' }}
+    if: ${{ github.event.action == 'labeled' && (github.event.label.name == 'run-cypress-workspace' || github.event.label.name == 'run-cypress') }}
 
     steps:
       - name: Setup Node.js
@@ -195,6 +195,9 @@ jobs:
             sleep 5
           done'
 
+      - name: Seeding
+        run: docker exec Tooljet-app npm run db:seed:prod
+
       - name: Create Cypress environment file
         id: create-json
         uses: jsdaniell/create-json@1.1.2

.github/workflows/docs-pr-app.yml

@@ -1,4 +1,4 @@
-name: Render PR deploy
+name: Render PR deploy Docs
 on:
   pull_request_target:
     types: [labeled, unlabeled, closed]
@@ -47,7 +47,7 @@ jobs:
                 "value": "8.19.2"
               },
               {
-                "key": "GA_MID",
+                "key": "GTM",
                 "value": "dummy"
               }
             ],

.github/workflows/render-preview-deploy.yml

@@ -252,7 +252,7 @@ jobs:
           sudo apt install postgresql-client -y
 
       - name: Wait after installing PostgreSQL
-        run: sleep 25  
+        run: sleep 25
 
       - name: Drop PostgreSQL PR database
         env:
@@ -261,7 +261,12 @@ jobs:
           PGUSER: ${{ secrets.RENDER_DS_PG_USER }}
           PGDATABASE: ${{ env.PR_NUMBER }}
         run: |
-          PGPASSWORD=${{ secrets.RENDER_DS_PG_PASS }} psql -h $PGHOST -p $PGPORT -U $PGUSER -d postgres -c "drop database \"$PGDATABASE\" ;"
+          if PGPASSWORD=${{ secrets.RENDER_DS_PG_PASS }} psql -h $PGHOST -p $PGPORT -U $PGUSER -lqt | cut -d \| -f 1 | grep -qw $PGDATABASE; then
+            echo "Database $PGDATABASE exists, deleting..."
+            PGPASSWORD=${{ secrets.RENDER_DS_PG_PASS }} psql -h $PGHOST -p $PGPORT -U $PGUSER -d postgres -c "drop database \"$PGDATABASE\" ;"
+          else
+            echo "Database $PGDATABASE does not exist."
+          fi
 
   suspend-review-app:
     if: ${{ github.event.action == 'labeled' && github.event.label.name == 'suspend-review-app' }}

.github/workflows/tooljet-docker-develop-build.yml

@@ -8,11 +8,11 @@ on:
   workflow_dispatch:
     inputs:
       job-to-run:
-        description: Enter the job name (tooljet-develop-image/tooljet-server-develop-image)
-        options: ['tooljet-develop-image', 'tooljet-server-develop-image']
+        description: Enter the job name (tooljet-develop-image)
+        options: ["tooljet-develop-image"]
         required: true
 
-jobs:  
+jobs:
   tooljet-develop-image:
     runs-on: ubuntu-latest
     if: |
@@ -63,56 +63,3 @@ jobs:
         run: |
           message="Job '${{ env.JOB_NAME }}' failed! tooljet/tooljet-ce:develop"
           curl -X POST -H 'Content-type: application/json' --data "{\"text\":\"$message\"}" ${{ secrets.SLACK_WEBHOOK_URL_OPS_CHANNEL }}
-
-
-
-  tooljet-server-develop-image:
-      runs-on: ubuntu-latest
-      if: |
-        ${{ github.ref == 'refs/heads/develop' }} &&
-        ${{ github.event_name == 'workflow_dispatch' && github.event.inputs.job-to-run == 'tooljet-server-develop-image' }}
-
-      steps:
-        - name: Checkout code
-          uses: actions/checkout@v2
-          with:
-            ref: refs/heads/develop
-
-        # Create Docker Buildx builder with platform configuration
-        - name: Set up Docker Buildx
-          run: |
-            mkdir -p ~/.docker/cli-plugins
-            curl -SL https://github.com/docker/buildx/releases/download/v0.11.0/buildx-v0.11.0.linux-amd64 -o ~/.docker/cli-plugins/docker-buildx
-            chmod a+x ~/.docker/cli-plugins/docker-buildx
-            docker buildx create --name mybuilder --platform linux/arm64,linux/amd64,linux/amd64/v2,linux/riscv64,linux/ppc64le,linux/s390x,linux/386,linux/mips64le,linux/mips64,linux/arm/v7,linux/arm/v6
-            docker buildx use mybuilder
-
-        - name: Set DOCKER_CLI_EXPERIMENTAL
-          run: echo "DOCKER_CLI_EXPERIMENTAL=enabled" >> $GITHUB_ENV
-          
-        - name: use mybuilder buildx
-          run: docker buildx use mybuilder
-
-        - name: Docker Login
-          uses: docker/login-action@v2
-          with:
-            username: ${{ secrets.DOCKER_USERNAME }}
-            password: ${{ secrets.DOCKER_PASSWORD }}
-
-        - name: Build and Push Docker image
-          uses: docker/build-push-action@v4
-          with:
-            context: .
-            file: docker/server.Dockerfile
-            push: true
-            tags: tooljet/tooljet-server-ce:develop
-            platforms: linux/amd64
-          env:
-            DOCKER_USERNAME: ${{ secrets.DOCKER_USERNAME }}
-            DOCKER_PASSWORD: ${{ secrets.DOCKER_PASSWORD }}
-            
-        - name: Send Slack Notification on Failure
-          if: failure()
-          run: |
-            message="Job '${{ env.JOB_NAME }}' failed! tooljet/tooljet-server-ce:develop"
-            curl -X POST -H 'Content-type: application/json' --data "{\"text\":\"$message\"}" ${{ secrets.SLACK_WEBHOOK_URL_OPS_CHANNEL }}

.github/workflows/tooljet-release-docker-image-build.yml

@@ -8,7 +8,7 @@ on:
     inputs:
       job-to-run:
         description: Enter the job name (tooljet-ce/tooljet-server-ce)
-        options: ["tooljet-ce", "tooljet-server-ce"]
+        options: ["tooljet-ce"]
         required: true
       image:
         description: "Enter the latest image tag"
@@ -68,7 +68,7 @@ jobs:
 
           curl -X POST -H 'Content-type: application/json' --data "{\"text\":\"$message\"}" ${{ secrets.SLACK_WEBHOOK_URL }}
 
-#   #Below code helps to trigger the workflow separately
+  #   #Below code helps to trigger the workflow separately
 
   tooljet-ce:
     runs-on: ubuntu-latest
@@ -121,57 +121,3 @@ jobs:
           fi
 
           curl -X POST -H 'Content-type: application/json' --data "{\"text\":\"$message\"}" ${{ secrets.SLACK_WEBHOOK_URL }}
-
-  tooljet-server-ce:
-    runs-on: ubuntu-latest
-    if: ${{ github.event_name == 'workflow_dispatch' && github.event.inputs.job-to-run == 'tooljet-server-ce' }}
-
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v2
-        with:
-          ref: refs/heads/main
-
-      # Create Docker Buildx builder with platform configuration
-      - name: Set up Docker Buildx
-        run: |
-          mkdir -p ~/.docker/cli-plugins
-          curl -SL https://github.com/docker/buildx/releases/download/v0.11.0/buildx-v0.11.0.linux-amd64 -o ~/.docker/cli-plugins/docker-buildx
-          chmod a+x ~/.docker/cli-plugins/docker-buildx
-          docker buildx create --name mybuilder --platform linux/arm64,linux/amd64,linux/amd64/v2,linux/riscv64,linux/ppc64le,linux/s390x,linux/386,linux/mips64le,linux/mips64,linux/arm/v7,linux/arm/v6
-          docker buildx use mybuilder
-
-      - name: Set DOCKER_CLI_EXPERIMENTAL
-        run: echo "DOCKER_CLI_EXPERIMENTAL=enabled" >> $GITHUB_ENV
-
-      - name: use mybuilder buildx
-        run: docker buildx use mybuilder
-
-      - name: Docker Login
-        uses: docker/login-action@v2
-        with:
-          username: ${{ secrets.DOCKER_USERNAME }}
-          password: ${{ secrets.DOCKER_PASSWORD }}
-
-      - name: Build and Push Docker image
-        uses: docker/build-push-action@v4
-        with:
-          context: .
-          file: docker/server.Dockerfile
-          push: true
-          tags: tooljet/tooljet-server-ce:${{ github.event.inputs.image }},tooljet/tooljet-server-ce:latest
-          platforms: linux/amd64
-        env:
-          DOCKER_USERNAME: ${{ secrets.DOCKER_USERNAME }}
-          DOCKER_PASSWORD: ${{ secrets.DOCKER_PASSWORD }}
-
-      - name: Send Slack Notification
-        run: |
-          if [[ "${{ job.status }}" == "success" ]]; then
-            message="Job '${{ env.JOB_NAME }}' succeeded! tooljet/tooljet-server-ce:${{ github.event.release.tag_name }}"
-          else
-            message="Job '${{ env.JOB_NAME }}' failed! tooljet/tooljet-server-ce:${{ github.event.release.tag_name }}"
-          fi
-
-          curl -X POST -H 'Content-type: application/json' --data "{\"text\":\"$message\"}" ${{ secrets.SLACK_WEBHOOK_URL }}
-          curl -X POST -H 'Content-type: application/json' --data "{\"text\":\"$message\"}" ${{ secrets.SLACK_WEBHOOK_URL }}

.version

@@ -1 +1 @@
-2.22.1
+2.24.0

.vscode/settings.json

@@ -1,27 +1,23 @@
 {
-    "[javascript, typescript]": {
-        "editor.defaultFormatter": "dbaeumer.vscode-eslint",
+  "[javascript, typescript]": {
+    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
+  },
+  "eslint.validate": [
+    "javascript",
+    "javascriptreact",
+    "typescript",
+    "typescriptreact"
+  ],
+  "eslint.format.enable": true,
+  "editor.formatOnSave": false,
+  "json.schemas": [
+    {
+      "fileMatch": ["/*.operations.json"],
+      "url": "https://raw.githubusercontent.com/ToolJet/ToolJet/develop/plugins/schemas/operations.schema.json"
     },
-    "eslint.validate": [
-        "javascript",
-        "javascriptreact",
-        "typescript",
-        "typescriptreact"
-    ],
-    "eslint.format.enable": true,
-    "editor.formatOnSave": true,
-    "json.schemas": [
-        {
-            "fileMatch": [
-                "/*.operations.json"
-            ],
-            "url": "https://raw.githubusercontent.com/ToolJet/ToolJet/develop/plugins/schemas/operations.schema.json"
-        },
-        {
-            "fileMatch": [
-                "/*.manifest.json"
-            ],
-            "url": "https://raw.githubusercontent.com/ToolJet/ToolJet/develop/plugins/schemas/manifest.schema.json"
-        }
-    ]
-}
+    {
+      "fileMatch": ["/*.manifest.json"],
+      "url": "https://raw.githubusercontent.com/ToolJet/ToolJet/develop/plugins/schemas/manifest.schema.json"
+    }
+  ]
+}

README.md

@@ -1,4 +1,4 @@
-ToolJet is an **open-source low-code framework** to build and deploy internal tools with minimal engineering effort. ToolJet's drag and drop frontend builder allows you to create complex, responsive frontends within minutes. Additionally, you can integrate various data sources, including databases like PostgreSQL, MongoDB, and Elasticsearch; API endpoints with OpenAPI spec and OAuth2 support; SaaS tools such as Stripe, Slack, Google Sheets, Airtable, and Notion; as well as object storage services like S3, GCS, and Minio, to fetch and write data.
+ToolJet is an **open-source low-code framework** to build and deploy internal tools with minimal engineering effort. ToolJet's drag-and-drop frontend builder allows you to create complex, responsive frontends within minutes. Additionally, you can integrate various data sources, including databases like PostgreSQL, MongoDB, and Elasticsearch; API endpoints with OpenAPI spec and OAuth2 support; SaaS tools such as Stripe, Slack, Google Sheets, Airtable, and Notion; as well as object storage services like S3, GCS, and Minio, to fetch and write data.
 
 ⭐ If you find ToolJet useful, please consider giving us a star on GitHub! Your support helps us continue to innovate and deliver exciting features.
 
@@ -17,6 +17,10 @@ ToolJet is an **open-source low-code framework** to build and deploy internal to
     <img src="https://user-images.githubusercontent.com/7828962/211444352-4d6d2e4a-13c9-4980-9e16-4aed4af9811b.png"/>
 </p>
 
+<p align="center">
+    <img src="https://github.com/ToolJet/ToolJet/assets/25361949/0e711f3a-edb7-496b-8833-107de3826933"/>
+</p>
+
 <p align="center">
   <kbd>
     <img src="https://user-images.githubusercontent.com/7828962/202402863-2851a072-9dca-4b8b-9473-0d044373928b.png"/>
@@ -59,7 +63,7 @@ ToolJet is an **open-source low-code framework** to build and deploy internal to
 - **Granular access control:** Set permissions at both group and app levels.
 - **Low-code:** Use JS code almost anywhere within the builder, such as setting text color based on status with 
 `status === 'success' ? 'green' : 'red`.
-- **No-code query editors:** Query Editors available for all supported data sources.
+- **No-code query editors:** Query Editors are available for all supported data sources.
 - **Join and transform data:** Transform query results using JavaScript or Python code.
 - **Secure:** All the credentials are securely encrypted using `aes-256-gcm`.
 - **Data Privacy:** ToolJet serves solely as a proxy and does not store data.
@@ -70,7 +74,7 @@ ToolJet is an **open-source low-code framework** to build and deploy internal to
 ## Quickstart
 The easiest way to get started with ToolJet is by creating a [ToolJet Cloud](https://tooljet.com) account. ToolJet Cloud offers a hosted solution of ToolJet. If you want to self-host ToolJet, kindly proceed to [deployment documentation](https://docs.tooljet.com/docs/setup/).
 
-You can deploy ToolJet on Heroku using one-click-deployment.
+You can deploy ToolJet on Heroku using one-click deployment.
 
 <p align="center">
   <a href="https://heroku.com/deploy?template=https://github.com/tooljet/tooljet/tree/main"><img src="https://www.herokucdn.com/deploy/button.svg" alt="Deploy to Heroku" height=32></a>
@@ -103,7 +107,7 @@ Documentation is available at https://docs.tooljet.com.
 - [Component Reference](https://docs.tooljet.com/docs/widgets/button)
 
 ## Self-hosted
-You can use ToolJet Cloud for a fully managed solution. If you want to self-host ToolJet, we have guides on deploying ToolJet on Kubernetes, AWS EC2, Docker, Heroku and more.
+You can use ToolJet Cloud for a fully managed solution. If you want to self-host ToolJet, we have guides on deploying ToolJet on Kubernetes, AWS EC2, Docker, Heroku, and more.
 
 | Provider  | Documentation |
 | :------------- | :------------- |
@@ -132,10 +136,10 @@ For general help using ToolJet, please refer to the official [documentation](htt
 
 - [Slack](https://tooljet.com/slack) - Discussions with the community and the team.
 - [GitHub](https://github.com/ToolJet/ToolJet/issues) - For bug reports and feature requests.
-- [Twitter](https://twitter.com/ToolJet) - Get the product updates easily.
+- [Twitter](https://twitter.com/ToolJet) - Get the product updates quickly.
 
 ## Roadmap
-Check out our [roadmap](https://github.com/ToolJet/ToolJet/projects/2) to stay updated on recently released features and to learn about what's coming next.
+Check out our [roadmap](https://github.com/ToolJet/ToolJet/projects/2) to stay updated on recently released features and learn about what's coming next.
 
 ## Branching model
 We use the git-flow branching model. The base branch is `develop`. If you are looking for a stable version, please use the main branch or tags labeled as v1.x.x.

cypress-tests/cypress.config.js

@@ -19,9 +19,9 @@ module.exports = defineConfig({
   trashAssetsBeforeRuns: true,
 
   e2e: {
-    setupNodeEvents(on, config) {
+    setupNodeEvents (on, config) {
       on("task", {
-        readPdf(pathToPdf) {
+        readPdf (pathToPdf) {
           return new Promise((resolve) => {
             const pdfPath = path.resolve(pathToPdf);
             let dataBuffer = fs.readFileSync(pdfPath);
@@ -33,7 +33,7 @@ module.exports = defineConfig({
       });
 
       on("task", {
-        readXlsx(filePath) {
+        readXlsx (filePath) {
           return new Promise((resolve, reject) => {
             try {
               let dataBuffer = fs.readFileSync(filePath);
@@ -48,7 +48,7 @@ module.exports = defineConfig({
       });
 
       on("task", {
-        deleteFolder(folderName) {
+        deleteFolder (folderName) {
           return new Promise((resolve, reject) => {
             if (fs.existsSync(folderName)) {
               rmdir(folderName, { maxRetries: 10, recursive: true }, (err) => {
@@ -66,7 +66,7 @@ module.exports = defineConfig({
       });
 
       on("task", {
-        updateId({ dbconfig, sql }) {
+        updateId ({ dbconfig, sql }) {
           const client = new pg.Pool(dbconfig);
           return client.query(sql);
         },
@@ -80,7 +80,7 @@ module.exports = defineConfig({
     specPattern: "cypress/e2e/**/*.cy.js",
     downloadsFolder: "cypress/downloads",
     numTestsKeptInMemory: 0,
-    redirectionLimit: 7,
+    redirectionLimit: 10,
     experimentalRunAllSpecs: true,
     trashAssetsBeforeRuns: true,
     experimentalMemoryManagement: true,

cypress-tests/cypress/commands/apiCommands.js

@@ -163,3 +163,21 @@ Cypress.Commands.add("apiCreateWorkspace", (workspaceName, workspaceSlug) => {
     });
   });
 });
+
+Cypress.Commands.add("logoutApi", () => {
+  cy.getCookie("tj_auth_token").then((cookie) => {
+    cy.request(
+      {
+        method: "GET",
+        url: "http://localhost:3000/api/logout",
+        headers: {
+          "Tj-Workspace-Id": Cypress.env("workspaceId"),
+          Cookie: `tj_auth_token=${cookie.value}`,
+        },
+      },
+      { log: false }
+    ).then((response) => {
+      expect(response.status).to.equal(200);
+    });
+  });
+});

cypress-tests/cypress/commands/commands.js

@@ -56,6 +56,8 @@ Cypress.Commands.add("createApp", (appName) => {
 
   cy.get("body").then(($title) => {
     cy.get(getAppButtonSelector($title)).click();
+    cy.clearAndType('[data-cy="app-name-input"]', appName);
+    cy.get('[data-cy="+ Create app"]').click();
   });
   cy.waitForAppLoad();
   cy.skipEditorPopover();
@@ -111,9 +113,9 @@ Cypress.Commands.add(
           .last()
           .click()
           .type(createBackspaceText(text), { delay: 0 }),
-          {
-            delay: 0,
-          };
+        {
+          delay: 0,
+        };
       });
     if (!Array.isArray(value)) {
       cy.wrap(subject).last().type(value, {
@@ -189,9 +191,9 @@ Cypress.Commands.add(
       .invoke("text")
       .then((text) => {
         cy.wrap(subject).type(createBackspaceText(text)),
-          {
-            delay: 0,
-          };
+        {
+          delay: 0,
+        };
       });
   }
 );

cypress-tests/cypress/constants/selectors/common.js

@@ -225,6 +225,7 @@ export const commonSelectors = {
   workspaceConstantsOption: '[data-cy="workspace-constants-list-item"]',
   nameErrorText: '[data-cy="name-error-text"]',
   valueErrorText: '[data-cy="value-error-text"]',
+  releaseButton: '[data-cy="button-release"]',
 };
 
 export const commonWidgetSelector = {

cypress-tests/cypress/constants/texts/manageGroups.js

@@ -37,7 +37,7 @@ export const groupsText = {
   helperTextPermissions:
     "Add app to the group to control permissions for users in this group",
   helperTextAllUsersIncluded:
-    " All users include every users in the app. This list is not editable",
+    " All users within the workspace are included in this list. This list cannot be edited.",
   helperTextAdminAppAccess:
     "Admin has edit access to all apps. These are not editable",
   helperTextAdminPermissions: "Admin has all permissions",

cypress-tests/cypress/constants/texts/workspaceConstants.js

@@ -3,7 +3,7 @@ export const workspaceConstantsText = {
         "To resolve a Workspace constant use {{constants.access_token}}",
     emptyStateHeader: "No Workspace constants yet",
     emptyStateText:
-        "Use Workspace constants seamlessly in both the app builder and global data source connections across ToolJet.",
+        "Use workspace constants seamlessly in both the app builder and data source connections across ToolJet.",
     addNewConstantButton: "Create new constant",
     addConstatntText: "Add new constant in production ",
     constantCreatedToast: "Constant has been created",

cypress-tests/cypress/e2e/ce/appSlug.cy.js

@@ -0,0 +1,39 @@
+import { commonSelectors, commonWidgetSelector } from "Selectors/common";
+import { fake } from "Fixtures/fake";
+import { logout, navigateToAppEditor, verifyTooltip, releaseApp } from "Support/utils/common";
+import { commonText } from "Texts/common";
+import { addNewUserMW } from "Support/utils/userPermissions";
+import { userSignUp } from "Support/utils/onboarding";
+
+describe("App share functionality", () => {
+    const data = {};
+    data.appName = `${fake.companyName} App`;
+    data.firstName = fake.firstName;
+    data.lastName = fake.lastName.replaceAll("[^A-Za-z]", "");
+    data.email = fake.email.toLowerCase();
+    const slug = data.appName.toLowerCase().replace(/\s+/g, "-");
+    const firstUserEmail = data.email
+    const envVar = Cypress.env("environment");
+    // beforeEach(() => {
+    //     cy.appUILogin();
+    // });
+    before(() => {
+        cy.apiLogin();
+        cy.apiCreateApp(data.appName);
+        // cy.visit('/')
+        // logout();
+    })
+
+    it("", () => {
+        cy.openApp(data.appName);
+
+        cy.get('[data-cy="left-sidebar-settings-button"]').click();
+        cy.get('[data-cy="app-slug-label"]').verifyVisibleElement("have.text", "Unique app slug");
+        cy.get('[data-cy="app-slug-input-field"]').verifyVisibleElement("have.value", Cypress.env("appId"));
+        cy.get('[data-cy="app-slug-info-label"]').verifyVisibleElement("have.text", "URL-friendly 'slug' consists of lowercase letters, numbers, and hyphens");
+        cy.get('[data-cy="app-link-label"]').verifyVisibleElement("have.text", "App link");
+        cy.get('[data-cy="app-link-field"]').verifyVisibleElement("have.text", `http://localhost:8082/my-workspace/apps/${Cypress.env("appId")}`)
+
+    })
+
+});

cypress-tests/cypress/e2e/editor/app-version/version.cy.js

@@ -37,12 +37,18 @@ describe("App Version Functionality", () => {
   let currentVersion = "";
   let newVersion = [];
   let versionFrom = "";
-  beforeEach(() => {
-    cy.appUILogin();
+  before(() => {
+    cy.apiLogin();
+    cy.apiCreateApp(data.appName);
+    cy.logoutApi();
   });
+  beforeEach(() => {
+    cy.apiLogin();
+    cy.visit('/my-workspace')
+  })
 
   it("Verify the elements of the version module", () => {
-    cy.createApp(data.appName);
+    navigateToAppEditor(data.appName);
     cy.get(appVersionSelectors.appVersionLabel).should("be.visible");
     cy.get(commonSelectors.appNameInput).verifyVisibleElement(
       "have.value",
@@ -103,6 +109,6 @@ describe("App Version Functionality", () => {
     createNewVersion((newVersion = ["v6"]), (versionFrom = "v3"));
 
     verifyVersionAfterPreview((currentVersion = "v6"));
-    cy.go("back");
+
   });
 });

cypress-tests/cypress/e2e/editor/inspectorHappypath.cy.js

@@ -77,7 +77,7 @@ describe("Editor- Inspector", () => {
     cy.get(multipageSelector.sidebarPageButton).click();
     addNewPage("test_page");
 
-    cy.dragAndDropWidget("Button", 100, 200);
+    cy.dragAndDropWidget("Button", 500, 500);
     selectEvent("On click", "Switch page");
     cy.get('[data-cy="switch-page-label-and-input"] > .select-search')
       .click()
@@ -88,9 +88,12 @@ describe("Editor- Inspector", () => {
 
     addSupportCSAData("query-param-key", "key");
     addSupportCSAData("query-param-value", "value");
+    cy.get('[data-cy="switch-page-label-and-input"] > .select-search')
+      .click()
+      .type("home{enter}");
 
     cy.get('[data-cy="real-canvas"]').click("topRight", { force: true });
-    cy.dragAndDropWidget("Button", 100, 300);
+    cy.dragAndDropWidget("Button", 500, 300);
     selectEvent("On click", "Set variable");
     addSupportCSAData("key", "globalVar");
     addSupportCSAData("variable", "globalVar");
@@ -99,7 +102,7 @@ describe("Editor- Inspector", () => {
     cy.get(commonWidgetSelector.draggableWidget("button2")).click();
 
     cy.get('[data-cy="real-canvas"]').click("topRight", { force: true });
-    cy.dragAndDropWidget("Button", 100, 400);
+    cy.dragAndDropWidget("Button", 500, 400);
     selectEvent("On click", "Set page variable");
     addSupportCSAData("key", "pageVar");
     addSupportCSAData("variable", "pageVar");
@@ -154,7 +157,7 @@ describe("Editor- Inspector", () => {
       });
     });
 
-    cy.dragAndDropWidget("Button", 100, 300);
+    cy.dragAndDropWidget("Button", 500, 300);
     cy.get(commonWidgetSelector.sidebarinspector).click();
     openNode("components");
     cy.get(`[data-cy="inspector-node-button1"] > .mx-1`).realHover();

cypress-tests/cypress/e2e/editor/widget/componentsBasicHappypath.cy.js

@@ -36,7 +36,7 @@ describe("Basic components", () => {
   beforeEach(() => {
     data.appName = `${fake.companyName}-${fake.companyName}-App`;
     cy.apiLogin();
-    cy.apiCreateApp();
+    cy.apiCreateApp(data.appName);
     cy.openApp();
     cy.modifyCanvasSize(900, 900);
     cy.intercept("GET", "/api/comments/*").as("loadComments");
@@ -584,9 +584,9 @@ describe("Basic components", () => {
     verifyComponentWithOutLabel("Tags", "tags1", "tags2", data.appName);
   });
 
-  it("Should verify Textarea", () => {
+  it("Should verify Text area", () => {
     verifyComponentWithOutLabel(
-      "Textarea",
+      "Text area",
       "textarea1",
       "textarea2",
       data.appName

cypress-tests/cypress/e2e/editor/widget/csa.cy.js

@@ -1,5 +1,6 @@
 import { commonSelectors, commonWidgetSelector } from "Selectors/common";
 import { openEditorSidebar } from "Support/utils/commonWidget";
+import { fake } from "Fixtures/fake";
 import {
   selectCSA,
   selectEvent,
@@ -12,13 +13,13 @@ import {
 } from "Support/utils/commonWidget";
 import { verifyComponent } from "Support/utils/basicComponents";
 import { commonWidgetText } from "Texts/common";
-import { fake } from "Fixtures/fake";
 
 describe("Editor- CSA", () => {
   const toolJetImage = "cypress/fixtures/Image/tooljet.png";
   beforeEach(() => {
+    const appName1 = `${fake.companyName}-${fake.companyName}-App`;
     cy.apiLogin();
-    cy.apiCreateApp(`${fake.companyName}-App`);
+    cy.apiCreateApp(appName1);
     cy.openApp();
     cy.get('[data-tooltip-content="Hide query panel"]').click();
   });
@@ -118,7 +119,7 @@ describe("Editor- CSA", () => {
   });
 
   it("Should verify Textarea CSA", () => {
-    cy.dragAndDropWidget("Textarea", 200, 100);
+    cy.dragAndDropWidget("Text area", 200, 100);
     verifyComponent("textarea1");
     cy.get(commonWidgetSelector.draggableWidget("textarea1"))
       .should("be.visible")
@@ -217,7 +218,7 @@ describe("Editor- CSA", () => {
     cy.get('[data-cy="draggable-widget-icon1"]').should("not.be.visible");
   });
 
-  it("Should verify Kanban CSA", () => {
+  it.only("Should verify Kanban CSA", () => {
     cy.viewport(1400, 1900);
 
     cy.dragAndDropWidget("Kanban", 50, 400);

cypress-tests/cypress/e2e/exportImport/import.cy.js

@@ -50,15 +50,20 @@ describe("App Import Functionality", () => {
         );
       }
     });
-    cy.get(importSelectors.importOptionInput).selectFile(toolJetImage, {
+    cy.get(importSelectors.importOptionInput).eq(0).selectFile(toolJetImage, {
       force: true,
     });
     cy.verifyToastMessage(
       commonSelectors.toastMessage,
       importText.couldNotImportAppToastMessage
     );
-
-    cy.get(importSelectors.importOptionInput).selectFile(appFile, {
+    cy.reload();
+    cy.get(importSelectors.dropDownMenu).should("be.visible").click();
+    cy.get(importSelectors.importOptionLabel).verifyVisibleElement(
+      "have.text",
+      importText.importOption
+    );
+    cy.get(importSelectors.importOptionInput).eq(0).selectFile(appFile, {
       force: true,
     });
     cy.get('[data-cy="import-app-title"]').should("be.visible");
@@ -72,6 +77,7 @@ describe("App Import Functionality", () => {
       "contain.value",
       appData.name.toLowerCase()
     );
+    cy.skipEditorPopover();
     cy.modifyCanvasSize(900, 600);
     cy.dragAndDropWidget(buttonText.defaultWidgetText);
     cy.get(appVersionSelectors.appVersionLabel).should("be.visible");

cypress-tests/cypress/e2e/globalDataSources/globalDataSourcePermissions.cy.js

@@ -53,7 +53,7 @@ describe("Global Datasource Manager", () => {
         cy.get(commonSelectors.globalDataSourceIcon).click();
         cy.get(commonSelectors.pageSectionHeader).verifyVisibleElement(
             "have.text",
-            "Data Sources"
+            "Data sources"
         );
         cy.get(dataSourceSelector.allDatasourceLabelAndCount).verifyVisibleElement(
             "have.text",
@@ -109,12 +109,12 @@ describe("Global Datasource Manager", () => {
             .should("eq", "Search Plugins");
 
         cy.get('[data-cy="added-ds-label"]').should(($el) => {
-            expect($el.contents().first().text().trim()).to.eq("Data Sources Added");
+            expect($el.contents().first().text().trim()).to.eq("Data sources added");
         });
         cy.get(dataSourceSelector.addedDsSearchIcon).should("be.visible").click();
         cy.get(dataSourceSelector.AddedDsSearchBar)
             .invoke("attr", "placeholder")
-            .should("eq", "Search for Data Sources");
+            .should("eq", "Search for Data sources");
 
         selectAndAddDataSource(
             "databases",
@@ -223,7 +223,7 @@ describe("Global Datasource Manager", () => {
 
         cy.get(".p-2 > .tj-base-btn")
             .should("be.visible")
-            .and("have.text", "+ Add new data source");
+            .and("have.text", "+ Add new Data source");
         cy.get(".p-2 > .tj-base-btn").click();
 
         selectAndAddDataSource(
@@ -299,12 +299,12 @@ describe("Global Datasource Manager", () => {
         verifyValueOnInspector("student_data", "8 items ");
     });
     it("Should verify the query creation and scope changing functionality.", () => {
+        data.appName = `${fake.companyName}-App`;
         logout();
         cy.apiLogin(data.email, "password");
         cy.visit('/')
-        cy.apiCreateApp();
+        cy.apiCreateApp(data.appName);
         cy.openApp();
-        cy.renameApp(data.appName);
         cy.dragAndDropWidget("Table", 250, 250);
 
         addQuery(

cypress-tests/cypress/e2e/workspace/dashboard.cy.js

@@ -159,7 +159,7 @@ describe("dashboard", () => {
     cy.reload();
     verifyTooltip(commonSelectors.dashboardIcon, "Dashboard");
     verifyTooltip(commonSelectors.databaseIcon, "Database");
-    verifyTooltip(commonSelectors.globalDataSourceIcon, "Data Sources");
+    verifyTooltip(commonSelectors.globalDataSourceIcon, "Data sources");
     verifyTooltip(commonSelectors.workspaceSettingsIcon, "Workspace settings");
     verifyTooltip(commonSelectors.notificationsIcon, "Comment notifications");
     verifyTooltip(dashboardSelector.modeToggle, "Mode");

cypress-tests/cypress/e2e/workspace/shareApp.cy.js

@@ -1,6 +1,6 @@
 import { commonSelectors, commonWidgetSelector } from "Selectors/common";
 import { fake } from "Fixtures/fake";
-import { logout, navigateToAppEditor } from "Support/utils/common";
+import { logout, navigateToAppEditor, verifyTooltip, releaseApp } from "Support/utils/common";
 import { commonText } from "Texts/common";
 import { addNewUserMW } from "Support/utils/userPermissions";
 import { userSignUp } from "Support/utils/onboarding";
@@ -29,8 +29,12 @@ describe("App share functionality", () => {
       cy.openApp(data.appName);
       cy.dragAndDropWidget("Table", 250, 250);
 
+      verifyTooltip(commonWidgetSelector.shareAppButton, "Share URL is unavailable until current version is released")
+      cy.get('[data-cy="share-button-link"]>span').should("have.class", "share-disabled");
+      releaseApp();
       cy.get(commonWidgetSelector.shareAppButton).click();
 
+
       for (const elements in commonWidgetSelector.shareModalElements) {
         cy.get(
           commonWidgetSelector.shareModalElements[elements]
@@ -47,13 +51,15 @@ describe("App share functionality", () => {
       cy.get(commonWidgetSelector.modalCloseButton).should("be.visible");
 
       cy.clearAndType(commonWidgetSelector.appNameSlugInput, `${slug}`);
+      cy.wait(2000);
       cy.get(commonWidgetSelector.modalCloseButton).click();
       cy.forceClickOnCanvas()
-      cy.dragAndDropWidget("Button", 50, 50);
       cy.get(commonSelectors.editorPageLogo).click();
 
       logout();
+      cy.wait(2500);
       cy.visit(`/applications/${slug}`);
+      cy.wait(2500);
 
       cy.get(commonSelectors.loginButton).should("be.visible");
 
@@ -72,21 +78,34 @@ describe("App share functionality", () => {
       cy.get(commonSelectors.editorPageLogo).click();
 
       logout();
+      cy.wait(2500);
       cy.visit(`/applications/${slug}`);
-      cy.wait(500);
+      cy.wait(2500);
       cy.get('[data-cy="draggable-widget-table1"]').should("be.visible");
     });
 
     it("Verify app private and public app visibility for the same workspace user", () => {
-      addNewUserMW(data.firstName, data.email);
+      navigateToAppEditor(data.appName);
+      cy.wait(2000);
+      cy.get(commonWidgetSelector.shareAppButton).click();
+      cy.get("body").then(($el) => {
+        if (!$el.text().includes("Embedded app link", { timeout: 2000 })) {
+          cy.get(commonWidgetSelector.makePublicAppToggle).check();
+        }
+      });
+      cy.get(commonWidgetSelector.modalCloseButton).click();
+      cy.get(commonSelectors.editorPageLogo).click();
 
+      addNewUserMW(data.firstName, data.email);
       logout();
+
       cy.visit(`/applications/${slug}`);
       cy.get('[data-cy="draggable-widget-table1"]').should("be.visible");
 
       cy.appUILogin();
       navigateToAppEditor(data.appName);
-      cy.skipEditorPopover()
+      cy.wait(2000);
+      cy.skipEditorPopover();
       cy.get(commonWidgetSelector.shareAppButton).click();
       cy.get(commonWidgetSelector.makePublicAppToggle).uncheck();
       cy.get(commonWidgetSelector.modalCloseButton).click();
@@ -115,6 +134,10 @@ describe("App share functionality", () => {
       cy.clearAndType(commonSelectors.passwordInputField, "password");
       cy.get(commonSelectors.signInButton).click();
       cy.wait(1000);
+      cy.get(`[data-cy="workspace-sign-in-sub-header"]`).verifyVisibleElement(
+        "have.text",
+        "Sign in to your workspace - My workspace"
+      );
 
       cy.visit("/");
       cy.wait(2000);
@@ -122,6 +145,7 @@ describe("App share functionality", () => {
       cy.appUILogin();
 
       navigateToAppEditor(data.appName);
+      cy.wait(2000);
       cy.skipEditorPopover();
       cy.get(commonWidgetSelector.shareAppButton).click();
       cy.get(commonWidgetSelector.makePublicAppToggle).check();

cypress-tests/cypress/e2e/workspace/userPermissions.cy.js

@@ -21,21 +21,21 @@ describe("User permissions", () => {
     cy.intercept("GET", "/api/apps?page=1&folder=&searchKey=").as("homePage");
     cy.apiLogin();
     cy.apiCreateApp(data.appName);
-    cy.visit('/')
+    cy.visit('/my-workspace')
     permissions.reset();
     cy.get(commonSelectors.homePageLogo).click();
     cy.wait("@homePage");
     permissions.addNewUserMW(data.firstName, data.email);
-    common.logout();
+    cy.logoutApi();
   });
   beforeEach(() => {
-    cy.appUILogin();
-    cy.visitTheWorkspace("My workspace");
+    cy.apiLogin();
+    cy.visit("/my-workspace");
   });
 
   it("Should verify the create new app permission", () => {
-    common.logout();
-    cy.login(data.email, usersText.password);
+    cy.logoutApi();
+    cy.apiLogin(data.email, usersText.password);
     cy.get("body").then(($title) => {
       if ($title.text().includes(dashboardText.emptyPageDescription)) {
         cy.get(commonSelectors.dashboardAppCreateButton).should('be.disabled');
@@ -43,7 +43,7 @@ describe("User permissions", () => {
         cy.contains(dashboardText.createAppButton).should("not.exist");
       }
     });
-    common.logout();
+    cy.logoutApi();
   });
 
   it("Should verify the View and Edit permission", () => {
@@ -59,7 +59,9 @@ describe("User permissions", () => {
       });
 
     common.logout();
-    cy.login(data.email, usersText.password);
+    cy.apiLogin(data.email, usersText.password);
+    cy.visit("/my-workspace");
+    cy.wait(500)
     cy.contains(data.appName).should("exist");
     cy.get(commonSelectors.appCard(data.appName)).should(
       "contain.text",
@@ -74,8 +76,11 @@ describe("User permissions", () => {
           "tj-disabled-btn"
         );
       });
+    common.logout();
 
-    permissions.adminLogin();
+    cy.apiLogin();
+    cy.visit("/my-workspace");
+    common.navigateToManageGroups();
     cy.contains("tr", data.appName)
       .parent()
       .within(() => {
@@ -87,7 +92,9 @@ describe("User permissions", () => {
     );
 
     common.logout();
-    cy.login(data.email, usersText.password);
+    cy.apiLogin(data.email, usersText.password);
+    cy.visit("/my-workspace");
+    cy.wait(500)
     cy.get(commonSelectors.appCard(data.appName)).should(
       "contain.text",
       data.appName
@@ -114,9 +121,10 @@ describe("User permissions", () => {
 
   it("Should verify the Create and Delete app permission", () => {
     data.appName = `${fake.companyName}-App`;
-    cy.createApp(data.appName);
-    cy.get(commonSelectors.editorPageLogo).click();
-    cy.wait(1000);
+    cy.apiCreateApp(data.appName);
+    cy.visit('/my-workspace')
+    cy.wait(500);
+
     common.navigateToManageGroups();
     cy.get(groupsSelector.appSearchBox).click();
     cy.get(groupsSelector.searchBoxOptions).contains(data.appName).click();
@@ -133,18 +141,24 @@ describe("User permissions", () => {
     cy.get(groupsSelector.permissionsLink).click();
     cy.get(groupsSelector.appsDeleteCheck).check();
 
-    common.logout();
-    cy.login(data.email, usersText.password);
+    cy.logoutApi();
+    cy.apiLogin(data.email, usersText.password);
+    cy.visit('/my-workspace');
     cy.get(commonSelectors.appCreateButton).should("exist");
     common.viewAppCardOptions(data.appName);
     cy.contains("Delete app").should("exist");
 
-    permissions.adminLogin();
+    common.logout();
+    cy.apiLogin();
+    cy.visit("/my-workspace");
+    common.navigateToManageGroups();
     cy.get(groupsSelector.permissionsLink).click();
     cy.get(groupsSelector.appsDeleteCheck).uncheck();
 
-    common.logout();
-    cy.login(data.email, usersText.password);
+    cy.logoutApi();
+    cy.apiLogin(data.email, usersText.password);
+    cy.visit("/my-workspace");
+    cy.wait(1000)
     common.viewAppCardOptions(data.appName);
     cy.contains("Delete app").should("not.exist");
 
@@ -157,12 +171,17 @@ describe("User permissions", () => {
     cy.get(commonSelectors.appCardOptions(commonText.deleteAppOption)).click();
     cy.get(commonSelectors.buttonSelector("Yes")).click();
 
-    permissions.adminLogin();
+    common.logout
+    cy.apiLogin();
+    cy.visit("/my-workspace");
+    common.navigateToManageGroups();
     cy.get(groupsSelector.permissionsLink).click();
     cy.get(groupsSelector.appsCreateCheck).uncheck();
 
-    common.logout();
-    cy.login(data.email, usersText.password);
+    cy.logoutApi();
+    cy.apiLogin(data.email, usersText.password);
+    cy.visit("/my-workspace");
+    cy.wait(1000)
     cy.contains("Create new application").should("not.exist");
   });
 
@@ -171,8 +190,10 @@ describe("User permissions", () => {
     cy.get(groupsSelector.permissionsLink).click();
     cy.get(groupsSelector.foldersCreateCheck).check();
 
-    common.logout();
-    cy.login(data.email, usersText.password);
+    cy.logoutApi();
+    cy.apiLogin(data.email, usersText.password);
+    cy.visit("/my-workspace");
+    cy.wait(500)
 
     cy.get(commonSelectors.createNewFolderButton).click();
     cy.clearAndType(commonSelectors.folderNameInput, data.folderName);
@@ -188,15 +209,22 @@ describe("User permissions", () => {
       });
     cy.get(commonSelectors.deleteFolderOption(data.folderName)).click();
     cy.get(commonSelectors.buttonSelector("Yes")).click();
+    common.logout();
 
-    permissions.adminLogin();
+    cy.apiLogin();
+    cy.visit("/my-workspace");
+    common.navigateToManageGroups();
     cy.get(groupsSelector.permissionsLink).click();
     cy.get(groupsSelector.foldersCreateCheck).uncheck();
 
     common.logout();
-    cy.login(data.email, usersText.password);
+    cy.apiLogin(data.email, usersText.password);
+    cy.visit("/my-workspace");
+    cy.wait(500)
 
-    permissions.adminLogin();
+    cy.apiLogin();
+    cy.visit("/my-workspace");
+    common.navigateToManageGroups();
     cy.contains("td", data.appName)
       .parent()
       .within(() => {
@@ -204,7 +232,9 @@ describe("User permissions", () => {
       });
 
     common.logout();
-    cy.login(data.email, usersText.password);
+    cy.apiLogin(data.email, usersText.password);
+    cy.visit("/my-workspace");
+    cy.wait(500)
     cy.contains(data.appName).should("not.exist");
 
     common.logout();
@@ -223,7 +253,9 @@ describe("User permissions", () => {
     ).verifyVisibleElement("have.text", "Go to workspace constants");
     common.logout();
 
-    cy.login(data.email, usersText.password);
+    cy.apiLogin(data.email, usersText.password);
+    cy.visit("/my-workspace");
+    cy.wait(500)
     common.navigateToWorkspaceVariable();
     cy.get('[data-cy="alert-info-text"]>>.text-muted').verifyVisibleElement(
       "have.text",

cypress-tests/cypress/e2e/workspace/workspaceConstants.cy.js

@@ -47,7 +47,9 @@ describe("Workspace constants", () => {
                 .click();
 
             cy.get(commonSelectors.breadcrumbTitle).should(($el) => {
-                expect($el.contents().first().text().trim()).to.eq("Workspace settings");
+                expect($el.contents().first().text().trim()).to.eq(
+                    "Workspace settings"
+                );
             });
             cy.get(commonSelectors.breadcrumbPageTitle).verifyVisibleElement(
                 "have.text",
@@ -67,7 +69,9 @@ describe("Workspace constants", () => {
             );
 
             cy.get("body").then(($body) => {
-                if ($body.find(workspaceConstantsSelectors.emptyStateImage).length > 0) {
+                if (
+                    $body.find(workspaceConstantsSelectors.emptyStateImage).length > 0
+                ) {
                     cy.get(workspaceConstantsSelectors.emptyStateImage).should(
                         "be.visible"
                     );
@@ -77,7 +81,9 @@ describe("Workspace constants", () => {
                         "have.text",
                         workspaceConstantsText.emptyStateHeader
                     );
-                    cy.get(workspaceConstantsSelectors.emptyStateText).verifyVisibleElement(
+                    cy.get(
+                        workspaceConstantsSelectors.emptyStateText
+                    ).verifyVisibleElement(
                         "have.text",
                         workspaceConstantsText.emptyStateText
                     );
@@ -94,7 +100,10 @@ describe("Workspace constants", () => {
                 "have.text",
                 workspaceConstantsText.addConstatntText
             );
-            cy.get(commonSelectors.nameLabel).verifyVisibleElement("have.text", "Name");
+            cy.get(commonSelectors.nameLabel).verifyVisibleElement(
+                "have.text",
+                "Name"
+            );
             cy.get(commonSelectors.nameInputField)
                 .invoke("attr", "placeholder")
                 .should("eq", "Enter Constant Name");
@@ -111,11 +120,12 @@ describe("Workspace constants", () => {
                 "have.text",
                 "Cancel"
             );
-            cy.get(workspaceConstantsSelectors.addConstantButton).verifyVisibleElement(
-                "have.text",
-                "Add constant"
+            cy.get(
+                workspaceConstantsSelectors.addConstantButton
+            ).verifyVisibleElement("have.text", "Add constant");
+            cy.get(workspaceConstantsSelectors.addConstantButton).should(
+                "be.disabled"
             );
-            cy.get(workspaceConstantsSelectors.addConstantButton).should("be.disabled");
 
             contantsNameValidation(" ", commonText.constantsNameError);
             contantsNameValidation("9", commonText.constantsNameError);
@@ -134,13 +144,17 @@ describe("Workspace constants", () => {
                 "have.text",
                 commonText.constantsValueError
             );
-            cy.get(workspaceConstantsSelectors.addConstantButton).should("be.disabled");
+            cy.get(workspaceConstantsSelectors.addConstantButton).should(
+                "be.disabled"
+            );
             cy.get(commonSelectors.cancelButton).click();
             cy.get(workspaceConstantsSelectors.addNewConstantButton).click();
 
             cy.clearAndType(commonSelectors.nameInputField, data.constName);
             cy.clearAndType(commonSelectors.valueInputField, data.constName);
-            cy.get(workspaceConstantsSelectors.addConstantButton).should("be.enabled");
+            cy.get(workspaceConstantsSelectors.addConstantButton).should(
+                "be.enabled"
+            );
             cy.get(commonSelectors.cancelButton).click();
             cy.get(workspaceConstantsSelectors.constantName(data.constName)).should(
                 "not.exist"
@@ -189,14 +203,22 @@ describe("Workspace constants", () => {
             ).verifyVisibleElement("have.text", "Delete");
             cy.get(commonSelectors.pagination).should("be.visible");
 
-            cy.get(workspaceConstantsSelectors.constEditButton(data.constName)).click();
+            cy.get(
+                workspaceConstantsSelectors.constEditButton(data.constName)
+            ).click();
 
             cy.get(workspaceConstantsSelectors.contantFormTitle).verifyVisibleElement(
                 "have.text",
                 "Update constant in production "
             );
-            cy.get(commonSelectors.nameLabel).verifyVisibleElement("have.text", "Name");
-            cy.get(commonSelectors.nameInputField).should("have.value", data.constName);
+            cy.get(commonSelectors.nameLabel).verifyVisibleElement(
+                "have.text",
+                "Name"
+            );
+            cy.get(commonSelectors.nameInputField).should(
+                "have.value",
+                data.constName
+            );
             cy.get(commonSelectors.nameInputField)
                 .should("be.visible")
                 .and("be.disabled");
@@ -211,20 +233,25 @@ describe("Workspace constants", () => {
                 "have.text",
                 "Cancel"
             );
-            cy.get(workspaceConstantsSelectors.addConstantButton).verifyVisibleElement(
-                "have.text",
-                "Update"
+            cy.get(
+                workspaceConstantsSelectors.addConstantButton
+            ).verifyVisibleElement("have.text", "Update");
+            cy.get(workspaceConstantsSelectors.addConstantButton).should(
+                "be.disabled"
             );
-            cy.get(workspaceConstantsSelectors.addConstantButton).should("be.disabled");
 
             cy.clearAndType(commonSelectors.valueInputField, data.newConstvalue);
-            cy.get(workspaceConstantsSelectors.addConstantButton).should("be.enabled");
+            cy.get(workspaceConstantsSelectors.addConstantButton).should(
+                "be.enabled"
+            );
             cy.get(commonSelectors.cancelButton).click();
             cy.get(
                 workspaceConstantsSelectors.constantValue(data.constName)
             ).verifyVisibleElement("have.text", data.constName);
 
-            cy.get(workspaceConstantsSelectors.constEditButton(data.constName)).click();
+            cy.get(
+                workspaceConstantsSelectors.constEditButton(data.constName)
+            ).click();
             cy.clearAndType(commonSelectors.valueInputField, data.newConstvalue);
             cy.get(workspaceConstantsSelectors.addConstantButton).click();
             cy.verifyToastMessage(
@@ -246,7 +273,10 @@ describe("Workspace constants", () => {
                 "have.text",
                 "Cancel"
             );
-            cy.get(commonSelectors.yesButton).verifyVisibleElement("have.text", "Yes");
+            cy.get(commonSelectors.yesButton).verifyVisibleElement(
+                "have.text",
+                "Yes"
+            );
             cy.get(commonSelectors.cancelButton).click();
             cy.get(
                 workspaceConstantsSelectors.constantValue(data.constName)
@@ -312,47 +342,31 @@ describe("Workspace constants", () => {
             `[data-cy="inspector-node-${data.constantsName}"] > .mx-2`
         ).verifyVisibleElement("have.text", `"dJ_8Q~BcaMPd"`);
 
+        cy.get('[data-cy="button-release"]').click();
+        cy.get('[data-cy="yes-button"]').click();
+        cy.verifyToastMessage(commonSelectors.toastMessage, "Version v1 released");
 
-        if (envVar === "Community") {
-            cy.get('[data-cy="button-release"]').click();
-            cy.get('[data-cy="yes-button"]').click();
-            cy.verifyToastMessage(
-                commonSelectors.toastMessage,
-                "Version v1 released"
-            );
+        cy.get(commonWidgetSelector.shareAppButton).click();
+        cy.clearAndType(commonWidgetSelector.appNameSlugInput, `${data.slug}`);
+        cy.wait(1500);
+        cy.get(commonWidgetSelector.modalCloseButton).click();
+        cy.forceClickOnCanvas();
+        cy.waitForAutoSave();
+        cy.wait(500)
+        cy.openInCurrentTab(commonWidgetSelector.previewButton);
+        cy.wait(4000);
 
-            cy.get(commonWidgetSelector.shareAppButton).click();
-            cy.clearAndType(commonWidgetSelector.appNameSlugInput, `${data.slug}`);
-            cy.get(commonWidgetSelector.modalCloseButton).click();
-            cy.forceClickOnCanvas();
-            cy.waitForAutoSave();
-            cy.openInCurrentTab(commonWidgetSelector.previewButton);
-            cy.wait(4000);
+        cy.get(
+            commonWidgetSelector.draggableWidget(data.constantsName)
+        ).verifyVisibleElement("have.text", "dJ_8Q~BcaMPd");
 
-            cy.get(
-                commonWidgetSelector.draggableWidget(data.constantsName)
-            ).verifyVisibleElement("have.text", "dJ_8Q~BcaMPd");
+        cy.get('[data-cy="viewer-page-logo"]').click();
+        cy.wait("@homePage");
+        cy.visit(`/applications/${data.slug}`);
+        cy.wait(4000);
 
-            cy.get('[data-cy="viewer-page-logo"]').click();
-            cy.wait("@homePage");
-            cy.visit(`/applications/${data.slug}`);
-            cy.wait(4000);
-
-            cy.get(
-                commonWidgetSelector.draggableWidget(data.constantsName)
-            ).verifyVisibleElement("have.text", "dJ_8Q~BcaMPd");
-        } else {
-            cy.forceClickOnCanvas();
-            cy.waitForAutoSave();
-            cy.openInCurrentTab(commonWidgetSelector.previewButton);
-            cy.wait(4000);
-
-            cy.get(
-                commonWidgetSelector.draggableWidget(data.constantsName)
-            ).verifyVisibleElement("have.text", "dJ_8Q~BcaMPd");
-
-            cy.get('[data-cy="viewer-page-logo"]').click();
-            cy.wait("@homePage");
-        }
+        cy.get(
+            commonWidgetSelector.draggableWidget(data.constantsName)
+        ).verifyVisibleElement("have.text", "dJ_8Q~BcaMPd");
     });
-});
+});

cypress-tests/cypress/support/utils/common.js

@@ -262,4 +262,11 @@ export const createGroup = (groupName) => {
 export const navigateToworkspaceConstants = () => {
   cy.get(commonSelectors.workspaceSettingsIcon).click();
   cy.get(commonSelectors.workspaceConstantsOption).click();
+};
+
+export const releaseApp = () => {
+  cy.get(commonSelectors.releaseButton).click();
+  cy.get(commonSelectors.yesButton).click();
+  cy.verifyToastMessage(commonSelectors.toastMessage, "Version v1 released");
+  cy.wait(1000);
 };

cypress-tests/cypress/support/utils/version.js

@@ -151,5 +151,7 @@ export const verifyVersionAfterPreview = (currentVersion) => {
     .click();
   cy.url().should("include", "/home");
   verifyComponent("button1");
+  cy.go("back");
+  cy.waitForAppLoad()
   cy.contains(currentVersion);
 };

docs/docs/actions/control-component.md

@@ -3,43 +3,47 @@ id: control-component
 title: Control component (Component Specific Actions)
 ---
 
-Control component action invokes the component specific actions. Component specific actions are the actions that are exclusive actions for a particular widget. Component specific actions can be triggered either through the event handlers or from the Run JavaScript code query.
+Control component action invokes the component specific actions. Component specific actions are the actions that are exclusive actions for a particular component. Component specific actions can be triggered either through the event handlers or from the Run JavaScript code query.
+
+You can find the component specific actions for the specific component in their respective documentation. For example, you can find the component specific actions for the **Bounded Box** component in the [Bounded Box](/docs/widgets/bounded-box) documentation.
+
+<details>
+  <summary>Currently, Component specific actions are supported only by the below listed components.</summary>
+  <div>
+    <ul>
+    <li><a href="/docs/widgets/button#component-specific-actions-csa">Button</a></li>
+    <li><a href="/docs/widgets/checkbox#component-specific-actions-csa">Checkbox</a></li>
+    <li><a href="/docs/widgets/color-picker#component-specific-actions-csa">Color Picker</a></li>
+    <li><a href="/docs/widgets/dropdown#component-specific-actions-csa">Dropdown</a></li>
+    <li><a href="/docs/widgets/file-picker#component-specific-actions-csa">File Picker</a></li>
+    <li><a href="/docs/widgets/form#component-specific-actions-csa">Form</a></li>
+    <li><a href="/docs/widgets/icon#component-specific-actions-csa">Icon</a></li>
+    <li><a href="/docs/widgets/kanban#component-specific-actions-csa">Kanban</a></li>
+    <li><a href="/docs/widgets/link#component-specific-actions-csa">Link</a></li>
+    <li><a href="/docs/widgets/map#component-specific-actions-csa">Map</a></li>
+    <li><a href="/docs/widgets/modal#component-specific-actions-csa">Modal</a></li>
+    <li><a href="/docs/widgets/multiselect#component-specific-actions-csa">Multiselect</a></li>
+    <li><a href="/docs/widgets/radio-button#component-specific-actions-csa">Radio button</a></li>
+    <li><a href="/docs/widgets/table#component-specific-actions-csa">Table</a></li>
+    <li><a href="/docs/widgets/tabs#component-specific-actions-csa">Tabs</a></li>
+    <li><a href="/docs/widgets/text-input#component-specific-actions-csa">Text Input</a></li>
+    <li><a href="/docs/widgets/text#component-specific-actions-csa">Text</a></li>
+    <li><a href="/docs/widgets/textarea#component-specific-actions-csa">Text Area</a></li>
+    </ul>
+  </div>
+</details>
 
 :::info
-Check out the **[live demo](https://youtu.be/JIhSH3YeM3E)** of Component specific actions demonstrated in one of our community call.
-:::
-
-## Available Component Specific Actions
-
-| Widget | Component Specific Actions |
-|--------|---------------------------|
-| Button | Click, Set label, Disable, Visibility, Loading |
-| Checkbox   | Set checked |
-| Color picker   | Set color |
-| Dropdown   | Select option |
-| File picker    | Clear files |
-| Kanban   | Add card, Delete card, Move card, Update card data |
-| Map   | Set location |
-| Modal     | Show, Close |
-| Multiselect   | Select option, Deselect option, Clear selection |
-| Radio button | Select option |
-| Tabs   | Set tab |
-| Table   | Set page, Select row, Deselect Row, Discard changes |
-| Text   | Set text, Set Visibility |
-| Text Area | Set text, Clear |
-| Text Input | Set text, Clear, Set Focus, Set Blur, Disable, Visibility |
-
-:::info
-Currently, Component specific actions are supported only by the above listed widgets. We are working on bringing component specific actions for the remaining widgets.
+Check out the **[demo](https://youtu.be/JIhSH3YeM3E)** of Component specific actions demonstrated in one of our community call.
 :::
 
 ## Using Component Specific Actions
 
-### Set a value for text input widget using button's event handler
+### Set a value for text input component using button's event handler
 
-- Drag a **Text Input** and a **Button** widget onto the canvas.
+- Drag a **Text Input** and a **Button** component onto the canvas.
 
-- Go to the **Inspector** on the left sidebar to check the exposed variables available for the `textinput1` widget under the `components`. You'll see that the variable `value` is an empty string because the field value of the text input widget is empty right now.
+- Go to the **Inspector** on the left sidebar to check the exposed variables available for the `textinput1` component under the `components`. You'll see that the variable `value` is an empty string because the field value of the text input component is empty right now.
 
 <div style={{textAlign: 'center'}}>
 
@@ -47,7 +51,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now enter some value in the text input widget and you'll see that the `value` in inspector has been updated.
+- Now enter some value in the text input component and you'll see that the `value` in inspector has been updated.
 
 <div style={{textAlign: 'center'}}>
 
@@ -55,7 +59,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now, click on the button's widget handler to open up its properties in the right sidebar and then add a event handler for **On Click** event to trigger **Control Component** action. Select `textinput1` in component dropdown, `Set text` as Action, and in `Text` field enter the text that you want to update in the field value.
+- Now, click on the button's component handler to open up its properties in the right sidebar and then add a event handler for **On Click** event to trigger **Control Component** action. Select `textinput1` in component dropdown, `Set text` as Action, and in `Text` field enter the text that you want to update in the field value.
 
 <div style={{textAlign: 'center'}}>
 
@@ -63,7 +67,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now when you'll click on the button you'll see that the field value of the text input widget has been updated with value that you set.
+- Now when you'll click on the button you'll see that the field value of the text input component has been updated with value that you set.
 
 <div style={{textAlign: 'center'}}>
 
@@ -72,7 +76,7 @@ Currently, Component specific actions are supported only by the above listed wid
 </div>
 
 
-### Clear value of text input widget using JavaScript query
+### Clear value of text input component using JavaScript query
 
 - Let's clear the value that we set in the previous section, using Run JavaScript code. Create a new Run JavaScript Code query and call the component and the CSA that component provides.
 
@@ -94,5 +98,5 @@ await components.textinput1.clear()
 
 </div>
 
-- Finally, hit the **save and run** query button to fire up the query, and you'll see that the field value of the text input widget has been cleared.
+- Finally, hit the **save and run** query button to fire up the query, and you'll see that the field value of the text input component has been cleared.
 

docs/docs/app-builder/left-sidebar.md

@@ -64,15 +64,17 @@ Debugger consists of two main sections:
 
 To configure the app's global settings, click on the kebab menu(three vertical dots) on the left of the app name. Global settings include:
 
+- **Unique app slug**: The unique slug of the application. This slug is used in the URL of the application. By default, the slug is the `app id` of the application. You can change the slug to a custom value. For example, if the slug is `7b56293b-be5a-401f-8806-b71625f8ee0d` you can change it to `<unique-name>` then the new URL of the application will be `https://app.tooljet.com/<workspace-name>/apps/<unique-name>/`
+- **App link**: The link to the application. This link can be used to share the application with other users of the workspace. If you want to share the application with users outside the workspace, you can make the application public from the **[Share](/docs/app-builder/share)** modal.
 - **Hide header for launched apps**: Toggle this on to the hide the tooljet's header when the applications are launched
 - **Maintenance mode**: Toggle this on to put the application in maintenance mode. When in **maintenance mode**, on launching the app, the user will get an error message that **the app is under maintenance**.
-- **Max width of canvas**: Modify the width of the canvas in **px** or **%**. The default width is 1292 px.
-- **Max height of canvas**: Modify the width of the canvas in **px** or **%**. The default height is 2400 px and currently it is the maximum height limit.
+- **Max width of canvas**: Modify the width of the canvas in **px** or **%**. The default width is `1292` px.
 - **Background color of canvas**: Enter the hex color code or choose a color from the picker to change the background color of the canvas. You can also click on the **Fx** to programmatically set the value.
+- **Export app**: Click on the [Export app](/docs/dashboard/#export-app) button to export the application as a JSON file. You can import this JSON file in any other workspace to use the application.
 
 <div style={{textAlign: 'center'}}>
 
-<img className="screenshot-full" src="/img/v2-beta/app-builder/leftsidebar/globalnew.png" alt="App Builder: Left-sidebar"/>
+<img className="screenshot-full" src="/img/v2-beta/app-builder/leftsidebar/globalsettings.png" alt="App Builder: Left-sidebar"/>
 
 </div>
 

docs/docs/app-builder/share.md

@@ -7,7 +7,7 @@ ToolJet apps offer two sharing options: they can either be shared privately with
 
 <div style={{textAlign: 'center'}}>
 
-<img className="screenshot-full" src="/img/v2-beta/app-builder/share/sharenew.png" alt="Share modal" width='700'/>
+<img className="screenshot-full" src="/img/v2-beta/app-builder/share/sharenew1.png" alt="Share modal" width='700'/>
 
 </div>
 
@@ -17,7 +17,7 @@ To share the app with external end users and make it accessible to anyone on the
 
 <div style={{textAlign: 'center'}}>
 
-<img className="screenshot-full" src="/img/v2-beta/app-builder/share/publicnew.png" alt="Share modal" width='700'/>
+<img className="screenshot-full" src="/img/v2-beta/app-builder/share/publicnew1.png" alt="Share modal" width='700'/>
 
 </div>
 
@@ -27,7 +27,7 @@ By default, ToolJet will generate a unique URL for your application. However, yo
 
 <div style={{textAlign: 'center'}}>
 
-<img className="screenshot-full" src="/img/v2-beta/app-builder/share/edit.png" alt="Share modal" width='700'/>
+<img className="screenshot-full" src="/img/v2-beta/app-builder/share/edit1.png" alt="Share modal" width='700'/>
 
 </div>
 

docs/docs/dashboard.md

@@ -15,9 +15,7 @@ Furthermore, the dashboard serves as a gateway to various essential sections, su
 
 ## Workspace Manager
 
-The workspace manager is located on the top left corner of the dashboard. Clicking on the workspace manager will open a dropdown menu with a list of all the workspaces you are a part of. You can switch between workspaces by clicking on the workspace name from the dropdown menu.
-
-You can also create a new workspace by clicking on the `Add new workspace` button on the bottom of the dropdown menu. Clicking on this button will open a modal, enter the name of the workspace and click on the `Create Workspace` button to create a new workspace. Workspaces can be **renamed** by clicking on the `edit` icon on the right side of the workspace name.
+The workspace manager is located on the bottom left corner of the dashboard. Clicking on the workspace manager will open a dropdown menu with a list of all the workspaces you are a part of. You can switch between workspaces by clicking on the workspace name from the dropdown menu.
 
 <div style={{textAlign: 'center'}}>
 
@@ -25,19 +23,46 @@ You can also create a new workspace by clicking on the `Add new workspace` butto
 
 </div>
 
-## Create a new app
+### Add new workspace
 
-To create a new app, click on the `Create new app` button on the top left corner of the dashboard. Clicking on this button will instantly create a new app and open the **[app builder](/docs/next/app-builder/overview)**. 
+On clicking the `Add new workspace` button, a modal will open where you can enter the name of the workspace, enter the unique workspace slug, and can see the preview of the workspace URL. Click on the `+ Create Workspace` button to create a new workspace.
+
+Previously, the workspace slug was an automatically generated workspace ID, like this: `https://tooljet.com/262750db-b2b8-4abb-9404-8995c2ecb2a0`. Now, you can set a custom, unique slug for your workspace which will generate a more accessible or readable URL such as `https://tooljet.com/apac-team)`.
+
+#### Conditions for workspace slug
+
+- The workspace slug should be unique.
+- The workspace slug should not contain any special characters except `-`.
+- The workspace slug should not contain any spaces.
+- The workspace slug should not contain any capital letters.
+- The workspace slug should not be empty.
 
 <div style={{textAlign: 'center'}}>
 
-<img className="screenshot-full" src="/img/dashboard/newapp.gif" alt="Dashboard"/>
+<img className="screenshot-full" src="/img/dashboard/newworkmodal.png" alt="Dashboard"/>
+
+</div>
+
+### Edit workspace
+
+Similar to the `Add new workspace` button, clicking on the `Edit workspace` button will open a modal where you can edit the name of the workspace and the workspace slug. Click on the `Save` button to update the changes.
+
+## Create a new app
+
+To create a new app, click on the `Create new app` button on the top left corner of the dashboard. Clicking on this button will open a modal where you can enter the name of the app and then click on the `+ Create app` button to create a new app. 
+
+<div style={{textAlign: 'center'}}>
+
+<img className="screenshot-full" src="/img/dashboard/newappmodal.png" alt="Dashboard"/>
 
 </div>
 <br/>
 
 There are three dots on the right side of the `Create new app` button. Clicking on these dots will open a dropdown menu with two options:
 
+- **[Choose from templates](#choose-from-templates)**
+- **[Import](#import)**
+
 ### Choose from templates
 
 This option will open a modal with a list of pre-built templates. You can choose any template from this list to create a new app.
@@ -76,7 +101,8 @@ When the app(JSON file) that includes the table schema is imported, and the tabl
 
 If the table with the same name is already present in the workspace, the new table will be created with the name `<table name>_<unix timestamp>`. Example: `<tablename>_1627980000`.
 
-## Create a new folder
+## Folders
+### Create a new folder
 
 Folders can be created to organize your apps. To create a new folder, click on the `+` button on the left drawer of the dashboard. Clicking on this button will open a modal, enter the name of the folder and click on the `Create Folder` button to create a new folder.
 
@@ -103,6 +129,20 @@ Folders can be searched by clicking on the search icon on the left drawer of the
 
 </div>
 
+### Slug for folders
+
+The folder's URL slug is generated automatically from its name, providing direct access to the folder using the slug.
+
+To get the URL of a specific folder, the user will have to select that folder and then copy the URL from the address bar of the browser. The copied URL can be used to share with other users of the workspace.
+
+Example: If the name of the folder is `customer support`, The folder can be accessed directly from the URL `https://tooljet.com/<workspace-name>?folder=customer%20support`.
+
+<div style={{textAlign: 'center'}}>
+
+<img className="screenshot-full" src="/img/dashboard/appurl.png" alt="Dashboard"/>
+
+</div>
+
 ## App cards
 
 The dashboard displays all the apps created in the workspace as cards. These cards are displayed in a grid layout. The app cards display the **name of the app**, the **name of the creator**, and the **date of creation**. The app cards also display the app **icon**, which can be changed by clicking on the `Change Icon` option from the app menu.

docs/docs/data-sources/airtable.md

@@ -5,22 +5,15 @@ title: Airtable
 
 # Airtable
 
-
-ToolJet can connect to your Airtable account to read and write data. **Airtable API key** is required to create an Airtable data source on ToolJet. You can generate API key by visiting [Airtable account page](https://airtable.com/account). 
-
+ToolJet can connect to your Airtable account to read and write data.Airtable Personal Access Token is required to connect to the Airtable data source on ToolJet. You can generate the PAT by visiting [Developer Hub from your Airtable profile](https://support.airtable.com/docs/creating-and-using-api-keys-and-access-tokens#understanding-personal-access-token-basic-actions).
 
 <img className="screenshot-full" src="/img/datasource-reference/airtable/add_creds.gif" alt="irtable record"/>
 
-
 :::info
-Airtable API has a rate limit, and at the time of writing this documentation, the limit is five(5) requests per second per base. You can read more about rate limits here **[Airtable API]( https://airtable.com/api )**.
+Airtable API has a rate limit, and at the time of writing this documentation, the limit is five(5) requests per second per base. You can read more about rate limits here **[Airtable API](https://airtable.com/api)**.
 :::
 
-:::tip
-This guide assumes that you have already gone through [Adding a data source](/docs/tutorial/adding-a-datasource) tutorial.
-:::
-
-## Supported queries
+## Supported Operations
 
 - **[Listing records](#listing-records)**
 - **[Retrieving a record](#retrieving-a-record)**
@@ -30,113 +23,106 @@ This guide assumes that you have already gone through [Adding a data source](/do
 
 ### Listing records
 
-This query lists all the records in a table. The results are paginated and each page can have up to 100 records. 
+This query lists all the records in a table. The results are paginated and each page can have up to 100 records.
 
-#### Required parameters: 
+#### Required parameters:
 
 - **Base ID:** To find the Base ID, first visit **airtable.com/api**. Select from the list of bases the base whose ID you'd like to find out. Example Base ID: `appDT3UCPffPiSmFd`
 - **Table name:** Enter the table name whose data you want to fetch.
 
-#### Optional parameters: 
+#### Optional parameters:
 
 - **Page size:** The number of records returned in each request. Must be less than or equal to 100. Default is 100.
 - **offset:** If there are more records, the response will contain an offset. To fetch the next page of records, include offset in the next request's parameters.
 
-
 <img className="screenshot-full" src="/img/datasource-reference/airtable/listv2.png"  alt="List airtable record" />
 
-
-Example response from Airtable: 
+Example response from Airtable:
 
 ```json
 {
-    "records": [
-        {
-            "id": "recu9xMnUdr2n2cw8",
-            "fields": {
-                "Notes": "sdfdsf",
-                "Name": "dsfdsf"
-            },
-            "createdTime": "2021-05-12T14:30:33.000Z"
-        },
-        {
-            "id": "recyIdR7bVdQvmKXa",
-            "fields": {
-                "Notes": "sdfdsf",
-                "Name": "dfds"
-            },
-            "createdTime": "2021-05-12T14:30:33.000Z"
-        },
-        {
-            "id": "recAOzdIHaRpvRaGE",
-            "fields": {
-                "Notes": "sdfsdfsd",
-                "Name": "sdfdsf"
-            },
-            "createdTime": "2021-05-12T14:30:33.000Z"
-        }
-    ],
-    "offset": "recAOzdIHaRpvRaGE"
+  "records": [
+    {
+      "id": "recu9xMnUdr2n2cw8",
+      "fields": {
+        "Notes": "sdfdsf",
+        "Name": "dsfdsf"
+      },
+      "createdTime": "2021-05-12T14:30:33.000Z"
+    },
+    {
+      "id": "recyIdR7bVdQvmKXa",
+      "fields": {
+        "Notes": "sdfdsf",
+        "Name": "dfds"
+      },
+      "createdTime": "2021-05-12T14:30:33.000Z"
+    },
+    {
+      "id": "recAOzdIHaRpvRaGE",
+      "fields": {
+        "Notes": "sdfsdfsd",
+        "Name": "sdfdsf"
+      },
+      "createdTime": "2021-05-12T14:30:33.000Z"
+    }
+  ],
+  "offset": "recAOzdIHaRpvRaGE"
 }
 ```
 
 ### Retrieving a record
 
-#### Required parameters: 
+#### Required parameters:
 
 - **Base ID**
-- **Table name** 
+- **Table name**
 - **Record ID**
 
-
 <img className="screenshot-full" src="/img/datasource-reference/airtable/retv2.png"  alt="Retrieve airtable record" />
 
-
-Example response from Airtable: 
+Example response from Airtable:
 
 ```json
 {
-    "id": "recu9xMnUdr2n2cw8",
-    "fields": {
-        "Notes": "sdfdsf",
-        "Name": "dsfdsf"
-    },
-    "createdTime": "2021-05-12T14:30:33.000Z"
+  "id": "recu9xMnUdr2n2cw8",
+  "fields": {
+    "Notes": "sdfdsf",
+    "Name": "dsfdsf"
+  },
+  "createdTime": "2021-05-12T14:30:33.000Z"
 }
 ```
 
 ### Creating a record
 
 #### Required parameters:
+
 - **Base ID**
 - **Table name**
 - **Records**
 
-
 <img className="screenshot-full" src="/img/datasource-reference/airtable/createv2.png" alt="Create airtable record" />
 
 #### Example Records:
 
 ```json
 [
-    {
-        "fields": {
-            "Notes": "sdfdsf",
-            "Name": "dsfdsf"
-        }
-    },
-    {
-        "fields": {
-            "Notes": "note1",
-            "Name": "dsfdsf"
-        }
+  {
+    "fields": {
+      "Notes": "sdfdsf",
+      "Name": "dsfdsf"
     }
+  },
+  {
+    "fields": {
+      "Notes": "note1",
+      "Name": "dsfdsf"
+    }
+  }
 ]
- 
-
 ```
 
-
 Click on the `run` button to run the query.
 
 :::info
@@ -144,37 +130,38 @@ NOTE: Query must be saved before running.
 :::
 
 Example response from Airtable:
+
 ```json
 {
-    "records": [
-        {
-            "id": "rec5RuZ1COoZGtGDY",
-            "fields": {
-                "Notes": "sdfdsf",
-                "Name": "dsfdsf"
-            },
-            "createdTime": "2022-02-07T20:25:27.000Z"
-        },
-        {
-            "id": "recaYbFPonNNu6Cwj",
-            "fields": {
-                "Notes": "note1",
-                "Name": "dsfdsf"
-            },
-            "createdTime": "2022-02-07T20:25:27.000Z"
-        }
-    ]
+  "records": [
+    {
+      "id": "rec5RuZ1COoZGtGDY",
+      "fields": {
+        "Notes": "sdfdsf",
+        "Name": "dsfdsf"
+      },
+      "createdTime": "2022-02-07T20:25:27.000Z"
+    },
+    {
+      "id": "recaYbFPonNNu6Cwj",
+      "fields": {
+        "Notes": "note1",
+        "Name": "dsfdsf"
+      },
+      "createdTime": "2022-02-07T20:25:27.000Z"
+    }
+  ]
 }
 ```
 
 ### Updating a record
 
 #### Required parameters:
+
 - **Base ID**
 - **Table name**
 - **Record ID**
 
-
 <img className="screenshot-full" src="/img/datasource-reference/airtable/updv2.png" alt="Update airtable record"/>
 
 #### Example body:
@@ -192,27 +179,28 @@ NOTE: Query must be saved before running.
 :::
 
 Example response from Airtable:
+
 ```json
 {
-    "id": "recu9xMnUdr2n2cw8",
-    "fields": {
-        "Notes": "Example Notes",
-        "Name": "change"
-    },
-    "createdTime": "2021-08-08T17:27:17.000Z"
+  "id": "recu9xMnUdr2n2cw8",
+  "fields": {
+    "Notes": "Example Notes",
+    "Name": "change"
+  },
+  "createdTime": "2021-08-08T17:27:17.000Z"
 }
 ```
 
 ### Deleting a record
 
 #### Required parameters:
+
 - **Base ID**
 - **Table name**
 - **Record ID**
 
 <img className="screenshot-full" src="/img/datasource-reference/airtable/delv2.png" alt="Delete airtable record" />
 
-
 Click on the `run` button to run the query.
 
 :::info
@@ -226,4 +214,4 @@ Example response from Airtable:
     deleted: true
     id: "recIKsyZgqI4zoqS7"
 }
-```
+```

docs/docs/data-sources/athena.md

@@ -9,6 +9,8 @@ ToolJet can connect to Amazon Athena which is an interactive query service that
 
 ## Connection
 
+To establish a connection with the Amazon Athena data source, you can either click on the `+Add new data source` button located on the query panel or navigate to the [Data Sources](https://docs.tooljet.com/docs/data-sources/overview) page from the ToolJet dashboard.
+
 ToolJet requires the following to connect to your Athena.
 
 - **Database**
@@ -29,14 +31,8 @@ You can also configure for **[additional optional parameters](https://github.com
 
 - Click on `+` button of the query manager at the bottom panel of the editor and select the database added in the previous step as the datasource. Query manager then can be used to write SQL queries.
 
-
-<img className="screenshot-full" src="/img/datasource-reference/athena/athena-query.png" alt="Athena query" />
-
-
 - Click on the `run` button to run the query. 
 
-**NOTE:** Query should be saved before running.
-
 :::tip
 **Refer amazon athena docs here for more info:** [link](https://docs.aws.amazon.com/athena/latest/ug/what-is.html)
 :::

docs/docs/data-sources/azureblob.md

@@ -7,9 +7,9 @@ ToolJet offers the capability to establish a connection with Azure Blob storage
 
 ## Connection
 
-To connect ToolJet with the Azure Blob global datasource, you have two options:
-1. Click on the `+Add new global datasource` button in the query panel.
-2. Go to the **[Global Datasources](/docs/data-sources/overview)** page on the ToolJet dashboard.
+To connect ToolJet with the Azure Blob data source, you have two options:
+1. Click on the `+Add new data source` button in the query panel.
+2. Go to the **[Data Sources](/docs/data-sources/overview)** page on the ToolJet dashboard.
 
 <div style={{textAlign: 'center'}}>
 
@@ -20,15 +20,15 @@ To connect ToolJet with the Azure Blob global datasource, you have two options:
 To successfully establish the connection, ToolJet requires the following details:
 - **Connection String**: The connection string can be found on the dashboard of Azure Blob Storage.
 
-Once you have entered the connection string, click on the **Test connection** button to verify the connection's success. To save the datasource, click on the **Save** button.
+Once you have entered the connection string, click on the **Test connection** button to verify the connection's success. To save the data source, click on the **Save** button.
 
 ## Querying Azure Blob
 
-Once you have connected to the Azure Blob global datasource, follow these steps to create queries and interact with a Azure Blob storage from the ToolJet application:
+Once you have connected to the Azure Blob data source, follow these steps to create queries and interact with Azure Blob storage from the ToolJet application:
 
 1. Open the ToolJet application and navigate to the query panel at the bottom of the app builder.
-2. Click the `+Add` button to open the list of available `local` and `global datasources`.
-3. Select **Azure Blob** from the global datasource section.
+2. Click the `+Add` button to open the list of available `local` and `data sources`.
+3. Select **Azure Blob** from the data source section.
 4. Select the desired **operation** from the dropdown and enter the required **parameters**.
 5. **Rename**(optional) and **Create** the query.
 6. Click **Preview** to view the data returned from the query or click **Run** to execute the query.
@@ -43,21 +43,21 @@ Query results can be transformed using Transformation. For more information on t
 
 </div>
 
-## Supported operations
+## Supported Operations
 
-1. **[Create container](#create-container)**
-2. **[List containers](#list-containers)**
-3. **[List blobs](#list-blobs)**
-4. **[Upload blob](#upload-blob)**
-5. **[Read blob](#read-blob)**
-6. **[Delete blob](#delete-blob)**
+1. **[Create Container](#create-container)**
+2. **[List Containers](#list-containers)**
+3. **[List Blobs](#list-blobs)**
+4. **[Upload Blob](#upload-blob)**
+5. **[Read Blob](#read-blob)**
+6. **[Delete Blob](#delete-blob)**
 
 
-### Create container
+### Create Container
 
 The create container operation enables the creation of new containers within Azure Blob storage. Containers serve as logical units for organizing and managing blob data. Users can provide a unique name for the container. Once created, the container is available for use in storing and organizing blob data. If the container with the same name already exists, the operation fails.
 
-#### Required parameters:
+#### Required Parameters:
 
 - **Container Name:** Name of the container that you want to create. 
 
@@ -67,7 +67,7 @@ The create container operation enables the creation of new containers within Azu
 
 </div>
 
-### List containers
+### List Containers
 
 The list container operation allows you to retrieve a list of containers within Azure Blob storage.
 
@@ -77,16 +77,16 @@ The list container operation allows you to retrieve a list of containers within
 
 </div>
 
-### List blobs
+### List Blobs
 
 The list blobs operation enables you to retrieve a list of blobs within a specific container in Azure Blob storage. 
 
-#### Required parameter:
+#### Required Parameter:
 
 - **Container:** Specify the name of the container from which you wish to retrieve a list of blobs.
 - **Page Size:** Specify the maximum number of blobs to be returned per page or request.
 
-#### Optional parameters: 
+#### Optional Parameters: 
 
 - **Prefix:** Filter the list of blobs based on a specific prefix or prefix pattern, allowing you to narrow down the results to blobs with names that start with the specified prefix.
 - **Continuation Token:** A marker or token used to retrieve the next page of results when there are more blobs available beyond the initial page.
@@ -97,11 +97,11 @@ The list blobs operation enables you to retrieve a list of blobs within a specif
 
 </div>
 
-### Upload blob
+### Upload Blob
 
 The upload blob operation allows you to upload a new blob or update an existing blob in Azure Blob storage. It provides a convenient way to store data such as files, images, or documents in the specified container.
 
-#### Required parameters:
+#### Required Parameters:
 
 - **Container**: Specify the name of the container where the blob will be uploaded or updated.
 - **Blob Name**: Provide a unique name for the blob. This name is used to identify and access the blob within the specified container.
@@ -109,11 +109,11 @@ The upload blob operation allows you to upload a new blob or update an existing
 - **Upload Data**: Select or provide the data to be uploaded as the content of the blob. This can be a file from your local system, binary data, or text content. You can also get the data from the exposed variable of the file picker component.
 - **Encoding**: Choose the encoding format for the uploaded data if applicable. This parameter determines how the data is encoded before being stored as the blob content. If the value is left blank then it takes **UTF-8** by default.
 
-### Read blob
+### Read Blob
 
 The read blob operation allows you to retrieve the content of a specific blob stored in Azure Blob storage. It enables you to access and retrieve the data stored within the blob for further processing or display.
 
-#### Required parameters:
+#### Required Parameters:
 
 - **Container**: Specify the name of the container where the blob is located.
 - **Blob Name**: Provide the unique name of the blob you want to read. This identifies the specific blob within the specified container
@@ -124,11 +124,11 @@ The read blob operation allows you to retrieve the content of a specific blob st
 
 </div>
 
-### Delete blob
+### Delete Blob
 
 The delete blob operation allows you to remove a specific blob from Azure Blob storage. This operation permanently deletes the blob and its associated data, freeing up storage space and removing the blob from the container.
 
-#### Required parameters:
+#### Required Parameters:
 
 - **Container**: Specify the name of the container from which you want to delete the blob.
 - **Blob Name**: Provide the unique name of the blob you want to delete. This identifies the specific blob within the specified container.

docs/docs/data-sources/baserow.md

@@ -5,24 +5,22 @@ title: Baserow
 
 # Baserow
 
+ToolJet can connect to your Baserow account to read and write data.
+
 ## Connection
 
-ToolJet can connect to your Baserow account to read and write data. 
-Select the hosted version of Baserow or the self-host option.
+To connect to Baserow, you need to provide the following details:
 
-For [**self-hosted**](https://baserow.io/docs/index#installation) option, base URL is required to connect.
+- **API token**: You can create an API token from your Baserow dashboard. You can follow the steps to create API token from [this link](https://baserow.io/user-docs/personal-api-tokens).
+- **Host**: You can either select the Baserow Cloud or Self-hosted option.
+  - **Base URL**: If you select the self-hosted option, you need to provide the base URL of your Baserow instance.
 
-Baserow API token is required to create an Baserow data source on ToolJet. You can follow the steps to create API token from [this link](https://baserow.io/api-docs).
 
 
 <img className="screenshot-full" src="/img/datasource-reference/baserow/baserow-intro.png" alt="Baserow intro" />
 
 
-:::tip
-This guide assumes that you have already gone through [Adding a data source](/docs/tutorial/adding-a-datasource) tutorial.
-:::
-
-## Supported queries
+## Supported Operations
 
 - [List fields](#list-fields)
 - [List rows](#list-rows)

docs/docs/data-sources/n8n.md

@@ -9,7 +9,7 @@ ToolJet can trigger n8n workflows using webhook URLs. Please refer [this](https:
 
 ## Connection
 
-Go to the data source manager on the left sidebar and click on `+` button to add new data source. Select n8n from the list of available data sources in the modal that pops-up.
+To establish a connection with the n8n data source, click on the `+Add new data source` button located on the query panel or navigate to the [Data Sources](https://docs.tooljet.com/docs/data-sources/overview) page from the ToolJet dashboard.
 
 n8n webhooks can be called with or without an **Authentication**. You can keep the `Authentication type` as `none` if your webhook didn't have one or if it has one then you can choose the one from the dropdown and provide credentials:
 

docs/docs/data-sources/oracledb.md

@@ -9,6 +9,8 @@ ToolJet can connect to Oracle databases to read and write data.
 
 ## Connection
 
+To establish a connection with the Oracle DB data source, click on the `+Add new` button located on the query panel or navigate to the [Data Sources](https://docs.tooljet.com/docs/data-sources/overview) page from the ToolJet dashboard.
+
 A Oracle DB can be connected with the following credentails:
 - **Host**
 - **Port**
@@ -38,7 +40,6 @@ Once you have added a Oracle DB data source, click on `+` button of the query ma
 
 SQL mode can be used to write raw SQL queries. Select SQL mode from the dropdown and enter the SQL query in the editor. Click on the `run` button to run the query.
 
-**NOTE**: Query should be saved before running.
 
 #### GUI mode
 
@@ -50,4 +51,4 @@ Click on the **run** button to run the query. **NOTE**: Query should be saved be
 
 :::tip
 Query results can be transformed using transformations. Read our transformations documentation to see how: **[link](/docs/tutorial/transformations)**
-:::
+:::

docs/docs/setup/azure-container.md

@@ -6,7 +6,7 @@ title: Azure container apps
 # Deploying ToolJet on Azure container apps
 
 :::info
-Please note that you need to set up a PostgreSQL database manually to be used by ToolJet
+Please note that you need to set up a PostgreSQL database manually to be used by ToolJet. Additionally, you must set up a Redis service through Azure Cache for Redis.
 :::
 
 *If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
@@ -36,9 +36,12 @@ Please note that you need to set up a PostgreSQL database manually to be used by
  
   - Make sure to provide the image tag, and then enter `npm run start:prod` in the "Command override" field.
   - Add the following ToolJet application variables under the "Environmental variable" section. You can refer to this [**documentation**](/docs/setup/env-vars) for more information on environment variables.
+
+  **Note: For the minimal setup, ToolJet requires: `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.**
+  
    <div style={{textAlign: 'center'}}>
  
-   <img className="screenshot-full" src="/img/setup/azure-container/step4.png" alt="Deploying ToolJet on Azure container apps" />
+   <img className="screenshot-full" src="/img/setup/azure-container/3-a.png" alt="Deploying ToolJet on Azure container apps" />
 
    </div>
 
@@ -52,7 +55,7 @@ Please note that you need to set up a PostgreSQL database manually to be used by
 5. Click on "Review + create" and wait for the template to be verified and passed, as shown in the screenshot below.
  <div style={{textAlign: 'center'}}>
 
- <img className="screenshot-full" src="/img/setup/azure-container/step5.png" alt="Deploying ToolJet on Azure container apps" />
+ <img className="screenshot-full" src="/img/setup/azure-container/5a.png" alt="Deploying ToolJet on Azure container apps" />
 
  </div>
 

docs/docs/setup/digitalocean.md

@@ -7,49 +7,13 @@ title: DigitalOcean
 
 Now you can quickly deploy ToolJet using the Deploy to DigitalOcean button.
 
-*If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
-
-The latest docker image is `tooljet/tooljet:<version_tag>`
-
-## Deploying
-
-#### Follow the steps below to deploy ToolJet on DigitalOcean:
-
-1. Once signed-in to your DigitalOcean account, click on the **Create App** button. 
-  
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/1.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
-
-2. On the next page, you'll be asked to choose a **Resource** type, select **Docker Hub**. Enter the Repository name as `tooljet/tooljet` and the corresponding tag.
-
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/2.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
-
-3. Once the Resource is created, you'll be redirected to the **Resources** page. Click on the **Edit** button next to the Resource.
-
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/3.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
-  
-  Make sure the **Run Command** is `./server/scripts/digitalocean-postbuild.sh` and the **HTTP** port is `3000`. Once you have edited the ToolJet resource click on the **Back** button.
-
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/4.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
+If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.
 
 ### Redis setup
 
+:::info
 ToolJet requires configuring Redis which is used for enabling multiplayer editing and for background jobs.
+:::
 
 Follow the steps below to configure Redis database:
 
@@ -70,82 +34,60 @@ Follow the steps below to configure Redis database:
   </div>
 
 3. Once the set-up is complete, add the Redis connection string in the environmental variable of `tooliet-app`.
-  :::info
-  In the business edition, saving or making changes in apps is dependent on Redis, even if multi-player editing is not necessary.
-  :::
-  
-### Database setup
 
-Follow the below steps to attach a postgresql database:
+## Deploying
 
-1. Click on **Add Resource** and select **Database** and click on add.
+#### Follow the steps below to deploy ToolJet on DigitalOcean:
+
+1. Click on the button below to start one click deployment
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/7.png" alt="ToolJet - Deploy on DigitalOcean" />
+  [![Deploy to DigitalOcean](https://www.deploytodo.com/do-btn-blue.svg)](https://cloud.digitalocean.com/apps/new?repo=https://github.com/ToolJet/ToolJet/tree/main)
 
   </div>
 
-2. Enter the preffered name for the database and click **Create and attach**.
+2. A new tab will open up, sign-in to your DigitalOCean account. Once signed-in, the **Create App** page will open up and **Resources** will be already selected. Click on **Next** button.
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/8.png" alt="ToolJet - Deploy on DigitalOcean" />
+  <img className="screenshot-full" src="/img/setup/digitalocean/resources.png" alt="ToolJet - Deploy on DigitalOcean - Resources" />
 
   </div>
 
-### Setting up environment variables
+3. Now, on **Environment Variables** page you can add new variables or edit the existing ones. Check the [environment variables here](/docs/setup/env-vars).
 
-1. Once the database is attached, click on **Next** to set up the environment variables.
+  Also, please add the redis url in the environment variable `REDIS_URL= #connection string`
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/9.png" alt="ToolJet - Deploy on DigitalOcean" />
+  <img className="screenshot-full" src="/img/setup/digitalocean/env.png" alt="ToolJet - Deploy on DigitalOcean - Environment Variables" />
 
   </div>
 
-2. Click on **Edit** next to `tooljet-app`.
+4. On the next page, you can change the **App name**, **Project**, and the **Region**.
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/10.png" alt="ToolJet - Deploy on DigitalOcean" />
+  <img className="screenshot-full" src="/img/setup/digitalocean/region.png" alt="ToolJet - Deploy on DigitalOcean - Launch" />
 
   </div>
 
-3. Click on the build editor to edit the environment variables.
+5. On the last page, you'll be asked to **Review** all the app details such that we entered before such as **Resources**, **Environment Variables**, **Region**, and there will also be **Billing** section at the end. Review all the details and click the **Create Resource** button.
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/11.png" alt="ToolJet - Deploy on DigitalOcean" />
+  <img className="screenshot-full" src="/img/setup/digitalocean/review.png" alt="ToolJet - Deploy on DigitalOcean - Launch" />
 
   </div>
 
-  ```bash
-  NODE_ ENV=production
-  NODE_OPTIONS=--max-old-space-size=4096
-  LOCKBOX MASTER_KEY= #Use `openssl rand -hex 32`
-  SECRET KEY BASE= #Use `openssl rand -hex 64`
-  DEPLOYMENT_PLATFORM=digitalocean
-  DATABASE_URL=${<enter the db name which was attached>.DATABASE_URL}
-  CA CERT=${<enter the db name which was attached>.CA_CERT}
-  TOOLJET HOST=${APP_URL} 
-  TOOLJET_SERVER_URL=${APP_URL} 
-  REDIS_URL= #connection string
-  ```
+6. Once you click the **Create Resource** button, the build will begin. Once the build is complete, you'll see the resource and a **URL** next to it. Click on the URL to open the deployed **ToolJet**.
 
-  DATABASE_URL and CA_CERT variable should be added in the above format.
+:::tip
+ToolJet server and client can be deployed as standalone applications. If you do not want to deploy the client on DigitalOcean, modify `package.json` accordingly. We have a [guide](/docs/setup/client) on deploying ToolJet client using services such as Firebase.
+:::
 
-4. After adding the environment variables, click on **Save**.
-
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/12.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
-
-  To add additional environment variables, refer this [doc](https://docs.tooljet.com/docs/setup/env-vars/).
-
-#### Deploying Tooljet Database
+## Deploying Tooljet Database
 
 If you intend to use this feature, you'd have to set up and deploy PostgREST server which helps querying ToolJet Database.
 You can learn more about this feature [here](/docs/tooljet-database).

docs/docs/setup/ec2.md

@@ -3,12 +3,12 @@ id: ec2
 title: AWS EC2
 ---
 
-# AWS EC2
+# Deploying ToolJet on Amazon EC2
 
 :::info
 You should setup a PostgreSQL database manually to be used by the ToolJet server.
-
 :::
+
 *If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
 
 Follow the steps below to deploy ToolJet on AWS EC2 instances.

docs/docs/setup/ecs.md

@@ -9,81 +9,222 @@ title: AWS ECS
 You should setup a PostgreSQL database manually to be used by ToolJet.
 :::
 
-*If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
+You can effortlessly deploy Amazon Elastic Container Service (ECS) by utilizing a [CloudFormation template](https://aws.amazon.com/cloudformation/):
+
+To deploy all the services at once, simply employ the following template:
+
+```
+curl -LO https://tooljet-deployments.s3.us-west-1.amazonaws.com/cloudformation/Cloudfomation-template-one-click.yml
+```
+
+If you already have existing services and wish to integrate ToolJet seamlessly into your current Virtual Private Cloud (VPC) or other setups, you can opt for the following template:
+
+```
+curl -LO https://tooljet-deployments.s3.us-west-1.amazonaws.com/cloudformation/Cloudformation-deploy.yml
+``` 
+
+## Redis
+
+:::info
+ToolJet requires configuring Redis which is used for enabling multiplayer editing and for background jobs.
+:::
+
+To deploy Redis on an ECS cluster, please follow the steps outlined below.
+
+Please note that if you already have an existing Redis setup, you can continue using it. However, if you need to create a new Redis service, you can follow the steps provided below.
+
+- Create a new take definition 
+
+  <div style={{textAlign: 'center'}}>
+  
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-1.png" alt="ECS Setup" />
+  
+  </div>
+
+
+- Please add container and image tag as shown below: 
+
+  **Make sure that you are using redis version 6.x.x**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-2.png" alt="ECS Setup" />
+
+  </div>
+
+- Ensure that when creating a service, Redis is integrated into the same cluster where your ToolJet app will be deployed. 
+
+  **Note: Please enable public IP**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-3.png" alt="ECS Setup" />
+
+  </div>
+
+## ToolJet
 
 Follow the steps below to deploy ToolJet on a ECS cluster.
 
-1.  Setup a PostgreSQL database
-    ToolJet uses a postgres database as the persistent storage for storing data related to users and apps.
+1. Setup a PostgreSQL database ToolJet uses a postgres database as the persistent storage for storing data related to users and apps.
+2. Create a target group and an application load balancer to route traffic onto ToolJet containers. You can [reference](https://docs.aws.amazon.com/AmazonECS/latest/userguide/create-application-load-balancer.html) AWS docs to set it up. Please note that ToolJet server exposes `/api/health`, which you can configure for health checks.
 
-2.  Create a target group and an application load balancer to route traffic onto ToolJet containers.
-    You can [reference](https://docs.aws.amazon.com/AmazonECS/latest/userguide/create-application-load-balancer.html) AWS docs to set it up. Please note that ToolJet server exposes `/api/health`, which you can configure for health checks.
+3. Create task definition for deploying ToolJet app as a service on your preconfigured cluster.
 
-    :::note
-    This setup follows the old AWS UI for ECS as some options are missing on the latest experience.
-    :::
+  i. Select Fargate as launch type compatibility
+   
+  ii. Configure IAM roles and set operating system family as Linux. 
+  
+  iii. Select task size to have 3GB of memory and 1vCpu
 
-3.  Create task definition for deploying ToolJet app as a service on your preconfigured cluster.
+  <div style={{textAlign: 'center'}}>
 
-    1.  Select Fargate as launch type compatibility.
-        <img className="screenshot-full" src="/img/setup/ecs/launch-type-compatibility.png" alt="select launch type compatibility" />
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-4.png" alt="ECS Setup" />
 
-    2.  Configure IAM roles and set operating system family as Linux
-        <img className="screenshot-full" src="/img/setup/ecs/task-definition-config.png" alt="task definition config" />
+  </div>
+  
+  iv. Add container details that is shown: 
 
-    3.  Select task size to have 3GB of memory and 1vCpu
-        <img className="screenshot-full" src="/img/setup/ecs/task-size.png" alt="task size config" />
+  Specify your container name ex: `ToolJet`
 
-    4.  Click on add container to update container definitions
-        <img className="screenshot-full" src="/img/setup/ecs/add-container-button.png" alt="add container button" />
+  Set the image you intend to deploy. ex: `tooljet/tooljet:<version_tag>`
 
-        Within the add container form that is shown:
+  Update port mappings at container port `3000` for tcp protocol.
 
-        - Specify your container name ex: `tooljet`
-        - Set the image you intend to deploy. ex: `tooljet/tooljet:<version_tag>`
-        - Update port mappings at container port `3000` for tcp protocol.
-          <img className="screenshot-full" src="/img/setup/ecs/container-setup.png" alt="container setup" />
+  <div style={{textAlign: 'center'}}>
 
-        - Update container command field to be `npm,run,start:prod`.
-          <img className="screenshot-full" src="/img/setup/ecs/container-command.png" alt="container command" />
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-5.png" alt="ECS Setup" />
 
-        - Specify environmental values for the container. You'd want to make use of secrets to store sensitive information or credentials, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/specifying-sensitive-data-secrets.html) to set it up.
+  </div>
+  
+  Specify environmental values for the container. You'd want to make use of secrets to store sensitive information or credentials, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/specifying-sensitive-data-secrets.html) to set it up. You can also store the env in S3 bucket, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/taskdef-envfiles.html) . 
 
-           <img className="screenshot-full" src="/img/setup/ecs/container-env-setup.png" alt="container env setup" />
+  <div style={{textAlign: 'center'}}>
 
-          :::note
-          For the minimal setup, ToolJet requires:
-          `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-6.png" alt="ECS Setup" />
 
-          Read **[environment variables reference](/docs/setup/env-vars)**
+  </div>
+  
+  :::info
+  For the minimal setup, ToolJet requires: `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.
+  
+  Read **[environment variables reference](https://docs.tooljet.com/docs/setup/env-vars)**
+  :::
+  
+  Additionally, include the Redis environment variables within the ToolJet container mentioned above if you have followed the previous steps to create Redis.
+  
+  ```
+  REDIS_HOST=<public ip of redis task>
+  REDIS_PORT=6379
+  REDIS_USER=default
+  REDIS_PASSWORD=
+  ```
+  
+  v. Make sure `Use log collection checked` and `Docker configuration` with the command `npm run start:dev`
 
-          :::
-     5. Please add redis container as part of the deployment. Please make sure that you are using redis version 6.x.x
+  <div style={{textAlign: 'center'}}>
 
-        Also add these env variable in the above tooljet container
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-8.png" alt="ECS Setup" />
 
-           ```
-           REDIS_HOST=localhost
-           REDIS_PORT=6379
-           REDIS_USER=default
-           REDIS_PASSWORD=
-           ```
+  </div>
 
-4.  Create a service to run your task definition within your cluster.
-    - Select launch type as Fargate.
-    - Set operating system family as Linux
-    - Select task definition family as the one created earlier. ex: `tooljet-ce`
-    - Select the cluster and set the service name
-    - You can set the number of tasks to start with as two
-    - Rest of the values can be kept as default
-      <img className="screenshot-full" src="/img/setup/ecs/service-config.png" alt="service config" />
-    - Click on next step to configure networking options
-    - Select your designated VPC, Subnets and Security groups. Kindly ensure that the security group allows for inbound traffic to http port 3000 for the task.
-      <img className="screenshot-full" src="/img/setup/ecs/service-security-group-config.png" alt="service security group config" />
-    - Since migrations are run as a part of container boot, please specify health check grace period for 900 seconds.
-    - Select the application loadbalancer option and set the target group name to the one we had created earlier. This will auto populate the health check endpoints.
+4. Create a service to run your task definition within your cluster.
+
+  - Select the cluster which you have created
+  
+  - Select launch type as Fargate 
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-9.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Select the cluster and set the service name
+  
+  - You can set the number of tasks to start with as two
+
+  - Rest of the values can be kept as default
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-10.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Click on next step to configure networking options
+  
+  - Select your designated VPC, Subnets and Security groups. Kindly ensure that the security group allows for inbound traffic to http port 3000 for the task.
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-11.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Since migrations are run as a part of container boot, please specify health check grace period for 900 seconds. Select the application loadbalancer option and set the target group name to the one we had created earlier. This will auto populate the health check endpoints.
 
 :::info
 The setup above is just a template. Feel free to update the task definition and configure parameters for resources and environment variables according to your needs.
 :::
 
+
+## ToolJet Database
+
+If you intend to use this feature, you'd have to set up and deploy PostgREST server which helps querying ToolJet Database. You can learn more about this feature [here](https://docs.tooljet.com/docs/tooljet-database).
+
+Follow the steps below to deploy PostgREST on a ECS cluster. 
+
+1. Create a new take definition
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-12.png" alt="ECS Setup" />
+
+  </div>
+  
+  Add the container details and image tag as shown below:
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-13.png" alt="ECS Setup" />
+
+  </div>
+  
+  Under environmental variable please add corresponding PostgREST env variables. You can also refer [env variable](https://docs.tooljet.com/docs/setup/env-vars/#postgrest-server-optional).
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-14.png" alt="ECS Setup" />
+
+  </div>
+
+
+2. Create service and make sure the postgrest is within the same cluster as ToolJet app. 
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-15.png" alt="ECS Setup" />
+
+  </div>
+
+
+3. Specify a service name and leave the remaining settings at their default configurations.
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-16.png" alt="ECS Setup" />
+
+  </div>
+
+4. Ensure that the PostgREST service resides within the same Virtual Private Cloud (VPC), and confirm that port 3001 is included in the security group used by the ToolJet app. **Note: Please enable public IP**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-17.png" alt="ECS Setup" />
+
+  </div>
+
+
+Update ToolJet deployment with the appropriate env variables [here](https://docs.tooljet.com/docs/setup/env-vars/#enable-tooljet-database--optional-) and apply the changes.
+

docs/docusaurus.config.js

@@ -121,17 +121,15 @@ module.exports = {
           // Please change this to your repo.
           editUrl: 'https://github.com/ToolJet/Tooljet/blob/develop/docs/',
           includeCurrentVersion: false,
-          lastVersion: '2.19.0',
+          lastVersion: '2.22.0',
         },
         theme: {
           customCss: require.resolve('./src/css/custom.css'),
         },
         sitemap: {},
-        gtag: isProd
+        googleTagManager: isProd
           ? {
-            trackingID: process.env.GA_MID,
-            // Optional fields.
-            anonymizeIP: true, // Should IPs be anonymized?
+            containerId: process.env.GTM,
           }
           : undefined,
       },

docs/netlify.toml

@@ -1,7 +1,7 @@
 [build]
   base = "docs/"
   publish = "build"
-  command = "GA_MID=$GA_MID ALGOLIA_API_KEY=$ALGOLIA_API_KEY npm run build"
+  command = "GTM=$GTM ALGOLIA_API_KEY=$ALGOLIA_API_KEY npm run build"
   
   [template.environment]
   NODE_ENV = "production"  

docs/package.json

@@ -14,10 +14,10 @@
     "write-heading-ids": "docusaurus write-heading-ids"
   },
   "dependencies": {
-    "@docusaurus/core": "^2.4.0",
-    "@docusaurus/plugin-google-gtag": "^2.4.0",
-    "@docusaurus/plugin-sitemap": "^2.4.0",
-    "@docusaurus/preset-classic": "^2.4.0",
+    "@docusaurus/core": "^2.4.3",
+    "@docusaurus/plugin-google-gtag": "^2.4.3",
+    "@docusaurus/plugin-sitemap": "^2.4.3",
+    "@docusaurus/preset-classic": "^2.4.3",
     "@mdx-js/react": "^1.6.22",
     "clsx": "^1.2.1",
     "react": "^17.0.2",

docs/src/css/custom.css

@@ -217,11 +217,11 @@ img {
 }
 
 .navbar-twitter-logo::before {
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%231DA1F2' viewBox='0 -3 28 28' aria-hidden='true'%3E%3Cpath d='M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085 4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z' %3E%3C/path%3E%3C/svg%3E");
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 512 512' aria-hidden='true'%3E%3Cpath d='M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z' %3E%3C/path%3E%3C/svg%3E");
 }
 
 [data-theme='dark'] .navbar-twitter-logo::before {
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%231DA1F2' viewBox='0 -3 28 28' aria-hidden='true'%3E%3Cpath d='M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085 4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z' %3E%3C/path%3E%3C/svg%3E");
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 512 512' aria-hidden='true'%3E%3Cpath d='M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z' %3E%3C/path%3E%3C/svg%3E");
 }
 
 [data-theme='light'] .DocSearch {
@@ -280,4 +280,4 @@ img {
     min-width: 200px;
     /* Fixes #3856 */
   }
-}
+}

docs/versioned_docs/version-2.15.0/actions/control-component.md

@@ -3,43 +3,47 @@ id: control-component
 title: Control component (Component Specific Actions)
 ---
 
-Control component action invokes the component specific actions. Component specific actions are the actions that are exclusive actions for a particular widget. Component specific actions can be triggered either through the event handlers or from the Run JavaScript code query.
+Control component action invokes the component specific actions. Component specific actions are the actions that are exclusive actions for a particular component. Component specific actions can be triggered either through the event handlers or from the Run JavaScript code query.
+
+You can find the component specific actions for the specific component in their respective documentation. For example, you can find the component specific actions for the **Bounded Box** component in the [Bounded Box](/docs/widgets/bounded-box) documentation.
+
+<details>
+  <summary>Currently, Component specific actions are supported only by the below listed components.</summary>
+  <div>
+    <ul>
+    <li><a href="/docs/widgets/button#component-specific-actions-csa">Button</a></li>
+    <li><a href="/docs/widgets/checkbox#component-specific-actions-csa">Checkbox</a></li>
+    <li><a href="/docs/widgets/color-picker#component-specific-actions-csa">Color Picker</a></li>
+    <li><a href="/docs/widgets/dropdown#component-specific-actions-csa">Dropdown</a></li>
+    <li><a href="/docs/widgets/file-picker#component-specific-actions-csa">File Picker</a></li>
+    <li><a href="/docs/widgets/form#component-specific-actions-csa">Form</a></li>
+    <li><a href="/docs/widgets/icon#component-specific-actions-csa">Icon</a></li>
+    <li><a href="/docs/widgets/kanban#component-specific-actions-csa">Kanban</a></li>
+    <li><a href="/docs/widgets/link#component-specific-actions-csa">Link</a></li>
+    <li><a href="/docs/widgets/map#component-specific-actions-csa">Map</a></li>
+    <li><a href="/docs/widgets/modal#component-specific-actions-csa">Modal</a></li>
+    <li><a href="/docs/widgets/multiselect#component-specific-actions-csa">Multiselect</a></li>
+    <li><a href="/docs/widgets/radio-button#component-specific-actions-csa">Radio button</a></li>
+    <li><a href="/docs/widgets/table#component-specific-actions-csa">Table</a></li>
+    <li><a href="/docs/widgets/tabs#component-specific-actions-csa">Tabs</a></li>
+    <li><a href="/docs/widgets/text-input#component-specific-actions-csa">Text Input</a></li>
+    <li><a href="/docs/widgets/text#component-specific-actions-csa">Text</a></li>
+    <li><a href="/docs/widgets/textarea#component-specific-actions-csa">Text Area</a></li>
+    </ul>
+  </div>
+</details>
 
 :::info
-Check out the **[live demo](https://youtu.be/JIhSH3YeM3E)** of Component specific actions demonstrated in one of our community call.
-:::
-
-## Available Component Specific Actions
-
-| Widget | Component Specific Actions |
-|--------|---------------------------|
-| Button | Click, Set label, Disable, Visibility, Loading |
-| Checkbox   | Set checked |
-| Color picker   | Set color |
-| Dropdown   | Select option |
-| File picker    | Clear files |
-| Kanban   | Add card, Delete card, Move card, Update card data |
-| Map   | Set location |
-| Modal     | Show, Close |
-| Multiselect   | Select option, Deselect option, Clear selection |
-| Radio button | Select option |
-| Tabs   | Set tab |
-| Table   | Set page, Select row, Deselect Row, Discard changes |
-| Text   | Set text, Set Visibility |
-| Text Area | Set text, Clear |
-| Text Input | Set text, Clear, Set Focus, Set Blur, Disable, Visibility |
-
-:::info
-Currently, Component specific actions are supported only by the above listed widgets. We are working on bringing component specific actions for the remaining widgets.
+Check out the **[demo](https://youtu.be/JIhSH3YeM3E)** of Component specific actions demonstrated in one of our community call.
 :::
 
 ## Using Component Specific Actions
 
-### Set a value for text input widget using button's event handler
+### Set a value for text input component using button's event handler
 
-- Drag a **Text Input** and a **Button** widget onto the canvas.
+- Drag a **Text Input** and a **Button** component onto the canvas.
 
-- Go to the **Inspector** on the left sidebar to check the exposed variables available for the `textinput1` widget under the `components`. You'll see that the variable `value` is an empty string because the field value of the text input widget is empty right now.
+- Go to the **Inspector** on the left sidebar to check the exposed variables available for the `textinput1` component under the `components`. You'll see that the variable `value` is an empty string because the field value of the text input component is empty right now.
 
 <div style={{textAlign: 'center'}}>
 
@@ -47,7 +51,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now enter some value in the text input widget and you'll see that the `value` in inspector has been updated.
+- Now enter some value in the text input component and you'll see that the `value` in inspector has been updated.
 
 <div style={{textAlign: 'center'}}>
 
@@ -55,7 +59,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now, click on the button's widget handler to open up its properties in the right sidebar and then add a event handler for **On Click** event to trigger **Control Component** action. Select `textinput1` in component dropdown, `Set text` as Action, and in `Text` field enter the text that you want to update in the field value.
+- Now, click on the button's component handler to open up its properties in the right sidebar and then add a event handler for **On Click** event to trigger **Control Component** action. Select `textinput1` in component dropdown, `Set text` as Action, and in `Text` field enter the text that you want to update in the field value.
 
 <div style={{textAlign: 'center'}}>
 
@@ -63,7 +67,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now when you'll click on the button you'll see that the field value of the text input widget has been updated with value that you set.
+- Now when you'll click on the button you'll see that the field value of the text input component has been updated with value that you set.
 
 <div style={{textAlign: 'center'}}>
 
@@ -72,7 +76,7 @@ Currently, Component specific actions are supported only by the above listed wid
 </div>
 
 
-### Clear value of text input widget using JavaScript query
+### Clear value of text input component using JavaScript query
 
 - Let's clear the value that we set in the previous section, using Run JavaScript code. Create a new Run JavaScript Code query and call the component and the CSA that component provides.
 
@@ -94,5 +98,5 @@ await components.textinput1.clear()
 
 </div>
 
-- Finally, hit the **save and run** query button to fire up the query, and you'll see that the field value of the text input widget has been cleared.
+- Finally, hit the **save and run** query button to fire up the query, and you'll see that the field value of the text input component has been cleared.
 

docs/versioned_docs/version-2.15.0/setup/azure-container.md

@@ -6,7 +6,7 @@ title: Azure container apps
 # Deploying ToolJet on Azure container apps
 
 :::info
-Please note that you need to set up a PostgreSQL database manually to be used by ToolJet
+Please note that you need to set up a PostgreSQL database manually to be used by ToolJet. Additionally, you must set up a Redis service through Azure Cache for Redis.
 :::
 
 *If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
@@ -36,9 +36,12 @@ Please note that you need to set up a PostgreSQL database manually to be used by
  
   - Make sure to provide the image tag, and then enter `npm run start:prod` in the "Command override" field.
   - Add the following ToolJet application variables under the "Environmental variable" section. You can refer to this [**documentation**](/docs/setup/env-vars) for more information on environment variables.
+
+  **Note: For the minimal setup, ToolJet requires: `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.**
+  
    <div style={{textAlign: 'center'}}>
  
-   <img className="screenshot-full" src="/img/setup/azure-container/step4.png" alt="Deploying ToolJet on Azure container apps" />
+   <img className="screenshot-full" src="/img/setup/azure-container/3-a.png" alt="Deploying ToolJet on Azure container apps" />
 
    </div>
 
@@ -52,7 +55,7 @@ Please note that you need to set up a PostgreSQL database manually to be used by
 5. Click on "Review + create" and wait for the template to be verified and passed, as shown in the screenshot below.
  <div style={{textAlign: 'center'}}>
 
- <img className="screenshot-full" src="/img/setup/azure-container/step5.png" alt="Deploying ToolJet on Azure container apps" />
+ <img className="screenshot-full" src="/img/setup/azure-container/5a.png" alt="Deploying ToolJet on Azure container apps" />
 
  </div>
 

docs/versioned_docs/version-2.15.0/setup/digitalocean.md

@@ -7,13 +7,38 @@ title: DigitalOcean
 
 Now you can quickly deploy ToolJet using the Deploy to DigitalOcean button.
 
-*If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
+If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.
+
+### Redis setup
+
+:::info
+ToolJet requires configuring Redis which is used for enabling multiplayer editing and for background jobs.
+:::
+
+Follow the steps below to configure Redis database:
+
+1. Navigate to **Database** and create a database cluster.
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/digitalocean/5.png" alt="ToolJet - Deploy on DigitalOcean" />
+
+  </div>
+
+2. Select `Redis` from the database engine and add a unique name to the cluster and click on **Create Database cluster**.
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/digitalocean/6.png" alt="ToolJet - Deploy on DigitalOcean" />
+
+  </div>
+
+3. Once the set-up is complete, add the Redis connection string in the environmental variable of `tooliet-app`.
 
 ## Deploying
 
 #### Follow the steps below to deploy ToolJet on DigitalOcean:
 
-
 1. Click on the button below to start one click deployment
 
   <div style={{textAlign: 'center'}}>
@@ -24,19 +49,37 @@ Now you can quickly deploy ToolJet using the Deploy to DigitalOcean button.
 
 2. A new tab will open up, sign-in to your DigitalOCean account. Once signed-in, the **Create App** page will open up and **Resources** will be already selected. Click on **Next** button.
 
+  <div style={{textAlign: 'center'}}>
+
   <img className="screenshot-full" src="/img/setup/digitalocean/resources.png" alt="ToolJet - Deploy on DigitalOcean - Resources" />
 
+  </div>
+
 3. Now, on **Environment Variables** page you can add new variables or edit the existing ones. Check the [environment variables here](/docs/setup/env-vars).
 
+  Also, please add the redis url in the environment variable `REDIS_URL= #connection string`
+
+  <div style={{textAlign: 'center'}}>
+
   <img className="screenshot-full" src="/img/setup/digitalocean/env.png" alt="ToolJet - Deploy on DigitalOcean - Environment Variables" />
 
+  </div>
+
 4. On the next page, you can change the **App name**, **Project**, and the **Region**.
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/region.png" alt="ToolJet - Deploy on DigitalOcean - App name" />
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/digitalocean/region.png" alt="ToolJet - Deploy on DigitalOcean - Launch" />
+
+  </div>
 
 5. On the last page, you'll be asked to **Review** all the app details such that we entered before such as **Resources**, **Environment Variables**, **Region**, and there will also be **Billing** section at the end. Review all the details and click the **Create Resource** button.
 
-   <img className="screenshot-full" src="/img/setup/digitalocean/review.png" alt="ToolJet - Deploy on DigitalOcean - App name" />
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/digitalocean/review.png" alt="ToolJet - Deploy on DigitalOcean - Launch" />
+
+  </div>
 
 6. Once you click the **Create Resource** button, the build will begin. Once the build is complete, you'll see the resource and a **URL** next to it. Click on the URL to open the deployed **ToolJet**.
 
@@ -44,14 +87,14 @@ Now you can quickly deploy ToolJet using the Deploy to DigitalOcean button.
 ToolJet server and client can be deployed as standalone applications. If you do not want to deploy the client on DigitalOcean, modify `package.json` accordingly. We have a [guide](/docs/setup/client) on deploying ToolJet client using services such as Firebase.
 :::
 
-#### Deploying Tooljet Database
+## Deploying Tooljet Database
 
 If you intend to use this feature, you'd have to set up and deploy PostgREST server which helps querying ToolJet Database.
 You can learn more about this feature [here](/docs/tooljet-database).
 
 Follow the steps below to deploy ToolJet Database on DigitalOcean:
 
-1. If you are using dev database within ToolJet deployment, upgrade it to managed database. You could also add a separate database, if you intent use a different database, please refer the [environment variables](/docs/setup/env-vars#tooljet-database-feature-enable--optional-) for additional env variables. 
+1. If you are using dev database within ToolJet deployment, upgrade it to managed database. You could also add a separate database, if you intent use a different database, please refer the [environment variables](/docs/setup/env-vars#enable-tooljet-database--optional-) for additional env variables. 
 
 2. Create a new app for PostgREST server. You can opt for docker hub to deploy PostgREST image of version `10.1.x`.
 
@@ -63,4 +106,4 @@ Follow the steps below to deploy ToolJet Database on DigitalOcean:
 
 4. Add your newly created PostgREST app to the trusted sources of your managed or separate database.
 
-5. Update your existing ToolJet application deployment with [environment variables](/docs/setup/env-vars#tooljet-database-feature-enable--optional-) required for PostgREST. 
+5. Update your existing ToolJet application deployment with [environment variables](/docs/setup/env-vars#enable-tooljet-database--optional-) required for PostgREST. 

docs/versioned_docs/version-2.15.0/setup/ec2.md

@@ -3,12 +3,12 @@ id: ec2
 title: AWS EC2
 ---
 
-# AWS EC2
+# Deploying ToolJet on Amazon EC2
 
 :::info
 You should setup a PostgreSQL database manually to be used by the ToolJet server.
-
 :::
+
 *If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
 
 Follow the steps below to deploy ToolJet on AWS EC2 instances.

docs/versioned_docs/version-2.15.0/setup/ecs.md

@@ -9,71 +9,222 @@ title: AWS ECS
 You should setup a PostgreSQL database manually to be used by ToolJet.
 :::
 
-*If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
+You can effortlessly deploy Amazon Elastic Container Service (ECS) by utilizing a [CloudFormation template](https://aws.amazon.com/cloudformation/):
+
+To deploy all the services at once, simply employ the following template:
+
+```
+curl -LO https://tooljet-deployments.s3.us-west-1.amazonaws.com/cloudformation/Cloudfomation-template-one-click.yml
+```
+
+If you already have existing services and wish to integrate ToolJet seamlessly into your current Virtual Private Cloud (VPC) or other setups, you can opt for the following template:
+
+```
+curl -LO https://tooljet-deployments.s3.us-west-1.amazonaws.com/cloudformation/Cloudformation-deploy.yml
+``` 
+
+## Redis
+
+:::info
+ToolJet requires configuring Redis which is used for enabling multiplayer editing and for background jobs.
+:::
+
+To deploy Redis on an ECS cluster, please follow the steps outlined below.
+
+Please note that if you already have an existing Redis setup, you can continue using it. However, if you need to create a new Redis service, you can follow the steps provided below.
+
+- Create a new take definition 
+
+  <div style={{textAlign: 'center'}}>
+  
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-1.png" alt="ECS Setup" />
+  
+  </div>
+
+
+- Please add container and image tag as shown below: 
+
+  **Make sure that you are using redis version 6.x.x**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-2.png" alt="ECS Setup" />
+
+  </div>
+
+- Ensure that when creating a service, Redis is integrated into the same cluster where your ToolJet app will be deployed. 
+
+  **Note: Please enable public IP**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-3.png" alt="ECS Setup" />
+
+  </div>
+
+## ToolJet
 
 Follow the steps below to deploy ToolJet on a ECS cluster.
 
-1.  Setup a PostgreSQL database
-    ToolJet uses a postgres database as the persistent storage for storing data related to users and apps.
+1. Setup a PostgreSQL database ToolJet uses a postgres database as the persistent storage for storing data related to users and apps.
+2. Create a target group and an application load balancer to route traffic onto ToolJet containers. You can [reference](https://docs.aws.amazon.com/AmazonECS/latest/userguide/create-application-load-balancer.html) AWS docs to set it up. Please note that ToolJet server exposes `/api/health`, which you can configure for health checks.
 
-2.  Create a target group and an application load balancer to route traffic onto ToolJet containers.
-    You can [reference](https://docs.aws.amazon.com/AmazonECS/latest/userguide/create-application-load-balancer.html) AWS docs to set it up. Please note that ToolJet server exposes `/api/health`, which you can configure for health checks.
+3. Create task definition for deploying ToolJet app as a service on your preconfigured cluster.
 
-    :::note
-    This setup follows the old AWS UI for ECS as some options are missing on the latest experience.
-    :::
+  i. Select Fargate as launch type compatibility
+   
+  ii. Configure IAM roles and set operating system family as Linux. 
+  
+  iii. Select task size to have 3GB of memory and 1vCpu
 
-3.  Create task definition for deploying ToolJet app as a service on your preconfigured cluster.
+  <div style={{textAlign: 'center'}}>
 
-    1.  Select Fargate as launch type compatibility.
-        <img className="screenshot-full" src="/img/setup/ecs/launch-type-compatibility.png" alt="select launch type compatibility" />
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-4.png" alt="ECS Setup" />
 
-    2.  Configure IAM roles and set operating system family as Linux
-        <img className="screenshot-full" src="/img/setup/ecs/task-definition-config.png" alt="task definition config" />
+  </div>
+  
+  iv. Add container details that is shown: 
 
-    3.  Select task size to have 3GB of memory and 1vCpu
-        <img className="screenshot-full" src="/img/setup/ecs/task-size.png" alt="task size config" />
+  Specify your container name ex: `ToolJet`
 
-    4.  Click on add container to update container definitions
-        <img className="screenshot-full" src="/img/setup/ecs/add-container-button.png" alt="add container button" />
+  Set the image you intend to deploy. ex: `tooljet/tooljet:<version_tag>`
 
-        Within the add container form that is shown:
+  Update port mappings at container port `3000` for tcp protocol.
 
-        - Specify your container name ex: `tooljet-ce`
-        - Set the image you intend to deploy. ex: `tooljet/tooljet-ce:v1.26.0`
-        - Update port mappings at container port `3000` for tcp protocol.
-          <img className="screenshot-full" src="/img/setup/ecs/container-setup.png" alt="container setup" />
+  <div style={{textAlign: 'center'}}>
 
-        - Update container command field to be `npm,run,start:prod`.
-          <img className="screenshot-full" src="/img/setup/ecs/container-command.png" alt="container command" />
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-5.png" alt="ECS Setup" />
 
-        - Specify environmental values for the container. You'd want to make use of secrets to store sensitive information or credentials, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/specifying-sensitive-data-secrets.html) to set it up.
+  </div>
+  
+  Specify environmental values for the container. You'd want to make use of secrets to store sensitive information or credentials, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/specifying-sensitive-data-secrets.html) to set it up. You can also store the env in S3 bucket, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/taskdef-envfiles.html) . 
 
-           <img className="screenshot-full" src="/img/setup/ecs/container-env-setup.png" alt="container env setup" />
+  <div style={{textAlign: 'center'}}>
 
-          :::note
-          For the minimal setup, ToolJet requires:
-          `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-6.png" alt="ECS Setup" />
 
-          Read **[environment variables reference](/docs/setup/env-vars)**
+  </div>
+  
+  :::info
+  For the minimal setup, ToolJet requires: `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.
+  
+  Read **[environment variables reference](https://docs.tooljet.com/docs/setup/env-vars)**
+  :::
+  
+  Additionally, include the Redis environment variables within the ToolJet container mentioned above if you have followed the previous steps to create Redis.
+  
+  ```
+  REDIS_HOST=<public ip of redis task>
+  REDIS_PORT=6379
+  REDIS_USER=default
+  REDIS_PASSWORD=
+  ```
+  
+  v. Make sure `Use log collection checked` and `Docker configuration` with the command `npm run start:dev`
 
-          :::
+  <div style={{textAlign: 'center'}}>
 
-4.  Create a service to run your task definition within your cluster.
-    - Select launch type as Fargate.
-    - Set operating system family as Linux
-    - Select task definition family as the one created earlier. ex: `tooljet-ce`
-    - Select the cluster and set the service name
-    - You can set the number of tasks to start with as two
-    - Rest of the values can be kept as default
-      <img className="screenshot-full" src="/img/setup/ecs/service-config.png" alt="service config" />
-    - Click on next step to configure networking options
-    - Select your designated VPC, Subnets and Security groups. Kindly ensure that the security group allows for inbound traffic to http port 3000 for the task.
-      <img className="screenshot-full" src="/img/setup/ecs/service-security-group-config.png" alt="service security group config" />
-    - Since migrations are run as a part of container boot, please specify health check grace period for 900 seconds.
-    - Select the application loadbalancer option and set the target group name to the one we had created earlier. This will auto populate the health check endpoints.
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-8.png" alt="ECS Setup" />
+
+  </div>
+
+4. Create a service to run your task definition within your cluster.
+
+  - Select the cluster which you have created
+  
+  - Select launch type as Fargate 
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-9.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Select the cluster and set the service name
+  
+  - You can set the number of tasks to start with as two
+
+  - Rest of the values can be kept as default
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-10.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Click on next step to configure networking options
+  
+  - Select your designated VPC, Subnets and Security groups. Kindly ensure that the security group allows for inbound traffic to http port 3000 for the task.
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-11.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Since migrations are run as a part of container boot, please specify health check grace period for 900 seconds. Select the application loadbalancer option and set the target group name to the one we had created earlier. This will auto populate the health check endpoints.
 
 :::info
 The setup above is just a template. Feel free to update the task definition and configure parameters for resources and environment variables according to your needs.
 :::
 
+
+## ToolJet Database
+
+If you intend to use this feature, you'd have to set up and deploy PostgREST server which helps querying ToolJet Database. You can learn more about this feature [here](https://docs.tooljet.com/docs/tooljet-database).
+
+Follow the steps below to deploy PostgREST on a ECS cluster. 
+
+1. Create a new take definition
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-12.png" alt="ECS Setup" />
+
+  </div>
+  
+  Add the container details and image tag as shown below:
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-13.png" alt="ECS Setup" />
+
+  </div>
+  
+  Under environmental variable please add corresponding PostgREST env variables. You can also refer [env variable](https://docs.tooljet.com/docs/setup/env-vars/#postgrest-server-optional).
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-14.png" alt="ECS Setup" />
+
+  </div>
+
+
+2. Create service and make sure the postgrest is within the same cluster as ToolJet app. 
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-15.png" alt="ECS Setup" />
+
+  </div>
+
+
+3. Specify a service name and leave the remaining settings at their default configurations.
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-16.png" alt="ECS Setup" />
+
+  </div>
+
+4. Ensure that the PostgREST service resides within the same Virtual Private Cloud (VPC), and confirm that port 3001 is included in the security group used by the ToolJet app. **Note: Please enable public IP**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-17.png" alt="ECS Setup" />
+
+  </div>
+
+
+Update ToolJet deployment with the appropriate env variables [here](https://docs.tooljet.com/docs/setup/env-vars/#enable-tooljet-database--optional-) and apply the changes.
+

docs/versioned_docs/version-2.16.0/actions/control-component.md

@@ -3,43 +3,47 @@ id: control-component
 title: Control component (Component Specific Actions)
 ---
 
-Control component action invokes the component specific actions. Component specific actions are the actions that are exclusive actions for a particular widget. Component specific actions can be triggered either through the event handlers or from the Run JavaScript code query.
+Control component action invokes the component specific actions. Component specific actions are the actions that are exclusive actions for a particular component. Component specific actions can be triggered either through the event handlers or from the Run JavaScript code query.
+
+You can find the component specific actions for the specific component in their respective documentation. For example, you can find the component specific actions for the **Bounded Box** component in the [Bounded Box](/docs/widgets/bounded-box) documentation.
+
+<details>
+  <summary>Currently, Component specific actions are supported only by the below listed components.</summary>
+  <div>
+    <ul>
+    <li><a href="/docs/widgets/button#component-specific-actions-csa">Button</a></li>
+    <li><a href="/docs/widgets/checkbox#component-specific-actions-csa">Checkbox</a></li>
+    <li><a href="/docs/widgets/color-picker#component-specific-actions-csa">Color Picker</a></li>
+    <li><a href="/docs/widgets/dropdown#component-specific-actions-csa">Dropdown</a></li>
+    <li><a href="/docs/widgets/file-picker#component-specific-actions-csa">File Picker</a></li>
+    <li><a href="/docs/widgets/form#component-specific-actions-csa">Form</a></li>
+    <li><a href="/docs/widgets/icon#component-specific-actions-csa">Icon</a></li>
+    <li><a href="/docs/widgets/kanban#component-specific-actions-csa">Kanban</a></li>
+    <li><a href="/docs/widgets/link#component-specific-actions-csa">Link</a></li>
+    <li><a href="/docs/widgets/map#component-specific-actions-csa">Map</a></li>
+    <li><a href="/docs/widgets/modal#component-specific-actions-csa">Modal</a></li>
+    <li><a href="/docs/widgets/multiselect#component-specific-actions-csa">Multiselect</a></li>
+    <li><a href="/docs/widgets/radio-button#component-specific-actions-csa">Radio button</a></li>
+    <li><a href="/docs/widgets/table#component-specific-actions-csa">Table</a></li>
+    <li><a href="/docs/widgets/tabs#component-specific-actions-csa">Tabs</a></li>
+    <li><a href="/docs/widgets/text-input#component-specific-actions-csa">Text Input</a></li>
+    <li><a href="/docs/widgets/text#component-specific-actions-csa">Text</a></li>
+    <li><a href="/docs/widgets/textarea#component-specific-actions-csa">Text Area</a></li>
+    </ul>
+  </div>
+</details>
 
 :::info
-Check out the **[live demo](https://youtu.be/JIhSH3YeM3E)** of Component specific actions demonstrated in one of our community call.
-:::
-
-## Available Component Specific Actions
-
-| Widget | Component Specific Actions |
-|--------|---------------------------|
-| Button | Click, Set label, Disable, Visibility, Loading |
-| Checkbox   | Set checked |
-| Color picker   | Set color |
-| Dropdown   | Select option |
-| File picker    | Clear files |
-| Kanban   | Add card, Delete card, Move card, Update card data |
-| Map   | Set location |
-| Modal     | Show, Close |
-| Multiselect   | Select option, Deselect option, Clear selection |
-| Radio button | Select option |
-| Tabs   | Set tab |
-| Table   | Set page, Select row, Deselect Row, Discard changes |
-| Text   | Set text, Set Visibility |
-| Text Area | Set text, Clear |
-| Text Input | Set text, Clear, Set Focus, Set Blur, Disable, Visibility |
-
-:::info
-Currently, Component specific actions are supported only by the above listed widgets. We are working on bringing component specific actions for the remaining widgets.
+Check out the **[demo](https://youtu.be/JIhSH3YeM3E)** of Component specific actions demonstrated in one of our community call.
 :::
 
 ## Using Component Specific Actions
 
-### Set a value for text input widget using button's event handler
+### Set a value for text input component using button's event handler
 
-- Drag a **Text Input** and a **Button** widget onto the canvas.
+- Drag a **Text Input** and a **Button** component onto the canvas.
 
-- Go to the **Inspector** on the left sidebar to check the exposed variables available for the `textinput1` widget under the `components`. You'll see that the variable `value` is an empty string because the field value of the text input widget is empty right now.
+- Go to the **Inspector** on the left sidebar to check the exposed variables available for the `textinput1` component under the `components`. You'll see that the variable `value` is an empty string because the field value of the text input component is empty right now.
 
 <div style={{textAlign: 'center'}}>
 
@@ -47,7 +51,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now enter some value in the text input widget and you'll see that the `value` in inspector has been updated.
+- Now enter some value in the text input component and you'll see that the `value` in inspector has been updated.
 
 <div style={{textAlign: 'center'}}>
 
@@ -55,7 +59,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now, click on the button's widget handler to open up its properties in the right sidebar and then add a event handler for **On Click** event to trigger **Control Component** action. Select `textinput1` in component dropdown, `Set text` as Action, and in `Text` field enter the text that you want to update in the field value.
+- Now, click on the button's component handler to open up its properties in the right sidebar and then add a event handler for **On Click** event to trigger **Control Component** action. Select `textinput1` in component dropdown, `Set text` as Action, and in `Text` field enter the text that you want to update in the field value.
 
 <div style={{textAlign: 'center'}}>
 
@@ -63,7 +67,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now when you'll click on the button you'll see that the field value of the text input widget has been updated with value that you set.
+- Now when you'll click on the button you'll see that the field value of the text input component has been updated with value that you set.
 
 <div style={{textAlign: 'center'}}>
 
@@ -72,7 +76,7 @@ Currently, Component specific actions are supported only by the above listed wid
 </div>
 
 
-### Clear value of text input widget using JavaScript query
+### Clear value of text input component using JavaScript query
 
 - Let's clear the value that we set in the previous section, using Run JavaScript code. Create a new Run JavaScript Code query and call the component and the CSA that component provides.
 
@@ -94,5 +98,5 @@ await components.textinput1.clear()
 
 </div>
 
-- Finally, hit the **save and run** query button to fire up the query, and you'll see that the field value of the text input widget has been cleared.
+- Finally, hit the **save and run** query button to fire up the query, and you'll see that the field value of the text input component has been cleared.
 

docs/versioned_docs/version-2.16.0/setup/azure-container.md

@@ -6,7 +6,7 @@ title: Azure container apps
 # Deploying ToolJet on Azure container apps
 
 :::info
-Please note that you need to set up a PostgreSQL database manually to be used by ToolJet
+Please note that you need to set up a PostgreSQL database manually to be used by ToolJet. Additionally, you must set up a Redis service through Azure Cache for Redis.
 :::
 
 *If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
@@ -36,9 +36,12 @@ Please note that you need to set up a PostgreSQL database manually to be used by
  
   - Make sure to provide the image tag, and then enter `npm run start:prod` in the "Command override" field.
   - Add the following ToolJet application variables under the "Environmental variable" section. You can refer to this [**documentation**](/docs/setup/env-vars) for more information on environment variables.
+
+  **Note: For the minimal setup, ToolJet requires: `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.**
+  
    <div style={{textAlign: 'center'}}>
  
-   <img className="screenshot-full" src="/img/setup/azure-container/step4.png" alt="Deploying ToolJet on Azure container apps" />
+   <img className="screenshot-full" src="/img/setup/azure-container/3-a.png" alt="Deploying ToolJet on Azure container apps" />
 
    </div>
 
@@ -52,7 +55,7 @@ Please note that you need to set up a PostgreSQL database manually to be used by
 5. Click on "Review + create" and wait for the template to be verified and passed, as shown in the screenshot below.
  <div style={{textAlign: 'center'}}>
 
- <img className="screenshot-full" src="/img/setup/azure-container/step5.png" alt="Deploying ToolJet on Azure container apps" />
+ <img className="screenshot-full" src="/img/setup/azure-container/5a.png" alt="Deploying ToolJet on Azure container apps" />
 
  </div>
 

docs/versioned_docs/version-2.16.0/setup/digitalocean.md

@@ -7,13 +7,38 @@ title: DigitalOcean
 
 Now you can quickly deploy ToolJet using the Deploy to DigitalOcean button.
 
-*If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
+If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.
+
+### Redis setup
+
+:::info
+ToolJet requires configuring Redis which is used for enabling multiplayer editing and for background jobs.
+:::
+
+Follow the steps below to configure Redis database:
+
+1. Navigate to **Database** and create a database cluster.
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/digitalocean/5.png" alt="ToolJet - Deploy on DigitalOcean" />
+
+  </div>
+
+2. Select `Redis` from the database engine and add a unique name to the cluster and click on **Create Database cluster**.
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/digitalocean/6.png" alt="ToolJet - Deploy on DigitalOcean" />
+
+  </div>
+
+3. Once the set-up is complete, add the Redis connection string in the environmental variable of `tooliet-app`.
 
 ## Deploying
 
 #### Follow the steps below to deploy ToolJet on DigitalOcean:
 
-
 1. Click on the button below to start one click deployment
 
   <div style={{textAlign: 'center'}}>
@@ -24,19 +49,37 @@ Now you can quickly deploy ToolJet using the Deploy to DigitalOcean button.
 
 2. A new tab will open up, sign-in to your DigitalOCean account. Once signed-in, the **Create App** page will open up and **Resources** will be already selected. Click on **Next** button.
 
+  <div style={{textAlign: 'center'}}>
+
   <img className="screenshot-full" src="/img/setup/digitalocean/resources.png" alt="ToolJet - Deploy on DigitalOcean - Resources" />
 
+  </div>
+
 3. Now, on **Environment Variables** page you can add new variables or edit the existing ones. Check the [environment variables here](/docs/setup/env-vars).
 
+  Also, please add the redis url in the environment variable `REDIS_URL= #connection string`
+
+  <div style={{textAlign: 'center'}}>
+
   <img className="screenshot-full" src="/img/setup/digitalocean/env.png" alt="ToolJet - Deploy on DigitalOcean - Environment Variables" />
 
+  </div>
+
 4. On the next page, you can change the **App name**, **Project**, and the **Region**.
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/region.png" alt="ToolJet - Deploy on DigitalOcean - App name" />
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/digitalocean/region.png" alt="ToolJet - Deploy on DigitalOcean - Launch" />
+
+  </div>
 
 5. On the last page, you'll be asked to **Review** all the app details such that we entered before such as **Resources**, **Environment Variables**, **Region**, and there will also be **Billing** section at the end. Review all the details and click the **Create Resource** button.
 
-   <img className="screenshot-full" src="/img/setup/digitalocean/review.png" alt="ToolJet - Deploy on DigitalOcean - App name" />
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/digitalocean/review.png" alt="ToolJet - Deploy on DigitalOcean - Launch" />
+
+  </div>
 
 6. Once you click the **Create Resource** button, the build will begin. Once the build is complete, you'll see the resource and a **URL** next to it. Click on the URL to open the deployed **ToolJet**.
 
@@ -44,14 +87,14 @@ Now you can quickly deploy ToolJet using the Deploy to DigitalOcean button.
 ToolJet server and client can be deployed as standalone applications. If you do not want to deploy the client on DigitalOcean, modify `package.json` accordingly. We have a [guide](/docs/setup/client) on deploying ToolJet client using services such as Firebase.
 :::
 
-#### Deploying Tooljet Database
+## Deploying Tooljet Database
 
 If you intend to use this feature, you'd have to set up and deploy PostgREST server which helps querying ToolJet Database.
 You can learn more about this feature [here](/docs/tooljet-database).
 
 Follow the steps below to deploy ToolJet Database on DigitalOcean:
 
-1. If you are using dev database within ToolJet deployment, upgrade it to managed database. You could also add a separate database, if you intent use a different database, please refer the [environment variables](/docs/setup/env-vars#tooljet-database-feature-enable--optional-) for additional env variables. 
+1. If you are using dev database within ToolJet deployment, upgrade it to managed database. You could also add a separate database, if you intent use a different database, please refer the [environment variables](/docs/setup/env-vars#enable-tooljet-database--optional-) for additional env variables. 
 
 2. Create a new app for PostgREST server. You can opt for docker hub to deploy PostgREST image of version `10.1.x`.
 
@@ -63,4 +106,4 @@ Follow the steps below to deploy ToolJet Database on DigitalOcean:
 
 4. Add your newly created PostgREST app to the trusted sources of your managed or separate database.
 
-5. Update your existing ToolJet application deployment with [environment variables](/docs/setup/env-vars#tooljet-database-feature-enable--optional-) required for PostgREST. 
+5. Update your existing ToolJet application deployment with [environment variables](/docs/setup/env-vars#enable-tooljet-database--optional-) required for PostgREST. 

docs/versioned_docs/version-2.16.0/setup/ec2.md

@@ -3,12 +3,12 @@ id: ec2
 title: AWS EC2
 ---
 
-# AWS EC2
+# Deploying ToolJet on Amazon EC2
 
 :::info
 You should setup a PostgreSQL database manually to be used by the ToolJet server.
-
 :::
+
 *If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
 
 Follow the steps below to deploy ToolJet on AWS EC2 instances.

docs/versioned_docs/version-2.16.0/setup/ecs.md

@@ -9,71 +9,222 @@ title: AWS ECS
 You should setup a PostgreSQL database manually to be used by ToolJet.
 :::
 
-*If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
+You can effortlessly deploy Amazon Elastic Container Service (ECS) by utilizing a [CloudFormation template](https://aws.amazon.com/cloudformation/):
+
+To deploy all the services at once, simply employ the following template:
+
+```
+curl -LO https://tooljet-deployments.s3.us-west-1.amazonaws.com/cloudformation/Cloudfomation-template-one-click.yml
+```
+
+If you already have existing services and wish to integrate ToolJet seamlessly into your current Virtual Private Cloud (VPC) or other setups, you can opt for the following template:
+
+```
+curl -LO https://tooljet-deployments.s3.us-west-1.amazonaws.com/cloudformation/Cloudformation-deploy.yml
+``` 
+
+## Redis
+
+:::info
+ToolJet requires configuring Redis which is used for enabling multiplayer editing and for background jobs.
+:::
+
+To deploy Redis on an ECS cluster, please follow the steps outlined below.
+
+Please note that if you already have an existing Redis setup, you can continue using it. However, if you need to create a new Redis service, you can follow the steps provided below.
+
+- Create a new take definition 
+
+  <div style={{textAlign: 'center'}}>
+  
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-1.png" alt="ECS Setup" />
+  
+  </div>
+
+
+- Please add container and image tag as shown below: 
+
+  **Make sure that you are using redis version 6.x.x**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-2.png" alt="ECS Setup" />
+
+  </div>
+
+- Ensure that when creating a service, Redis is integrated into the same cluster where your ToolJet app will be deployed. 
+
+  **Note: Please enable public IP**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-3.png" alt="ECS Setup" />
+
+  </div>
+
+## ToolJet
 
 Follow the steps below to deploy ToolJet on a ECS cluster.
 
-1.  Setup a PostgreSQL database
-    ToolJet uses a postgres database as the persistent storage for storing data related to users and apps.
+1. Setup a PostgreSQL database ToolJet uses a postgres database as the persistent storage for storing data related to users and apps.
+2. Create a target group and an application load balancer to route traffic onto ToolJet containers. You can [reference](https://docs.aws.amazon.com/AmazonECS/latest/userguide/create-application-load-balancer.html) AWS docs to set it up. Please note that ToolJet server exposes `/api/health`, which you can configure for health checks.
 
-2.  Create a target group and an application load balancer to route traffic onto ToolJet containers.
-    You can [reference](https://docs.aws.amazon.com/AmazonECS/latest/userguide/create-application-load-balancer.html) AWS docs to set it up. Please note that ToolJet server exposes `/api/health`, which you can configure for health checks.
+3. Create task definition for deploying ToolJet app as a service on your preconfigured cluster.
 
-    :::note
-    This setup follows the old AWS UI for ECS as some options are missing on the latest experience.
-    :::
+  i. Select Fargate as launch type compatibility
+   
+  ii. Configure IAM roles and set operating system family as Linux. 
+  
+  iii. Select task size to have 3GB of memory and 1vCpu
 
-3.  Create task definition for deploying ToolJet app as a service on your preconfigured cluster.
+  <div style={{textAlign: 'center'}}>
 
-    1.  Select Fargate as launch type compatibility.
-        <img className="screenshot-full" src="/img/setup/ecs/launch-type-compatibility.png" alt="select launch type compatibility" />
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-4.png" alt="ECS Setup" />
 
-    2.  Configure IAM roles and set operating system family as Linux
-        <img className="screenshot-full" src="/img/setup/ecs/task-definition-config.png" alt="task definition config" />
+  </div>
+  
+  iv. Add container details that is shown: 
 
-    3.  Select task size to have 3GB of memory and 1vCpu
-        <img className="screenshot-full" src="/img/setup/ecs/task-size.png" alt="task size config" />
+  Specify your container name ex: `ToolJet`
 
-    4.  Click on add container to update container definitions
-        <img className="screenshot-full" src="/img/setup/ecs/add-container-button.png" alt="add container button" />
+  Set the image you intend to deploy. ex: `tooljet/tooljet:<version_tag>`
 
-        Within the add container form that is shown:
+  Update port mappings at container port `3000` for tcp protocol.
 
-        - Specify your container name ex: `tooljet-ce`
-        - Set the image you intend to deploy. ex: `tooljet/tooljet-ce:v1.26.0`
-        - Update port mappings at container port `3000` for tcp protocol.
-          <img className="screenshot-full" src="/img/setup/ecs/container-setup.png" alt="container setup" />
+  <div style={{textAlign: 'center'}}>
 
-        - Update container command field to be `npm,run,start:prod`.
-          <img className="screenshot-full" src="/img/setup/ecs/container-command.png" alt="container command" />
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-5.png" alt="ECS Setup" />
 
-        - Specify environmental values for the container. You'd want to make use of secrets to store sensitive information or credentials, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/specifying-sensitive-data-secrets.html) to set it up.
+  </div>
+  
+  Specify environmental values for the container. You'd want to make use of secrets to store sensitive information or credentials, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/specifying-sensitive-data-secrets.html) to set it up. You can also store the env in S3 bucket, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/taskdef-envfiles.html) . 
 
-           <img className="screenshot-full" src="/img/setup/ecs/container-env-setup.png" alt="container env setup" />
+  <div style={{textAlign: 'center'}}>
 
-          :::note
-          For the minimal setup, ToolJet requires:
-          `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-6.png" alt="ECS Setup" />
 
-          Read **[environment variables reference](/docs/setup/env-vars)**
+  </div>
+  
+  :::info
+  For the minimal setup, ToolJet requires: `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.
+  
+  Read **[environment variables reference](https://docs.tooljet.com/docs/setup/env-vars)**
+  :::
+  
+  Additionally, include the Redis environment variables within the ToolJet container mentioned above if you have followed the previous steps to create Redis.
+  
+  ```
+  REDIS_HOST=<public ip of redis task>
+  REDIS_PORT=6379
+  REDIS_USER=default
+  REDIS_PASSWORD=
+  ```
+  
+  v. Make sure `Use log collection checked` and `Docker configuration` with the command `npm run start:dev`
 
-          :::
+  <div style={{textAlign: 'center'}}>
 
-4.  Create a service to run your task definition within your cluster.
-    - Select launch type as Fargate.
-    - Set operating system family as Linux
-    - Select task definition family as the one created earlier. ex: `tooljet-ce`
-    - Select the cluster and set the service name
-    - You can set the number of tasks to start with as two
-    - Rest of the values can be kept as default
-      <img className="screenshot-full" src="/img/setup/ecs/service-config.png" alt="service config" />
-    - Click on next step to configure networking options
-    - Select your designated VPC, Subnets and Security groups. Kindly ensure that the security group allows for inbound traffic to http port 3000 for the task.
-      <img className="screenshot-full" src="/img/setup/ecs/service-security-group-config.png" alt="service security group config" />
-    - Since migrations are run as a part of container boot, please specify health check grace period for 900 seconds.
-    - Select the application loadbalancer option and set the target group name to the one we had created earlier. This will auto populate the health check endpoints.
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-8.png" alt="ECS Setup" />
+
+  </div>
+
+4. Create a service to run your task definition within your cluster.
+
+  - Select the cluster which you have created
+  
+  - Select launch type as Fargate 
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-9.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Select the cluster and set the service name
+  
+  - You can set the number of tasks to start with as two
+
+  - Rest of the values can be kept as default
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-10.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Click on next step to configure networking options
+  
+  - Select your designated VPC, Subnets and Security groups. Kindly ensure that the security group allows for inbound traffic to http port 3000 for the task.
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-11.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Since migrations are run as a part of container boot, please specify health check grace period for 900 seconds. Select the application loadbalancer option and set the target group name to the one we had created earlier. This will auto populate the health check endpoints.
 
 :::info
 The setup above is just a template. Feel free to update the task definition and configure parameters for resources and environment variables according to your needs.
 :::
 
+
+## ToolJet Database
+
+If you intend to use this feature, you'd have to set up and deploy PostgREST server which helps querying ToolJet Database. You can learn more about this feature [here](https://docs.tooljet.com/docs/tooljet-database).
+
+Follow the steps below to deploy PostgREST on a ECS cluster. 
+
+1. Create a new take definition
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-12.png" alt="ECS Setup" />
+
+  </div>
+  
+  Add the container details and image tag as shown below:
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-13.png" alt="ECS Setup" />
+
+  </div>
+  
+  Under environmental variable please add corresponding PostgREST env variables. You can also refer [env variable](https://docs.tooljet.com/docs/setup/env-vars/#postgrest-server-optional).
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-14.png" alt="ECS Setup" />
+
+  </div>
+
+
+2. Create service and make sure the postgrest is within the same cluster as ToolJet app. 
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-15.png" alt="ECS Setup" />
+
+  </div>
+
+
+3. Specify a service name and leave the remaining settings at their default configurations.
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-16.png" alt="ECS Setup" />
+
+  </div>
+
+4. Ensure that the PostgREST service resides within the same Virtual Private Cloud (VPC), and confirm that port 3001 is included in the security group used by the ToolJet app. **Note: Please enable public IP**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-17.png" alt="ECS Setup" />
+
+  </div>
+
+
+Update ToolJet deployment with the appropriate env variables [here](https://docs.tooljet.com/docs/setup/env-vars/#enable-tooljet-database--optional-) and apply the changes.
+

docs/versioned_docs/version-2.17.0/actions/control-component.md

@@ -3,43 +3,47 @@ id: control-component
 title: Control component (Component Specific Actions)
 ---
 
-Control component action invokes the component specific actions. Component specific actions are the actions that are exclusive actions for a particular widget. Component specific actions can be triggered either through the event handlers or from the Run JavaScript code query.
+Control component action invokes the component specific actions. Component specific actions are the actions that are exclusive actions for a particular component. Component specific actions can be triggered either through the event handlers or from the Run JavaScript code query.
+
+You can find the component specific actions for the specific component in their respective documentation. For example, you can find the component specific actions for the **Bounded Box** component in the [Bounded Box](/docs/widgets/bounded-box) documentation.
+
+<details>
+  <summary>Currently, Component specific actions are supported only by the below listed components.</summary>
+  <div>
+    <ul>
+    <li><a href="/docs/widgets/button#component-specific-actions-csa">Button</a></li>
+    <li><a href="/docs/widgets/checkbox#component-specific-actions-csa">Checkbox</a></li>
+    <li><a href="/docs/widgets/color-picker#component-specific-actions-csa">Color Picker</a></li>
+    <li><a href="/docs/widgets/dropdown#component-specific-actions-csa">Dropdown</a></li>
+    <li><a href="/docs/widgets/file-picker#component-specific-actions-csa">File Picker</a></li>
+    <li><a href="/docs/widgets/form#component-specific-actions-csa">Form</a></li>
+    <li><a href="/docs/widgets/icon#component-specific-actions-csa">Icon</a></li>
+    <li><a href="/docs/widgets/kanban#component-specific-actions-csa">Kanban</a></li>
+    <li><a href="/docs/widgets/link#component-specific-actions-csa">Link</a></li>
+    <li><a href="/docs/widgets/map#component-specific-actions-csa">Map</a></li>
+    <li><a href="/docs/widgets/modal#component-specific-actions-csa">Modal</a></li>
+    <li><a href="/docs/widgets/multiselect#component-specific-actions-csa">Multiselect</a></li>
+    <li><a href="/docs/widgets/radio-button#component-specific-actions-csa">Radio button</a></li>
+    <li><a href="/docs/widgets/table#component-specific-actions-csa">Table</a></li>
+    <li><a href="/docs/widgets/tabs#component-specific-actions-csa">Tabs</a></li>
+    <li><a href="/docs/widgets/text-input#component-specific-actions-csa">Text Input</a></li>
+    <li><a href="/docs/widgets/text#component-specific-actions-csa">Text</a></li>
+    <li><a href="/docs/widgets/textarea#component-specific-actions-csa">Text Area</a></li>
+    </ul>
+  </div>
+</details>
 
 :::info
-Check out the **[live demo](https://youtu.be/JIhSH3YeM3E)** of Component specific actions demonstrated in one of our community call.
-:::
-
-## Available Component Specific Actions
-
-| Widget | Component Specific Actions |
-|--------|---------------------------|
-| Button | Click, Set label, Disable, Visibility, Loading |
-| Checkbox   | Set checked |
-| Color picker   | Set color |
-| Dropdown   | Select option |
-| File picker    | Clear files |
-| Kanban   | Add card, Delete card, Move card, Update card data |
-| Map   | Set location |
-| Modal     | Show, Close |
-| Multiselect   | Select option, Deselect option, Clear selection |
-| Radio button | Select option |
-| Tabs   | Set tab |
-| Table   | Set page, Select row, Deselect Row, Discard changes |
-| Text   | Set text, Set Visibility |
-| Text Area | Set text, Clear |
-| Text Input | Set text, Clear, Set Focus, Set Blur, Disable, Visibility |
-
-:::info
-Currently, Component specific actions are supported only by the above listed widgets. We are working on bringing component specific actions for the remaining widgets.
+Check out the **[demo](https://youtu.be/JIhSH3YeM3E)** of Component specific actions demonstrated in one of our community call.
 :::
 
 ## Using Component Specific Actions
 
-### Set a value for text input widget using button's event handler
+### Set a value for text input component using button's event handler
 
-- Drag a **Text Input** and a **Button** widget onto the canvas.
+- Drag a **Text Input** and a **Button** component onto the canvas.
 
-- Go to the **Inspector** on the left sidebar to check the exposed variables available for the `textinput1` widget under the `components`. You'll see that the variable `value` is an empty string because the field value of the text input widget is empty right now.
+- Go to the **Inspector** on the left sidebar to check the exposed variables available for the `textinput1` component under the `components`. You'll see that the variable `value` is an empty string because the field value of the text input component is empty right now.
 
 <div style={{textAlign: 'center'}}>
 
@@ -47,7 +51,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now enter some value in the text input widget and you'll see that the `value` in inspector has been updated.
+- Now enter some value in the text input component and you'll see that the `value` in inspector has been updated.
 
 <div style={{textAlign: 'center'}}>
 
@@ -55,7 +59,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now, click on the button's widget handler to open up its properties in the right sidebar and then add a event handler for **On Click** event to trigger **Control Component** action. Select `textinput1` in component dropdown, `Set text` as Action, and in `Text` field enter the text that you want to update in the field value.
+- Now, click on the button's component handler to open up its properties in the right sidebar and then add a event handler for **On Click** event to trigger **Control Component** action. Select `textinput1` in component dropdown, `Set text` as Action, and in `Text` field enter the text that you want to update in the field value.
 
 <div style={{textAlign: 'center'}}>
 
@@ -63,7 +67,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now when you'll click on the button you'll see that the field value of the text input widget has been updated with value that you set.
+- Now when you'll click on the button you'll see that the field value of the text input component has been updated with value that you set.
 
 <div style={{textAlign: 'center'}}>
 
@@ -72,7 +76,7 @@ Currently, Component specific actions are supported only by the above listed wid
 </div>
 
 
-### Clear value of text input widget using JavaScript query
+### Clear value of text input component using JavaScript query
 
 - Let's clear the value that we set in the previous section, using Run JavaScript code. Create a new Run JavaScript Code query and call the component and the CSA that component provides.
 
@@ -94,5 +98,5 @@ await components.textinput1.clear()
 
 </div>
 
-- Finally, hit the **save and run** query button to fire up the query, and you'll see that the field value of the text input widget has been cleared.
+- Finally, hit the **save and run** query button to fire up the query, and you'll see that the field value of the text input component has been cleared.
 

docs/versioned_docs/version-2.17.0/setup/azure-container.md

@@ -6,7 +6,7 @@ title: Azure container apps
 # Deploying ToolJet on Azure container apps
 
 :::info
-Please note that you need to set up a PostgreSQL database manually to be used by ToolJet
+Please note that you need to set up a PostgreSQL database manually to be used by ToolJet. Additionally, you must set up a Redis service through Azure Cache for Redis.
 :::
 
 *If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
@@ -36,9 +36,12 @@ Please note that you need to set up a PostgreSQL database manually to be used by
  
   - Make sure to provide the image tag, and then enter `npm run start:prod` in the "Command override" field.
   - Add the following ToolJet application variables under the "Environmental variable" section. You can refer to this [**documentation**](/docs/setup/env-vars) for more information on environment variables.
+
+  **Note: For the minimal setup, ToolJet requires: `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.**
+  
    <div style={{textAlign: 'center'}}>
  
-   <img className="screenshot-full" src="/img/setup/azure-container/step4.png" alt="Deploying ToolJet on Azure container apps" />
+   <img className="screenshot-full" src="/img/setup/azure-container/3-a.png" alt="Deploying ToolJet on Azure container apps" />
 
    </div>
 
@@ -52,7 +55,7 @@ Please note that you need to set up a PostgreSQL database manually to be used by
 5. Click on "Review + create" and wait for the template to be verified and passed, as shown in the screenshot below.
  <div style={{textAlign: 'center'}}>
 
- <img className="screenshot-full" src="/img/setup/azure-container/step5.png" alt="Deploying ToolJet on Azure container apps" />
+ <img className="screenshot-full" src="/img/setup/azure-container/5a.png" alt="Deploying ToolJet on Azure container apps" />
 
  </div>
 

docs/versioned_docs/version-2.17.0/setup/digitalocean.md

@@ -7,49 +7,13 @@ title: DigitalOcean
 
 Now you can quickly deploy ToolJet using the Deploy to DigitalOcean button.
 
-*If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
-
-The latest docker image is `tooljet/tooljet:<version_tag>`
-
-## Deploying
-
-#### Follow the steps below to deploy ToolJet on DigitalOcean:
-
-1. Once signed-in to your DigitalOcean account, click on the **Create App** button. 
-  
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/1.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
-
-2. On the next page, you'll be asked to choose a **Resource** type, select **Docker Hub**. Enter the Repository name as `tooljet/tooljet` and the corresponding tag.
-
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/2.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
-
-3. Once the Resource is created, you'll be redirected to the **Resources** page. Click on the **Edit** button next to the Resource.
-
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/3.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
-  
-  Make sure the **Run Command** is `./server/scripts/digitalocean-postbuild.sh` and the **HTTP** port is `3000`. Once you have edited the ToolJet resource click on the **Back** button.
-
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/4.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
+If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.
 
 ### Redis setup
 
+:::info
 ToolJet requires configuring Redis which is used for enabling multiplayer editing and for background jobs.
+:::
 
 Follow the steps below to configure Redis database:
 
@@ -70,82 +34,60 @@ Follow the steps below to configure Redis database:
   </div>
 
 3. Once the set-up is complete, add the Redis connection string in the environmental variable of `tooliet-app`.
-  :::info
-  In the business edition, saving or making changes in apps is dependent on Redis, even if multi-player editing is not necessary.
-  :::
-  
-### Database setup
 
-Follow the below steps to attach a postgresql database:
+## Deploying
 
-1. Click on **Add Resource** and select **Database** and click on add.
+#### Follow the steps below to deploy ToolJet on DigitalOcean:
+
+1. Click on the button below to start one click deployment
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/7.png" alt="ToolJet - Deploy on DigitalOcean" />
+  [![Deploy to DigitalOcean](https://www.deploytodo.com/do-btn-blue.svg)](https://cloud.digitalocean.com/apps/new?repo=https://github.com/ToolJet/ToolJet/tree/main)
 
   </div>
 
-2. Enter the preffered name for the database and click **Create and attach**.
+2. A new tab will open up, sign-in to your DigitalOCean account. Once signed-in, the **Create App** page will open up and **Resources** will be already selected. Click on **Next** button.
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/8.png" alt="ToolJet - Deploy on DigitalOcean" />
+  <img className="screenshot-full" src="/img/setup/digitalocean/resources.png" alt="ToolJet - Deploy on DigitalOcean - Resources" />
 
   </div>
 
-### Setting up environment variables
+3. Now, on **Environment Variables** page you can add new variables or edit the existing ones. Check the [environment variables here](/docs/setup/env-vars).
 
-1. Once the database is attached, click on **Next** to set up the environment variables.
+  Also, please add the redis url in the environment variable `REDIS_URL= #connection string`
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/9.png" alt="ToolJet - Deploy on DigitalOcean" />
+  <img className="screenshot-full" src="/img/setup/digitalocean/env.png" alt="ToolJet - Deploy on DigitalOcean - Environment Variables" />
 
   </div>
 
-2. Click on **Edit** next to `tooljet-app`.
+4. On the next page, you can change the **App name**, **Project**, and the **Region**.
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/10.png" alt="ToolJet - Deploy on DigitalOcean" />
+  <img className="screenshot-full" src="/img/setup/digitalocean/region.png" alt="ToolJet - Deploy on DigitalOcean - Launch" />
 
   </div>
 
-3. Click on the build editor to edit the environment variables.
+5. On the last page, you'll be asked to **Review** all the app details such that we entered before such as **Resources**, **Environment Variables**, **Region**, and there will also be **Billing** section at the end. Review all the details and click the **Create Resource** button.
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/11.png" alt="ToolJet - Deploy on DigitalOcean" />
+  <img className="screenshot-full" src="/img/setup/digitalocean/review.png" alt="ToolJet - Deploy on DigitalOcean - Launch" />
 
   </div>
 
-  ```bash
-  NODE_ ENV=production
-  NODE_OPTIONS=--max-old-space-size=4096
-  LOCKBOX MASTER_KEY= #Use `openssl rand -hex 32`
-  SECRET KEY BASE= #Use `openssl rand -hex 64`
-  DEPLOYMENT_PLATFORM=digitalocean
-  DATABASE_URL=${<enter the db name which was attached>.DATABASE_URL}
-  CA CERT=${<enter the db name which was attached>.CA_CERT}
-  TOOLJET HOST=${APP_URL} 
-  TOOLJET_SERVER_URL=${APP_URL} 
-  REDIS_URL= #connection string
-  ```
+6. Once you click the **Create Resource** button, the build will begin. Once the build is complete, you'll see the resource and a **URL** next to it. Click on the URL to open the deployed **ToolJet**.
 
-  DATABASE_URL and CA_CERT variable should be added in the above format.
+:::tip
+ToolJet server and client can be deployed as standalone applications. If you do not want to deploy the client on DigitalOcean, modify `package.json` accordingly. We have a [guide](/docs/setup/client) on deploying ToolJet client using services such as Firebase.
+:::
 
-4. After adding the environment variables, click on **Save**.
-
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/12.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
-
-  To add additional environment variables, refer this [doc](https://docs.tooljet.com/docs/setup/env-vars/).
-
-#### Deploying Tooljet Database
+## Deploying Tooljet Database
 
 If you intend to use this feature, you'd have to set up and deploy PostgREST server which helps querying ToolJet Database.
 You can learn more about this feature [here](/docs/tooljet-database).

docs/versioned_docs/version-2.17.0/setup/ec2.md

@@ -3,12 +3,12 @@ id: ec2
 title: AWS EC2
 ---
 
-# AWS EC2
+# Deploying ToolJet on Amazon EC2
 
 :::info
 You should setup a PostgreSQL database manually to be used by the ToolJet server.
-
 :::
+
 *If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
 
 Follow the steps below to deploy ToolJet on AWS EC2 instances.

docs/versioned_docs/version-2.17.0/setup/ecs.md

@@ -9,81 +9,222 @@ title: AWS ECS
 You should setup a PostgreSQL database manually to be used by ToolJet.
 :::
 
-*If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
+You can effortlessly deploy Amazon Elastic Container Service (ECS) by utilizing a [CloudFormation template](https://aws.amazon.com/cloudformation/):
+
+To deploy all the services at once, simply employ the following template:
+
+```
+curl -LO https://tooljet-deployments.s3.us-west-1.amazonaws.com/cloudformation/Cloudfomation-template-one-click.yml
+```
+
+If you already have existing services and wish to integrate ToolJet seamlessly into your current Virtual Private Cloud (VPC) or other setups, you can opt for the following template:
+
+```
+curl -LO https://tooljet-deployments.s3.us-west-1.amazonaws.com/cloudformation/Cloudformation-deploy.yml
+``` 
+
+## Redis
+
+:::info
+ToolJet requires configuring Redis which is used for enabling multiplayer editing and for background jobs.
+:::
+
+To deploy Redis on an ECS cluster, please follow the steps outlined below.
+
+Please note that if you already have an existing Redis setup, you can continue using it. However, if you need to create a new Redis service, you can follow the steps provided below.
+
+- Create a new take definition 
+
+  <div style={{textAlign: 'center'}}>
+  
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-1.png" alt="ECS Setup" />
+  
+  </div>
+
+
+- Please add container and image tag as shown below: 
+
+  **Make sure that you are using redis version 6.x.x**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-2.png" alt="ECS Setup" />
+
+  </div>
+
+- Ensure that when creating a service, Redis is integrated into the same cluster where your ToolJet app will be deployed. 
+
+  **Note: Please enable public IP**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-3.png" alt="ECS Setup" />
+
+  </div>
+
+## ToolJet
 
 Follow the steps below to deploy ToolJet on a ECS cluster.
 
-1.  Setup a PostgreSQL database
-    ToolJet uses a postgres database as the persistent storage for storing data related to users and apps.
+1. Setup a PostgreSQL database ToolJet uses a postgres database as the persistent storage for storing data related to users and apps.
+2. Create a target group and an application load balancer to route traffic onto ToolJet containers. You can [reference](https://docs.aws.amazon.com/AmazonECS/latest/userguide/create-application-load-balancer.html) AWS docs to set it up. Please note that ToolJet server exposes `/api/health`, which you can configure for health checks.
 
-2.  Create a target group and an application load balancer to route traffic onto ToolJet containers.
-    You can [reference](https://docs.aws.amazon.com/AmazonECS/latest/userguide/create-application-load-balancer.html) AWS docs to set it up. Please note that ToolJet server exposes `/api/health`, which you can configure for health checks.
+3. Create task definition for deploying ToolJet app as a service on your preconfigured cluster.
 
-    :::note
-    This setup follows the old AWS UI for ECS as some options are missing on the latest experience.
-    :::
+  i. Select Fargate as launch type compatibility
+   
+  ii. Configure IAM roles and set operating system family as Linux. 
+  
+  iii. Select task size to have 3GB of memory and 1vCpu
 
-3.  Create task definition for deploying ToolJet app as a service on your preconfigured cluster.
+  <div style={{textAlign: 'center'}}>
 
-    1.  Select Fargate as launch type compatibility.
-        <img className="screenshot-full" src="/img/setup/ecs/launch-type-compatibility.png" alt="select launch type compatibility" />
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-4.png" alt="ECS Setup" />
 
-    2.  Configure IAM roles and set operating system family as Linux
-        <img className="screenshot-full" src="/img/setup/ecs/task-definition-config.png" alt="task definition config" />
+  </div>
+  
+  iv. Add container details that is shown: 
 
-    3.  Select task size to have 3GB of memory and 1vCpu
-        <img className="screenshot-full" src="/img/setup/ecs/task-size.png" alt="task size config" />
+  Specify your container name ex: `ToolJet`
 
-    4.  Click on add container to update container definitions
-        <img className="screenshot-full" src="/img/setup/ecs/add-container-button.png" alt="add container button" />
+  Set the image you intend to deploy. ex: `tooljet/tooljet:<version_tag>`
 
-        Within the add container form that is shown:
+  Update port mappings at container port `3000` for tcp protocol.
 
-        - Specify your container name ex: `tooljet`
-        - Set the image you intend to deploy. ex: `tooljet/tooljet:<version_tag>`
-        - Update port mappings at container port `3000` for tcp protocol.
-          <img className="screenshot-full" src="/img/setup/ecs/container-setup.png" alt="container setup" />
+  <div style={{textAlign: 'center'}}>
 
-        - Update container command field to be `npm,run,start:prod`.
-          <img className="screenshot-full" src="/img/setup/ecs/container-command.png" alt="container command" />
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-5.png" alt="ECS Setup" />
 
-        - Specify environmental values for the container. You'd want to make use of secrets to store sensitive information or credentials, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/specifying-sensitive-data-secrets.html) to set it up.
+  </div>
+  
+  Specify environmental values for the container. You'd want to make use of secrets to store sensitive information or credentials, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/specifying-sensitive-data-secrets.html) to set it up. You can also store the env in S3 bucket, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/taskdef-envfiles.html) . 
 
-           <img className="screenshot-full" src="/img/setup/ecs/container-env-setup.png" alt="container env setup" />
+  <div style={{textAlign: 'center'}}>
 
-          :::note
-          For the minimal setup, ToolJet requires:
-          `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-6.png" alt="ECS Setup" />
 
-          Read **[environment variables reference](/docs/setup/env-vars)**
+  </div>
+  
+  :::info
+  For the minimal setup, ToolJet requires: `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.
+  
+  Read **[environment variables reference](https://docs.tooljet.com/docs/setup/env-vars)**
+  :::
+  
+  Additionally, include the Redis environment variables within the ToolJet container mentioned above if you have followed the previous steps to create Redis.
+  
+  ```
+  REDIS_HOST=<public ip of redis task>
+  REDIS_PORT=6379
+  REDIS_USER=default
+  REDIS_PASSWORD=
+  ```
+  
+  v. Make sure `Use log collection checked` and `Docker configuration` with the command `npm run start:dev`
 
-          :::
-     5. Please add redis container as part of the deployment. Please make sure that you are using redis version 6.x.x
+  <div style={{textAlign: 'center'}}>
 
-        Also add these env variable in the above tooljet container
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-8.png" alt="ECS Setup" />
 
-           ```
-           REDIS_HOST=localhost
-           REDIS_PORT=6379
-           REDIS_USER=default
-           REDIS_PASSWORD=
-           ```
+  </div>
 
-4.  Create a service to run your task definition within your cluster.
-    - Select launch type as Fargate.
-    - Set operating system family as Linux
-    - Select task definition family as the one created earlier. ex: `tooljet-ce`
-    - Select the cluster and set the service name
-    - You can set the number of tasks to start with as two
-    - Rest of the values can be kept as default
-      <img className="screenshot-full" src="/img/setup/ecs/service-config.png" alt="service config" />
-    - Click on next step to configure networking options
-    - Select your designated VPC, Subnets and Security groups. Kindly ensure that the security group allows for inbound traffic to http port 3000 for the task.
-      <img className="screenshot-full" src="/img/setup/ecs/service-security-group-config.png" alt="service security group config" />
-    - Since migrations are run as a part of container boot, please specify health check grace period for 900 seconds.
-    - Select the application loadbalancer option and set the target group name to the one we had created earlier. This will auto populate the health check endpoints.
+4. Create a service to run your task definition within your cluster.
+
+  - Select the cluster which you have created
+  
+  - Select launch type as Fargate 
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-9.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Select the cluster and set the service name
+  
+  - You can set the number of tasks to start with as two
+
+  - Rest of the values can be kept as default
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-10.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Click on next step to configure networking options
+  
+  - Select your designated VPC, Subnets and Security groups. Kindly ensure that the security group allows for inbound traffic to http port 3000 for the task.
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-11.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Since migrations are run as a part of container boot, please specify health check grace period for 900 seconds. Select the application loadbalancer option and set the target group name to the one we had created earlier. This will auto populate the health check endpoints.
 
 :::info
 The setup above is just a template. Feel free to update the task definition and configure parameters for resources and environment variables according to your needs.
 :::
 
+
+## ToolJet Database
+
+If you intend to use this feature, you'd have to set up and deploy PostgREST server which helps querying ToolJet Database. You can learn more about this feature [here](https://docs.tooljet.com/docs/tooljet-database).
+
+Follow the steps below to deploy PostgREST on a ECS cluster. 
+
+1. Create a new take definition
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-12.png" alt="ECS Setup" />
+
+  </div>
+  
+  Add the container details and image tag as shown below:
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-13.png" alt="ECS Setup" />
+
+  </div>
+  
+  Under environmental variable please add corresponding PostgREST env variables. You can also refer [env variable](https://docs.tooljet.com/docs/setup/env-vars/#postgrest-server-optional).
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-14.png" alt="ECS Setup" />
+
+  </div>
+
+
+2. Create service and make sure the postgrest is within the same cluster as ToolJet app. 
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-15.png" alt="ECS Setup" />
+
+  </div>
+
+
+3. Specify a service name and leave the remaining settings at their default configurations.
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-16.png" alt="ECS Setup" />
+
+  </div>
+
+4. Ensure that the PostgREST service resides within the same Virtual Private Cloud (VPC), and confirm that port 3001 is included in the security group used by the ToolJet app. **Note: Please enable public IP**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-17.png" alt="ECS Setup" />
+
+  </div>
+
+
+Update ToolJet deployment with the appropriate env variables [here](https://docs.tooljet.com/docs/setup/env-vars/#enable-tooljet-database--optional-) and apply the changes.
+

docs/versioned_docs/version-2.18.0/data-sources/airtable.md

@@ -5,22 +5,15 @@ title: Airtable
 
 # Airtable
 
-
-ToolJet can connect to your Airtable account to read and write data. **Airtable API key** is required to create an Airtable data source on ToolJet. You can generate API key by visiting [Airtable account page](https://airtable.com/account). 
-
+ToolJet can connect to your Airtable account to read and write data. Airtable Personal Access Token is required to connect to the Airtable data source on ToolJet. You can generate the PAT by visiting [Developer Hub from your Airtable profile](https://support.airtable.com/docs/creating-and-using-api-keys-and-access-tokens#understanding-personal-access-token-basic-actions).
 
 <img className="screenshot-full" src="/img/datasource-reference/airtable/add_creds.gif" alt="irtable record"/>
 
-
 :::info
-Airtable API has a rate limit, and at the time of writing this documentation, the limit is five(5) requests per second per base. You can read more about rate limits here **[Airtable API]( https://airtable.com/api )**.
+Airtable API has a rate limit, and at the time of writing this documentation, the limit is five(5) requests per second per base. You can read more about rate limits here **[Airtable API](https://airtable.com/api)**.
 :::
 
-:::tip
-This guide assumes that you have already gone through [Adding a data source](/docs/tutorial/adding-a-datasource) tutorial.
-:::
-
-## Supported queries
+## Supported Operations
 
 - **[Listing records](#listing-records)**
 - **[Retrieving a record](#retrieving-a-record)**
@@ -30,113 +23,106 @@ This guide assumes that you have already gone through [Adding a data source](/do
 
 ### Listing records
 
-This query lists all the records in a table. The results are paginated and each page can have up to 100 records. 
+This query lists all the records in a table. The results are paginated and each page can have up to 100 records.
 
-#### Required parameters: 
+#### Required parameters:
 
 - **Base ID:** To find the Base ID, first visit **airtable.com/api**. Select from the list of bases the base whose ID you'd like to find out. Example Base ID: `appDT3UCPffPiSmFd`
 - **Table name:** Enter the table name whose data you want to fetch.
 
-#### Optional parameters: 
+#### Optional parameters:
 
 - **Page size:** The number of records returned in each request. Must be less than or equal to 100. Default is 100.
 - **offset:** If there are more records, the response will contain an offset. To fetch the next page of records, include offset in the next request's parameters.
 
-
 <img className="screenshot-full" src="/img/datasource-reference/airtable/listv2.png"  alt="List airtable record" />
 
-
-Example response from Airtable: 
+Example response from Airtable:
 
 ```json
 {
-    "records": [
-        {
-            "id": "recu9xMnUdr2n2cw8",
-            "fields": {
-                "Notes": "sdfdsf",
-                "Name": "dsfdsf"
-            },
-            "createdTime": "2021-05-12T14:30:33.000Z"
-        },
-        {
-            "id": "recyIdR7bVdQvmKXa",
-            "fields": {
-                "Notes": "sdfdsf",
-                "Name": "dfds"
-            },
-            "createdTime": "2021-05-12T14:30:33.000Z"
-        },
-        {
-            "id": "recAOzdIHaRpvRaGE",
-            "fields": {
-                "Notes": "sdfsdfsd",
-                "Name": "sdfdsf"
-            },
-            "createdTime": "2021-05-12T14:30:33.000Z"
-        }
-    ],
-    "offset": "recAOzdIHaRpvRaGE"
+  "records": [
+    {
+      "id": "recu9xMnUdr2n2cw8",
+      "fields": {
+        "Notes": "sdfdsf",
+        "Name": "dsfdsf"
+      },
+      "createdTime": "2021-05-12T14:30:33.000Z"
+    },
+    {
+      "id": "recyIdR7bVdQvmKXa",
+      "fields": {
+        "Notes": "sdfdsf",
+        "Name": "dfds"
+      },
+      "createdTime": "2021-05-12T14:30:33.000Z"
+    },
+    {
+      "id": "recAOzdIHaRpvRaGE",
+      "fields": {
+        "Notes": "sdfsdfsd",
+        "Name": "sdfdsf"
+      },
+      "createdTime": "2021-05-12T14:30:33.000Z"
+    }
+  ],
+  "offset": "recAOzdIHaRpvRaGE"
 }
 ```
 
 ### Retrieving a record
 
-#### Required parameters: 
+#### Required parameters:
 
 - **Base ID**
-- **Table name** 
+- **Table name**
 - **Record ID**
 
-
 <img className="screenshot-full" src="/img/datasource-reference/airtable/retv2.png"  alt="Retrieve airtable record" />
 
-
-Example response from Airtable: 
+Example response from Airtable:
 
 ```json
 {
-    "id": "recu9xMnUdr2n2cw8",
-    "fields": {
-        "Notes": "sdfdsf",
-        "Name": "dsfdsf"
-    },
-    "createdTime": "2021-05-12T14:30:33.000Z"
+  "id": "recu9xMnUdr2n2cw8",
+  "fields": {
+    "Notes": "sdfdsf",
+    "Name": "dsfdsf"
+  },
+  "createdTime": "2021-05-12T14:30:33.000Z"
 }
 ```
 
 ### Creating a record
 
 #### Required parameters:
+
 - **Base ID**
 - **Table name**
 - **Records**
 
-
 <img className="screenshot-full" src="/img/datasource-reference/airtable/createv2.png" alt="Create airtable record" />
 
 #### Example Records:
 
 ```json
 [
-    {
-        "fields": {
-            "Notes": "sdfdsf",
-            "Name": "dsfdsf"
-        }
-    },
-    {
-        "fields": {
-            "Notes": "note1",
-            "Name": "dsfdsf"
-        }
+  {
+    "fields": {
+      "Notes": "sdfdsf",
+      "Name": "dsfdsf"
     }
+  },
+  {
+    "fields": {
+      "Notes": "note1",
+      "Name": "dsfdsf"
+    }
+  }
 ]
- 
-
 ```
 
-
 Click on the `run` button to run the query.
 
 :::info
@@ -144,37 +130,38 @@ NOTE: Query must be saved before running.
 :::
 
 Example response from Airtable:
+
 ```json
 {
-    "records": [
-        {
-            "id": "rec5RuZ1COoZGtGDY",
-            "fields": {
-                "Notes": "sdfdsf",
-                "Name": "dsfdsf"
-            },
-            "createdTime": "2022-02-07T20:25:27.000Z"
-        },
-        {
-            "id": "recaYbFPonNNu6Cwj",
-            "fields": {
-                "Notes": "note1",
-                "Name": "dsfdsf"
-            },
-            "createdTime": "2022-02-07T20:25:27.000Z"
-        }
-    ]
+  "records": [
+    {
+      "id": "rec5RuZ1COoZGtGDY",
+      "fields": {
+        "Notes": "sdfdsf",
+        "Name": "dsfdsf"
+      },
+      "createdTime": "2022-02-07T20:25:27.000Z"
+    },
+    {
+      "id": "recaYbFPonNNu6Cwj",
+      "fields": {
+        "Notes": "note1",
+        "Name": "dsfdsf"
+      },
+      "createdTime": "2022-02-07T20:25:27.000Z"
+    }
+  ]
 }
 ```
 
 ### Updating a record
 
 #### Required parameters:
+
 - **Base ID**
 - **Table name**
 - **Record ID**
 
-
 <img className="screenshot-full" src="/img/datasource-reference/airtable/updv2.png" alt="Update airtable record"/>
 
 #### Example body:
@@ -192,27 +179,28 @@ NOTE: Query must be saved before running.
 :::
 
 Example response from Airtable:
+
 ```json
 {
-    "id": "recu9xMnUdr2n2cw8",
-    "fields": {
-        "Notes": "Example Notes",
-        "Name": "change"
-    },
-    "createdTime": "2021-08-08T17:27:17.000Z"
+  "id": "recu9xMnUdr2n2cw8",
+  "fields": {
+    "Notes": "Example Notes",
+    "Name": "change"
+  },
+  "createdTime": "2021-08-08T17:27:17.000Z"
 }
 ```
 
 ### Deleting a record
 
 #### Required parameters:
+
 - **Base ID**
 - **Table name**
 - **Record ID**
 
 <img className="screenshot-full" src="/img/datasource-reference/airtable/delv2.png" alt="Delete airtable record" />
 
-
 Click on the `run` button to run the query.
 
 :::info
@@ -226,4 +214,4 @@ Example response from Airtable:
     deleted: true
     id: "recIKsyZgqI4zoqS7"
 }
-```
+```

docs/versioned_docs/version-2.18.0/data-sources/athena.md

@@ -9,6 +9,8 @@ ToolJet can connect to Amazon Athena which is an interactive query service that
 
 ## Connection
 
+To establish a connection with the Amazon Athena data source, you can either click on the `+Add new data source` button located on the query panel or navigate to the [Data Sources](https://docs.tooljet.com/docs/data-sources/overview) page from the ToolJet dashboard.
+
 ToolJet requires the following to connect to your Athena.
 
 - **Database**
@@ -29,14 +31,8 @@ You can also configure for **[additional optional parameters](https://github.com
 
 - Click on `+` button of the query manager at the bottom panel of the editor and select the database added in the previous step as the datasource. Query manager then can be used to write SQL queries.
 
-
-<img className="screenshot-full" src="/img/datasource-reference/athena/athena-query.png" alt="Athena query" />
-
-
 - Click on the `run` button to run the query. 
 
-**NOTE:** Query should be saved before running.
-
 :::tip
 **Refer amazon athena docs here for more info:** [link](https://docs.aws.amazon.com/athena/latest/ug/what-is.html)
 :::

docs/versioned_docs/version-2.18.0/data-sources/azureblob.md

@@ -7,9 +7,9 @@ ToolJet offers the capability to establish a connection with Azure Blob storage
 
 ## Connection
 
-To connect ToolJet with the Azure Blob global datasource, you have two options:
-1. Click on the `+Add new global datasource` button in the query panel.
-2. Go to the **[Global Datasources](/docs/data-sources/overview)** page on the ToolJet dashboard.
+To connect ToolJet with the Azure Blob data source, you have two options:
+1. Click on the `+Add new data source` button in the query panel.
+2. Go to the **[Data Sources](/docs/data-sources/overview)** page on the ToolJet dashboard.
 
 <div style={{textAlign: 'center'}}>
 
@@ -20,15 +20,15 @@ To connect ToolJet with the Azure Blob global datasource, you have two options:
 To successfully establish the connection, ToolJet requires the following details:
 - **Connection String**: The connection string can be found on the dashboard of Azure Blob Storage.
 
-Once you have entered the connection string, click on the **Test connection** button to verify the connection's success. To save the datasource, click on the **Save** button.
+Once you have entered the connection string, click on the **Test connection** button to verify the connection's success. To save the data source, click on the **Save** button.
 
 ## Querying Azure Blob
 
-Once you have connected to the Azure Blob global datasource, follow these steps to create queries and interact with a Azure Blob storage from the ToolJet application:
+Once you have connected to the Azure Blob data source, follow these steps to create queries and interact with Azure Blob storage from the ToolJet application:
 
 1. Open the ToolJet application and navigate to the query panel at the bottom of the app builder.
-2. Click the `+Add` button to open the list of available `local` and `global datasources`.
-3. Select **Azure Blob** from the global datasource section.
+2. Click the `+Add` button to open the list of available `local` and `data sources`.
+3. Select **Azure Blob** from the data source section.
 4. Select the desired **operation** from the dropdown and enter the required **parameters**.
 5. **Rename**(optional) and **Create** the query.
 6. Click **Preview** to view the data returned from the query or click **Run** to execute the query.
@@ -43,21 +43,21 @@ Query results can be transformed using Transformation. For more information on t
 
 </div>
 
-## Supported operations
+## Supported Operations
 
-1. **[Create container](#create-container)**
-2. **[List containers](#list-containers)**
-3. **[List blobs](#list-blobs)**
-4. **[Upload blob](#upload-blob)**
-5. **[Read blob](#read-blob)**
-6. **[Delete blob](#delete-blob)**
+1. **[Create Container](#create-container)**
+2. **[List Containers](#list-containers)**
+3. **[List Blobs](#list-blobs)**
+4. **[Upload Blob](#upload-blob)**
+5. **[Read Blob](#read-blob)**
+6. **[Delete Blob](#delete-blob)**
 
 
-### Create container
+### Create Container
 
 The create container operation enables the creation of new containers within Azure Blob storage. Containers serve as logical units for organizing and managing blob data. Users can provide a unique name for the container. Once created, the container is available for use in storing and organizing blob data. If the container with the same name already exists, the operation fails.
 
-#### Required parameters:
+#### Required Parameters:
 
 - **Container Name:** Name of the container that you want to create. 
 
@@ -67,7 +67,7 @@ The create container operation enables the creation of new containers within Azu
 
 </div>
 
-### List containers
+### List Containers
 
 The list container operation allows you to retrieve a list of containers within Azure Blob storage.
 
@@ -77,16 +77,16 @@ The list container operation allows you to retrieve a list of containers within
 
 </div>
 
-### List blobs
+### List Blobs
 
 The list blobs operation enables you to retrieve a list of blobs within a specific container in Azure Blob storage. 
 
-#### Required parameter:
+#### Required Parameter:
 
 - **Container:** Specify the name of the container from which you wish to retrieve a list of blobs.
 - **Page Size:** Specify the maximum number of blobs to be returned per page or request.
 
-#### Optional parameters: 
+#### Optional Parameters: 
 
 - **Prefix:** Filter the list of blobs based on a specific prefix or prefix pattern, allowing you to narrow down the results to blobs with names that start with the specified prefix.
 - **Continuation Token:** A marker or token used to retrieve the next page of results when there are more blobs available beyond the initial page.
@@ -97,11 +97,11 @@ The list blobs operation enables you to retrieve a list of blobs within a specif
 
 </div>
 
-### Upload blob
+### Upload Blob
 
 The upload blob operation allows you to upload a new blob or update an existing blob in Azure Blob storage. It provides a convenient way to store data such as files, images, or documents in the specified container.
 
-#### Required parameters:
+#### Required Parameters:
 
 - **Container**: Specify the name of the container where the blob will be uploaded or updated.
 - **Blob Name**: Provide a unique name for the blob. This name is used to identify and access the blob within the specified container.
@@ -109,11 +109,11 @@ The upload blob operation allows you to upload a new blob or update an existing
 - **Upload Data**: Select or provide the data to be uploaded as the content of the blob. This can be a file from your local system, binary data, or text content. You can also get the data from the exposed variable of the file picker component.
 - **Encoding**: Choose the encoding format for the uploaded data if applicable. This parameter determines how the data is encoded before being stored as the blob content. If the value is left blank then it takes **UTF-8** by default.
 
-### Read blob
+### Read Blob
 
 The read blob operation allows you to retrieve the content of a specific blob stored in Azure Blob storage. It enables you to access and retrieve the data stored within the blob for further processing or display.
 
-#### Required parameters:
+#### Required Parameters:
 
 - **Container**: Specify the name of the container where the blob is located.
 - **Blob Name**: Provide the unique name of the blob you want to read. This identifies the specific blob within the specified container
@@ -124,11 +124,11 @@ The read blob operation allows you to retrieve the content of a specific blob st
 
 </div>
 
-### Delete blob
+### Delete Blob
 
 The delete blob operation allows you to remove a specific blob from Azure Blob storage. This operation permanently deletes the blob and its associated data, freeing up storage space and removing the blob from the container.
 
-#### Required parameters:
+#### Required Parameters:
 
 - **Container**: Specify the name of the container from which you want to delete the blob.
 - **Blob Name**: Provide the unique name of the blob you want to delete. This identifies the specific blob within the specified container.

docs/versioned_docs/version-2.18.0/data-sources/baserow.md

@@ -5,25 +5,22 @@ title: Baserow
 
 # Baserow
 
+ToolJet can connect to your Baserow account to read and write data.
+
 ## Connection
 
-ToolJet can connect to your Baserow account to read and write data. 
-Select the hosted version of Baserow or the self-host option.
+To connect to Baserow, you need to provide the following details:
 
-For [**self-hosted**](https://baserow.io/docs/index#installation) option, base URL is required to connect.
+- **API token**: You can create an API token from your Baserow dashboard. You can follow the steps to create API token from [this link](https://baserow.io/user-docs/personal-api-tokens).
+- **Host**: You can either select the Baserow Cloud or Self-hosted option.
+  - **Base URL**: If you select the self-hosted option, you need to provide the base URL of your Baserow instance.
 
-Baserow API token is required to create an Baserow data source on ToolJet. You can follow the steps to create API token from [this link](https://baserow.io/api-docs).
 
 
 <img className="screenshot-full" src="/img/datasource-reference/baserow/baserow-intro.png" alt="Baserow intro" />
 
 
-:::tip
-This guide assumes that you have already gone through [Adding a data source](/docs/tutorial/adding-a-datasource) tutorial.
-:::
-
-## Supported queries
-
+## Supported Operations
 - [List fields](#list-fields)
 - [List rows](#list-rows)
 - [Get row](#get-row)

docs/versioned_docs/version-2.18.0/data-sources/n8n.md

@@ -9,7 +9,7 @@ ToolJet can trigger n8n workflows using webhook URLs. Please refer [this](https:
 
 ## Connection
 
-Go to the data source manager on the left sidebar and click on `+` button to add new data source. Select n8n from the list of available data sources in the modal that pops-up.
+To establish a connection with the n8n data source, click on the `+Add new data source` button located on the query panel or navigate to the [Data Sources](https://docs.tooljet.com/docs/data-sources/overview) page from the ToolJet dashboard.
 
 n8n webhooks can be called with or without an **Authentication**. You can keep the `Authentication type` as `none` if your webhook didn't have one or if it has one then you can choose the one from the dropdown and provide credentials:
 

docs/versioned_docs/version-2.18.0/data-sources/oracledb.md

@@ -9,6 +9,8 @@ ToolJet can connect to Oracle databases to read and write data.
 
 ## Connection
 
+To establish a connection with the Oracle DB data source, click on the `+Add new` button located on the query panel or navigate to the [Data Sources](https://docs.tooljet.com/docs/data-sources/overview) page from the ToolJet dashboard.
+
 A Oracle DB can be connected with the following credentails:
 - **Host**
 - **Port**
@@ -38,8 +40,6 @@ Once you have added a Oracle DB data source, click on `+` button of the query ma
 
 SQL mode can be used to write raw SQL queries. Select SQL mode from the dropdown and enter the SQL query in the editor. Click on the `run` button to run the query.
 
-**NOTE**: Query should be saved before running.
-
 #### GUI mode
 
 GUI mode can be used to query Oracle database without writing queries. Select GUI mode from the dropdown and then choose the operation **Bulk update using primary key**. Enter the **Table** name and **Primary key column** name. Now, in the editor enter the records in the form of an array of objects. 
@@ -50,4 +50,4 @@ Click on the **run** button to run the query. **NOTE**: Query should be saved be
 
 :::tip
 Query results can be transformed using transformations. Read our transformations documentation to see how: **[link](/docs/tutorial/transformations)**
-:::
+:::

docs/versioned_docs/version-2.18.0/setup/azure-container.md

@@ -6,7 +6,7 @@ title: Azure container apps
 # Deploying ToolJet on Azure container apps
 
 :::info
-Please note that you need to set up a PostgreSQL database manually to be used by ToolJet
+Please note that you need to set up a PostgreSQL database manually to be used by ToolJet. Additionally, you must set up a Redis service through Azure Cache for Redis.
 :::
 
 *If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
@@ -36,9 +36,12 @@ Please note that you need to set up a PostgreSQL database manually to be used by
  
   - Make sure to provide the image tag, and then enter `npm run start:prod` in the "Command override" field.
   - Add the following ToolJet application variables under the "Environmental variable" section. You can refer to this [**documentation**](/docs/setup/env-vars) for more information on environment variables.
+
+  **Note: For the minimal setup, ToolJet requires: `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.**
+  
    <div style={{textAlign: 'center'}}>
  
-   <img className="screenshot-full" src="/img/setup/azure-container/step4.png" alt="Deploying ToolJet on Azure container apps" />
+   <img className="screenshot-full" src="/img/setup/azure-container/3-a.png" alt="Deploying ToolJet on Azure container apps" />
 
    </div>
 
@@ -52,7 +55,7 @@ Please note that you need to set up a PostgreSQL database manually to be used by
 5. Click on "Review + create" and wait for the template to be verified and passed, as shown in the screenshot below.
  <div style={{textAlign: 'center'}}>
 
- <img className="screenshot-full" src="/img/setup/azure-container/step5.png" alt="Deploying ToolJet on Azure container apps" />
+ <img className="screenshot-full" src="/img/setup/azure-container/5a.png" alt="Deploying ToolJet on Azure container apps" />
 
  </div>
 

docs/versioned_docs/version-2.18.0/setup/digitalocean.md

@@ -7,49 +7,13 @@ title: DigitalOcean
 
 Now you can quickly deploy ToolJet using the Deploy to DigitalOcean button.
 
-*If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
-
-The latest docker image is `tooljet/tooljet:<version_tag>`
-
-## Deploying
-
-#### Follow the steps below to deploy ToolJet on DigitalOcean:
-
-1. Once signed-in to your DigitalOcean account, click on the **Create App** button. 
-  
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/1.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
-
-2. On the next page, you'll be asked to choose a **Resource** type, select **Docker Hub**. Enter the Repository name as `tooljet/tooljet` and the corresponding tag.
-
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/2.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
-
-3. Once the Resource is created, you'll be redirected to the **Resources** page. Click on the **Edit** button next to the Resource.
-
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/3.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
-  
-  Make sure the **Run Command** is `./server/scripts/digitalocean-postbuild.sh` and the **HTTP** port is `3000`. Once you have edited the ToolJet resource click on the **Back** button.
-
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/4.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
+If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.
 
 ### Redis setup
 
+:::info
 ToolJet requires configuring Redis which is used for enabling multiplayer editing and for background jobs.
+:::
 
 Follow the steps below to configure Redis database:
 
@@ -70,82 +34,60 @@ Follow the steps below to configure Redis database:
   </div>
 
 3. Once the set-up is complete, add the Redis connection string in the environmental variable of `tooliet-app`.
-  :::info
-  In the business edition, saving or making changes in apps is dependent on Redis, even if multi-player editing is not necessary.
-  :::
-  
-### Database setup
 
-Follow the below steps to attach a postgresql database:
+## Deploying
 
-1. Click on **Add Resource** and select **Database** and click on add.
+#### Follow the steps below to deploy ToolJet on DigitalOcean:
+
+1. Click on the button below to start one click deployment
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/7.png" alt="ToolJet - Deploy on DigitalOcean" />
+  [![Deploy to DigitalOcean](https://www.deploytodo.com/do-btn-blue.svg)](https://cloud.digitalocean.com/apps/new?repo=https://github.com/ToolJet/ToolJet/tree/main)
 
   </div>
 
-2. Enter the preffered name for the database and click **Create and attach**.
+2. A new tab will open up, sign-in to your DigitalOCean account. Once signed-in, the **Create App** page will open up and **Resources** will be already selected. Click on **Next** button.
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/8.png" alt="ToolJet - Deploy on DigitalOcean" />
+  <img className="screenshot-full" src="/img/setup/digitalocean/resources.png" alt="ToolJet - Deploy on DigitalOcean - Resources" />
 
   </div>
 
-### Setting up environment variables
+3. Now, on **Environment Variables** page you can add new variables or edit the existing ones. Check the [environment variables here](/docs/setup/env-vars).
 
-1. Once the database is attached, click on **Next** to set up the environment variables.
+  Also, please add the redis url in the environment variable `REDIS_URL= #connection string`
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/9.png" alt="ToolJet - Deploy on DigitalOcean" />
+  <img className="screenshot-full" src="/img/setup/digitalocean/env.png" alt="ToolJet - Deploy on DigitalOcean - Environment Variables" />
 
   </div>
 
-2. Click on **Edit** next to `tooljet-app`.
+4. On the next page, you can change the **App name**, **Project**, and the **Region**.
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/10.png" alt="ToolJet - Deploy on DigitalOcean" />
+  <img className="screenshot-full" src="/img/setup/digitalocean/region.png" alt="ToolJet - Deploy on DigitalOcean - Launch" />
 
   </div>
 
-3. Click on the build editor to edit the environment variables.
+5. On the last page, you'll be asked to **Review** all the app details such that we entered before such as **Resources**, **Environment Variables**, **Region**, and there will also be **Billing** section at the end. Review all the details and click the **Create Resource** button.
 
   <div style={{textAlign: 'center'}}>
 
-  <img className="screenshot-full" src="/img/setup/digitalocean/11.png" alt="ToolJet - Deploy on DigitalOcean" />
+  <img className="screenshot-full" src="/img/setup/digitalocean/review.png" alt="ToolJet - Deploy on DigitalOcean - Launch" />
 
   </div>
 
-  ```bash
-  NODE_ ENV=production
-  NODE_OPTIONS=--max-old-space-size=4096
-  LOCKBOX MASTER_KEY= #Use `openssl rand -hex 32`
-  SECRET KEY BASE= #Use `openssl rand -hex 64`
-  DEPLOYMENT_PLATFORM=digitalocean
-  DATABASE_URL=${<enter the db name which was attached>.DATABASE_URL}
-  CA CERT=${<enter the db name which was attached>.CA_CERT}
-  TOOLJET HOST=${APP_URL} 
-  TOOLJET_SERVER_URL=${APP_URL} 
-  REDIS_URL= #connection string
-  ```
+6. Once you click the **Create Resource** button, the build will begin. Once the build is complete, you'll see the resource and a **URL** next to it. Click on the URL to open the deployed **ToolJet**.
 
-  DATABASE_URL and CA_CERT variable should be added in the above format.
+:::tip
+ToolJet server and client can be deployed as standalone applications. If you do not want to deploy the client on DigitalOcean, modify `package.json` accordingly. We have a [guide](/docs/setup/client) on deploying ToolJet client using services such as Firebase.
+:::
 
-4. After adding the environment variables, click on **Save**.
-
-  <div style={{textAlign: 'center'}}>
-
-  <img className="screenshot-full" src="/img/setup/digitalocean/12.png" alt="ToolJet - Deploy on DigitalOcean" />
-
-  </div>
-
-  To add additional environment variables, refer this [doc](https://docs.tooljet.com/docs/setup/env-vars/).
-
-#### Deploying Tooljet Database
+## Deploying Tooljet Database
 
 If you intend to use this feature, you'd have to set up and deploy PostgREST server which helps querying ToolJet Database.
 You can learn more about this feature [here](/docs/tooljet-database).

docs/versioned_docs/version-2.18.0/setup/ec2.md

@@ -3,12 +3,12 @@ id: ec2
 title: AWS EC2
 ---
 
-# AWS EC2
+# Deploying ToolJet on Amazon EC2
 
 :::info
 You should setup a PostgreSQL database manually to be used by the ToolJet server.
-
 :::
+
 *If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
 
 Follow the steps below to deploy ToolJet on AWS EC2 instances.

docs/versioned_docs/version-2.18.0/setup/ecs.md

@@ -9,81 +9,222 @@ title: AWS ECS
 You should setup a PostgreSQL database manually to be used by ToolJet.
 :::
 
-*If you have any questions feel free to join our [Slack Community](https://tooljet.com/slack) or send us an email at hello@tooljet.com.*
+You can effortlessly deploy Amazon Elastic Container Service (ECS) by utilizing a [CloudFormation template](https://aws.amazon.com/cloudformation/):
+
+To deploy all the services at once, simply employ the following template:
+
+```
+curl -LO https://tooljet-deployments.s3.us-west-1.amazonaws.com/cloudformation/Cloudfomation-template-one-click.yml
+```
+
+If you already have existing services and wish to integrate ToolJet seamlessly into your current Virtual Private Cloud (VPC) or other setups, you can opt for the following template:
+
+```
+curl -LO https://tooljet-deployments.s3.us-west-1.amazonaws.com/cloudformation/Cloudformation-deploy.yml
+``` 
+
+## Redis
+
+:::info
+ToolJet requires configuring Redis which is used for enabling multiplayer editing and for background jobs.
+:::
+
+To deploy Redis on an ECS cluster, please follow the steps outlined below.
+
+Please note that if you already have an existing Redis setup, you can continue using it. However, if you need to create a new Redis service, you can follow the steps provided below.
+
+- Create a new take definition 
+
+  <div style={{textAlign: 'center'}}>
+  
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-1.png" alt="ECS Setup" />
+  
+  </div>
+
+
+- Please add container and image tag as shown below: 
+
+  **Make sure that you are using redis version 6.x.x**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-2.png" alt="ECS Setup" />
+
+  </div>
+
+- Ensure that when creating a service, Redis is integrated into the same cluster where your ToolJet app will be deployed. 
+
+  **Note: Please enable public IP**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-3.png" alt="ECS Setup" />
+
+  </div>
+
+## ToolJet
 
 Follow the steps below to deploy ToolJet on a ECS cluster.
 
-1.  Setup a PostgreSQL database
-    ToolJet uses a postgres database as the persistent storage for storing data related to users and apps.
+1. Setup a PostgreSQL database ToolJet uses a postgres database as the persistent storage for storing data related to users and apps.
+2. Create a target group and an application load balancer to route traffic onto ToolJet containers. You can [reference](https://docs.aws.amazon.com/AmazonECS/latest/userguide/create-application-load-balancer.html) AWS docs to set it up. Please note that ToolJet server exposes `/api/health`, which you can configure for health checks.
 
-2.  Create a target group and an application load balancer to route traffic onto ToolJet containers.
-    You can [reference](https://docs.aws.amazon.com/AmazonECS/latest/userguide/create-application-load-balancer.html) AWS docs to set it up. Please note that ToolJet server exposes `/api/health`, which you can configure for health checks.
+3. Create task definition for deploying ToolJet app as a service on your preconfigured cluster.
 
-    :::note
-    This setup follows the old AWS UI for ECS as some options are missing on the latest experience.
-    :::
+  i. Select Fargate as launch type compatibility
+   
+  ii. Configure IAM roles and set operating system family as Linux. 
+  
+  iii. Select task size to have 3GB of memory and 1vCpu
 
-3.  Create task definition for deploying ToolJet app as a service on your preconfigured cluster.
+  <div style={{textAlign: 'center'}}>
 
-    1.  Select Fargate as launch type compatibility.
-        <img className="screenshot-full" src="/img/setup/ecs/launch-type-compatibility.png" alt="select launch type compatibility" />
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-4.png" alt="ECS Setup" />
 
-    2.  Configure IAM roles and set operating system family as Linux
-        <img className="screenshot-full" src="/img/setup/ecs/task-definition-config.png" alt="task definition config" />
+  </div>
+  
+  iv. Add container details that is shown: 
 
-    3.  Select task size to have 3GB of memory and 1vCpu
-        <img className="screenshot-full" src="/img/setup/ecs/task-size.png" alt="task size config" />
+  Specify your container name ex: `ToolJet`
 
-    4.  Click on add container to update container definitions
-        <img className="screenshot-full" src="/img/setup/ecs/add-container-button.png" alt="add container button" />
+  Set the image you intend to deploy. ex: `tooljet/tooljet:<version_tag>`
 
-        Within the add container form that is shown:
+  Update port mappings at container port `3000` for tcp protocol.
 
-        - Specify your container name ex: `tooljet`
-        - Set the image you intend to deploy. ex: `tooljet/tooljet:<version_tag>`
-        - Update port mappings at container port `3000` for tcp protocol.
-          <img className="screenshot-full" src="/img/setup/ecs/container-setup.png" alt="container setup" />
+  <div style={{textAlign: 'center'}}>
 
-        - Update container command field to be `npm,run,start:prod`.
-          <img className="screenshot-full" src="/img/setup/ecs/container-command.png" alt="container command" />
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-5.png" alt="ECS Setup" />
 
-        - Specify environmental values for the container. You'd want to make use of secrets to store sensitive information or credentials, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/specifying-sensitive-data-secrets.html) to set it up.
+  </div>
+  
+  Specify environmental values for the container. You'd want to make use of secrets to store sensitive information or credentials, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/specifying-sensitive-data-secrets.html) to set it up. You can also store the env in S3 bucket, kindly refer the AWS [docs](https://docs.aws.amazon.com/AmazonECS/latest/developerguide/taskdef-envfiles.html) . 
 
-           <img className="screenshot-full" src="/img/setup/ecs/container-env-setup.png" alt="container env setup" />
+  <div style={{textAlign: 'center'}}>
 
-          :::note
-          For the minimal setup, ToolJet requires:
-          `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-6.png" alt="ECS Setup" />
 
-          Read **[environment variables reference](/docs/setup/env-vars)**
+  </div>
+  
+  :::info
+  For the minimal setup, ToolJet requires: `TOOLJET_HOST`, `PG_HOST`, `PG_DB`, `PG_USER`, `PG_PASSWORD`, `SECRET_KEY_BASE` & `LOCKBOX_MASTER_KEY` keys in the secret.
+  
+  Read **[environment variables reference](https://docs.tooljet.com/docs/setup/env-vars)**
+  :::
+  
+  Additionally, include the Redis environment variables within the ToolJet container mentioned above if you have followed the previous steps to create Redis.
+  
+  ```
+  REDIS_HOST=<public ip of redis task>
+  REDIS_PORT=6379
+  REDIS_USER=default
+  REDIS_PASSWORD=
+  ```
+  
+  v. Make sure `Use log collection checked` and `Docker configuration` with the command `npm run start:dev`
 
-          :::
-     5. Please add redis container as part of the deployment. Please make sure that you are using redis version 6.x.x
+  <div style={{textAlign: 'center'}}>
 
-        Also add these env variable in the above tooljet container
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-8.png" alt="ECS Setup" />
 
-           ```
-           REDIS_HOST=localhost
-           REDIS_PORT=6379
-           REDIS_USER=default
-           REDIS_PASSWORD=
-           ```
+  </div>
 
-4.  Create a service to run your task definition within your cluster.
-    - Select launch type as Fargate.
-    - Set operating system family as Linux
-    - Select task definition family as the one created earlier. ex: `tooljet-ce`
-    - Select the cluster and set the service name
-    - You can set the number of tasks to start with as two
-    - Rest of the values can be kept as default
-      <img className="screenshot-full" src="/img/setup/ecs/service-config.png" alt="service config" />
-    - Click on next step to configure networking options
-    - Select your designated VPC, Subnets and Security groups. Kindly ensure that the security group allows for inbound traffic to http port 3000 for the task.
-      <img className="screenshot-full" src="/img/setup/ecs/service-security-group-config.png" alt="service security group config" />
-    - Since migrations are run as a part of container boot, please specify health check grace period for 900 seconds.
-    - Select the application loadbalancer option and set the target group name to the one we had created earlier. This will auto populate the health check endpoints.
+4. Create a service to run your task definition within your cluster.
+
+  - Select the cluster which you have created
+  
+  - Select launch type as Fargate 
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-9.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Select the cluster and set the service name
+  
+  - You can set the number of tasks to start with as two
+
+  - Rest of the values can be kept as default
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-10.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Click on next step to configure networking options
+  
+  - Select your designated VPC, Subnets and Security groups. Kindly ensure that the security group allows for inbound traffic to http port 3000 for the task.
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-11.png" alt="ECS Setup" />
+
+  </div>
+  
+  - Since migrations are run as a part of container boot, please specify health check grace period for 900 seconds. Select the application loadbalancer option and set the target group name to the one we had created earlier. This will auto populate the health check endpoints.
 
 :::info
 The setup above is just a template. Feel free to update the task definition and configure parameters for resources and environment variables according to your needs.
 :::
 
+
+## ToolJet Database
+
+If you intend to use this feature, you'd have to set up and deploy PostgREST server which helps querying ToolJet Database. You can learn more about this feature [here](https://docs.tooljet.com/docs/tooljet-database).
+
+Follow the steps below to deploy PostgREST on a ECS cluster. 
+
+1. Create a new take definition
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-12.png" alt="ECS Setup" />
+
+  </div>
+  
+  Add the container details and image tag as shown below:
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-13.png" alt="ECS Setup" />
+
+  </div>
+  
+  Under environmental variable please add corresponding PostgREST env variables. You can also refer [env variable](https://docs.tooljet.com/docs/setup/env-vars/#postgrest-server-optional).
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-14.png" alt="ECS Setup" />
+
+  </div>
+
+
+2. Create service and make sure the postgrest is within the same cluster as ToolJet app. 
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-15.png" alt="ECS Setup" />
+
+  </div>
+
+
+3. Specify a service name and leave the remaining settings at their default configurations.
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-16.png" alt="ECS Setup" />
+
+  </div>
+
+4. Ensure that the PostgREST service resides within the same Virtual Private Cloud (VPC), and confirm that port 3001 is included in the security group used by the ToolJet app. **Note: Please enable public IP**
+
+  <div style={{textAlign: 'center'}}>
+
+  <img className="screenshot-full" src="/img/setup/ecs/ecs-17.png" alt="ECS Setup" />
+
+  </div>
+
+
+Update ToolJet deployment with the appropriate env variables [here](https://docs.tooljet.com/docs/setup/env-vars/#enable-tooljet-database--optional-) and apply the changes.
+

docs/versioned_docs/version-2.19.0/actions/control-component.md

@@ -3,43 +3,47 @@ id: control-component
 title: Control component (Component Specific Actions)
 ---
 
-Control component action invokes the component specific actions. Component specific actions are the actions that are exclusive actions for a particular widget. Component specific actions can be triggered either through the event handlers or from the Run JavaScript code query.
+Control component action invokes the component specific actions. Component specific actions are the actions that are exclusive actions for a particular component. Component specific actions can be triggered either through the event handlers or from the Run JavaScript code query.
+
+You can find the component specific actions for the specific component in their respective documentation. For example, you can find the component specific actions for the **Bounded Box** component in the [Bounded Box](/docs/widgets/bounded-box) documentation.
+
+<details>
+  <summary>Currently, Component specific actions are supported only by the below listed components.</summary>
+  <div>
+    <ul>
+    <li><a href="/docs/widgets/button#component-specific-actions-csa">Button</a></li>
+    <li><a href="/docs/widgets/checkbox#component-specific-actions-csa">Checkbox</a></li>
+    <li><a href="/docs/widgets/color-picker#component-specific-actions-csa">Color Picker</a></li>
+    <li><a href="/docs/widgets/dropdown#component-specific-actions-csa">Dropdown</a></li>
+    <li><a href="/docs/widgets/file-picker#component-specific-actions-csa">File Picker</a></li>
+    <li><a href="/docs/widgets/form#component-specific-actions-csa">Form</a></li>
+    <li><a href="/docs/widgets/icon#component-specific-actions-csa">Icon</a></li>
+    <li><a href="/docs/widgets/kanban#component-specific-actions-csa">Kanban</a></li>
+    <li><a href="/docs/widgets/link#component-specific-actions-csa">Link</a></li>
+    <li><a href="/docs/widgets/map#component-specific-actions-csa">Map</a></li>
+    <li><a href="/docs/widgets/modal#component-specific-actions-csa">Modal</a></li>
+    <li><a href="/docs/widgets/multiselect#component-specific-actions-csa">Multiselect</a></li>
+    <li><a href="/docs/widgets/radio-button#component-specific-actions-csa">Radio button</a></li>
+    <li><a href="/docs/widgets/table#component-specific-actions-csa">Table</a></li>
+    <li><a href="/docs/widgets/tabs#component-specific-actions-csa">Tabs</a></li>
+    <li><a href="/docs/widgets/text-input#component-specific-actions-csa">Text Input</a></li>
+    <li><a href="/docs/widgets/text#component-specific-actions-csa">Text</a></li>
+    <li><a href="/docs/widgets/textarea#component-specific-actions-csa">Text Area</a></li>
+    </ul>
+  </div>
+</details>
 
 :::info
-Check out the **[live demo](https://youtu.be/JIhSH3YeM3E)** of Component specific actions demonstrated in one of our community call.
-:::
-
-## Available Component Specific Actions
-
-| Widget | Component Specific Actions |
-|--------|---------------------------|
-| Button | Click, Set label, Disable, Visibility, Loading |
-| Checkbox   | Set checked |
-| Color picker   | Set color |
-| Dropdown   | Select option |
-| File picker    | Clear files |
-| Kanban   | Add card, Delete card, Move card, Update card data |
-| Map   | Set location |
-| Modal     | Show, Close |
-| Multiselect   | Select option, Deselect option, Clear selection |
-| Radio button | Select option |
-| Tabs   | Set tab |
-| Table   | Set page, Select row, Deselect Row, Discard changes |
-| Text   | Set text, Set Visibility |
-| Text Area | Set text, Clear |
-| Text Input | Set text, Clear, Set Focus, Set Blur, Disable, Visibility |
-
-:::info
-Currently, Component specific actions are supported only by the above listed widgets. We are working on bringing component specific actions for the remaining widgets.
+Check out the **[demo](https://youtu.be/JIhSH3YeM3E)** of Component specific actions demonstrated in one of our community call.
 :::
 
 ## Using Component Specific Actions
 
-### Set a value for text input widget using button's event handler
+### Set a value for text input component using button's event handler
 
-- Drag a **Text Input** and a **Button** widget onto the canvas.
+- Drag a **Text Input** and a **Button** component onto the canvas.
 
-- Go to the **Inspector** on the left sidebar to check the exposed variables available for the `textinput1` widget under the `components`. You'll see that the variable `value` is an empty string because the field value of the text input widget is empty right now.
+- Go to the **Inspector** on the left sidebar to check the exposed variables available for the `textinput1` component under the `components`. You'll see that the variable `value` is an empty string because the field value of the text input component is empty right now.
 
 <div style={{textAlign: 'center'}}>
 
@@ -47,7 +51,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now enter some value in the text input widget and you'll see that the `value` in inspector has been updated.
+- Now enter some value in the text input component and you'll see that the `value` in inspector has been updated.
 
 <div style={{textAlign: 'center'}}>
 
@@ -55,7 +59,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now, click on the button's widget handler to open up its properties in the right sidebar and then add a event handler for **On Click** event to trigger **Control Component** action. Select `textinput1` in component dropdown, `Set text` as Action, and in `Text` field enter the text that you want to update in the field value.
+- Now, click on the button's component handler to open up its properties in the right sidebar and then add a event handler for **On Click** event to trigger **Control Component** action. Select `textinput1` in component dropdown, `Set text` as Action, and in `Text` field enter the text that you want to update in the field value.
 
 <div style={{textAlign: 'center'}}>
 
@@ -63,7 +67,7 @@ Currently, Component specific actions are supported only by the above listed wid
 
 </div>
 
-- Now when you'll click on the button you'll see that the field value of the text input widget has been updated with value that you set.
+- Now when you'll click on the button you'll see that the field value of the text input component has been updated with value that you set.
 
 <div style={{textAlign: 'center'}}>
 
@@ -72,7 +76,7 @@ Currently, Component specific actions are supported only by the above listed wid
 </div>
 
 
-### Clear value of text input widget using JavaScript query
+### Clear value of text input component using JavaScript query
 
 - Let's clear the value that we set in the previous section, using Run JavaScript code. Create a new Run JavaScript Code query and call the component and the CSA that component provides.
 
@@ -94,5 +98,5 @@ await components.textinput1.clear()
 
 </div>
 
-- Finally, hit the **save and run** query button to fire up the query, and you'll see that the field value of the text input widget has been cleared.
+- Finally, hit the **save and run** query button to fire up the query, and you'll see that the field value of the text input component has been cleared.
 

docs/versioned_docs/version-2.19.0/data-sources/airtable.md

@@ -5,22 +5,15 @@ title: Airtable
 
 # Airtable
 
-
-ToolJet can connect to your Airtable account to read and write data. **Airtable API key** is required to create an Airtable data source on ToolJet. You can generate API key by visiting [Airtable account page](https://airtable.com/account). 
-
+ToolJet can connect to your Airtable account to read and write data. Airtable Personal Access Token is required to connect to the Airtable data source on ToolJet. You can generate the PAT by visiting [Developer Hub from your Airtable profile](https://support.airtable.com/docs/creating-and-using-api-keys-and-access-tokens#understanding-personal-access-token-basic-actions).
 
 <img className="screenshot-full" src="/img/datasource-reference/airtable/add_creds.gif" alt="irtable record"/>
 
-
 :::info
-Airtable API has a rate limit, and at the time of writing this documentation, the limit is five(5) requests per second per base. You can read more about rate limits here **[Airtable API]( https://airtable.com/api )**.
+Airtable API has a rate limit, and at the time of writing this documentation, the limit is five(5) requests per second per base. You can read more about rate limits here **[Airtable API](https://airtable.com/api)**.
 :::
 
-:::tip
-This guide assumes that you have already gone through [Adding a data source](/docs/tutorial/adding-a-datasource) tutorial.
-:::
-
-## Supported queries
+## Supported Operations
 
 - **[Listing records](#listing-records)**
 - **[Retrieving a record](#retrieving-a-record)**
@@ -30,113 +23,106 @@ This guide assumes that you have already gone through [Adding a data source](/do
 
 ### Listing records
 
-This query lists all the records in a table. The results are paginated and each page can have up to 100 records. 
+This query lists all the records in a table. The results are paginated and each page can have up to 100 records.
 
-#### Required parameters: 
+#### Required parameters:
 
 - **Base ID:** To find the Base ID, first visit **airtable.com/api**. Select from the list of bases the base whose ID you'd like to find out. Example Base ID: `appDT3UCPffPiSmFd`
 - **Table name:** Enter the table name whose data you want to fetch.
 
-#### Optional parameters: 
+#### Optional parameters:
 
 - **Page size:** The number of records returned in each request. Must be less than or equal to 100. Default is 100.
 - **offset:** If there are more records, the response will contain an offset. To fetch the next page of records, include offset in the next request's parameters.
 
-
 <img className="screenshot-full" src="/img/datasource-reference/airtable/listv2.png"  alt="List airtable record" />
 
-
-Example response from Airtable: 
+Example response from Airtable:
 
 ```json
 {
-    "records": [
-        {
-            "id": "recu9xMnUdr2n2cw8",
-            "fields": {
-                "Notes": "sdfdsf",
-                "Name": "dsfdsf"
-            },
-            "createdTime": "2021-05-12T14:30:33.000Z"
-        },
-        {
-            "id": "recyIdR7bVdQvmKXa",
-            "fields": {
-                "Notes": "sdfdsf",
-                "Name": "dfds"
-            },
-            "createdTime": "2021-05-12T14:30:33.000Z"
-        },
-        {
-            "id": "recAOzdIHaRpvRaGE",
-            "fields": {
-                "Notes": "sdfsdfsd",
-                "Name": "sdfdsf"
-            },
-            "createdTime": "2021-05-12T14:30:33.000Z"
-        }
-    ],
-    "offset": "recAOzdIHaRpvRaGE"
+  "records": [
+    {
+      "id": "recu9xMnUdr2n2cw8",
+      "fields": {
+        "Notes": "sdfdsf",
+        "Name": "dsfdsf"
+      },
+      "createdTime": "2021-05-12T14:30:33.000Z"
+    },
+    {
+      "id": "recyIdR7bVdQvmKXa",
+      "fields": {
+        "Notes": "sdfdsf",
+        "Name": "dfds"
+      },
+      "createdTime": "2021-05-12T14:30:33.000Z"
+    },
+    {
+      "id": "recAOzdIHaRpvRaGE",
+      "fields": {
+        "Notes": "sdfsdfsd",
+        "Name": "sdfdsf"
+      },
+      "createdTime": "2021-05-12T14:30:33.000Z"
+    }
+  ],
+  "offset": "recAOzdIHaRpvRaGE"
 }
 ```
 
 ### Retrieving a record
 
-#### Required parameters: 
+#### Required parameters:
 
 - **Base ID**
-- **Table name** 
+- **Table name**
 - **Record ID**
 
-
 <img className="screenshot-full" src="/img/datasource-reference/airtable/retv2.png"  alt="Retrieve airtable record" />
 
-
-Example response from Airtable: 
+Example response from Airtable:
 
 ```json
 {
-    "id": "recu9xMnUdr2n2cw8",
-    "fields": {
-        "Notes": "sdfdsf",
-        "Name": "dsfdsf"
-    },
-    "createdTime": "2021-05-12T14:30:33.000Z"
+  "id": "recu9xMnUdr2n2cw8",
+  "fields": {
+    "Notes": "sdfdsf",
+    "Name": "dsfdsf"
+  },
+  "createdTime": "2021-05-12T14:30:33.000Z"
 }
 ```
 
 ### Creating a record
 
 #### Required parameters:
+
 - **Base ID**
 - **Table name**
 - **Records**
 
-
 <img className="screenshot-full" src="/img/datasource-reference/airtable/createv2.png" alt="Create airtable record" />
 
 #### Example Records:
 
 ```json
 [
-    {
-        "fields": {
-            "Notes": "sdfdsf",
-            "Name": "dsfdsf"
-        }
-    },
-    {
-        "fields": {
-            "Notes": "note1",
-            "Name": "dsfdsf"
-        }
+  {
+    "fields": {
+      "Notes": "sdfdsf",
+      "Name": "dsfdsf"
     }
+  },
+  {
+    "fields": {
+      "Notes": "note1",
+      "Name": "dsfdsf"
+    }
+  }
 ]
- 
-
 ```
 
-
 Click on the `run` button to run the query.
 
 :::info
@@ -144,37 +130,38 @@ NOTE: Query must be saved before running.
 :::
 
 Example response from Airtable:
+
 ```json
 {
-    "records": [
-        {
-            "id": "rec5RuZ1COoZGtGDY",
-            "fields": {
-                "Notes": "sdfdsf",
-                "Name": "dsfdsf"
-            },
-            "createdTime": "2022-02-07T20:25:27.000Z"
-        },
-        {
-            "id": "recaYbFPonNNu6Cwj",
-            "fields": {
-                "Notes": "note1",
-                "Name": "dsfdsf"
-            },
-            "createdTime": "2022-02-07T20:25:27.000Z"
-        }
-    ]
+  "records": [
+    {
+      "id": "rec5RuZ1COoZGtGDY",
+      "fields": {
+        "Notes": "sdfdsf",
+        "Name": "dsfdsf"
+      },
+      "createdTime": "2022-02-07T20:25:27.000Z"
+    },
+    {
+      "id": "recaYbFPonNNu6Cwj",
+      "fields": {
+        "Notes": "note1",
+        "Name": "dsfdsf"
+      },
+      "createdTime": "2022-02-07T20:25:27.000Z"
+    }
+  ]
 }
 ```
 
 ### Updating a record
 
 #### Required parameters:
+
 - **Base ID**
 - **Table name**
 - **Record ID**
 
-
 <img className="screenshot-full" src="/img/datasource-reference/airtable/updv2.png" alt="Update airtable record"/>
 
 #### Example body:
@@ -192,27 +179,28 @@ NOTE: Query must be saved before running.
 :::
 
 Example response from Airtable:
+
 ```json
 {
-    "id": "recu9xMnUdr2n2cw8",
-    "fields": {
-        "Notes": "Example Notes",
-        "Name": "change"
-    },
-    "createdTime": "2021-08-08T17:27:17.000Z"
+  "id": "recu9xMnUdr2n2cw8",
+  "fields": {
+    "Notes": "Example Notes",
+    "Name": "change"
+  },
+  "createdTime": "2021-08-08T17:27:17.000Z"
 }
 ```
 
 ### Deleting a record
 
 #### Required parameters:
+
 - **Base ID**
 - **Table name**
 - **Record ID**
 
 <img className="screenshot-full" src="/img/datasource-reference/airtable/delv2.png" alt="Delete airtable record" />
 
-
 Click on the `run` button to run the query.
 
 :::info
@@ -226,4 +214,4 @@ Example response from Airtable:
     deleted: true
     id: "recIKsyZgqI4zoqS7"
 }
-```
+```