update translations

beszel/site/src/components/lang-toggle.tsx

@@ -23,11 +23,11 @@ export function LangToggle() {
 					<span className="sr-only">Language</span>
 				</Button>
 			</DropdownMenuTrigger>
-			<DropdownMenuContent>
+			<DropdownMenuContent className="grid grid-cols-2">
 				{languages.map(({ lang, label, e }) => (
 					<DropdownMenuItem
 						key={lang}
-						className={cn("ps-2.5 pe-4 flex gap-2.5", lang === i18n.language ? "font-bold" : "")}
+						className={cn("px-3 flex gap-2.5", lang === i18n.language ? "font-bold" : "")}
 						onClick={() => setLang(lang)}
 					>
 						<span>{e}</span> {label}

beszel/site/src/components/routes/settings/layout.tsx

@@ -14,6 +14,7 @@ import Notifications from "./notifications.tsx"
 import ConfigYaml from "./config-yaml.tsx"
 import { isAdmin } from "@/lib/utils.ts"
 import { useTranslation } from "react-i18next"
+import { t } from "i18next"
 
 export async function saveSettings(newSettings: Partial<UserSettings>) {
 	try {
@@ -30,14 +31,14 @@ export async function saveSettings(newSettings: Partial<UserSettings>) {
 		})
 		$userSettings.set(updatedSettings.settings)
 		toast({
-			title: "Settings saved",
-			description: "Your user settings have been updated.",
+			title: t("settings.saved"),
+			description: t("settings.saved_des"),
 		})
 	} catch (e) {
 		// console.error('update settings', e)
 		toast({
-			title: "Failed to save settings",
-			description: "Check logs for more details.",
+			title: t("settings.failed_to_save"),
+			description: t("settings.check_logs"),
 			variant: "destructive",
 		})
 	}

beszel/site/src/components/routes/settings/notifications.tsx

@@ -13,6 +13,7 @@ import { saveSettings } from "./layout"
 import * as v from "valibot"
 import { isAdmin } from "@/lib/utils"
 import { useTranslation } from "react-i18next"
+import { t } from "i18next"
 
 interface ShoutrrrUrlCardProps {
 	url: string
@@ -61,7 +62,7 @@ const SettingsNotificationsPage = ({ userSettings }: { userSettings: UserSetting
 			await saveSettings(parsedData)
 		} catch (e: any) {
 			toast({
-				title: "Failed to save settings",
+				title: t("settings.failed_to_save"),
 				description: e.message,
 				variant: "destructive",
 			})
@@ -95,7 +96,7 @@ const SettingsNotificationsPage = ({ userSettings }: { userSettings: UserSetting
 						)}
 					</div>
 					<Label className="block" htmlFor="email">
-						{t("settings.notifications.email.to_email_s")}
+						{t("settings.notifications.email.to_emails")}
 					</Label>
 					<InputTags
 						value={emails}
@@ -110,13 +111,13 @@ const SettingsNotificationsPage = ({ userSettings }: { userSettings: UserSetting
 				<Separator />
 				<div className="space-y-3">
 					<div>
-						<h3 className="mb-1 text-lg font-medium">{t("settings.notifications.webhook_push.title")}</h3>
+						<h3 className="mb-1 text-lg font-medium">{t("settings.notifications.webhook.title")}</h3>
 						<p className="text-sm text-muted-foreground leading-relaxed">
-							{t("settings.notifications.webhook_push.des_1")}{" "}
+							{t("settings.notifications.webhook.des_1")}{" "}
 							<a href="https://containrrr.dev/shoutrrr/services/overview/" target="_blank" className="link">
 								Shoutrrr
 							</a>{" "}
-							{t("settings.notifications.webhook_push.des_2")}
+							{t("settings.notifications.webhook.des_2")}
 						</p>
 					</div>
 					{webhooks.length > 0 && (
@@ -138,8 +139,8 @@ const SettingsNotificationsPage = ({ userSettings }: { userSettings: UserSetting
 						className="mt-2 flex items-center gap-1"
 						onClick={addWebhook}
 					>
-						<PlusIcon className="h-4 w-4 -ml-0.5" />
-						{t("settings.notifications.webhook_push.add_url")}
+						<PlusIcon className="h-4 w-4 -ms-0.5" />
+						{t("settings.notifications.webhook.add")} URL
 					</Button>
 				</div>
 				<Separator />
@@ -165,12 +166,12 @@ const ShoutrrrUrlCard = ({ url, onUrlChange, onRemove }: ShoutrrrUrlCardProps) =
 		const res = await pb.send("/api/beszel/send-test-notification", { url })
 		if ("err" in res && !res.err) {
 			toast({
-				title: "Test notification sent",
-				description: "Check your notification service",
+				title: t("settings.notifications.webhook.test_sent"),
+				description: t("settings.notifications.webhook.test_sent_des"),
 			})
 		} else {
 			toast({
-				title: "Error",
+				title: t("error"),
 				description: res.err ?? "Failed to send test notification",
 				variant: "destructive",
 			})
@@ -189,18 +190,12 @@ const ShoutrrrUrlCard = ({ url, onUrlChange, onRemove }: ShoutrrrUrlCardProps) =
 					value={url}
 					onChange={onUrlChange}
 				/>
-				<Button
-					type="button"
-					variant="outline"
-					className="w-20 md:w-28"
-					disabled={isLoading || url === ""}
-					onClick={sendTestNotification}
-				>
+				<Button type="button" variant="outline" disabled={isLoading || url === ""} onClick={sendTestNotification}>
 					{isLoading ? (
 						<LoaderCircleIcon className="h-4 w-4 animate-spin" />
 					) : (
 						<span>
-							Test <span className="hidden md:inline">URL</span>
+							{t("settings.notifications.webhook.test")} <span className="hidden sm:inline">URL</span>
 						</span>
 					)}
 				</Button>

beszel/site/src/components/routes/system.tsx

@@ -160,7 +160,7 @@ export default function SystemDetail({ name }: { name: string }) {
 			orientation: i18n.dir() == "rtl" ? "right" : "left",
 			...getTimeData(chartTime, lastCreated),
 		}
-	}, [systemStats, containerData, t])
+	}, [systemStats, containerData, i18n.dir()])
 
 	// get stats
 	useEffect(() => {