Use internationalization feature for added text
GitLab: #81
Change-Id: Ie8c3b62545d954922f5c90387c5d361d07cb8cf2
diff --git a/client/src/components/AlertSnackbar.tsx b/client/src/components/AlertSnackbar.tsx
index c32eca8..287cd60 100644
--- a/client/src/components/AlertSnackbar.tsx
+++ b/client/src/components/AlertSnackbar.tsx
@@ -38,6 +38,10 @@
}}
>
<Alert severity={severity} {...alertProps}>
+ {/* For i18n-parser.
+ t('severity_error')
+ t('severity_success')
+ */}
<AlertTitle>{t(`severity_${severity}`)}</AlertTitle>
{children}
</Alert>
diff --git a/client/src/components/Input.tsx b/client/src/components/Input.tsx
index 063b350..db11fb6 100644
--- a/client/src/components/Input.tsx
+++ b/client/src/components/Input.tsx
@@ -28,6 +28,7 @@
} from '@mui/material';
import { styled } from '@mui/material/styles';
import { ChangeEvent, ReactElement, useCallback, useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
import { InfoButton, ToggleVisibilityButton } from './Button';
import RulesDialog from './RulesDialog';
@@ -60,6 +61,7 @@
tooltipTitle,
...props
}: InputProps) => {
+ const { t } = useTranslation();
const [isSelected, setIsSelected] = useState(false);
const [input, setInput] = useState(props.defaultValue);
const [startAdornment, setStartAdornment] = useState<ReactElement | undefined>();
@@ -89,13 +91,17 @@
return (
<>
- <RulesDialog openDialog={isDialogOpened} title="Username rules :" closeDialog={() => setIsDialogOpened(false)}>
+ <RulesDialog
+ openDialog={isDialogOpened}
+ title={t('username_rules_dialog_title')}
+ closeDialog={() => setIsDialogOpened(false)}
+ >
<UsernameRules />
</RulesDialog>
<TextField
{...props}
color={inputColor(props.error, success)}
- label={'Choose an identifier'}
+ label={t('username_input_label')}
variant="standard"
InputLabelProps={{ shrink: !!(isSelected || input) }}
onChange={onChange}
@@ -119,6 +125,7 @@
tooltipTitle,
...props
}: InputProps) => {
+ const { t } = useTranslation();
const [showPassword, setShowPassword] = useState(false);
const [isSelected, setIsSelected] = useState(false);
const [input, setInput] = useState(props.defaultValue);
@@ -153,13 +160,17 @@
return (
<>
- <RulesDialog openDialog={isDialogOpened} title="Password rules :" closeDialog={() => setIsDialogOpened(false)}>
+ <RulesDialog
+ openDialog={isDialogOpened}
+ title={t('password_rules_dialog_title')}
+ closeDialog={() => setIsDialogOpened(false)}
+ >
<PasswordRules />
</RulesDialog>
<TextField
{...props}
color={inputColor(props.error, success)}
- label="Password"
+ label={t('password_input_label')}
type={showPassword ? 'text' : 'password'}
variant="standard"
autoComplete="current-password"
@@ -257,73 +268,73 @@
}
const PasswordRules = () => {
+ const { t } = useTranslation();
+
return (
- <Typography variant="body1">
- <List>
- <ListItem>
- <ListItemIcon>
- <GppMaybe />
- </ListItemIcon>
- The password must contain at least 1 lowercase alphabetical character.
- </ListItem>
- <ListItem>
- <ListItemIcon>
- <GppMaybe />
- </ListItemIcon>
- The password must contain at least 1 uppercase alphabetical character.
- </ListItem>
- <ListItem>
- <ListItemIcon>
- <GppMaybe />
- </ListItemIcon>
- The password must contain at least 1 numeric character.
- </ListItem>
- <ListItem>
- <ListItemIcon>
- <GppMaybe />
- </ListItemIcon>
- The password must contain at least 1 special character.
- </ListItem>
- <ListItem>
- <ListItemIcon>
- <GppMaybe />
- </ListItemIcon>
- The password must be 10 characters or longer to be considered strong.
- </ListItem>
- </List>
- </Typography>
+ <List>
+ <ListItem>
+ <ListItemIcon>
+ <GppMaybe />
+ </ListItemIcon>
+ <Typography variant="body1">{t('password_rule_one')}</Typography>
+ </ListItem>
+ <ListItem>
+ <ListItemIcon>
+ <GppMaybe />
+ </ListItemIcon>
+ <Typography variant="body1">{t('password_rule_two')}</Typography>
+ </ListItem>
+ <ListItem>
+ <ListItemIcon>
+ <GppMaybe />
+ </ListItemIcon>
+ <Typography variant="body1">{t('password_rule_three')}</Typography>
+ </ListItem>
+ <ListItem>
+ <ListItemIcon>
+ <GppMaybe />
+ </ListItemIcon>
+ <Typography variant="body1">{t('password_rule_four')}</Typography>
+ </ListItem>
+ <ListItem>
+ <ListItemIcon>
+ <GppMaybe />
+ </ListItemIcon>
+ <Typography variant="body1">{t('password_rule_five')}</Typography>
+ </ListItem>
+ </List>
);
};
const UsernameRules = () => {
+ const { t } = useTranslation();
+
return (
- <Typography variant="body1">
- <List>
- <ListItem>
- <ListItemIcon>
- <Warning />
- </ListItemIcon>
- The username must be 3 to 32 characters long.
- </ListItem>
- <ListItem>
- <ListItemIcon>
- <Warning />
- </ListItemIcon>
- The username may contain lowercase and uppercase alphabetical characters.
- </ListItem>
- <ListItem>
- <ListItemIcon>
- <Warning />
- </ListItemIcon>
- The username may contain hyphens {'(-)'}.
- </ListItem>
- <ListItem>
- <ListItemIcon>
- <Warning />
- </ListItemIcon>
- The username may contain underscores {'(_)'}.
- </ListItem>
- </List>
- </Typography>
+ <List>
+ <ListItem>
+ <ListItemIcon>
+ <Warning />
+ </ListItemIcon>
+ <Typography variant="body1">{t('username_rule_one')}</Typography>
+ </ListItem>
+ <ListItem>
+ <ListItemIcon>
+ <Warning />
+ </ListItemIcon>
+ <Typography variant="body1">{t('username_rule_two')}</Typography>
+ </ListItem>
+ <ListItem>
+ <ListItemIcon>
+ <Warning />
+ </ListItemIcon>
+ <Typography variant="body1">{t('username_rule_three')}</Typography>
+ </ListItem>
+ <ListItem>
+ <ListItemIcon>
+ <Warning />
+ </ListItemIcon>
+ <Typography variant="body1">{t('username_rule_four')}</Typography>
+ </ListItem>
+ </List>
);
};
diff --git a/client/src/components/JamiWelcomeLogo.tsx b/client/src/components/JamiWelcomeLogo.tsx
index 31311b6..8e66172 100644
--- a/client/src/components/JamiWelcomeLogo.tsx
+++ b/client/src/components/JamiWelcomeLogo.tsx
@@ -16,6 +16,7 @@
* <https://www.gnu.org/licenses/>.
*/
import { Stack, StackProps, Typography } from '@mui/material';
+import { useTranslation } from 'react-i18next';
import { ReactComponent as JamiLogo } from '../icons/jami-logo-icon.svg';
import { jamiLogoDefaultSize } from '../utils/constants';
@@ -26,6 +27,8 @@
}
export default function JamiWelcomeLogo({ logoWidth, logoHeight, ...stackProps }: WelcomeLogoProps) {
+ const { t } = useTranslation();
+
return (
<Stack
{...stackProps}
@@ -37,7 +40,7 @@
}}
>
<JamiLogo width={logoWidth ?? jamiLogoDefaultSize} height={logoHeight ?? jamiLogoDefaultSize} />
- <Typography variant="h1">Welcome to Jami!</Typography>
+ <Typography variant="h1">{t('welcome_text')}</Typography>
</Stack>
);
}
diff --git a/client/src/components/RulesDialog.tsx b/client/src/components/RulesDialog.tsx
index 5e1e929..3b65f33 100644
--- a/client/src/components/RulesDialog.tsx
+++ b/client/src/components/RulesDialog.tsx
@@ -16,6 +16,7 @@
* <https://www.gnu.org/licenses/>.
*/
import { Button, Dialog, DialogActions, DialogContent, DialogTitle } from '@mui/material';
+import { useTranslation } from 'react-i18next';
interface RulesDialogProps {
openDialog: boolean;
@@ -25,6 +26,8 @@
}
export default function RulesDialog(props: RulesDialogProps) {
+ const { t } = useTranslation();
+
return (
<Dialog open={props.openDialog} onClose={props.closeDialog}>
<DialogTitle>
@@ -34,7 +37,7 @@
<DialogContent>{props.children}</DialogContent>
<DialogActions>
<Button onClick={props.closeDialog} autoFocus>
- Close
+ {t('dialog_close')}
</Button>
</DialogActions>
</Dialog>
diff --git a/client/src/components/welcome.jsx b/client/src/components/welcome.jsx
index 9f3978d..66edb9f 100644
--- a/client/src/components/welcome.jsx
+++ b/client/src/components/welcome.jsx
@@ -18,6 +18,7 @@
import { Container } from '@mui/material';
import { AnimatePresence, motion } from 'framer-motion';
import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
import { ReactComponent as JamiLogo } from '../icons/jami-logo-icon.svg';
@@ -37,6 +38,7 @@
};
export default function WelcomeAnimation(props) {
+ const { t } = useTranslation();
const [visible, setVisible] = useState(true);
return (
@@ -59,7 +61,7 @@
<motion.div variants={item}>
<JamiLogo width="95%" />
</motion.div>
- <motion.h1 variants={item}>Welcome to Jami</motion.h1>
+ <motion.h1 variants={item}>{t('welcome_text')}</motion.h1>
</motion.div>
)}
</AnimatePresence>
diff --git a/client/src/locale/en/translation.json b/client/src/locale/en/translation.json
index 18bbf31..7933acc 100644
--- a/client/src/locale/en/translation.json
+++ b/client/src/locale/en/translation.json
@@ -1,4 +1,8 @@
{
+ "share_screen": "Share your screen",
+ "share_screen_area": "Share an area of your screen",
+ "share_file": "Share a file",
+ "dummy_option_string": "Test option",
"conversation_message": "Message",
"conversation_start_audiocall": "Start audio call",
"conversation_start_videocall": "Start video call",
@@ -11,47 +15,58 @@
"conversation_title_three": "{{member0}}, {{member1}} and {{member2}}",
"conversation_title_four": "{{member0}}, {{member1}}, {{member2}}, +1 other member",
"conversation_title_more": "{{member0}}, {{member1}}, {{member2}}, +{{excess}} other members",
-
+ "username_rules_dialog_title": "Username rules",
+ "username_input_label": "Choose an identifier",
+ "password_rules_dialog_title": "Password rules",
+ "password_input_label": "Password",
+ "password_rule_one": "The password must contain at least 1 lowercase alphabetical character.",
+ "password_rule_two": "The password must contain at least 1 uppercase alphabetical character.",
+ "password_rule_three": "The password must contain at least 1 numeric character.",
+ "password_rule_four": "The password must contain at least 1 special character.",
+ "password_rule_five": "The password must be 10 characters or longer to be considered strong.",
+ "username_rule_one": "The username must be 3 to 32 characters long.",
+ "username_rule_two": "The username may contain lowercase and uppercase alphabetical characters.",
+ "username_rule_three": "The username may contain hyphens (-).",
+ "username_rule_four": "The username may contain underscores (_).",
+ "welcome_text": "Welcome to Jami!",
"message_call_outgoing_missed": "Missed outgoing call",
"message_call_incoming_missed": "Missed incoming call",
"message_call_outgoing": "Outgoing call - {{duration}}",
"message_call_incoming": "Incoming call - {{duration}}",
-
"message_swarm_created": "Swarm created",
"message_user_joined": "{{user}} joined",
-
+ "dialog_close": "Close",
"message_input_placeholder_one": "Write to {{member0}}",
"message_input_placeholder_two": "Write to {{member0}} and {{member1}}",
"message_input_placeholder_three": "Write to {{member0}}, {{member1}} and {{member2}}",
"message_input_placeholder_four": "Write to {{member0}}, {{member1}}, {{member2}}, +1 other member",
"message_input_placeholder_more": "Write to {{member0}}, {{member1}}, {{member2}}, +{{excess}} other members",
-
- "messages_scroll_to_end": "Scroll to the end of the conversation",
-
- "username_input_default_helper_text": "",
- "username_input_success_helper_text": "Username available",
- "username_input_taken_helper_text": "Username already taken",
- "username_input_invalid_helper_text": "Username doesn't follow required pattern",
- "username_input_registration_failed_helper_text": "Username not correct!",
-
- "password_input_default_helper_text": "",
- "password_input_too_weak_helper_text": "Too weak",
- "password_input_weak_helper_text": "Weak",
- "password_input_medium_helper_text": "Medium",
- "password_input_strong_helper_text": "Strong",
- "password_input_registration_failed_helper_text": "Choose another password!",
-
"login_username_not_found": "Username not found",
"login_invalid_password": "Incorrect password",
-
- "severity_error": "Error",
- "severity_success": "Success",
+ "login_form_title": "LOGIN",
+ "login_form_username_tooltip": "The username you registered with",
+ "login_form_password_tooltip": "The password you registered with",
+ "login_form_submit_button": "LOG IN",
+ "login_form_to_registration_text": "Need an account?",
+ "login_form_to_registration_link": "REGISTER",
"registration_success": "You've successfully registered! — Logging you in...",
-
- "share_screen": "Share your screen",
- "share_window": "Share window",
- "share_screen_area": "Share an area of your screen",
- "share_file": "Share a file",
-
- "dummy_option_string": "Test option"
+ "registration_form_title": "REGISTRATION",
+ "username_input_helper_text": "",
+ "registration_form_username_tooltip": "Username may be from 3 to 32 chraracters long and contain a-z, A-Z, -, _\n\nClick for more details",
+ "password_input_helper_text": "",
+ "registration_form_password_tooltip": "Choose a password hard to guess for others but easy to remember for you, it must be at least 10 characters. Your account won't be recovered if you forget it!\n\nClick for more details",
+ "registration_form_submit_button": "REGISTER",
+ "registration_form_to_login_text": "Already have an account?",
+ "registration_form_to_login_link": "LOG IN",
+ "username_input_helper_text_success": "Username available",
+ "username_input_helper_text_taken": "Username already taken",
+ "username_input_helper_text_invalid": "Username doesn't follow required pattern",
+ "username_input_helper_text_registration_failed": "Username not correct!",
+ "password_input_helper_text_too_weak": "Too weak",
+ "password_input_helper_text_weak": "Weak",
+ "password_input_helper_text_medium": "Medium",
+ "password_input_helper_text_strong": "Strong",
+ "password_input_helper_text_registration_failed": "Choose another password!",
+ "severity_error": "Error",
+ "severity_success": "Success"
}
diff --git a/client/src/locale/en/translation_old.json b/client/src/locale/en/translation_old.json
deleted file mode 100644
index a1a3e9a..0000000
--- a/client/src/locale/en/translation_old.json
+++ /dev/null
@@ -1,15 +0,0 @@
-{
- "password_input_default_helper_text": "",
- "password_input_medium_helper_text": "Medium",
- "password_input_registration_failed_helper_text": "Choose another password!",
- "password_input_strong_helper_text": "Strong",
- "password_input_too_weak_helper_text": "Too weak",
- "password_input_weak_helper_text": "Weak",
- "severity_error": "Error",
- "severity_success": "Success",
- "username_input_default_helper_text": "",
- "username_input_invalid_helper_text": "Username doesn't follow required pattern",
- "username_input_registration_failed_helper_text": "Username not correct!",
- "username_input_success_helper_text": "Username available",
- "username_input_taken_helper_text": "Username already taken"
-}
diff --git a/client/src/locale/fr/translation.json b/client/src/locale/fr/translation.json
index 44f747c..5d9c556 100644
--- a/client/src/locale/fr/translation.json
+++ b/client/src/locale/fr/translation.json
@@ -1,4 +1,8 @@
{
+ "share_screen": "Partager votre écran",
+ "share_screen_area": "Partager une partie de l'écran",
+ "share_file": "Partager le fichier",
+ "dummy_option_string": "Option test",
"conversation_message": "Envoyer un message",
"conversation_start_audiocall": "Démarrer appel audio",
"conversation_start_videocall": "Démarrer appel vidéo",
@@ -11,27 +15,58 @@
"conversation_title_three": "{{member0}}, {{member1}} et {{member2}}",
"conversation_title_four": "{{member0}}, {{member1}}, {{member2}}, +1 autre membre",
"conversation_title_more": "{{member01}}, {{member1}}, {{member2}}, +{{excess}} autres membres",
-
+ "username_rules_dialog_title": "Règles du nom d'utilisateur",
+ "username_input_label": "Choisir un identifiant",
+ "password_rules_dialog_title": "Règles du mot de passe",
+ "password_input_label": "Mot de passe",
+ "password_rule_one": "Le mot de passe doit contenir au moins 1 caractère alphabétique minuscule.",
+ "password_rule_two": "Le mot de passe doit contenir au moins 1 caractère alphabétique majuscule.",
+ "password_rule_three": "Le mot de passe doit contenir au moins 1 caractère numérique.",
+ "password_rule_four": "Le mot de passe doit contenir au moins 1 caractère spécial.",
+ "password_rule_five": "Le mot de passe doit avoir au moins 10 caractères pour être considéré fort.",
+ "username_rule_one": "Le nom d'utilisateur doit avoir de 3 à 32 caractères.",
+ "username_rule_two": "Le nom d'utilisateur peut contenir des caractères alphabétiques minuscules et majuscules.",
+ "username_rule_three": "Le nom d'utilisateur peut contenir des tirets (-).",
+ "username_rule_four": "Le nom d'utilisateur peut contenir des tirets bas (_).",
+ "welcome_text": "Bienvenue sur Jami!",
"message_call_outgoing_missed": "Appel sortant manqué",
"message_call_incoming_missed": "Appel entrant manqué",
"message_call_outgoing": "Appel entrant - {{duration}}",
"message_call_incoming": "Appel sortant - {{duration}}",
-
"message_swarm_created": "Le Swarm a été créé",
"message_user_joined": "{{user}} s'est joint",
-
+ "dialog_close": "Fermer",
"message_input_placeholder_one": "Écrire à {{member0}}",
"message_input_placeholder_two": "Écrire à {{member0}} et {{member1}}",
"message_input_placeholder_three": "Écrire à {{member0}}, {{member1}} et {{member2}}",
"message_input_placeholder_four": "Écrire à {{member0}}, {{member1}}, {{member2}}, +1 autre membre",
- "message_input_placeholder_more": "Écrire à {{member0}}, {{member1}}, {{member2}}, +{{excess}} autres membres",
-
- "messages_scroll_to_end": "Faire défiler jusqu'à la fin de la conversation",
-
- "share_screen": "Partager votre écran",
- "share_window": "Partager la fenêtre",
- "share_screen_area": "Partager une partie de l'écran",
- "share_file": "Partager le fichier",
-
- "dummy_option_string": "Option test"
+ "message_input_placeholder_more": "Écrire à {{member01}}, {{member1}}, {{member2}}, +{{excess}} autres membres",
+ "login_username_not_found": "Nom d'utilisateur introuvable",
+ "login_invalid_password": "Mot de passe incorrect",
+ "login_form_title": "CONNEXION",
+ "login_form_username_tooltip": "Le nom d'utilisateur avec lequel vous vous êtes inscrit(e)",
+ "login_form_password_tooltip": "Le mot de passe avec lequel vous vous êtes inscrit(e)",
+ "login_form_submit_button": "SE CONNECTER",
+ "login_form_to_registration_text": "Besoin d'un compte?",
+ "login_form_to_registration_link": "S'INSCRIRE",
+ "registration_success": "Inscription réussie! — Connexion en cours...",
+ "registration_form_title": "INSCRIPTION",
+ "username_input_helper_text": "",
+ "registration_form_username_tooltip": "Le nom d'utilisateur doit avoir de 3 à 32 caractères et contenir a-z, A-Z, -, _\n\nCliquer pour plus de détails",
+ "password_input_helper_text": "",
+ "registration_form_password_tooltip": "Choisissez un mot de passe difficile à deviner pour les autres, mais facile à retenir pour vous, il doit avoir au moins 10 caractères. Votre compte ne sera pas récupéré si vous l'oubliez!\n\nCliquer pour plus de détails",
+ "registration_form_submit_button": "S'INSCRIRE",
+ "registration_form_to_login_text": "Déjà inscrit?",
+ "registration_form_to_login_link": "SE CONNECTER",
+ "username_input_helper_text_success": "Nom d'utilisateur disponible",
+ "username_input_helper_text_taken": "Nom d'utilisateur déjà pris",
+ "username_input_helper_text_invalid": "Le nom d'utilisateur ne suit pas le modèle",
+ "username_input_helper_text_registration_failed": "Nom d'utilisateur incorrect!",
+ "password_input_helper_text_too_weak": "Trop faible",
+ "password_input_helper_text_weak": "Faible",
+ "password_input_helper_text_medium": "Moyen",
+ "password_input_helper_text_strong": "Fort",
+ "password_input_helper_text_registration_failed": "Choisissez un autre mot de passe!",
+ "severity_error": "Erreur",
+ "severity_success": "Succès"
}
diff --git a/client/src/pages/JamiLogin.tsx b/client/src/pages/JamiLogin.tsx
index 06a607b..5cd2917 100644
--- a/client/src/pages/JamiLogin.tsx
+++ b/client/src/pages/JamiLogin.tsx
@@ -97,7 +97,7 @@
>
<Box sx={{ mt: theme.typography.pxToRem(50), mb: theme.typography.pxToRem(20) }}>
<Typography component={'span'} variant="h2">
- LOGIN
+ {t('login_form_title')}
</Typography>
</Box>
@@ -105,14 +105,14 @@
<div>
<UsernameInput
onChange={handleUsername}
- tooltipTitle={'The username you registered with'}
+ tooltipTitle={t('login_form_username_tooltip')}
sx={{ width: theme.typography.pxToRem(inputWidth) }}
/>
</div>
<div>
<PasswordInput
onChange={handlePassword}
- tooltipTitle={'The password you registered with'}
+ tooltipTitle={t('login_form_password_tooltip')}
sx={{ width: theme.typography.pxToRem(inputWidth) }}
/>
</div>
@@ -123,15 +123,15 @@
onClick={authenticateUser}
sx={{ width: theme.typography.pxToRem(inputWidth), mt: theme.typography.pxToRem(20) }}
>
- LOG IN
+ {t('login_form_submit_button')}
</Button>
</Form>
<Box sx={{ mt: theme.typography.pxToRem(50), mb: theme.typography.pxToRem(50) }}>
<Typography variant="body1">
- Need an account ?
+ {t('login_form_to_registration_text')}
<a href="" onClick={register}>
- REGISTER
+ {t('login_form_to_registration_link')}
</a>
</Typography>
</Box>
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 ?
+ {t('registration_form_to_login_text')}
<a href="" onClick={login}>
- LOG IN
+ {t('registration_form_to_login_link')}
</a>
</Typography>
</Box>