From 58ed9330bf87793d7ef9e4c91051943652aea20c Mon Sep 17 00:00:00 2001 From: awu43 <46470763+awu43@users.noreply.github.com> Date: Thu, 26 Aug 2021 16:03:11 -0700 Subject: [PATCH] fix(client): ensure unmount effect has most recent values (#43282) * ensure unmount effect has most recent values Co-authored-by: Oliver Eyton-Williams --- client/src/pages/email-sign-up.tsx | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/client/src/pages/email-sign-up.tsx b/client/src/pages/email-sign-up.tsx index 91c9a032a0..15cf9c443f 100644 --- a/client/src/pages/email-sign-up.tsx +++ b/client/src/pages/email-sign-up.tsx @@ -1,5 +1,5 @@ import { Row, Col, Button, Grid } from '@freecodecamp/react-bootstrap'; -import React, { useEffect } from 'react'; +import React, { useEffect, useRef } from 'react'; import Helmet from 'react-helmet'; import { TFunction, withTranslation } from 'react-i18next'; import { connect } from 'react-redux'; @@ -36,6 +36,13 @@ function AcceptPrivacyTerms({ acceptedPrivacyTerms, t }: AcceptPrivacyTermsProps) { + const acceptedPrivacyRef = useRef(acceptedPrivacyTerms); + const acceptTermsRef = useRef(acceptTerms); + useEffect(() => { + acceptedPrivacyRef.current = acceptedPrivacyTerms; + acceptTermsRef.current = acceptTerms; + }); + useEffect(() => { return () => { // if a user navigates away from here we should set acceptedPrivacyTerms @@ -43,14 +50,10 @@ function AcceptPrivacyTerms({ // preferences (hence the null payload) // This makes sure that the user has to opt in to Quincy's emails and that // they are only asked twice - if (!acceptedPrivacyTerms) { - acceptTerms(null); + if (!acceptedPrivacyRef.current) { + acceptTermsRef.current(null); } }; - // We're ignoring all dependencies, since this effect must only run once - // (when the user leaves the page). - // TODO: figure out how to useCallback to only run this effect once. - // eslint-disable-next-line react-hooks/exhaustive-deps }, []); function onClick(isWeeklyEmailAccepted: boolean) {