diff --git a/apps/dokploy/components/layouts/user-nav.tsx b/apps/dokploy/components/layouts/user-nav.tsx
index 05c601f6e..a339f05f4 100644
--- a/apps/dokploy/components/layouts/user-nav.tsx
+++ b/apps/dokploy/components/layouts/user-nav.tsx
@@ -17,6 +17,7 @@ import {
} from "@/components/ui/select";
import { authClient } from "@/lib/auth-client";
import { Languages } from "@/lib/languages";
+import { getFallbackAvatarInitials } from "@/lib/utils";
import { api } from "@/utils/api";
import useLocale from "@/utils/hooks/use-locale";
import { ChevronsUpDown } from "lucide-react";
@@ -46,7 +47,7 @@ export const UserNav = () => {
src={data?.user?.image || ""}
alt={data?.user?.image || ""}
/>
- CN
+ {getFallbackAvatarInitials(data?.user?.email)}
Account
diff --git a/apps/dokploy/lib/utils.ts b/apps/dokploy/lib/utils.ts
index b763e9ee9..cf9f2cc94 100644
--- a/apps/dokploy/lib/utils.ts
+++ b/apps/dokploy/lib/utils.ts
@@ -27,3 +27,15 @@ export function formatTimestamp(timestamp: string | number) {
return "Fecha inválida";
}
}
+
+export function getFallbackAvatarInitials(email: string | undefined): string {
+ if (typeof email === "undefined") return "CN";
+
+ const [emailUsername = ""] = email.split('@');
+ const parts = emailUsername.split(/[\._-]+/).filter(Boolean);
+ if (parts.length >= 2) {
+ // @ts-ignore we are sure parts[0] and parts[1] exist
+ return (parts[0]?.charAt(0) + parts[1].charAt(0)).toUpperCase();
+ }
+ return emailUsername.slice(0, 2).toUpperCase();
+}