From 8a0626d290cec0a9798f0a67f610d48dd09fa1de Mon Sep 17 00:00:00 2001
From: Tom Chapman <tchapman000@gmail.com>
Date: Fri, 19 Jul 2024 14:30:25 -0700
Subject: [PATCH] make support links mailto

---
 met-web/src/components/common/Modals/types.tsx             | 2 +-
 met-web/src/components/engagement/view/FailurePanel.tsx    | 5 ++++-
 .../engagement/view/widgets/Subscribe/EmailListModal.tsx   | 7 ++++++-
 met-web/src/routes/NotFound.tsx                            | 5 ++++-
 4 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/met-web/src/components/common/Modals/types.tsx b/met-web/src/components/common/Modals/types.tsx
index fd8bc0eb8..a147b9fff 100644
--- a/met-web/src/components/common/Modals/types.tsx
+++ b/met-web/src/components/common/Modals/types.tsx
@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
 
 export interface ModalSubtext {
-    text: string;
+    text: string | ReactNode;
     bold?: boolean;
 }
 
diff --git a/met-web/src/components/engagement/view/FailurePanel.tsx b/met-web/src/components/engagement/view/FailurePanel.tsx
index 54e63e525..2797b2da6 100644
--- a/met-web/src/components/engagement/view/FailurePanel.tsx
+++ b/met-web/src/components/engagement/view/FailurePanel.tsx
@@ -36,7 +36,10 @@ const FailurePanel = ({ email, handleClose, tryAgain, visibility }: FailurePanel
                 <MetBody>Please verify your email and try again.</MetBody>
             </Grid>
             <Grid item xs={12}>
-                <MetBody>If this problem persists, contact eao.epicsystem@gov.bc.ca</MetBody>
+                <MetBody>
+                    If this problem persists, contact{' '}
+                    <a href="mailto:eao.epicsystem@gov.bc.ca">eao.epicsystem@gov.bc.ca</a>
+                </MetBody>
             </Grid>
             <Grid item container xs={12} direction="row" justifyContent="flex-end" spacing={1} sx={{ mt: '1em' }}>
                 <Stack direction={{ xs: 'column', sm: 'row' }} spacing={1} width="100%" justifyContent="flex-end">
diff --git a/met-web/src/components/engagement/view/widgets/Subscribe/EmailListModal.tsx b/met-web/src/components/engagement/view/widgets/Subscribe/EmailListModal.tsx
index 9ba8d9db4..a8c2f6f8d 100644
--- a/met-web/src/components/engagement/view/widgets/Subscribe/EmailListModal.tsx
+++ b/met-web/src/components/engagement/view/widgets/Subscribe/EmailListModal.tsx
@@ -86,7 +86,12 @@ const EmailListModal = ({ open, setOpen }: { open: boolean; setOpen: (open: bool
                                 text: 'Please verify your email and try again.',
                             },
                             {
-                                text: 'If this problem persists, contact eao.epicsystem@gov.bc.ca',
+                                text: (
+                                    <>
+                                        If this problem persists, contact{' '}
+                                        <a href="mailto:eao.epicsystem@gov.bc.ca">eao.epicsystem@gov.bc.ca</a>
+                                    </>
+                                ),
                             },
                         ],
                     },
diff --git a/met-web/src/routes/NotFound.tsx b/met-web/src/routes/NotFound.tsx
index 1988883d7..e6e17e6bb 100644
--- a/met-web/src/routes/NotFound.tsx
+++ b/met-web/src/routes/NotFound.tsx
@@ -16,7 +16,10 @@ const SuggestionsList = () => (
                 Go to our <Link to="/">homepage</Link> and browse through our past and current engagements
             </li>
             <li style={listItemStyle}>Telephone Device for the Deaf (TDD) across B.C.: 711</li>
-            <li style={listItemStyle}>If you would like to email us, please contact eao.epicsystem@gov.bc.ca.</li>
+            <li style={listItemStyle}>
+                If you would like to email us, please contact{' '}
+                <a href="mailto:eao.epicsystem@gov.bc.ca">eao.epicsystem@gov.bc.ca</a>.
+            </li>
         </ul>
     </Box>
 );