#387 documentation fixes

configurator/frontend/src/catalog/sources/lib/documentation.tsx

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { ConnectorDocumentation } from '../types';
+import {ReactNode} from "react";
 
 export const googleProjectCreation = <>
   At first, create or select Google project:
@@ -16,9 +17,10 @@ export type DocumentationParams = {
   serviceAccountEnabled?: boolean
   scopes?: string[]
   apis: string[]
+  serviceAccountSpecifics?: ReactNode
 }
 
-export function googleServiceAuthDocumentation({ oauthEnabled = false, scopes = [], serviceAccountEnabled = true, serviceName, apis }: DocumentationParams) {
+export function googleServiceAuthDocumentation({ oauthEnabled = false, scopes = [], serviceAccountEnabled = true, serviceName, apis, serviceAccountSpecifics = undefined }: DocumentationParams) {
   const scopeStr = scopes.join(' ');
   return <>
     Following authorization methods are available for <b>{serviceName}</b>
@@ -30,9 +32,9 @@ export function googleServiceAuthDocumentation({ oauthEnabled = false, scopes =
         {' '} put Service Account Key JSON (available in Google Cloud Console) in the field below
       </li>}
     </ul>
-    You should also enable Google API for your project. Go to the <a href="https://console.cloud.google.com/apis/library">Google APIs Library page</a>, search
-    {apis.map(api => <b>{api}</b>).join(' and ')} and make sure they are enabled
-
+    You should also enable Google API for your project. Go to the <a href="https://console.cloud.google.com/apis/library">Google APIs Library page</a>,
+      search {apis.map<React.ReactNode>(t => <b>{t}</b>)
+          .reduce((prev, curr) => [prev, ' and ', curr])}  and make sure they are enabled
     {oauthEnabled && <>
       <h1>1. Obtaining access through <b>OAuth</b></h1>
       Jitsu requires 3 parameters for accessing {serviceName}:
@@ -60,9 +62,11 @@ export function googleServiceAuthDocumentation({ oauthEnabled = false, scopes =
       <ul>
         <li>Go to the <a href="https://console.developers.google.com/iam-admin/serviceaccounts">Service Accounts page</a></li>
         <li>Click "+ Create Service Account"</li>
-        <li>Click on created row in Service Accounts table, go to "KEYS" tab</li>
-        <li>Click "ADD KEY" ➞ "Create new key" ➞ Select JSON ➞ "CREATE"</li>
+         <li>Fill Service account name and press DONE </li>
+          <li>Click on the Email of created account in Service Accounts table, go to "KEYS" tab</li>
+          <li>Click "ADD KEY" ➞ "Create new key" ➞ Select JSON ➞ "CREATE"</li>
         <li>Service Account JSON (private key) will be in downloaded file</li>
+          {serviceAccountSpecifics && serviceAccountSpecifics}
       </ul>
     </>}
   </>

configurator/frontend/src/catalog/sources/lib/native.tsx

@@ -2,6 +2,7 @@ import {intType, isoUtcDateType, passwordType, selectionType, SourceConnector, s
 import { googleServiceAuthDocumentation } from '../lib/documentation';
 
 import { googleAuthConfigParameters } from '../lib/commonParams';
+import * as React from "react";
 
 export const facebook: SourceConnector = {
   pic: (
@@ -168,7 +169,7 @@ export const googleAds: SourceConnector = {
       displayName: 'Fields',
       documentation: (
           <> Use <a href="https://developers.google.com/google-ads/api/fields/v8/overview_query_builder">Google Ads Query Builder</a> tool to build required query. Copy comma-separated field list from resulting GAQL query (part between SELECT and FROM keywords).
-            Don't forget to add date segments (e.g. segments.date) where applicable.
+            Don't forget to add date segments (e.g. segments.date) where it is necessary.
           </>
       ),
       id: 'fields',
@@ -179,7 +180,7 @@ export const googleAds: SourceConnector = {
       displayName: 'Start Date',
       id: 'start_date',
       type: isoUtcDateType,
-      defaultValue: '2018-12-31',
+      defaultValue: '2020-12-31',
       required: true
     }
   ],
@@ -197,31 +198,48 @@ export const googleAds: SourceConnector = {
       displayName: 'Customer ID',
       id: 'config.customer_id',
       type: stringType,
-      required: true
+      required: true,
+      documentation: (
+          <>
+            The client customer ID is the account number of the Google Ads client account you want to pull data from. Pass it without '-' symbols.
+          </>
+      )
     },{
       displayName: 'Manager Customer ID',
       id: 'config.manager_customer_id',
       type: stringType,
       required: false,
       documentation: (
           <>
-            For Google Ads API calls made by a manager to a client account (that is, when logging in as a manager to make API calls to one of its client accounts), you also need to supply the Manager Customer Id. This value represents the Google Ads customer ID of the manager making the API call.
+            For Google Ads API calls made by a manager to a client account (that is, when logging in as a manager to make API calls to one of its client accounts), you also need to supply the Manager Customer Id. This value represents the Google Ads customer ID of the manager making the API call. Pass it without '-' symbols.
           </>
       )
     }
   ],
   documentation: {
     overview: (
         <>
-          The Google Ads
+          The Google Ads connector pulls data from{' '}
+          <a href="https://developers.google.com/google-ads/api/fields/v8/overview">
+            Google Ads API
+          </a>
+          . The connector is highly configurable. You can compose any number of reports using <a href="https://developers.google.com/google-ads/api/fields/v8/overview_query_builder">Query Builder</a> by importing field lists to this source as separate streams.
         </>
     ),
     connection: googleServiceAuthDocumentation({
       oauthEnabled: true,
       serviceAccountEnabled: true,
-      scopes: ['https://www.googleapis.com/auth/adwords.readonly'],
+      scopes: ['https://www.googleapis.com/auth/adwords'],
       serviceName: 'Google Ads',
-      apis: ['Google Ads API']
+      apis: ['Google Ads API'],
+      serviceAccountSpecifics: (
+          <>
+            <li>Go to "DETAILS" tab</li>
+            <li>Press "SHOW DOMAIN-WIDE DELEGATION" at the bottom, check <b>Enable Google Workspace Domain-wide Delegation</b> and press "SAVE" </li>
+            <li>Share the service account ID and the Google Ads API scope (https://www.googleapis.com/auth/adwords) with your domain administrator. Request the domain administrator to delegate domain-wide authority to your service account.</li>
+            <li>If you are the domain administrator, follow the instructions in the <a href="https://support.google.com/a/answer/162106">help center guide</a> to complete this step.</li>
+          </>
+      )
     })
   }
 };