From 916dac36a03ade4a05383af0be454517a165ed8c Mon Sep 17 00:00:00 2001 From: Chisomchima Date: Tue, 3 Dec 2024 10:29:30 +0100 Subject: [PATCH 1/5] feat: add email verification pages --- src/app.js | 10 ++++++++++ src/pages/email-verification-failure.js | 17 +++++++++++++++++ src/pages/email-verification-success.js | 16 ++++++++++++++++ src/pages/index.js | 2 ++ src/pages/login.module.css | 6 ++++++ 5 files changed, 51 insertions(+) create mode 100644 src/pages/email-verification-failure.js create mode 100644 src/pages/email-verification-success.js diff --git a/src/app.js b/src/app.js index 80cebbb..1908485 100644 --- a/src/app.js +++ b/src/app.js @@ -18,6 +18,8 @@ import { LoginPage, CompleteRegistrationPage, CreateAccountPage, + EmailVerificationFailure, + EmailVerificationSuccess, PasswordResetRequestPage, PasswordUpdatePage, SafeModePage, @@ -34,6 +36,14 @@ const LoginRoutes = () => { } /> } /> + } + /> + } + /> } diff --git a/src/pages/email-verification-failure.js b/src/pages/email-verification-failure.js new file mode 100644 index 0000000..29a5e7b --- /dev/null +++ b/src/pages/email-verification-failure.js @@ -0,0 +1,17 @@ +import { NoticeBox } from '@dhis2/ui' +import React from 'react' +import styles from './login.module.css' + +function EmailVerificationFailure() { + return ( +
+

Email Verification Failed

+ + The verification link is invalid or has expired. Please request + a new verification email. + +
+ ) +} + +export default EmailVerificationFailure diff --git a/src/pages/email-verification-success.js b/src/pages/email-verification-success.js new file mode 100644 index 0000000..fa420c2 --- /dev/null +++ b/src/pages/email-verification-success.js @@ -0,0 +1,16 @@ +import { NoticeBox } from '@dhis2/ui' +import React from 'react' +import styles from './login.module.css' + +function EmailVerificationSuccess() { + return ( +
+

Email confirmed

+ + You can now close this page. + +
+ ) +} + +export default EmailVerificationSuccess diff --git a/src/pages/index.js b/src/pages/index.js index cccddef..f635082 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -1,5 +1,7 @@ export { default as CompleteRegistrationPage } from './complete-registration.js' export { default as CreateAccountPage } from './create-account.js' +export { default as EmailVerificationSuccess } from './email-verification-success.js' +export { default as EmailVerificationFailure } from './email-verification-failure.js' export { default as LoginPage } from './login.js' export { default as PasswordResetRequestPage } from './password-reset-request.js' export { default as PasswordUpdatePage } from './password-update.js' diff --git a/src/pages/login.module.css b/src/pages/login.module.css index f180368..682c4aa 100644 --- a/src/pages/login.module.css +++ b/src/pages/login.module.css @@ -12,3 +12,9 @@ gap: var(--spacers-dp8); margin-bottom: var(--spacers-dp16); } + +.card { + padding: 40px; + border-radius: var(--spacers-dp8); + background-color: white !important; +} From c74a4ca08f102e8f8c27065e079a066315577a7d Mon Sep 17 00:00:00 2001 From: Chisomchima Date: Tue, 10 Dec 2024 14:41:17 +0100 Subject: [PATCH 2/5] fix: use form container component for styling consistency --- src/pages/email-verification-failure.js | 12 +++++++----- src/pages/email-verification-success.js | 10 ++++++---- src/pages/login.module.css | 6 ------ 3 files changed, 13 insertions(+), 15 deletions(-) diff --git a/src/pages/email-verification-failure.js b/src/pages/email-verification-failure.js index 29a5e7b..386bd68 100644 --- a/src/pages/email-verification-failure.js +++ b/src/pages/email-verification-failure.js @@ -1,16 +1,18 @@ import { NoticeBox } from '@dhis2/ui' +import i18n from '@dhis2/d2-i18n' import React from 'react' -import styles from './login.module.css' +import { FormContainer } from '../components/index.js' +import { useLoginConfig } from '../providers/index.js' function EmailVerificationFailure() { + const { lngs } = useLoginConfig() return ( -
-

Email Verification Failed

- + + The verification link is invalid or has expired. Please request a new verification email. -
+ ) } diff --git a/src/pages/email-verification-success.js b/src/pages/email-verification-success.js index fa420c2..f7c9ed6 100644 --- a/src/pages/email-verification-success.js +++ b/src/pages/email-verification-success.js @@ -1,15 +1,17 @@ import { NoticeBox } from '@dhis2/ui' import React from 'react' -import styles from './login.module.css' +import i18n from '@dhis2/d2-i18n' +import { FormContainer } from '../components/index.js' +import { useLoginConfig } from '../providers/index.js' function EmailVerificationSuccess() { + const { lngs } = useLoginConfig() return ( -
-

Email confirmed

+ You can now close this page. -
+ ) } diff --git a/src/pages/login.module.css b/src/pages/login.module.css index 682c4aa..f180368 100644 --- a/src/pages/login.module.css +++ b/src/pages/login.module.css @@ -12,9 +12,3 @@ gap: var(--spacers-dp8); margin-bottom: var(--spacers-dp16); } - -.card { - padding: 40px; - border-radius: var(--spacers-dp8); - background-color: white !important; -} From ad6169cafd1018fe5d37fd6eee067da6aae2bfd0 Mon Sep 17 00:00:00 2001 From: Chisomchima Date: Tue, 10 Dec 2024 14:44:19 +0100 Subject: [PATCH 3/5] chore: format code --- src/pages/email-verification-failure.js | 2 +- src/pages/email-verification-success.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/email-verification-failure.js b/src/pages/email-verification-failure.js index 386bd68..2f400a4 100644 --- a/src/pages/email-verification-failure.js +++ b/src/pages/email-verification-failure.js @@ -1,5 +1,5 @@ -import { NoticeBox } from '@dhis2/ui' import i18n from '@dhis2/d2-i18n' +import { NoticeBox } from '@dhis2/ui' import React from 'react' import { FormContainer } from '../components/index.js' import { useLoginConfig } from '../providers/index.js' diff --git a/src/pages/email-verification-success.js b/src/pages/email-verification-success.js index f7c9ed6..0b76e58 100644 --- a/src/pages/email-verification-success.js +++ b/src/pages/email-verification-success.js @@ -1,6 +1,6 @@ +import i18n from '@dhis2/d2-i18n' import { NoticeBox } from '@dhis2/ui' import React from 'react' -import i18n from '@dhis2/d2-i18n' import { FormContainer } from '../components/index.js' import { useLoginConfig } from '../providers/index.js' From 8c9b109cd17deffafd2169c6e298529b8a7428ad Mon Sep 17 00:00:00 2001 From: Chisomchima Date: Mon, 16 Dec 2024 15:14:07 +0100 Subject: [PATCH 4/5] chore: add translations --- i18n/en.pot | 10 ++++++++-- src/pages/email-verification-failure.js | 8 +++++--- src/pages/email-verification-success.js | 5 +++-- 3 files changed, 16 insertions(+), 7 deletions(-) diff --git a/i18n/en.pot b/i18n/en.pot index f95caf7..57cfa2a 100644 --- a/i18n/en.pot +++ b/i18n/en.pot @@ -5,8 +5,8 @@ msgstr "" "Content-Type: text/plain; charset=utf-8\n" "Content-Transfer-Encoding: 8bit\n" "Plural-Forms: nplurals=2; plural=(n != 1)\n" -"POT-Creation-Date: 2024-08-28T07:47:39.528Z\n" -"PO-Revision-Date: 2024-08-28T07:47:39.528Z\n" +"POT-Creation-Date: 2024-12-10T15:02:03.384Z\n" +"PO-Revision-Date: 2024-12-10T15:02:03.387Z\n" msgid "Please confirm that you are not a robot by checking the checkbox." msgstr "Please confirm that you are not a robot by checking the checkbox." @@ -133,6 +133,12 @@ msgstr "Download default template" msgid "Download sidebar template" msgstr "Download sidebar template" +msgid "Email Verification Failed" +msgstr "Email Verification Failed" + +msgid "Email confirmed" +msgstr "Email confirmed" + msgid "Something went wrong" msgstr "Something went wrong" diff --git a/src/pages/email-verification-failure.js b/src/pages/email-verification-failure.js index 2f400a4..20eebcc 100644 --- a/src/pages/email-verification-failure.js +++ b/src/pages/email-verification-failure.js @@ -6,11 +6,13 @@ import { useLoginConfig } from '../providers/index.js' function EmailVerificationFailure() { const { lngs } = useLoginConfig() + return ( - - The verification link is invalid or has expired. Please request - a new verification email. + + {i18n.t( + 'The verification link is invalid or has expired. Please request a new verification email.' + )} ) diff --git a/src/pages/email-verification-success.js b/src/pages/email-verification-success.js index 0b76e58..48f289f 100644 --- a/src/pages/email-verification-success.js +++ b/src/pages/email-verification-success.js @@ -6,10 +6,11 @@ import { useLoginConfig } from '../providers/index.js' function EmailVerificationSuccess() { const { lngs } = useLoginConfig() + return ( - - You can now close this page. + + {i18n.t('You can now close this page.')} ) From 5e759af88c357be0720d033dfe599521eb4c7bb7 Mon Sep 17 00:00:00 2001 From: Chisomchima Date: Mon, 16 Dec 2024 15:28:40 +0100 Subject: [PATCH 5/5] chore: add lngs to avoid page refresh --- i18n/en.pot | 20 ++++++++++++++++++-- src/pages/email-verification-failure.js | 8 ++++++-- src/pages/email-verification-success.js | 7 +++++-- 3 files changed, 29 insertions(+), 6 deletions(-) diff --git a/i18n/en.pot b/i18n/en.pot index 57cfa2a..4f3c77a 100644 --- a/i18n/en.pot +++ b/i18n/en.pot @@ -5,8 +5,8 @@ msgstr "" "Content-Type: text/plain; charset=utf-8\n" "Content-Transfer-Encoding: 8bit\n" "Plural-Forms: nplurals=2; plural=(n != 1)\n" -"POT-Creation-Date: 2024-12-10T15:02:03.384Z\n" -"PO-Revision-Date: 2024-12-10T15:02:03.387Z\n" +"POT-Creation-Date: 2024-12-16T14:17:34.112Z\n" +"PO-Revision-Date: 2024-12-16T14:17:34.112Z\n" msgid "Please confirm that you are not a robot by checking the checkbox." msgstr "Please confirm that you are not a robot by checking the checkbox." @@ -136,9 +136,25 @@ msgstr "Download sidebar template" msgid "Email Verification Failed" msgstr "Email Verification Failed" +msgid "Unable to verify your email" +msgstr "Unable to verify your email" + +msgid "" +"The verification link is invalid or has expired. Please request a new " +"verification email." +msgstr "" +"The verification link is invalid or has expired. Please request a new " +"verification email." + msgid "Email confirmed" msgstr "Email confirmed" +msgid "Your email has been confirmed." +msgstr "Your email has been confirmed." + +msgid "You can now close this page." +msgstr "You can now close this page." + msgid "Something went wrong" msgstr "Something went wrong" diff --git a/src/pages/email-verification-failure.js b/src/pages/email-verification-failure.js index 20eebcc..5322354 100644 --- a/src/pages/email-verification-failure.js +++ b/src/pages/email-verification-failure.js @@ -9,9 +9,13 @@ function EmailVerificationFailure() { return ( - + {i18n.t( - 'The verification link is invalid or has expired. Please request a new verification email.' + 'The verification link is invalid or has expired. Please request a new verification email.', + { lngs } )} diff --git a/src/pages/email-verification-success.js b/src/pages/email-verification-success.js index 48f289f..5c5b797 100644 --- a/src/pages/email-verification-success.js +++ b/src/pages/email-verification-success.js @@ -9,8 +9,11 @@ function EmailVerificationSuccess() { return ( - - {i18n.t('You can now close this page.')} + + {i18n.t('You can now close this page.', { lngs })} )