Add additional shorter setup guides (#22318)

airbyte-webapp/src/components/ui/Markdown/Markdown.module.scss

@@ -83,4 +83,8 @@
   img {
     max-width: 100%;
   }
+
+  li:not(:last-child) {
+    margin-bottom: variables.$spacing-sm;
+  }
 }

airbyte-webapp/src/hooks/services/useDocumentation.ts

@@ -13,7 +13,14 @@ export const documentationKeys = {
 
 const DOCS_URL = /^https:\/\/docs\.airbyte\.(io|com)/;
 
-const AVAILABLE_INAPP_DOCS = ["hubspot", "facebook-marketing"];
+const AVAILABLE_INAPP_DOCS = [
+  "hubspot",
+  "facebook-marketing",
+  "google-analytics-v4",
+  "notion",
+  "google-search-console",
+  "instagram",
+];
 
 export const useDocumentation = (documentationUrl: string): UseDocumentationResult => {
   const { integrationUrl } = useConfig();

docs/integrations/sources/google-analytics-v4.inapp.md

@@ -0,0 +1,22 @@
+## Prerequisite
+
+* Administrator access to a Google Analytics 4 (GA4) property
+
+## Setup guide
+
+1. Click **Authenticate your account** by selecting Oauth (recommended).
+   * If you select Service Account Key Authentication, follow the instructions in our [full documentation](https://docs.airbyte.com/integrations/sources/google-analytics-v4).
+2. Log in and Authorize the Google Analytics account.
+3. Enter your [Property ID](https://developers.google.com/analytics/devguides/reporting/data/v1/property-id#what_is_my_property_id)
+4. Enter the **Start Date** from which to replicate report data in the format YYYY-MM-DD.
+5. (Optional) Airbyte generates 8 default reports. To add more reports, you need to add **Custom Reports** as a JSON array describing the custom reports you want to sync from Google Analytics. See below for more information.
+6. (Optional) Enter the **Data request time increment in days**. The bigger this value is, the faster the sync will be, but the more likely that sampling will be applied to your data, potentially causing inaccuracies in the returned results. We recommend setting this to 1 unless you have a hard requirement to make the sync faster at the expense of accuracy. The minimum allowed value for this field is 1, and the maximum is 364.
+
+## (Optional) Custom reports
+
+* Custom reports in format `[{"name": "<report-name>", "dimensions": ["<dimension-name>", ...], "metrics": ["<metric-name>", ...]}]`
+* Custom report format when using segments and / or filters `[{"name": "<report-name>", "dimensions": ["<dimension-name>", ...], "metrics": ["<metric-name>", ...], "segments":  ["<segment-id-or-dynamic-segment-v3-format]", filter: "<filter-definition-v3-format>"}]`
+* When using segments, make sure you add the `ga:segment` dimension.
+* Custom reports: [Dimensions and metrics explorer](https://ga-dev-tools.web.app/dimensions-metrics-explorer/)
+
+For detailed information on supported sync modes, supported streams, performance considerations, refer to the full documentation for [Google Analytics 4 (GA4)](https://docs.airbyte.com/integrations/sources/google-analytics-v4).

docs/integrations/sources/google-search-console.inapp.md

@@ -0,0 +1,13 @@
+## Prerequisite
+
+* Credentials to a Google Service Account (or Google Service Account with delegated Domain Wide Authority) or Google User Account
+​
+## Setup guide
+​
+Click Authenticate your account to sign in with Google and authorize your account.
+1. Enter the site URL.
+2. Enter the Start Date in YYYY-MM-DD
+3. Click Sign in with Google to authenticate your account
+4. (Optional) Fill in the custom reports in format `{"name": "<report-name>", "dimensions": ["<dimension-name>", ...]}`
+
+For detailed information on supported sync modes, supported streams, performance considerations, refer to the full documentation for [Google Search Console](https://docs.airbyte.com/integrations/sources/google-search-console/).

docs/integrations/sources/instagram.inapp.md

@@ -0,0 +1,12 @@
+## Prerequisite
+
+* [Instagram business account](https://www.facebook.com/business/help/898752960195806) to your Facebook page
+
+## Setup guide
+
+1. Click Authenticate your Instagram account.
+2. Log in and authorize the Instagram account.
+3. (Optional) Select a start date date. All data generated after this date will be replicated. If this field is blank, Airbyte will replicate all data.
+4. Click Set up source.
+​
+For detailed information on supported sync modes, supported streams, performance considerations, refer to the full documentation for [Instagram](https://docs.airbyte.com/integrations/sources/instagram).

docs/integrations/sources/notion.inapp.md

@@ -0,0 +1,13 @@
+## Prerequisite
+
+* Access to a Notion workspace
+​
+## Setup guide
+
+1. Choose the method of authentication:
+   * To use OAuth2.0 authorization, click **Authenticate your Notion account**.
+   * If you select Access Token, create a new integration in our [full documentation](https://docs.airbyte.com/integrations/sources/notion)
+2. (Optional) Enter the Start Date in `YYYY-MM-DDTHH:mm:ss.SSSZ`. All data generated after this date will be replicated. If this field is blank, Airbyte will replicate all data.
+3. Click **Set up source**.
+​
+For detailed information on supported sync modes, supported streams, performance considerations, refer to the full documentation for [Notion](https://docs.airbyte.com/integrations/sources/notion).