Use scopes in workflow page

twentyhq · Oct 8, 2024 · 5b3428b · 5b3428b
1 parent 9aa36f5
commit 5b3428b
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 13 deletions.
diff --git a/packages/twenty-front/src/modules/accounts/constants/GmailSendScope.ts b/packages/twenty-front/src/modules/accounts/constants/GmailSendScope.ts
@@ -0,0 +1 @@
+export const GMAIL_SEND_SCOPE = 'https://www.googleapis.com/auth/gmail.send';
diff --git a/packages/twenty-front/src/modules/accounts/types/ConnectedAccount.ts b/packages/twenty-front/src/modules/accounts/types/ConnectedAccount.ts
@@ -13,5 +13,6 @@ export type ConnectedAccount = {
   authFailedAt: Date | null;
   messageChannels: MessageChannel[];
   calendarChannels: CalendarChannel[];
+  scopes: string[] | null;
   __typename: 'ConnectedAccount';
 };
diff --git a/packages/twenty-front/src/modules/workflow/components/WorkflowEditActionFormSendEmail.tsx b/packages/twenty-front/src/modules/workflow/components/WorkflowEditActionFormSendEmail.tsx
@@ -6,7 +6,7 @@ import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
 import React, { useEffect } from 'react';
 import { Controller, useForm } from 'react-hook-form';
-import { IconMail, IconPlus } from 'twenty-ui';
+import { IconMail, IconPlus, isDefined } from 'twenty-ui';
 import { useDebouncedCallback } from 'use-debounce';
 import { Select, SelectOption } from '@/ui/input/components/Select';
 import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
@@ -15,6 +15,7 @@ import { useRecoilValue } from 'recoil';
 import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState';
 import { useTriggerGoogleApisOAuth } from '@/settings/accounts/hooks/useTriggerGoogleApisOAuth';
 import { workflowIdState } from '@/workflow/states/workflowIdState';
+import { GMAIL_SEND_SCOPE } from '@/accounts/constants/GmailSendScope';
 
 const StyledTriggerSettings = styled.div`
   padding: ${({ theme }) => theme.spacing(6)};
@@ -50,6 +51,24 @@ export const WorkflowEditActionFormSendEmail = ({
     },
   });
 
+  const checkConnectedAccountScopes = async (
+    connectedAccountId: string | null,
+  ) => {
+    const connectedAccount = accounts.find(
+      (account) => account.id === connectedAccountId,
+    );
+    if (!isDefined(connectedAccount)) {
+      return;
+    }
+    const scopes = connectedAccount.scopes;
+    if (
+      !isDefined(scopes) ||
+      !isDefined(scopes.find((scope) => scope === GMAIL_SEND_SCOPE))
+    ) {
+      await triggerGoogleApisOAuth(redirectUrl);
+    }
+  };
+
   useEffect(() => {
     form.setValue(
       'connectedAccountId',
@@ -64,17 +83,21 @@ export const WorkflowEditActionFormSendEmail = ({
     form,
   ]);
 
-  const saveAction = useDebouncedCallback((formData: SendEmailFormData) => {
-    onActionUpdate({
-      ...action,
-      settings: {
-        ...action.settings,
-        connectedAccountId: formData.connectedAccountId,
-        subject: formData.subject,
-        body: formData.body,
-      },
-    });
-  }, 1_000);
+  const saveAction = useDebouncedCallback(
+    async (formData: SendEmailFormData) => {
+      onActionUpdate({
+        ...action,
+        settings: {
+          ...action.settings,
+          connectedAccountId: formData.connectedAccountId,
+          subject: formData.subject,
+          body: formData.body,
+        },
+      });
+      await checkConnectedAccountScopes(formData.connectedAccountId);
+    },
+    1_000,
+  );
 
   useEffect(() => {
     return () => {
@@ -145,7 +168,6 @@ export const WorkflowEditActionFormSendEmail = ({
                 }}
                 onChange={(connectedAccountId) => {
                   field.onChange(connectedAccountId);
-
                   handleSave();
                 }}
               />
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export const GMAIL_SEND_SCOPE = 'https://www.googleapis.com/auth/gmail.send';