refactor: refactored i18n to display real lang name

apps/dokploy/components/dashboard/settings/appearance-form.tsx

@@ -38,7 +38,8 @@ const appearanceFormSchema = z.object({
 	theme: z.enum(["light", "dark", "system"], {
 		required_error: "Please select a theme.",
 	}),
-	language: z.nativeEnum(Languages, {
+
+	language: z.enum(Object.values(Languages).map(lang => lang.code), {
 		required_error: "Please select a language.",
 	}),
 });
@@ -48,7 +49,7 @@ type AppearanceFormValues = z.infer<typeof appearanceFormSchema>;
 // This can come from your database or API.
 const defaultValues: Partial<AppearanceFormValues> = {
 	theme: "system",
-	language: Languages.English,
+	language: Languages.english.code,
 };
 
 export function AppearanceForm() {
@@ -173,15 +174,11 @@ export function AppearanceForm() {
 												<SelectValue placeholder="No preset selected" />
 											</SelectTrigger>
 											<SelectContent>
-												{Object.keys(Languages).map((preset) => {
-													const value =
-														Languages[preset as keyof typeof Languages];
-													return (
-														<SelectItem key={value} value={value}>
-															{preset}
-														</SelectItem>
-													);
-												})}
+											{Object.values(Languages).map((language) => (
+												<SelectItem key={language.code} value={language.code}>
+													{language.name}
+												</SelectItem>
+											))}
 											</SelectContent>
 										</Select>
 									</FormItem>

apps/dokploy/lib/languages.ts

@@ -1,19 +1,19 @@
-export enum Languages {
-	English = "en",
-	Polish = "pl",
-	Russian = "ru",
-	French = "fr",
-	German = "de",
-	ChineseTraditional = "zh-Hant",
-	ChineseSimplified = "zh-Hans",
-	Turkish = "tr",
-	Kazakh = "kz",
-	Persian = "fa",
-	Korean = "ko",
-	Portuguese = "pt-br",
-	Italian = "it",
-	Japanese = "ja",
-	Spanish = "es",
-}
+export const Languages = {
+	english: { code: "en", name: "English" },
+	polish: { code: "pl", name: "Polski" },
+	russian: { code: "ru", name: "Русский" },
+	french: { code: "fr", name: "Français" },
+	german: { code: "de", name: "Deutsch" },
+	chineseTraditional: { code: "zh-Hant", name: "繁體中文" },
+	chineseSimplified: { code: "zh-Hans", name: "简体中文" },
+	turkish: { code: "tr", name: "Türkçe" },
+	kazakh: { code: "kz", name: "Қазақ" },
+	persian: { code: "fa", name: "فارسی" },
+	korean: { code: "ko", name: "한국어" },
+	portuguese: { code: "pt-br", name: "Português" },
+	italian: { code: "it", name: "Italiano" },
+	japanese: { code: "ja", name: "日本語" },
+	spanish: { code: "es", name: "Español" },
+};
 
 export type Language = keyof typeof Languages;