feat: verify email warning

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-11-21T08:20:57.566Z\n"
-"PO-Revision-Date: 2024-11-21T08:20:57.566Z\n"
+"POT-Creation-Date: 2024-12-16T05:17:28.155Z\n"
+"PO-Revision-Date: 2024-12-16T05:17:28.155Z\n"
 
 msgid "Never"
 msgstr "Never"
@@ -376,6 +376,9 @@ msgstr "Failed to send email verification link."
 msgid "Verify Email"
 msgstr "Verify Email"
 
+msgid "Please verify your email"
+msgstr "Please verify your email"
+
 msgid "Manage personal access tokens"
 msgstr "Manage personal access tokens"
 

src/layout/FormFields.component.js

@@ -17,6 +17,7 @@ import userSettingsKeyMapping from '../userSettingsMapping.js'
 import AvatarEditor from './AvatarEditor.component.js'
 import AppTheme from './theme.js'
 import { VerifyEmail } from './VerifyEmail.component.js'
+import VerifyEmailWarning from './VerifyEmailWarning.js'
 
 const styles = {
     header: {
@@ -387,6 +388,7 @@ class FormFields extends Component {
             <div className="content-area">
                 <div style={styles.header}>{this.props.pageLabel}</div>
                 <form autoComplete="off">
+                    <VerifyEmailWarning />
                     {this.renderFields(this.props.fieldKeys)}
                 </form>
             </div>

src/layout/VerifyEmailWarning.js

@@ -0,0 +1,50 @@
+import { useDataQuery, useAlert } from '@dhis2/app-runtime'
+import i18n from '@dhis2/d2-i18n'
+import { NoticeBox } from '@dhis2/ui'
+import React from 'react'
+
+const getUserProfileQuery = {
+    me: {
+        resource: 'me',
+    },
+}
+const getSystemSettingsQuery = {
+    systemSettings: {
+        resource: 'systemSettings',
+    },
+}
+
+const VerifyEmailWarning = () => {
+    const { data: userData, error: userError } =
+        useDataQuery(getUserProfileQuery)
+    const { data: systemData, error: systemError } = useDataQuery(
+        getSystemSettingsQuery
+    )
+
+    const errorAlert = useAlert(({ message }) => message, { critical: true })
+
+    const enforceVerifiedEmail =
+        systemData?.systemSettings?.enforceVerifiedEmail
+    const emailVerified = userData?.me?.emailVerified
+
+    if (userError || systemError) {
+        errorAlert.show({
+            message: i18n.t('Error fetching user or system data.'),
+        })
+        return null
+    }
+
+    if (enforceVerifiedEmail && !emailVerified) {
+        return (
+            <NoticeBox warning>
+                {i18n.t(
+                    'Your email is not verified. Please verify your email to continue using the system.'
+                )}
+            </NoticeBox>
+        )
+    }
+
+    return null
+}
+
+export default VerifyEmailWarning