diff --git a/src/components/layout/user-button-mobile.tsx b/src/components/layout/user-button-mobile.tsx
index b5573e3..c6c1e35 100644
--- a/src/components/layout/user-button-mobile.tsx
+++ b/src/components/layout/user-button-mobile.tsx
@@ -10,7 +10,7 @@ import {
   DrawerTitle,
   DrawerTrigger,
 } from '@/components/ui/drawer';
-import { getAvatarLinks } from '@/config/avatar-config';
+import { useAvatarLinks } from '@/config/avatar-config';
 import { LocaleLink, useLocaleRouter } from '@/i18n/navigation';
 import { authClient } from '@/lib/auth-client';
 import type { User } from 'better-auth';
@@ -25,7 +25,7 @@ interface UserButtonProps {
 
 export function UserButtonMobile({ user }: UserButtonProps) {
   const t = useTranslations();
-  const avatarLinks = getAvatarLinks();
+  const avatarLinks = useAvatarLinks();
   const localeRouter = useLocaleRouter();
   const [open, setOpen] = useState(false);
   const closeDrawer = () => {
diff --git a/src/components/layout/user-button.tsx b/src/components/layout/user-button.tsx
index cd0dfd8..812a5c7 100644
--- a/src/components/layout/user-button.tsx
+++ b/src/components/layout/user-button.tsx
@@ -8,7 +8,7 @@ import {
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from '@/components/ui/dropdown-menu';
-import { getAvatarLinks } from '@/config/avatar-config';
+import { useAvatarLinks } from '@/config/avatar-config';
 import { websiteConfig } from '@/config/website';
 import { useLocaleRouter } from '@/i18n/navigation';
 import { authClient } from '@/lib/auth-client';
@@ -25,7 +25,7 @@ interface UserButtonProps {
 
 export function UserButton({ user }: UserButtonProps) {
   const t = useTranslations();
-  const avatarLinks = getAvatarLinks();
+  const avatarLinks = useAvatarLinks();
   const localeRouter = useLocaleRouter();
   const [open, setOpen] = useState(false);
   const handleSignOut = async () => {
diff --git a/src/config/avatar-config.tsx b/src/config/avatar-config.tsx
index 78d5083..4cdf4e5 100644
--- a/src/config/avatar-config.tsx
+++ b/src/config/avatar-config.tsx
@@ -19,7 +19,7 @@ import { useTranslations } from 'next-intl';
  *
  * @returns The avatar config with translated titles
  */
-export function getAvatarLinks(): MenuItem[] {
+export function useAvatarLinks(): MenuItem[] {
   const t = useTranslations('Marketing.avatar');
 
   return [