From 4d8566f3793ffaeb6aa617401e7c513237863fb2 Mon Sep 17 00:00:00 2001 From: BetsyBraddock <69518422+BetsyBraddock@users.noreply.github.com> Date: Fri, 19 Mar 2021 18:31:57 +0000 Subject: [PATCH] Fix to email notification button (#483) * Bump react-dev-utils from 10.2.1 to 11.0.4 (#472) Bumps [react-dev-utils](https://github.com/facebook/create-react-app/tree/HEAD/packages/react-dev-utils) from 10.2.1 to 11.0.4. - [Release notes](https://github.com/facebook/create-react-app/releases) - [Changelog](https://github.com/facebook/create-react-app/blob/master/CHANGELOG-1.x.md) - [Commits](https://github.com/facebook/create-react-app/commits/HEAD/packages/react-dev-utils) Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * Fix to email notification button Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Victor Creed <69458664+creed-victor@users.noreply.github.com> --- package.json | 2 +- .../NotificationFormContainer/index.tsx | 46 ++---- src/app/containers/MarketingPage/Loadable.tsx | 15 ++ src/app/containers/MarketingPage/index.tsx | 35 +++++ yarn.lock | 136 ++++++++++++------ 5 files changed, 150 insertions(+), 84 deletions(-) create mode 100644 src/app/containers/MarketingPage/Loadable.tsx create mode 100644 src/app/containers/MarketingPage/index.tsx diff --git a/package.json b/package.json index c5ba594fe..0edec7dca 100644 --- a/package.json +++ b/package.json @@ -114,7 +114,7 @@ "react-bootstrap-icons": "1.0.0", "react-copy-to-clipboard": "5.0.2", "react-countdown": "2.3.1", - "react-dev-utils": "^10.2.1", + "react-dev-utils": "^11.0.4", "react-dom": "16.13.0", "react-helmet-async": "1.0.4", "react-i18next": "11.3.4", diff --git a/src/app/components/NotificationForm/NotificationFormContainer/index.tsx b/src/app/components/NotificationForm/NotificationFormContainer/index.tsx index b4e2a13b4..080a61d40 100644 --- a/src/app/components/NotificationForm/NotificationFormContainer/index.tsx +++ b/src/app/components/NotificationForm/NotificationFormContainer/index.tsx @@ -20,18 +20,9 @@ export function NotificationForm() { const mailSrv = backendUrl[currentChainId]; const walletAddress = useAccount(); - const emptyUser = { - user_address: '', - email: '', - name: '', - first_transaction: '', - marketing: true, - notifications: true, - referred_by: '', - }; const [response, setResponse] = useState(''); - const [foundUser, setFoundUser] = useState(emptyUser); + const [userExists, setUserExists] = useState(false); const [loading, setLoading] = useState(true); const [showForm, setShowForm] = useState(false); @@ -59,15 +50,6 @@ export function NotificationForm() { } }; - //SET VALUES IN UPDATE FORM - useEffect(() => { - if (foundUser && foundUser.email && foundUser.name) { - dispatch({ field: 'name', value: foundUser.name }); - dispatch({ field: 'email', value: foundUser.email }); - dispatch({ field: 'marketing', value: foundUser.marketing }); - } - }, [foundUser]); - //UPDATE OR ADD USER const addUser = (e, formType) => { e.preventDefault(); @@ -113,26 +95,16 @@ export function NotificationForm() { walletAddress: walletAddress, }) .then(res => { - setFoundUser(res.data[0]); + setUserExists(res.data.found); + console.log('User exists: ' + userExists); setLoading(false); }) .catch(e => { console.log(e); setLoading(false); }); - } else { - setFoundUser({ - user_address: '', - email: '', - name: '', - first_transaction: '', - marketing: true, - notifications: true, - referred_by: '', - }); - setLoading(false); } - }, [mailSrv, walletAddress]); + }, [mailSrv, walletAddress, userExists]); //GET USER useEffect(() => { @@ -145,6 +117,8 @@ export function NotificationForm() { setResponse(''); getUser(); setLoading(false); + state.name = ''; + state.email = ''; } return ( @@ -152,7 +126,7 @@ export function NotificationForm() {
)} - {response === 'success' && !foundUser && ( + {response === 'success' && !userExists && (
{t(translations.notificationFormContainer.updated_success)}
)} - {response === 'success' && foundUser && ( + {response === 'success' && userExists && (
{t( translations.notificationFormContainer diff --git a/src/app/containers/MarketingPage/Loadable.tsx b/src/app/containers/MarketingPage/Loadable.tsx new file mode 100644 index 000000000..dab4b1386 --- /dev/null +++ b/src/app/containers/MarketingPage/Loadable.tsx @@ -0,0 +1,15 @@ +/** + * + * Asynchronously loads the component for MarketingPage + * + */ + +import React from 'react'; +import { lazyLoad } from 'utils/loadable'; +import { PageSkeleton } from 'app/components/PageSkeleton'; + +export const MarketingPage = lazyLoad( + () => import('./index'), + module => module.MarketingPage, + { fallback: }, +); diff --git a/src/app/containers/MarketingPage/index.tsx b/src/app/containers/MarketingPage/index.tsx new file mode 100644 index 000000000..09b69188b --- /dev/null +++ b/src/app/containers/MarketingPage/index.tsx @@ -0,0 +1,35 @@ +/** + * + * EmailOptInSuccessPage + * + */ + +import React from 'react'; +import { Helmet } from 'react-helmet-async'; +import { useTranslation } from 'react-i18next'; + +import { translations } from 'locales/i18n'; + +import { Header } from 'app/components/Header'; +import { Footer } from '../../components/Footer'; + +const s = translations.tradingPage; + +export function MarketingPage() { + // eslint-disable-next-line @typescript-eslint/no-unused-vars + const { t } = useTranslation(); + + return ( + <> + + {t(s.meta.title)} + + +
+
+

Marketing Page

+
+