import type { UserNavItem } from "./types";

export const userMenu: UserNavItem[] = [
    {
        key: "profile",
        hash: "#/profile",
        icon: "badge",
        label: "个人资料",
        title: "个人资料",
        subtitle: "查看账号身份、昵称、头像与基础联系方式",
        group: "account",
        accent: "cyan",
    },
    {
        key: "security",
        hash: "#/security",
        icon: "security",
        label: "安全设置",
        title: "安全设置",
        subtitle: "统一管理密码、双因素认证与 Passkey",
        group: "account",
        accent: "emerald",
    },
    {
        key: "authorizations",
        hash: "#/authorizations",
        icon: "verified_user",
        label: "我的授权应用",
        title: "我的授权应用",
        subtitle: "查看已经授权访问你身份信息的客户端应用",
        group: "account",
        accent: "violet",
    },
    {
        key: "sessions",
        hash: "#/sessions",
        icon: "devices",
        label: "登录会话",
        title: "登录/会话记录",
        subtitle: "预留设备、IP 与最近活动记录管理入口",
        group: "account",
        accent: "blue",
    },
    {
        key: "articles",
        hash: "#/articles",
        icon: "article",
        label: "我的文章",
        title: "我发表的文章",
        subtitle: "预留文章列表、发布状态与内容管理入口",
        group: "content",
        accent: "amber",
    },
    {
        key: "mumbles",
        hash: "#/mumbles",
        icon: "chat_bubble",
        label: "碎碎念",
        title: "我发表的碎碎念",
        subtitle: "预留短内容动态与互动统计入口",
        group: "content",
        accent: "rose",
    },
    {
        key: "timelines",
        hash: "#/timelines",
        icon: "timeline",
        label: "时间轴",
        title: "我发表的时间轴",
        subtitle: "预留时间线记录、节点与归档入口",
        group: "content",
        accent: "slate",
    },
    {
        key: "albums",
        hash: "#/albums",
        icon: "photo_library",
        label: "我的相册",
        title: "我的相册",
        subtitle: "预留相册、照片与公开状态管理入口",
        group: "content",
        accent: "cyan",
    },
];

export const fallbackUserRoute = userMenu[0];
⚠⚠    以下内容为AI分析的结果,请根据实际情况进行判断。

代码解释

这是一个 TypeScript 配置文件,用于定义用户导航菜单的结构和默认路由。

主要内容

1. 导入类型定义

import type { UserNavItem } from "./types";

从本地的 types 文件中导入 UserNavItem 类型定义,用于类型约束。

2. 用户菜单配置 (userMenu)

这是一个包含8个菜单项的数组,每个菜单项都是一个 UserNavItem 对象,包含以下属性:

  • key: 唯一标识符
  • hash: 路由哈希值(用于前端路由导航)
  • icon: 图标名称(可能对应 Material Icons 或类似图标库)
  • label: 菜单项显示文本
  • title: 页面标题
  • subtitle: 功能描述/副标题
  • group: 分组标识(accountcontent
  • accent: 强调色/主题色

3. 菜单项分组

账户分组 (account)

  • 个人资料 - 查看基本信息
  • 安全设置 - 密码、双因素认证、Passkey管理
  • 我的授权应用 - OAuth授权管理
  • 登录会话 - 设备和活动记录

内容分组 (content)

  • 我的文章 - 文章管理(预留功能)
  • 碎碎念 - 短内容动态(预留功能)
  • 时间轴 - 时间线记录(预留功能)
  • 我的相册 - 相册管理(预留功能)

4. 默认路由 (fallbackUserRoute)

export const fallbackUserRoute = userMenu[0];

设置默认路由为第一个菜单项(个人资料),当用户访问用户中心时,如果没有指定具体页面,会跳转到这里。

应用场景

这个配置文件通常用于:

  • 渲染用户中心的侧边导航栏
  • 定义路由映射关系
  • 统一管理菜单的视觉样式(图标、颜色)
  • 提供菜单项的元数据(标题、描述)
评论加载中...