diff --git a/apps/formbricks-com/app/docs/integrations/airtable/add-base.webp b/apps/formbricks-com/app/docs/integrations/airtable/add-base.webp new file mode 100644 index 0000000000..0e3ae3e1ba Binary files /dev/null and b/apps/formbricks-com/app/docs/integrations/airtable/add-base.webp differ diff --git a/apps/formbricks-com/app/docs/integrations/airtable/airtable-connected.webp b/apps/formbricks-com/app/docs/integrations/airtable/airtable-connected.webp new file mode 100644 index 0000000000..143e7d370d Binary files /dev/null and b/apps/formbricks-com/app/docs/integrations/airtable/airtable-connected.webp differ diff --git a/apps/formbricks-com/app/docs/integrations/airtable/connect-with-airtable.webp b/apps/formbricks-com/app/docs/integrations/airtable/connect-with-airtable.webp new file mode 100644 index 0000000000..a9ac572dc7 Binary files /dev/null and b/apps/formbricks-com/app/docs/integrations/airtable/connect-with-airtable.webp differ diff --git a/apps/formbricks-com/app/docs/integrations/airtable/create-new-integration.webp b/apps/formbricks-com/app/docs/integrations/airtable/create-new-integration.webp new file mode 100644 index 0000000000..a55bdc618d Binary files /dev/null and b/apps/formbricks-com/app/docs/integrations/airtable/create-new-integration.webp differ diff --git a/apps/formbricks-com/app/docs/integrations/airtable/deleteIntegration.webp b/apps/formbricks-com/app/docs/integrations/airtable/deleteIntegration.webp new file mode 100644 index 0000000000..4a80b50a8d Binary files /dev/null and b/apps/formbricks-com/app/docs/integrations/airtable/deleteIntegration.webp differ diff --git a/apps/formbricks-com/app/docs/integrations/airtable/integrations-tab.webp b/apps/formbricks-com/app/docs/integrations/airtable/integrations-tab.webp new file mode 100644 index 0000000000..f0430ecaa2 Binary files /dev/null and b/apps/formbricks-com/app/docs/integrations/airtable/integrations-tab.webp differ diff --git a/apps/formbricks-com/app/docs/integrations/airtable/link-survey-with-table.webp b/apps/formbricks-com/app/docs/integrations/airtable/link-survey-with-table.webp new file mode 100644 index 0000000000..785363dae6 Binary files /dev/null and b/apps/formbricks-com/app/docs/integrations/airtable/link-survey-with-table.webp differ diff --git a/apps/formbricks-com/app/docs/integrations/airtable/link-with-questions.webp b/apps/formbricks-com/app/docs/integrations/airtable/link-with-questions.webp new file mode 100644 index 0000000000..57bfba7fb0 Binary files /dev/null and b/apps/formbricks-com/app/docs/integrations/airtable/link-with-questions.webp differ diff --git a/apps/formbricks-com/app/docs/integrations/airtable/list-linked-surveys.webp b/apps/formbricks-com/app/docs/integrations/airtable/list-linked-surveys.webp new file mode 100644 index 0000000000..3b50cee9e5 Binary files /dev/null and b/apps/formbricks-com/app/docs/integrations/airtable/list-linked-surveys.webp differ diff --git a/apps/formbricks-com/app/docs/integrations/airtable/open-developer-hub.webp b/apps/formbricks-com/app/docs/integrations/airtable/open-developer-hub.webp new file mode 100644 index 0000000000..648aab6598 Binary files /dev/null and b/apps/formbricks-com/app/docs/integrations/airtable/open-developer-hub.webp differ diff --git a/apps/formbricks-com/app/docs/integrations/airtable/page.mdx b/apps/formbricks-com/app/docs/integrations/airtable/page.mdx new file mode 100644 index 0000000000..e8bdf49ac8 --- /dev/null +++ b/apps/formbricks-com/app/docs/integrations/airtable/page.mdx @@ -0,0 +1,189 @@ +import { Fence } from "@/components/shared/Fence"; +import { Callout } from "@/components/shared/Callout"; +import IntegrationTab from "./integrations-tab.webp"; +import ConnectWithAirtable from "./connect-with-airtable.webp"; +import AirtableConnected from "./airtable-connected.webp"; +import LinkSurveyWithTable from "./link-survey-with-table.webp"; +import LinkWithQuestions from "./link-with-questions.webp"; +import ListLinkedSurveys from "./list-linked-surveys.webp"; +import OpenDeveloperHub from "./open-developer-hub.webp"; +import CreateNewIntegration from "./create-new-integration.webp"; +import RegisterNewIntegration from "./register-new-integration.webp"; +import SelectScopes from "./select-scopes.webp"; +import DeleteIntegration from "./deleteIntegration.webp"; +import Image from "next/image"; + +export const metadata = { + title: "Airtable Setup", + description: "Instantly populate your airtable table with survey data", +}; + +#### Integrations + +# Airtable + +The Airtable integration allows you to automatically send responses to an Airtable of your choice. + + + This feature is enabled by default in Formbricks Cloud but needs to be self-configured when running a + self-hosted version of Formbricks. + + +## Formbricks Cloud + +1. Go to the Integrations tab in your [Formbricks Cloud dashboard](https://app.formbricks.com/) and click on the "Connect" button under Airtable integration. + +Formbricks Integrations Tab + +2. Now click on the "Connect with Airtable" button to authenticate yourself with Airtable. + +Connect Formbricks with Airtable + +3. You will now be taken to a page where you need to add and grant access to the base you want to use for the integration. + +Add and grant access to airtable base + +4. Once you add and grant access to your base, you will be taken back to Formbricks Cloud and see the connected status as below: + +Formbricks is now connected with Google + + + +Before the next step, make sure that you have a Formbricks Survey with at least one question and a Airtable base with atleast one table in the Airtable account you integrated. + + + +6. Now click on the "Link New Table" button to link a new Airtable with Formbricks and a modal will open up. + +Link Formbricks with a Airtable + +7. Select the Base and table you want to link with Formbricks and the Survey. On doing so, you will be asked with what questions' responses you want to feed in Airtable. Select the questions and click on the "Save" button. + +Select question to link with Airtable + +8. On submitting, the modal will close and you will see the linked table in the list of linked tables. + +List of linked tables + +Congratulations! You have successfully linked an Airtable with Formbricks. Now whenever a response is submitted for the linked Survey, it will be automatically added to the linked Airtable. + +Still struggling or something not working as expected? [Join our Discord!](https://formbricks.com/discord) and we'd be glad to assist you! + +## Setup in self-hosted Formbricks + +Enabling the Airtable Integration in a self-hosted environment requires creating an airtable account and changing the environment variables of your Formbricks instance. + +1. Go to the [Airtable](https://airtable.com) and create a new account if you dont already have one. + +2. Click on user icon on top left and open to Developer hub + +List of linked tables + +3. Navigate to OAuth integrations and click on **Register an OAuth integrations** + +List of linked tables + +3. Select a name for you integration and also add a redirect URL which will be YOUR_WEBAPP_URL/api/v1/integrations/airtable/callback + + List of linked tables + +4. Now fill some basic details about your integrations and then go to scope section. You need to enable 5 scopes + + - data.records:read + - data.records:write + - schema.bases:read + - schema.bases:write + - user.email:read + +{" "} + +List of linked tables + +5. Click on the "Save" button and you are done +6. Now just copy client id and redirect url for your integration and add it to formbricks .env file + +### By now, your environment variables should include the below ones: + +- `AIR_TABLE_CLIENT_ID` +- `AIR_TABLE_REDIRECT_URL` + +Voila! You have successfully enabled the Airtable integration in your self-hosted Formbricks instance. Now you can follow the steps mentioned in the [Formbricks Cloud](#formbricks-cloud) section to link an Airtable with Formbricks. + +## Remove Integration with Airtable + +To remove the integration with Airtable, + +1. Visit the Integrations tab in your Formbricks Cloud dashboard. +2. Select "Manage" button in the Airtable card. +3. Click on the "Connected with `" just before the "Link new Table" button. +4. It will now ask for a confirmation to remove the integration. Click on the "Delete" button to remove the integration. You can always come back and connect again with the same Airtable Account. + +Delete Airtable Integration with Formbricks + + + We do not store any other information of yours! We value Privacy more than you and rest assured you're safe + with us! + + +Still struggling or something not working as expected? [Join our Discord!](https://formbricks.com/discord) and we'd be glad to assist you! diff --git a/apps/formbricks-com/app/docs/integrations/airtable/register-new-integration.webp b/apps/formbricks-com/app/docs/integrations/airtable/register-new-integration.webp new file mode 100644 index 0000000000..331ea78dfd Binary files /dev/null and b/apps/formbricks-com/app/docs/integrations/airtable/register-new-integration.webp differ diff --git a/apps/formbricks-com/app/docs/integrations/airtable/select-scopes.webp b/apps/formbricks-com/app/docs/integrations/airtable/select-scopes.webp new file mode 100644 index 0000000000..f60e8ca7f4 Binary files /dev/null and b/apps/formbricks-com/app/docs/integrations/airtable/select-scopes.webp differ diff --git a/apps/formbricks-com/components/docs/Navigation.tsx b/apps/formbricks-com/components/docs/Navigation.tsx index 736513e83a..571b71340b 100644 --- a/apps/formbricks-com/components/docs/Navigation.tsx +++ b/apps/formbricks-com/components/docs/Navigation.tsx @@ -226,10 +226,11 @@ export const navigation: Array = [ { title: "Integrations", links: [ - { title: "Zapier", href: "/docs/integrations/zapier" }, - { title: "n8n", href: "/docs/integrations/n8n" }, - { title: "Make.com", href: "/docs/integrations/make" }, + { title: "Airtable", href: "/docs/integrations/airtable" }, { title: "Google Sheets", href: "/docs/integrations/google-sheets" }, + { title: "Make.com", href: "/docs/integrations/make" }, + { title: "n8n", href: "/docs/integrations/n8n" }, + { title: "Zapier", href: "/docs/integrations/zapier" }, ], }, {