Add translations for PasswordPanel component in all locale files

client/src/Components/TabPanels/Account/PasswordPanel.jsx

@@ -94,7 +94,7 @@ const PasswordPanel = () => {
 			const action = await dispatch(update({ localData }));
 			if (action.payload.success) {
 				createToast({
-					body: "Your password was changed successfully.",
+					body: t("passwordPanel.passwordChangedSuccess", "Your password was changed successfully."),
 				});
 				setLocalData({
 					password: "",
@@ -104,7 +104,7 @@ const PasswordPanel = () => {
 			} else {
 				// TODO: Check for other errors?
 				createToast({
-					body: "Your password input was incorrect.",
+					body: t("passwordPanel.passwordInputIncorrect", "Your password input was incorrect."),
 				});
 				setErrors({ password: "*" + action.payload.msg + "." });
 			}
@@ -148,12 +148,12 @@ const PasswordPanel = () => {
 						component="h1"
 						width="20ch"
 					>
-						Current password
+						{t("passwordPanel.currentPassword", "Current password")}
 					</Typography>
 					<TextInput
 						type="password"
 						id="edit-current-password"
-						placeholder="Enter your current password"
+						placeholder={t("passwordPanel.enterCurrentPassword", "Enter your current password")}
 						autoComplete="current-password"
 						value={localData.password}
 						onChange={handleChange}
@@ -173,13 +173,13 @@ const PasswordPanel = () => {
 						component="h1"
 						width="20ch"
 					>
-						New password
+						{t("passwordPanel.newPassword", "New password")}
 					</Typography>
 
 					<TextInput
 						type="password"
 						id="edit-new-password"
-						placeholder="Enter your new password"
+						placeholder={t("passwordPanel.enterNewPassword", "Enter your new password")}
 						autoComplete="new-password"
 						value={localData.newPassword}
 						onChange={handleChange}
@@ -199,13 +199,13 @@ const PasswordPanel = () => {
 						component="h1"
 						width="20ch"
 					>
-						Confirm new password
+						{t("passwordPanel.confirmNewPassword", "Confirm new password")}
 					</Typography>
 
 					<TextInput
 						type="password"
 						id="edit-confirm-password"
-						placeholder={t("confirmPassword")}
+						placeholder={t("confirmPassword", "Confirm password")}
 						autoComplete="new-password"
 						value={localData.confirm}
 						onChange={handleChange}
@@ -219,7 +219,7 @@ const PasswordPanel = () => {
 					<Box sx={{ maxWidth: "70ch" }}>
 						<Alert
 							variant="warning"
-							body="New password must contain at least 8 characters and must have at least one uppercase letter, one lowercase letter, one number and one special character."
+							body={t("passwordPanel.passwordRequirements", "New password must contain at least 8 characters and must have at least one uppercase letter, one lowercase letter, one number and one special character.")}
 						/>
 					</Box>
 				)}
@@ -232,7 +232,7 @@ const PasswordPanel = () => {
 						color="accent"
 						type="submit"
 						loading={isLoading}
-						loadingIndicator="Saving..."
+						loadingIndicator={t("passwordPanel.saving", "Saving...")}
 						disabled={
 							Object.keys(errors).length > 0 ||
 							Object.values(localData).filter((value) => value === "").length > 0
@@ -242,7 +242,7 @@ const PasswordPanel = () => {
 							mt: theme.spacing(20),
 						}}
 					>
-						Save
+						{t("commonSave", "Save")}
 					</Button>
 				</Stack>
 			</Stack>

client/src/Pages/Account/index.jsx

@@ -8,6 +8,7 @@ import TabContext from "@mui/lab/TabContext";
 import ProfilePanel from "../../Components/TabPanels/Account/ProfilePanel";
 import PasswordPanel from "../../Components/TabPanels/Account/PasswordPanel";
 import TeamPanel from "../../Components/TabPanels/Account/TeamPanel";
+import { useTranslation } from "react-i18next";
 import "./index.css";
 
 /**
@@ -24,24 +25,34 @@ const Account = ({ open = "profile" }) => {
 		navigate(`/account/${newTab}`);
 	};
 	const { user } = useSelector((state) => state.auth);
+	const { t } = useTranslation();
 
 	const requiredRoles = ["superadmin", "admin"];
-	let tabList = ["Profile", "Password", "Team"];
+	let tabList = [
+		{ name: t("menu.profile"), value: "profile" },
+		{ name: t("menu.password"), value: "password" },
+		{ name: t("menu.team"), value: "team" }
+	];
 	const hideTeams = !requiredRoles.some((role) => user.role.includes(role));
 	if (hideTeams) {
-		tabList = ["Profile", "Password"];
+		tabList = [
+			{ name: t("menu.profile"), value: "profile" },
+			{ name: t("menu.password"), value: "password" }
+		];
 	}
 
 	// Remove password for demo
 	if (user.role.includes("demo")) {
-		tabList = ["Profile"];
+		tabList = [
+			{ name: t("menu.profile"), value: "profile" }
+		];
 	}
 
 	const handleKeyDown = (event) => {
-		const currentIndex = tabList.findIndex((label) => label.toLowerCase() === tab);
+		const currentIndex = tabList.findIndex((item) => item.value === tab);
 		if (event.key === "Tab") {
 			const nextIndex = (currentIndex + 1) % tabList.length;
-			setFocusedTab(tabList[nextIndex].toLowerCase());
+			setFocusedTab(tabList[nextIndex].value);
 		} else if (event.key === "Enter") {
 			event.preventDefault();
 			navigate(`/account/${focusedTab}`);
@@ -60,13 +71,13 @@ const Account = ({ open = "profile" }) => {
 		>
 			<TabContext value={tab}>
 				<CustomTabList value={tab} onChange={handleTabChange} aria-label="account tabs">
-					{tabList.map((label, index) => (
+					{tabList.map((item, index) => (
 						<Tab
-							label={label}
+							label={item.name}
 							key={index}
-							value={label.toLowerCase()}
+							value={item.value}
 							onKeyDown={handleKeyDown}
-							onFocus={() => handleFocus(label.toLowerCase())}
+							onFocus={() => handleFocus(item.value)}
 							tabIndex={index}
 						/>
 					))}

client/src/locales/gb.json

@@ -519,5 +519,16 @@
 	"statusBreadCrumbsStatusPages": "Status Pages",
 	"statusBreadCrumbsDetails": "Details",
 	"incidentsPageTitle": "Incidents",
+	"passwordPanel": {
+		"passwordChangedSuccess": "Your password was changed successfully.",
+		"passwordInputIncorrect": "Your password input was incorrect.",
+		"currentPassword": "Current password",
+		"enterCurrentPassword": "Enter your current password",
+		"newPassword": "New password",
+		"enterNewPassword": "Enter your new password",
+		"confirmNewPassword": "Confirm new password",
+		"passwordRequirements": "New password must contain at least 8 characters and must have at least one uppercase letter, one lowercase letter, one number and one special character.",
+		"saving": "Saving..."
+	},
 	"uptimeCreateSelectURL": "Enter the URL or IP to monitor (e.g., https://example.com/ or 192.168.1.100) and add a clear display name that appears on the dashboard."
 }

client/src/locales/ru.json

@@ -406,6 +406,17 @@
   "uptimeCreateJsonPathQuery": "",
   "maintenanceTableActionMenuDialogTitle": "",
   "incidentsPageTitle": "Инциденты",
+  "passwordPanel": {
+    "passwordChangedSuccess": "Ваш пароль был успешно изменен.",
+    "passwordInputIncorrect": "Ваш пароль введен неверно.",
+    "currentPassword": "Текущий пароль",
+    "enterCurrentPassword": "Введите ваш текущий пароль",
+    "newPassword": "Новый пароль",
+    "enterNewPassword": "Введите ваш новый пароль",
+    "confirmNewPassword": "Подтвердите новый пароль",
+    "passwordRequirements": "Новый пароль должен содержать не менее 8 символов и должен иметь как минимум одну заглавную букву, одну строчную букву, одну цифру и один специальный символ.",
+    "saving": "Сохранение..."
+  },
   "pageSpeedWarning": "Предупреждение: Вы не добавили ключ API Google PageSpeed. Без него монитор PageSpeed не будет работать.",
   "pageSpeedLearnMoreLink": "Нажмите здесь, чтобы узнать",
   "pageSpeedAddApiKey": "как добавить ваш ключ API.",

client/src/locales/tr.json

@@ -498,5 +498,16 @@
   "statusBreadCrumbsStatusPages": "Durum Sayfaları",
   "statusBreadCrumbsDetails": "Detaylar",
   "incidentsPageTitle": "Olaylar",
+  "passwordPanel": {
+    "passwordChangedSuccess": "Şifreniz başarıyla değiştirildi.",
+    "passwordInputIncorrect": "Şifre girişiniz yanlış.",
+    "currentPassword": "Mevcut şifre",
+    "enterCurrentPassword": "Mevcut şifrenizi girin",
+    "newPassword": "Yeni şifre",
+    "enterNewPassword": "Yeni şifrenizi girin",
+    "confirmNewPassword": "Yeni şifreyi onaylayın",
+    "passwordRequirements": "Yeni şifre en az 8 karakter içermeli ve en az bir büyük harf, bir küçük harf, bir rakam ve bir özel karakter içermelidir.",
+    "saving": "Kaydediliyor..."
+  },
   "uptimeCreateSelectURL": "İzlenecek URL veya IP adresini girin (örn. https://example.com/ veya 192.168.1.100) ve kontrol panelinde görünecek net bir görüntü adı ekleyin."
 }