SuperAPI AI 工具集

admin-panel-builder

通用与其它

查看项目

更新于 10-16 05:06

技能介绍

用途:该技能是 KR92 Bible Voice 项目中创建与维护管理后台(admin panel)页面的专家助手,适用于新建管理页面、构建管理组件等场景。

主要能力与约定:

  1. 布局模式:所有管理页面使用 SidebarProvider + AppSidebar + AdminHeader 组合,内容包裹在 p-6 容器中,使用 max-w-6xl mx-auto 居中与 space-y-6 间距。
  2. 鉴权:通过 @shared-auth/hooks/useUserRole 获取 isAdmin,非管理员显示芬兰语提示“Sinulla ei ole oikeuksia tähän sivuun.”。
  3. 导入约定:UI 组件来自 @ui 别名,共享鉴权来自 @shared-auth,本地组件用 @/ 前缀。
  4. 数据获取:使用 React Query 的 useQuery/useMutation,变更后 invalidateQueries,加载态用 Loader2,数据源为 supabase 客户端。
  5. 通知:使用 sonner 的 toast.success/toast.error,而非 useToast。
  6. 组件模式:数据表格(Table + Badge + 删除 mutation)、表单(react-hook-form + zod + @ui/form + Switch)。
  7. 新增页面三步:创建页面组件、在 App.tsx 添加路由、在 AdminDashboardPage 的 adminCards 数组添加卡片。
  8. 令牌管理:管理 Supabase 密钥、Turnstile、OpenAI、ElevenLabs 等令牌,含敏感标记、复制到剪贴板、轮换指引与安全警告。

适用场景:在既有管理后台中扩展新管理模块、统一页面结构与交互规范。

限制:资料仅针对 KR92 Bible Voice 项目及其技术栈(React、Supabase、React Query、Tailwind 风格类名),未提供安装命令、收费、平台支持或效果数据;其他项目需自行适配。