fix(i18n): Set the site_name in i18n to the configured value

i18n/en_US.yaml

@@ -638,7 +638,7 @@ ui:
       msg:
         empty: Email cannot be empty.
   change_email:
-    page_title: Welcome to Answer
+    page_title: Welcome to {{site_name}}
     btn_cancel: Cancel
     btn_update: Update email address
     send_success: >-
@@ -838,7 +838,7 @@ ui:
   modal_confirm:
     title: Error...
   account_result:
-    page_title: Welcome to Answer
+    page_title: Welcome to {{site_name}}
     success: Your new account is confirmed; you will be redirected to the home page.
     link: Continue to homepage
     invalid: >-

ui/src/pages/Users/ActivationResult/index.tsx

@@ -3,10 +3,12 @@ import { Container, Row, Col } from 'react-bootstrap';
 import { Link, useLocation } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 
+import { siteInfoStore } from '@/stores';
 import { usePageTags } from '@/hooks';
 
 const Index: FC = () => {
   const { t } = useTranslation('translation', { keyPrefix: 'account_result' });
+  const siteName = siteInfoStore((state) => state.siteInfo.name);
   const location = useLocation();
   usePageTags({
     title: t('account_activation', { keyPrefix: 'page_title' }),
@@ -15,7 +17,9 @@ const Index: FC = () => {
     <Container className="pt-4 mt-2 mb-5">
       <Row className="justify-content-center">
         <Col lg={6}>
-          <h3 className="text-center mt-3 mb-5">{t('page_title')}</h3>
+          <h3 className="text-center mt-3 mb-5">
+            {t('page_title', { site_name: siteName })}
+          </h3>
           {location.pathname?.includes('success') && (
             <>
               <p className="text-center">{t('success')}</p>

ui/src/pages/Users/ChangeEmail/index.tsx

@@ -2,18 +2,22 @@ import { FC, memo } from 'react';
 import { Container, Col } from 'react-bootstrap';
 import { useTranslation } from 'react-i18next';
 
+import { siteInfoStore } from '@/stores';
 import { usePageTags } from '@/hooks';
 
 import SendEmail from './components/sendEmail';
 
 const Index: FC = () => {
   const { t } = useTranslation('translation', { keyPrefix: 'change_email' });
+  const siteName = siteInfoStore((state) => state.siteInfo.name);
   usePageTags({
     title: t('change_email', { keyPrefix: 'page_title' }),
   });
   return (
     <Container style={{ paddingTop: '4rem', paddingBottom: '6rem' }}>
-      <h3 className="text-center mb-5">{t('page_title')}</h3>
+      <h3 className="text-center mb-5">
+        {t('page_title', { site_name: siteName })}
+      </h3>
       <Col className="mx-auto" md={3}>
         <SendEmail />
       </Col>

ui/src/pages/Users/ConfirmNewEmail/index.tsx

@@ -4,7 +4,7 @@ import { Link, useSearchParams } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 
 import { usePageTags } from '@/hooks';
-import { loggedUserInfoStore } from '@/stores';
+import { loggedUserInfoStore, siteInfoStore } from '@/stores';
 import { changeEmailVerify, getLoggedUserInfo } from '@/services';
 
 const Index: FC = () => {
@@ -13,6 +13,7 @@ const Index: FC = () => {
   const [step, setStep] = useState('loading');
 
   const updateUser = loggedUserInfoStore((state) => state.update);
+  const siteName = siteInfoStore((state) => state.siteInfo.name);
 
   useEffect(() => {
     const code = searchParams.get('code');
@@ -38,7 +39,9 @@ const Index: FC = () => {
     <Container className="pt-4 mt-2 mb-5">
       <Row className="justify-content-center">
         <Col lg={6}>
-          <h3 className="text-center mt-3 mb-5">{t('page_title')}</h3>
+          <h3 className="text-center mt-3 mb-5">
+            {t('page_title', { site_name: siteName })}
+          </h3>
           {step === 'success' && (
             <>
               <p className="text-center">{t('confirm_new_email')}</p>