commit 559cc80af7670756f15128cd55e2a4672ea21d86
author Michelle Sepkap Sime <simemichelle01@gmail.com> Sat Nov 05 12:06:40 2022 -0400
committer Michelle Sepkap Sime <simemichelle01@gmail.com> Wed Nov 09 17:18:00 2022 -0500
tree 5ad41817ef5a1bf26142fcc222a77e5b6c39eba4
parent 8321a0d39be205292143f2e7474d8fc2e2d58b2f

Use internationalization feature for added text

GitLab: #81
Change-Id: Ie8c3b62545d954922f5c90387c5d361d07cb8cf2

client/src/pages/JamiRegistration.tsx

diff --git a/client/src/pages/JamiRegistration.tsx b/client/src/pages/JamiRegistration.tsx
index 2e8d23d..71c38bd 100644
--- a/client/src/pages/JamiRegistration.tsx
+++ b/client/src/pages/JamiRegistration.tsx
@@ -35,15 +35,6 @@
 import { inputWidth, jamiUsernamePattern } from '../utils/constants';
 import { InvalidPassword, UsernameNotFound } from '../utils/errors';
 
-const usernameTooltipTitle =
-  'Choose a password hard to guess for others but easy to remember for you, ' +
-  'it must be at least 8 characters. ' +
-  "Your account won't be recovered if you forget it!\n\n" +
-  'Click for more details';
-
-const passwordTooltipTitle =
-  'Username may be from 3 to 32 chraracters long and contain a-z, A-Z, -, _\n\n' + 'Click for more details';
-
 type NameStatus = 'default' | 'success' | 'taken' | 'invalid' | 'registration_failed';
 type PasswordStatus = StrengthValueCode | 'registration_failed';
 
@@ -184,31 +175,46 @@
       >
         <Box sx={{ mt: theme.typography.pxToRem(50), mb: theme.typography.pxToRem(20) }}>
           <Typography component={'span'} variant="h2">
-            REGISTRATION
+            {t('registration_form_title')}
           </Typography>
         </Box>
 
         <Form method="post" id="register-form">
           <div>
+            {/* For i18n-parser.
+              t('username_input_helper_text_default')
+              t('username_input_helper_text_success')
+              t('username_input_helper_text_taken')
+              t('username_input_helper_text_invalid')
+              t('username_input_helper_text_registration_failed')
+            */}
             <UsernameInput
               value={username}
               onChange={handleUsername}
               error={usernameError}
               success={usernameSuccess}
-              helperText={t(`username_input_${usernameStatus}_helper_text`)}
+              helperText={usernameStatus === 'default' ? '' : t(`username_input_helper_text_${usernameStatus}`)}
               sx={{ width: theme.typography.pxToRem(inputWidth) }}
-              tooltipTitle={usernameTooltipTitle}
+              tooltipTitle={t('registration_form_username_tooltip')}
             />
           </div>
           <div>
+            {/* For i18n-parser.
+              t('password_input_helper_text_default')
+              t('password_input_helper_text_too_weak')
+              t('password_input_helper_text_weak')
+              t('password_input_helper_text_medium')
+              t('password_input_helper_text_strong')
+              t('password_input_helper_text_registration_failed')
+            */}
             <PasswordInput
               value={password}
               onChange={handlePassword}
               error={passwordError}
               success={passwordSuccess}
-              helperText={t(`password_input_${passwordStatus}_helper_text`)}
+              helperText={passwordStatus === 'default' ? '' : t(`password_input_helper_text_${passwordStatus}`)}
               sx={{ width: theme.typography.pxToRem(inputWidth) }}
-              tooltipTitle={passwordTooltipTitle}
+              tooltipTitle={t('registration_form_password_tooltip')}
             />
           </div>
 
@@ -218,15 +224,15 @@
             onClick={handleSubmit}
             sx={{ width: theme.typography.pxToRem(inputWidth), mt: theme.typography.pxToRem(20) }}
           >
-            REGISTER
+            {t('registration_form_submit_button')}
           </Button>
         </Form>
 
         <Box sx={{ mt: theme.typography.pxToRem(50), mb: theme.typography.pxToRem(50) }}>
           <Typography variant="body1">
-            Already have an account ? &nbsp;
+            {t('registration_form_to_login_text')} &nbsp;
             <a href="" onClick={login}>
-              LOG IN
+              {t('registration_form_to_login_link')}
             </a>
           </Typography>
         </Box>