头像按钮

定义头部用户头像下拉菜单中的菜单项，每个项目都是 MenuItem。

src/config/avatar-config.tsx

export function getAvatarLinks(): MenuItem[] {
  const t = useTranslations('Marketing.avatar');

  return [
    {
      title: t('dashboard'),
      href: Routes.Dashboard,
      icon: <LayoutDashboardIcon className="size-4 shrink-0" />,
    },
    {
      title: t('billing'),
      href: Routes.SettingsBilling,
      icon: <CreditCardIcon className="size-4 shrink-0" />,
    },
    {
      title: t('settings'),
      href: Routes.SettingsProfile,
      icon: <Settings2Icon className="size-4 shrink-0" />,
    },
  ];
}

头像配置定义了用户点击头部个人头像时出现的下拉菜单。通常包括以下链接：

积分余额（通过 enableCredits 在 website.tsx 中启用）
用户仪表盘
账户设置
账单/订阅管理
退出登录选项（单独处理）

此菜单提供对用户特定功能的快速访问，而不会使主导航变得混乱。

视频教程

下一步

现在您了解了头像配置，请探索其他相关主题：

网站配置

配置网站的核心设置

导航栏配置

配置头部导航菜单

页脚配置

配置网站页脚中的链接

侧边栏配置

配置仪表盘的导航菜单

定义头部用户头像下拉菜单中的菜单项，每个项目都是 MenuItem。

src/config/avatar-config.tsx

export function getAvatarLinks(): MenuItem[] {
  const t = useTranslations('Marketing.avatar');

  return [
    {
      title: t('dashboard'),
      href: Routes.Dashboard,
      icon: <LayoutDashboardIcon className="size-4 shrink-0" />,
    },
    {
      title: t('billing'),
      href: Routes.SettingsBilling,
      icon: <CreditCardIcon className="size-4 shrink-0" />,
    },
    {
      title: t('settings'),
      href: Routes.SettingsProfile,
      icon: <Settings2Icon className="size-4 shrink-0" />,
    },
  ];
}