diff --git a/src/Pages/About/index.jsx b/src/Pages/About/index.jsx index 84b90af55..dcb9d3f43 100644 --- a/src/Pages/About/index.jsx +++ b/src/Pages/About/index.jsx @@ -1,12 +1,15 @@ import React from 'react'; import AppBar from '../../Components/Common/AppBar'; import Footer from '../../Components/Common/Footer'; +import { useTranslation } from "react-i18next"; const AboutUs = () => { + const { t } = useTranslation(); + return (
-

About Us

+

{t("aboutus")}

); diff --git a/src/Pages/Auth/CheckEmail.jsx b/src/Pages/Auth/CheckEmail.jsx index 7d7a6af64..695be62b0 100644 --- a/src/Pages/Auth/CheckEmail.jsx +++ b/src/Pages/Auth/CheckEmail.jsx @@ -5,6 +5,7 @@ import { useDispatch } from "react-redux"; import { useNavigate } from "react-router"; import { createToast } from "../../Utils/toastUtils"; import { forgotPassword } from "../../Features/Auth/authSlice"; +import { useTranslation } from "react-i18next"; import Background from "../../assets/Images/background-grid.svg?react"; import EmailIcon from "../../assets/icons/email.svg?react"; import Logo from "../../assets/icons/checkmate-icon.svg?react"; @@ -15,6 +16,7 @@ const CheckEmail = () => { const theme = useTheme(); const navigate = useNavigate(); const dispatch = useDispatch(); + const { t } = useTranslation(); const [email, setEmail] = useState(); const [disabled, setDisabled] = useState(false); @@ -161,9 +163,9 @@ const CheckEmail = () => { - Check your email + {t("authCheckEmailTitle")} - We sent a password reset link to{" "} + {t("authCheckEmailDescription")}{" "} { maxWidth: 400, }} > - Open email app + {t("authCheckEmailOpenEmailButton")} - Didn't receive the email?{" "} + {t("authCheckEmailDidntReceiveEmail")}{" "} - Click to resend + {t("authCheckEmailClickToResend")} @@ -205,15 +207,15 @@ const CheckEmail = () => { textAlign="center" p={theme.spacing(12)} > - Go back to — + {t("goBackTo")} - Log In + {t("authLoginTitle")} diff --git a/src/Pages/Auth/ForgotPassword.jsx b/src/Pages/Auth/ForgotPassword.jsx index 61234db73..a67f67c14 100644 --- a/src/Pages/Auth/ForgotPassword.jsx +++ b/src/Pages/Auth/ForgotPassword.jsx @@ -11,6 +11,7 @@ import Logo from "../../assets/icons/checkmate-icon.svg?react"; import Key from "../../assets/icons/key.svg?react"; import Background from "../../assets/Images/background-grid.svg?react"; import IconBox from "../../Components/IconBox"; +import { useTranslation } from "react-i18next"; import "./index.css"; const ForgotPassword = () => { @@ -29,6 +30,8 @@ const ForgotPassword = () => { email && setForm({ email: sessionStorage.getItem("email") }); }, []); + const { t } = useTranslation(); + const handleSubmit = async (event) => { event.preventDefault(); @@ -162,7 +165,7 @@ const ForgotPassword = () => { - Forgot password? + {t("authForgotPasswordTitle")} No worries, we'll send you reset instructions. { mt: theme.spacing(15), }} > - Send instructions + {t("continue")} @@ -204,15 +207,15 @@ const ForgotPassword = () => { textAlign="center" p={theme.spacing(12)} > - Go back to — + {t("goBackTo")} - Log In + {t("authLoginTitle")} diff --git a/src/Pages/Auth/NewPasswordConfirmed.jsx b/src/Pages/Auth/NewPasswordConfirmed.jsx index 6258e0fa5..6667b1ace 100644 --- a/src/Pages/Auth/NewPasswordConfirmed.jsx +++ b/src/Pages/Auth/NewPasswordConfirmed.jsx @@ -8,12 +8,14 @@ import Background from "../../assets/Images/background-grid.svg?react"; import ConfirmIcon from "../../assets/icons/check-outlined.svg?react"; import Logo from "../../assets/icons/checkmate-icon.svg?react"; import IconBox from "../../Components/IconBox"; +import { useTranslation } from "react-i18next"; import "./index.css"; const NewPasswordConfirmed = () => { const theme = useTheme(); const navigate = useNavigate(); const dispatch = useDispatch(); + const { t } = useTranslation(); const handleNavigate = () => { dispatch(clearAuthState()); @@ -97,9 +99,9 @@ const NewPasswordConfirmed = () => { - Password reset + {t("passwordreset")} - Your password has been successfully reset. Click below to log in magically. + {t("authNewPasswordConfirmed")} @@ -118,7 +120,7 @@ const NewPasswordConfirmed = () => { textAlign="center" p={theme.spacing(12)} > - Go back to — + {t("goBack-")} { onClick={handleNavigate} sx={{ userSelect: "none" }} > - Log In + {t("authLoginTitle")} diff --git a/src/locales/gb.json b/src/locales/gb.json index cf7711fa8..c3d36d352 100644 --- a/src/locales/gb.json +++ b/src/locales/gb.json @@ -1,5 +1,6 @@ { "dontHaveAccount": "Don't have account", + "aboutus": "About Us", "email": "E-mail", "forgotPassword": "Forgot Password", "password": "password", @@ -16,6 +17,7 @@ "commonBack": "Back", "authForgotPasswordTitle": "Forgot password?", "authForgotPasswordResetPassword": "Reset password", + "passwordreset": "Password Reset", "authRegisterAlreadyHaveAccount": "Already have an account?", "commonAppName": "Checkmate", "authLoginEnterEmail": "Enter your email", @@ -30,9 +32,10 @@ "authForgotPasswordSendInstructions": "Send instructions", "authForgotPasswordBackTo": "Back to", "authCheckEmailTitle": "Check your email", - "authCheckEmailDescription": "We sent a password reset link to {{email}}", + "authCheckEmailDescription": "We sent a password reset link to", "authCheckEmailResendEmail": "Resend email", "authCheckEmailBackTo": "Back to", + "authCheckEmailOpenEmailButton": "Open email app", "goBackTo": "Go back to", "authCheckEmailDidntReceiveEmail": "Didn't receive the email?", "authCheckEmailClickToResend": "Click to resend", @@ -42,6 +45,7 @@ "authSetNewPasswordConfirmPassword": "Confirm password", "confirmPassword": "Confirm your password", "authSetNewPasswordResetPassword": "Reset password", + "authNewPasswordConfirmed": "Your password has been successfully reset. Click below to log in magically.", "authSetNewPasswordBackTo": "Back to", "authPasswordMustBeAtLeast": "Must be at least", "authPasswordCharactersLong": "8 characters long",