Bettertyping (#10725)

To get better at catching errors on providers
(It will ease also my coming PR to send microsoft messages using
workflow)

packages/twenty-front/src/modules/accounts/constants/MicrosoftSendScope.ts

@@ -0,0 +1 @@
+export const MICROSOFT_SEND_SCOPE = 'Mail.Send';

packages/twenty-front/src/modules/accounts/types/ConnectedAccount.ts

@@ -1,11 +1,12 @@
 import { CalendarChannel } from '@/accounts/types/CalendarChannel';
 
+import { ConnectedAccountProvider } from 'twenty-shared';
 import { MessageChannel } from './MessageChannel';
 
 export type ConnectedAccount = {
   id: string;
   handle: string;
-  provider: string;
+  provider: ConnectedAccountProvider;
   accessToken: string;
   refreshToken: string;
   accountOwnerId: string;

packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsListEmptyStateCard.tsx

@@ -6,6 +6,7 @@ import { useTriggerApisOAuth } from '@/settings/accounts/hooks/useTriggerApiOAut
 import styled from '@emotion/styled';
 import { useLingui } from '@lingui/react/macro';
 import { useRecoilValue } from 'recoil';
+import { ConnectedAccountProvider } from 'twenty-shared';
 import {
   Button,
   Card,
@@ -60,7 +61,7 @@ export const SettingsAccountsListEmptyStateCard = ({
             Icon={IconGoogle}
             title={t`Connect with Google`}
             variant="secondary"
-            onClick={() => triggerApisOAuth('google')}
+            onClick={() => triggerApisOAuth(ConnectedAccountProvider.GOOGLE)}
           />
         )}
 
@@ -69,7 +70,7 @@ export const SettingsAccountsListEmptyStateCard = ({
             Icon={IconMicrosoft}
             title={t`Connect with Microsoft`}
             variant="secondary"
-            onClick={() => triggerApisOAuth('microsoft')}
+            onClick={() => triggerApisOAuth(ConnectedAccountProvider.MICROSOFT)}
           />
         )}
       </StyledBody>

packages/twenty-front/src/modules/settings/accounts/hooks/useTriggerApiOAuth.ts

@@ -1,19 +1,20 @@
 import { AppPath } from '@/types/AppPath';
 import { useCallback } from 'react';
 
+import { useRedirect } from '@/domain-manager/hooks/useRedirect';
+import { ConnectedAccountProvider } from 'twenty-shared';
 import { REACT_APP_SERVER_BASE_URL } from '~/config';
 import {
   CalendarChannelVisibility,
   MessageChannelVisibility,
   useGenerateTransientTokenMutation,
 } from '~/generated/graphql';
-import { useRedirect } from '@/domain-manager/hooks/useRedirect';
 
-const getProviderUrl = (provider: string) => {
+const getProviderUrl = (provider: ConnectedAccountProvider) => {
   switch (provider) {
-    case 'google':
+    case ConnectedAccountProvider.GOOGLE:
       return 'google-apis';
-    case 'microsoft':
+    case ConnectedAccountProvider.MICROSOFT:
       return 'microsoft-apis';
     default:
       throw new Error(`Provider ${provider} is not supported`);
@@ -26,7 +27,7 @@ export const useTriggerApisOAuth = () => {
 
   const triggerApisOAuth = useCallback(
     async (
-      provider: string,
+      provider: ConnectedAccountProvider,
       {
         redirectLocation,
         messageVisibility,

packages/twenty-front/src/modules/settings/security/components/SettingsSecurityAuthProvidersOptionsList.tsx

@@ -7,7 +7,7 @@ import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar';
 import styled from '@emotion/styled';
 import { useLingui } from '@lingui/react/macro';
 import { useRecoilState, useRecoilValue } from 'recoil';
-import { capitalize } from 'twenty-shared';
+import { capitalize, ConnectedAccountProvider } from 'twenty-shared';
 import {
   Card,
   IconGoogle,
@@ -136,7 +136,9 @@ export const SettingsSecurityAuthProvidersOptionsList = () => {
                 checked={currentWorkspace.isGoogleAuthEnabled}
                 advancedMode
                 divider
-                onChange={() => toggleAuthMethod('google')}
+                onChange={() =>
+                  toggleAuthMethod(ConnectedAccountProvider.GOOGLE)
+                }
               />
             )}
             {authProviders.microsoft === true && (
@@ -147,7 +149,9 @@ export const SettingsSecurityAuthProvidersOptionsList = () => {
                 checked={currentWorkspace.isMicrosoftAuthEnabled}
                 advancedMode
                 divider
-                onChange={() => toggleAuthMethod('microsoft')}
+                onChange={() =>
+                  toggleAuthMethod(ConnectedAccountProvider.MICROSOFT)
+                }
               />
             )}
             {authProviders.password === true && (

packages/twenty-front/src/modules/workflow/workflow-steps/workflow-actions/components/WorkflowEditActionFormSendEmail.tsx

@@ -14,7 +14,7 @@ import { WorkflowVariablePicker } from '@/workflow/workflow-variables/components
 import { useTheme } from '@emotion/react';
 import { useEffect, useState } from 'react';
 import { useRecoilValue } from 'recoil';
-import { isDefined } from 'twenty-shared';
+import { ConnectedAccountProvider, isDefined } from 'twenty-shared';
 import { IconPlus, useIcons } from 'twenty-ui';
 import { JsonValue } from 'type-fest';
 import { useDebouncedCallback } from 'use-debounce';
@@ -71,7 +71,7 @@ export const WorkflowEditActionFormSendEmail = ({
       !isDefined(scopes) ||
       !isDefined(scopes.find((scope) => scope === GMAIL_SEND_SCOPE))
     ) {
-      await triggerApisOAuth('google', {
+      await triggerApisOAuth(ConnectedAccountProvider.GOOGLE, {
         redirectLocation: redirectUrl,
         loginHint: connectedAccount.handle,
       });
@@ -200,7 +200,7 @@ export const WorkflowEditActionFormSendEmail = ({
             options={connectedAccountOptions}
             callToActionButton={{
               onClick: () =>
-                triggerApisOAuth('google', {
+                triggerApisOAuth(ConnectedAccountProvider.GOOGLE, {
                   redirectLocation: redirectUrl,
                 }),
               Icon: IconPlus,