Add Email Verification for non-Microsoft/Google Emails

packages/twenty-emails/src/components/Footer.tsx

@@ -0,0 +1,55 @@
+import { Column, Row } from '@react-email/components';
+import { Link } from 'src/components/Link';
+import { ShadowText } from 'src/components/ShadowText';
+
+export const Footer = () => {
+  return (
+    <>
+      <Row>
+        <Column>
+          <ShadowText>
+            <Link
+              href="https://twenty.com/"
+              value="Website"
+              aria-label="Visit Twenty's website"
+            />
+          </ShadowText>
+        </Column>
+        <Column>
+          <ShadowText>
+            <Link
+              href="https://github.com/twentyhq/twenty"
+              value="Github"
+              aria-label="Visit Twenty's GitHub repository"
+            />
+          </ShadowText>
+        </Column>
+        <Column>
+          <ShadowText>
+            <Link
+              href="https://twenty.com/user-guide"
+              value="User guide"
+              aria-label="Read Twenty's user guide"
+            />
+          </ShadowText>
+        </Column>
+        <Column>
+          <ShadowText>
+            <Link
+              href="https://docs.twenty.com/"
+              value="Developers"
+              aria-label="Visit Twenty's developer documentation"
+            />
+          </ShadowText>
+        </Column>
+      </Row>
+      <ShadowText>
+        Twenty.com Public Benefit Corporation
+        <br />
+        2261 Market Street #5275
+        <br />
+        San Francisco, CA 94114
+      </ShadowText>
+    </>
+  );
+};

packages/twenty-emails/src/components/WhatIsTwenty.tsx

@@ -1,8 +1,7 @@
-import { Column, Row } from '@react-email/components';
-import { Link } from 'src/components/Link';
+import { Footer } from 'src/components/Footer';
 import { MainText } from 'src/components/MainText';
-import { ShadowText } from 'src/components/ShadowText';
 import { SubTitle } from 'src/components/SubTitle';
+
 export const WhatIsTwenty = () => {
   return (
     <>
@@ -11,35 +10,7 @@ export const WhatIsTwenty = () => {
         It's a CRM, a software to help businesses manage their customer data and
         relationships efficiently.
       </MainText>
-      <Row>
-        <Column>
-          <ShadowText>
-            <Link href="https://twenty.com/" value="Website" />
-          </ShadowText>
-        </Column>
-        <Column>
-          <ShadowText>
-            <Link href="https://github.com/twentyhq/twenty" value="Github" />
-          </ShadowText>
-        </Column>
-        <Column>
-          <ShadowText>
-            <Link href="https://twenty.com/user-guide" value="User guide" />
-          </ShadowText>
-        </Column>
-        <Column>
-          <ShadowText>
-            <Link href="https://docs.twenty.com/" value="Developers" />
-          </ShadowText>
-        </Column>
-      </Row>
-      <ShadowText>
-        Twenty.com Public Benefit Corporation
-        <br />
-        2261 Market Street #5275
-        <br />
-        San Francisco, CA 94114
-      </ShadowText>
+      <Footer />
     </>
   );
 };

packages/twenty-emails/src/emails/send-email-verification-link.email.tsx

@@ -0,0 +1,28 @@
+import { BaseEmail } from 'src/components/BaseEmail';
+import { CallToAction } from 'src/components/CallToAction';
+import { Footer } from 'src/components/Footer';
+import { MainText } from 'src/components/MainText';
+import { Title } from 'src/components/Title';
+
+type SendEmailVerificationLinkEmailProps = {
+  link: string;
+};
+
+export const SendEmailVerificationLinkEmail = ({
+  link,
+}: SendEmailVerificationLinkEmailProps) => {
+  return (
+    <BaseEmail width={333}>
+      <Title value="Confirm your email address" />
+      <CallToAction href={link} value="Verify Email" />
+      <br />
+      <br />
+      <MainText>
+        Thanks for registering for an account on Twenty! Before we get started,
+        we just need to confirm that this is you. Click above to verify your
+        email address.
+      </MainText>
+      <Footer />
+    </BaseEmail>
+  );
+};

packages/twenty-emails/src/index.ts

@@ -2,4 +2,5 @@ export * from './emails/clean-inactive-workspaces.email';
 export * from './emails/delete-inactive-workspaces.email';
 export * from './emails/password-reset-link.email';
 export * from './emails/password-update-notify.email';
+export * from './emails/send-email-verification-link.email';
 export * from './emails/send-invite-link.email';

packages/twenty-front/src/generated-metadata/graphql.ts

@@ -183,6 +183,7 @@ export type ClientConfig = {
   debugMode: Scalars['Boolean']['output'];
   defaultSubdomain?: Maybe<Scalars['String']['output']>;
   frontDomain: Scalars['String']['output'];
+  isEmailVerificationRequired: Scalars['Boolean']['output'];
   isMultiWorkspaceEnabled: Scalars['Boolean']['output'];
   isSSOEnabled: Scalars['Boolean']['output'];
   sentry: Sentry;
@@ -404,7 +405,6 @@ export enum FeatureFlagKey {
   IsSsoEnabled = 'IsSSOEnabled',
   IsStripeIntegrationEnabled = 'IsStripeIntegrationEnabled',
   IsUniqueIndexesEnabled = 'IsUniqueIndexesEnabled',
-  IsViewGroupsEnabled = 'IsViewGroupsEnabled',
   IsWorkflowEnabled = 'IsWorkflowEnabled'
 }
 
@@ -612,9 +612,11 @@ export type Mutation = {
   generateApiKeyToken: ApiKeyToken;
   generateTransientToken: TransientToken;
   getAuthorizationUrl: GetAuthorizationUrlOutput;
+  getLoginTokenFromEmailVerificationToken: LoginToken;
   impersonate: ImpersonateOutput;
   publishServerlessFunction: ServerlessFunction;
   renewToken: AuthTokens;
+  resendEmailVerificationToken: ResendEmailVerificationTokenOutput;
   resendWorkspaceInvitation: SendInvitationsOutput;
   runWorkflowVersion: WorkflowRun;
   sendInvitations: SendInvitationsOutput;
@@ -811,6 +813,12 @@ export type MutationGetAuthorizationUrlArgs = {
 };
 
 
+export type MutationGetLoginTokenFromEmailVerificationTokenArgs = {
+  captchaToken?: InputMaybe<Scalars['String']['input']>;
+  emailVerificationToken: Scalars['String']['input'];
+};
+
+
 export type MutationImpersonateArgs = {
   userId: Scalars['String']['input'];
   workspaceId: Scalars['String']['input'];
@@ -827,6 +835,11 @@ export type MutationRenewTokenArgs = {
 };
 
 
+export type MutationResendEmailVerificationTokenArgs = {
+  email: Scalars['String']['input'];
+};
+
+
 export type MutationResendWorkspaceInvitationArgs = {
   appTokenId: Scalars['String']['input'];
 };
@@ -1289,6 +1302,11 @@ export enum RemoteTableStatus {
   Synced = 'SYNCED'
 }
 
+export type ResendEmailVerificationTokenOutput = {
+  __typename?: 'ResendEmailVerificationTokenOutput';
+  success: Scalars['Boolean']['output'];
+};
+
 export type RunWorkflowVersionInput = {
   /** Execution result in JSON format */
   payload?: InputMaybe<Scalars['JSON']['input']>;
@@ -1631,9 +1649,9 @@ export type User = {
   deletedAt?: Maybe<Scalars['DateTime']['output']>;
   disabled?: Maybe<Scalars['Boolean']['output']>;
   email: Scalars['String']['output'];
-  emailVerified: Scalars['Boolean']['output'];
   firstName: Scalars['String']['output'];
   id: Scalars['UUID']['output'];
+  isEmailVerified: Scalars['Boolean']['output'];
   lastName: Scalars['String']['output'];
   onboardingStatus?: Maybe<OnboardingStatus>;
   passwordHash?: Maybe<Scalars['String']['output']>;
@@ -1657,6 +1675,7 @@ export type UserExists = {
   __typename?: 'UserExists';
   availableWorkspaces: Array<AvailableWorkspaceOutput>;
   exists: Scalars['Boolean']['output'];
+  isEmailVerified: Scalars['Boolean']['output'];
 };
 
 export type UserExistsOutput = UserExists | UserNotExists;