diff --git a/site/gatsby-site/cypress/e2e/integration/login.cy.js b/site/gatsby-site/cypress/e2e/integration/login.cy.js index 7d592170ad..ba310e60d6 100644 --- a/site/gatsby-site/cypress/e2e/integration/login.cy.js +++ b/site/gatsby-site/cypress/e2e/integration/login.cy.js @@ -84,4 +84,45 @@ describe('Login', () => { cy.contains('Forgot password?').click(); cy.location('pathname').should('eq', '/forgotpassword/'); }); + + it('Should give the option to resend Email verification if the user is not confirmed', () => { + cy.conditionalIntercept( + '**/login', + (req) => req.body.username == Cypress.env('e2eUsername'), + 'Login', + { + statusCode: 401, + body: { + error: 'confirmation required', + error_code: 'AuthError', + link: 'https://realm.mongodb.com/groups/633205e6aecbcc4b2c2067c3/apps/633207f10d438f13ab3ab4d6/logs?co_id=6549772172bdb9e8eadeea95', + }, + } + ); + + cy.conditionalIntercept( + '**/auth/providers/local-userpass/confirm/call', + (req) => req.body.email == Cypress.env('e2eUsername'), + 'Confirmation', + { + statusCode: 204, + } + ); + + cy.visit(url); + cy.get('input[name=email]').type(Cypress.env('e2eUsername')); + cy.get('input[name=password]').type(Cypress.env('e2ePassword')); + cy.get('[data-cy="login-btn"]').click(); + + cy.wait('@Login'); + + cy.get('[data-cy="toast"]').contains('Resend Verification email').should('exist'); + cy.get('[data-cy="toast"]').contains('Resend Verification email').click(); + + cy.wait('@Confirmation'); + + cy.get('[data-cy="toast"]') + .contains(`Verification email sent to ${Cypress.env('e2eUsername')}`) + .should('exist'); + }); }); diff --git a/site/gatsby-site/src/contexts/userContext/UserContextProvider.js b/site/gatsby-site/src/contexts/userContext/UserContextProvider.js index b514875dda..02d6e53cc1 100644 --- a/site/gatsby-site/src/contexts/userContext/UserContextProvider.js +++ b/site/gatsby-site/src/contexts/userContext/UserContextProvider.js @@ -6,9 +6,10 @@ import { ApolloProvider, ApolloClient, HttpLink, InMemoryCache } from '@apollo/c import config from '../../../config'; import fetch from 'cross-fetch'; import useToastContext, { SEVERITY } from '../../hooks/useToast'; -import { useTranslation } from 'react-i18next'; +import { Trans, useTranslation } from 'react-i18next'; import { navigate } from 'gatsby'; import useLocalizePath from '../../components/i18n/useLocalizePath'; +import CustomButton from '../../elements/Button'; // https://github.com/mongodb-university/realm-graphql-apollo-react/blob/master/src/index.js @@ -98,7 +99,19 @@ export const UserContextProvider = ({ children }) => { addToast({ message: ( - + <> + + {e.statusCode === 401 && e.error == 'confirmation required' && ( + onResendConfirmationClick(email)} + className="underline text-sm pl-0 border-0" + > + Resend Verification email + + )} + ), severity: SEVERITY.danger, error: e, @@ -107,6 +120,25 @@ export const UserContextProvider = ({ children }) => { } }; + const onResendConfirmationClick = async (email) => { + try { + await realmApp.emailPasswordAuth.retryCustomConfirmation(email); + + addToast({ + message: `${t('Verification email sent to')} ${email}`, + severity: SEVERITY.success, + }); + } catch (e) { + addToast({ + message: ( + + ), + severity: SEVERITY.danger, + error: e, + }); + } + }; + const loginWithEmail = async ({ email, password, redirectTo }) => { return await login({ email, password, redirectTo }); };