diff --git a/client/src/pages/email-sign-up.test.js b/client/src/pages/email-sign-up.test.js
index ae77536914..bc1f8f423c 100644
--- a/client/src/pages/email-sign-up.test.js
+++ b/client/src/pages/email-sign-up.test.js
@@ -20,7 +20,18 @@ describe('', () => {
describe('Non-Authenticated user "not accepted terms and condition"', () => {
beforeEach(() => {
- const initialState = { app: { appUsername: '', user: {} } };
+ const initialState = {
+ app: {
+ appUsername: '',
+ user: {},
+ userFetchState: {
+ pending: false,
+ complete: true,
+ errored: false,
+ error: null
+ }
+ }
+ };
const store = mockStore(initialState);
const container = renderer.create(
@@ -57,6 +68,12 @@ describe('', () => {
acceptedPrivacyTerms: true,
name: 'John Doe'
}
+ },
+ userFetchState: {
+ pending: false,
+ complete: true,
+ errored: false,
+ error: null
}
}
};
diff --git a/client/src/pages/email-sign-up.tsx b/client/src/pages/email-sign-up.tsx
index f29ffba38c..259b8affb6 100644
--- a/client/src/pages/email-sign-up.tsx
+++ b/client/src/pages/email-sign-up.tsx
@@ -8,10 +8,15 @@ import type { Dispatch } from 'redux';
import { createSelector } from 'reselect';
import IntroDescription from '../components/Intro/components/IntroDescription';
import createRedirect from '../components/create-redirect';
-import { ButtonSpacer, Spacer } from '../components/helpers';
+import { ButtonSpacer, Spacer, Loader } from '../components/helpers';
import { apiLocation } from '../../../config/env.json';
-import { acceptTerms, userSelector, isSignedInSelector } from '../redux';
+import {
+ acceptTerms,
+ userSelector,
+ isSignedInSelector,
+ signInLoadingSelector
+} from '../redux';
import './email-sign-up.css';
interface AcceptPrivacyTermsProps {
@@ -19,17 +24,21 @@ interface AcceptPrivacyTermsProps {
acceptedPrivacyTerms: boolean;
isSignedIn: boolean;
t: TFunction;
+ showLoading: boolean;
}
const mapStateToProps = createSelector(
userSelector,
isSignedInSelector,
+ signInLoadingSelector,
(
{ acceptedPrivacyTerms }: { acceptedPrivacyTerms: boolean },
- isSignedIn: boolean
+ isSignedIn: boolean,
+ showLoading: boolean
) => ({
acceptedPrivacyTerms,
- isSignedIn
+ isSignedIn,
+ showLoading
})
);
const mapDispatchToProps = (dispatch: Dispatch) =>
@@ -40,7 +49,8 @@ function AcceptPrivacyTerms({
acceptTerms,
acceptedPrivacyTerms,
isSignedIn,
- t
+ t,
+ showLoading
}: AcceptPrivacyTermsProps) {
const acceptedPrivacyRef = useRef(acceptedPrivacyTerms);
const acceptTermsRef = useRef(acceptTerms);
@@ -67,7 +77,10 @@ function AcceptPrivacyTerms({
acceptTerms(isWeeklyEmailAccepted);
}
- function renderEmailListOptin(isSignedIn: boolean) {
+ function renderEmailListOptin(isSignedIn: boolean, showLoading: boolean) {
+ if (showLoading) {
+ return ;
+ }
if (isSignedIn) {
return (
@@ -138,7 +151,7 @@ function AcceptPrivacyTerms({
{t('misc.email-blast')}
- {renderEmailListOptin(isSignedIn)}
+ {renderEmailListOptin(isSignedIn, showLoading)}