Merge pull request #825 from automatisch/google-forms-integration

Add google forms

packages/backend/src/apps/google-forms/assets/favicon.svg

@@ -0,0 +1,41 @@
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 1904.8 2500" style="enable-background:new 0 0 1904.8 2500;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#673AB7;}
+	.st1{fill:#F1F1F1;}
+	.st2{fill:url(#SVGID_1_);}
+	.st3{fill:#B39DDB;}
+	.st4{fill:#FFFFFF;fill-opacity:0.2;}
+	.st5{fill:#311B92;fill-opacity:0.2;}
+	.st6{fill:#311B92;fill-opacity:0.1;}
+	.st7{fill:url(#SVGID_2_);}
+</style>
+<g>
+	<path class="st0" d="M1190.5,0H178.6C83.3,0,0,83.3,0,178.6v2142.9c0,95.2,83.3,178.6,178.6,178.6h1547.6
+		c95.2,0,178.6-83.3,178.6-178.6V714.3l-416.7-297.6L1190.5,0z"/>
+	<path class="st1" d="M714.3,1845.2h714.3v-119H714.3V1845.2z M714.3,1071.4v119h714.3v-119H714.3z M607.1,1131
+		c0,47.6-35.7,95.2-95.2,95.2s-95.2-35.7-95.2-95.2c0-59.5,35.7-95.2,95.2-95.2S607.1,1083.3,607.1,1131z M607.1,1464.3
+		c0,47.6-35.7,95.2-95.2,95.2s-95.2-35.7-95.2-95.2c0-59.5,35.7-95.2,95.2-95.2S607.1,1416.7,607.1,1464.3z M607.1,1785.7
+		c0,47.6-35.7,95.2-95.2,95.2s-95.2-35.7-95.2-95.2c0-59.5,35.7-95.2,95.2-95.2S607.1,1738.1,607.1,1785.7z M714.3,1547.6h714.3
+		v-119.1H714.3L714.3,1547.6L714.3,1547.6z"/>
+	
+		<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="122.5479" y1="1635.2429" x2="122.5479" y2="1634.3186" gradientTransform="matrix(666.67 0 0 -654.7559 -80127.6016 1071403.75)">
+		<stop  offset="0" style="stop-color:#311B92;stop-opacity:0.2"/>
+		<stop  offset="1" style="stop-color:#311B92;stop-opacity:2.000000e-02"/>
+	</linearGradient>
+	<path class="st2" d="M1238.1,666.7l666.7,654.8V714.3L1238.1,666.7z"/>
+	<path class="st3" d="M1190.5,0v535.7c0,95.2,83.3,178.6,178.6,178.6h535.7L1190.5,0z"/>
+	<path class="st4" d="M178.6,0C83.3,0,0,83.3,0,178.6v11.9C0,95.2,83.3,11.9,178.6,11.9h1011.9V0H178.6L178.6,0z"/>
+	<path class="st5" d="M1726.2,2488.1H178.6C83.3,2488.1,0,2404.8,0,2309.5v11.9c0,95.2,83.3,178.6,178.6,178.6h1547.6
+		c95.2,0,178.6-83.3,178.6-178.6v-11.9C1904.8,2404.8,1821.4,2488.1,1726.2,2488.1z"/>
+	<path class="st6" d="M1369,714.3c-95.2,0-178.6-83.3-178.6-178.6v11.9c0,95.2,83.3,178.6,178.6,178.6h535.7v-11.9L1369,714.3
+		L1369,714.3z"/>
+	
+		<radialGradient id="SVGID_2_" cx="122.6324" cy="1634.4275" r="12.899" gradientTransform="matrix(1904.7655 0 0 -1904.75 -233525.7031 3113242.5)" gradientUnits="userSpaceOnUse">
+		<stop  offset="0" style="stop-color:#FFFFFF;stop-opacity:0.1"/>
+		<stop  offset="1" style="stop-color:#FFFFFF;stop-opacity:0"/>
+	</radialGradient>
+	<path class="st7" d="M1190.5,0H178.6C83.3,0,0,83.3,0,178.6v2142.9c0,95.2,83.3,178.6,178.6,178.6h1547.6
+		c95.2,0,178.6-83.3,178.6-178.6V714.3L1190.5,0z"/>
+</g>
+</svg>

packages/backend/src/apps/google-forms/auth/generate-auth-url.ts

@@ -0,0 +1,24 @@
+import { IField, IGlobalVariable } from '@automatisch/types';
+import { URLSearchParams } from 'url';
+import authScope from '../common/auth-scope';
+
+export default async function generateAuthUrl($: IGlobalVariable) {
+  const oauthRedirectUrlField = $.app.auth.fields.find(
+    (field: IField) => field.key == 'oAuthRedirectUrl'
+  );
+  const redirectUri = oauthRedirectUrlField.value as string;
+  const searchParams = new URLSearchParams({
+    client_id: $.auth.data.clientId as string,
+    redirect_uri: redirectUri,
+    prompt: 'select_account',
+    scope: authScope.join(' '),
+    response_type: 'code',
+    access_type: 'offline',
+  });
+
+  const url = `https://accounts.google.com/o/oauth2/v2/auth?${searchParams.toString()}`;
+
+  await $.auth.set({
+    url,
+  });
+}

packages/backend/src/apps/google-forms/auth/index.ts

@@ -0,0 +1,51 @@
+import generateAuthUrl from './generate-auth-url';
+import verifyCredentials from './verify-credentials';
+import refreshToken from './refresh-token';
+import isStillVerified from './is-still-verified';
+
+export default {
+  fields: [
+    {
+      key: 'oAuthRedirectUrl',
+      label: 'OAuth Redirect URL',
+      type: 'string' as const,
+      required: true,
+      readOnly: true,
+      value: '{WEB_APP_URL}/app/google-forms/connections/add',
+      placeholder: null,
+      description:
+        'When asked to input an OAuth callback or redirect URL in Github OAuth, enter the URL above.',
+      docUrl: 'https://automatisch.io/docs/github#oauth-redirect-url',
+      clickToCopy: true,
+    },
+    {
+      key: 'clientId',
+      label: 'Client ID',
+      type: 'string' as const,
+      required: true,
+      readOnly: false,
+      value: null,
+      placeholder: null,
+      description: null,
+      docUrl: 'https://automatisch.io/docs/google-forms#client-id',
+      clickToCopy: false,
+    },
+    {
+      key: 'clientSecret',
+      label: 'Client Secret',
+      type: 'string' as const,
+      required: true,
+      readOnly: false,
+      value: null,
+      placeholder: null,
+      description: null,
+      docUrl: 'https://automatisch.io/docs/google-forms#client-secret',
+      clickToCopy: false,
+    },
+  ],
+
+  generateAuthUrl,
+  verifyCredentials,
+  isStillVerified,
+  refreshToken,
+};

packages/backend/src/apps/google-forms/auth/is-still-verified.ts

@@ -0,0 +1,9 @@
+import { IGlobalVariable } from '@automatisch/types';
+import getCurrentUser from '../common/get-current-user';
+
+const isStillVerified = async ($: IGlobalVariable) => {
+  const currentUser = await getCurrentUser($);
+  return !!currentUser.resourceName;
+};
+
+export default isStillVerified;

packages/backend/src/apps/google-forms/auth/refresh-token.ts

@@ -0,0 +1,26 @@
+import { URLSearchParams } from 'node:url';
+import { IGlobalVariable } from '@automatisch/types';
+import authScope from '../common/auth-scope';
+
+const refreshToken = async ($: IGlobalVariable) => {
+  const params = new URLSearchParams({
+    client_id: $.auth.data.clientId as string,
+    client_secret: $.auth.data.clientSecret as string,
+    grant_type: 'refresh_token',
+    refresh_token: $.auth.data.refreshToken as string,
+  });
+
+  const { data } = await $.http.post(
+    'https://oauth2.googleapis.com/token',
+    params.toString()
+  );
+
+  await $.auth.set({
+    accessToken: data.access_token,
+    expiresIn: data.expires_in,
+    scope: authScope.join(' '),
+    tokenType: data.token_type,
+  });
+};
+
+export default refreshToken;

packages/backend/src/apps/google-forms/auth/verify-credentials.ts

@@ -0,0 +1,57 @@
+import { IField, IGlobalVariable } from '@automatisch/types';
+import getCurrentUser from '../common/get-current-user';
+
+type TUser = {
+  displayName: string;
+  metadata: {
+    primary: boolean;
+  };
+};
+
+type TEmailAddress = {
+  value: string;
+  metadata: {
+    primary: boolean;
+  };
+};
+
+const verifyCredentials = async ($: IGlobalVariable) => {
+  const oauthRedirectUrlField = $.app.auth.fields.find(
+    (field: IField) => field.key == 'oAuthRedirectUrl'
+  );
+  const redirectUri = oauthRedirectUrlField.value as string;
+  const { data } = await $.http.post(`https://oauth2.googleapis.com/token`, {
+    client_id: $.auth.data.clientId,
+    client_secret: $.auth.data.clientSecret,
+    code: $.auth.data.code,
+    grant_type: 'authorization_code',
+    redirect_uri: redirectUri,
+  });
+
+  await $.auth.set({
+    accessToken: data.access_token,
+    tokenType: data.token_type,
+  });
+
+  const currentUser = await getCurrentUser($);
+
+  const { displayName } = currentUser.names.find(
+    (name: TUser) => name.metadata.primary
+  );
+  const { value: email } = currentUser.emailAddresses.find(
+    (emailAddress: TEmailAddress) => emailAddress.metadata.primary
+  );
+
+  await $.auth.set({
+    clientId: $.auth.data.clientId,
+    clientSecret: $.auth.data.clientSecret,
+    scope: $.auth.data.scope,
+    idToken: data.id_token,
+    expiresIn: data.expires_in,
+    refreshToken: data.refresh_token,
+    resourceName: currentUser.resourceName,
+    screenName: `${displayName} - ${email}`,
+  });
+};
+
+export default verifyCredentials;

packages/backend/src/apps/google-forms/common/add-auth-header.ts

@@ -0,0 +1,11 @@
+import { TBeforeRequest } from '@automatisch/types';
+
+const addAuthHeader: TBeforeRequest = ($, requestConfig) => {
+  if (requestConfig.headers && $.auth.data?.accessToken) {
+    requestConfig.headers.Authorization = `${$.auth.data.tokenType} ${$.auth.data.accessToken}`;
+  }
+
+  return requestConfig;
+};
+
+export default addAuthHeader;

packages/backend/src/apps/google-forms/common/auth-scope.ts

@@ -0,0 +1,9 @@
+const authScope: string[] = [
+  'https://www.googleapis.com/auth/forms.body.readonly',
+  'https://www.googleapis.com/auth/forms.responses.readonly',
+  'https://www.googleapis.com/auth/drive.readonly',
+  'https://www.googleapis.com/auth/userinfo.email',
+  'profile',
+];
+
+export default authScope;

packages/backend/src/apps/google-forms/common/get-current-user.ts

@@ -0,0 +1,10 @@
+import { IGlobalVariable } from '@automatisch/types';
+
+const getCurrentUser = async ($: IGlobalVariable) => {
+  const { data: currentUser } = await $.http.get(
+    'https://people.googleapis.com/v1/people/me?personFields=names,emailAddresses'
+  );
+  return currentUser;
+};
+
+export default getCurrentUser;

packages/backend/src/apps/google-forms/dynamic-data/index.ts

@@ -0,0 +1,3 @@
+import listForms from './list-forms';
+
+export default [listForms];

packages/backend/src/apps/google-forms/dynamic-data/list-forms/index.ts

@@ -0,0 +1,34 @@
+import { IGlobalVariable, IJSONObject } from '@automatisch/types';
+
+export default {
+  name: 'List forms',
+  key: 'listForms',
+
+  async run($: IGlobalVariable) {
+    const forms: {
+      data: IJSONObject[];
+    } = {
+      data: [],
+    };
+
+    const params = {
+      q: `mimeType='application/vnd.google-apps.form'`,
+      spaces: 'drive',
+      pageToken: undefined as unknown as string,
+    };
+
+    do {
+      const { data } = await $.http.get(`https://www.googleapis.com/drive/v3/files`, { params });
+      params.pageToken = data.nextPageToken;
+
+      for (const file of data.files) {
+        forms.data.push({
+          value: file.id,
+          name: file.name,
+        });
+      }
+    } while (params.pageToken);
+
+    return forms;
+  },
+};

packages/backend/src/apps/google-forms/index.ts

@@ -0,0 +1,20 @@
+import defineApp from '../../helpers/define-app';
+import addAuthHeader from './common/add-auth-header';
+import auth from './auth';
+import triggers from './triggers';
+import dynamicData from './dynamic-data';
+
+export default defineApp({
+  name: 'Google Forms',
+  key: 'google-forms',
+  baseUrl: 'https://docs.google.com/forms',
+  apiBaseUrl: 'https://forms.googleapis.com',
+  iconUrl: '{BASE_URL}/apps/google-forms/assets/favicon.svg',
+  authDocUrl: 'https://automatisch.io/docs/apps/google-forms/connection',
+  primaryColor: '673AB7',
+  supportsConnections: true,
+  beforeRequest: [addAuthHeader],
+  auth,
+  triggers,
+  dynamicData,
+});

packages/backend/src/apps/google-forms/triggers/index.ts

@@ -0,0 +1,3 @@
+import newFormResponses from './new-form-responses';
+
+export default [newFormResponses];

packages/backend/src/apps/google-forms/triggers/new-form-responses/index.ts

@@ -0,0 +1,33 @@
+import defineTrigger from '../../../../helpers/define-trigger';
+import newFormResponses from './new-form-responses';
+
+export default defineTrigger({
+  name: 'New Form Responses',
+  key: 'newFormResponses',
+  pollInterval: 15,
+  description: 'Triggers when a new form response is submitted.',
+  arguments: [
+    {
+      label: 'Form',
+      key: 'formId',
+      type: 'dropdown' as const,
+      required: true,
+      description: 'Pick a form to receive form responses.',
+      variables: false,
+      source: {
+        type: 'query',
+        name: 'getDynamicData',
+        arguments: [
+          {
+            name: 'key',
+            value: 'listForms',
+          },
+        ],
+      },
+    },
+  ],
+
+  async run($) {
+    await newFormResponses($);
+  },
+});

packages/backend/src/apps/google-forms/triggers/new-form-responses/new-form-responses.ts

@@ -0,0 +1,28 @@
+import { IGlobalVariable } from '@automatisch/types';
+
+const newResponses = async ($: IGlobalVariable) => {
+  const params = {
+    pageToken: undefined as unknown as string,
+  };
+
+  do {
+    const pathname = `/v1/forms/${$.step.parameters.formId}/responses`;
+    const { data } = await $.http.get(pathname, { params });
+    params.pageToken = data.nextPageToken;
+
+    if (data.responses?.length) {
+      for (const formResponse of data.responses) {
+        const dataItem = {
+          raw: formResponse,
+          meta: {
+            internalId: formResponse.responseId,
+          },
+        };
+
+        $.pushTriggerItem(dataItem);
+      }
+    }
+  } while (params.pageToken);
+};
+
+export default newResponses;

packages/web/src/components/AddAppConnection/index.tsx

@@ -116,7 +116,11 @@ export default function AddAppConnection(
           sx={{ mt: 1, fontWeight: 500, wordBreak: 'break-all' }}
         >
           {error.message}
-          {error.details && <pre>{JSON.stringify(error.details, null, 2)}</pre>}
+          {error.details && (
+            <pre style={{ whiteSpace: 'pre-wrap' }}>
+              {JSON.stringify(error.details, null, 2)}
+            </pre>
+          )}
         </Alert>
       )}
 

packages/web/src/components/TestSubstep/index.tsx

@@ -32,7 +32,7 @@ function serializeErrors(graphQLErrors: any) {
       return {
         ...error,
         message: (
-          <pre style={{ margin: 0 }}>
+          <pre style={{ margin: 0, whiteSpace: 'pre-wrap' }}>
             {JSON.stringify(JSON.parse(error.message as string), null, 2)}
           </pre>
         ),