Skip to content

feat: application crud and auth captcha#33

Merged
PaiJi merged 4 commits intomainfrom
feat/application-crud
Mar 12, 2026
Merged

feat: application crud and auth captcha#33
PaiJi merged 4 commits intomainfrom
feat/application-crud

Conversation

@PaiJi
Copy link
Copy Markdown
Member

@PaiJi PaiJi commented Mar 12, 2026

Summary by CodeRabbit

发布说明

  • 新功能

    • 登录和注册流程现已集成验证码验证功能
    • 应用管理现采用模态编辑器形式,支持在页面内创建和编辑应用
    • 注册功能新增用户名字段
    • 应用列表中现显示访问令牌,支持复制操作
    • 菜单结构根据用户角色动态调整
  • 改进

    • 增强了登录和注册错误处理机制
    • 优化表单字段自动填充行为
    • 密码恢复链接现仅在登录模式下显示

@PaiJi PaiJi merged commit a2594ed into main Mar 12, 2026
1 check passed
@PaiJi PaiJi deleted the feat/application-crud branch March 12, 2026 10:33
@coderabbitai
Copy link
Copy Markdown

coderabbitai bot commented Mar 12, 2026

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 2fda0dde-ec59-40ea-9022-ebfbc514dfd1

📥 Commits

Reviewing files that changed from the base of the PR and between cc3377e and 6b1389b.

⛔ Files ignored due to path filters (1)
  • yarn.lock is excluded by !**/yarn.lock, !**/*.lock
📒 Files selected for processing (11)
  • package.json
  • src/api/auth/index.ts
  • src/api/developer/application.ts
  • src/components/Application/ApplicationEditor.tsx
  • src/components/CapWidget/index.tsx
  • src/components/EventFeature/FeatureEditor.tsx
  • src/pages/auth/index.tsx
  • src/pages/dashboard/developer/application/list.tsx
  • src/pages/dashboard/index.tsx
  • src/pages/dashboard/layout.tsx
  • src/types/application.ts

📝 Walkthrough

Walkthrough

添加了验证码集成(@cap.js/widget 依赖),扩展认证 API 以支持注册功能,重构应用管理 API 使用类方式,新增应用编辑器组件,实现基于用户角色的动态菜单渲染。

Changes

Cohort / File(s) Summary
验证码集成
package.json, src/components/CapWidget/index.tsx
添加 @cap.js/widget 依赖,实现 CapWidget React 组件包装器,支持验证码求解、进度回调和错误处理。
认证 API 扩展
src/api/auth/index.ts, src/pages/auth/index.tsx
更新登录方法签名以包含 captchaToken,新增注册方法;扩展认证页面支持登录/注册分段切换、验证码流程、错误处理和成功跳转。
应用管理 API 重构
src/api/developer/application.ts
从顶级导出函数转换为 ApplicationApi 类,引入 zod 验证模式(EditApplicationApiBody),提供 getApplicationList、getApplicationDetail、createApplication、updateApplication、deleteApplication 等静态方法。
应用编辑器组件
src/components/Application/ApplicationEditor.tsx, src/pages/dashboard/developer/application/list.tsx
新增 ApplicationEditor 模态组件处理应用创建和编辑,集成 zod 验证、表单管理和 API 调用;更新应用列表页面使用新编辑器替代路由导航,添加删除确认模态和数据刷新机制。
功能编辑器重构
src/components/EventFeature/FeatureEditor.tsx
将模态包装层从 EditorContent 提取至 FeatureEditor,引入独立的 EditorContent 内部组件,调整初始值获取方式(使用 pickBy 过滤空值)。
仪表板 API 迁移和菜单
src/pages/dashboard/index.tsx, src/pages/dashboard/layout.tsx
更新仪表板使用 ApplicationApi.getApplicationList();实现 getMenuItems(role) 函数实现基于用户角色的动态菜单渲染,开发者角色显示专属菜单项。
应用类型扩展
src/types/application.ts
添加必需的 accessToken 字段到 ApplicationSchema,扩展 Application 类型定义。

Sequence Diagrams

sequenceDiagram
    actor User
    participant AuthPage as Auth Page
    participant CapWidget as CapWidget
    participant AuthAPI as AuthAPI
    participant Backend as Backend
    participant Dashboard as Dashboard

    User->>CapWidget: 与验证码交互
    CapWidget->>CapWidget: 求解验证码
    CapWidget->>AuthPage: onSolve(token)
    
    User->>AuthPage: 输入邮箱/密码/用户名<br/>点击登录或注册
    AuthPage->>AuthAPI: login/register(email, password, captchaToken, name?)
    AuthAPI->>Backend: POST /auth/login 或 /auth/register
    Backend->>AuthAPI: 返回 { token, user }
    
    AuthPage->>CapWidget: reset()
    alt 登录成功
        AuthPage->>Dashboard: 保存 token,导航到仪表板
    else 注册成功
        AuthPage->>AuthAPI: login(email, password, captchaToken)
        AuthAPI->>Backend: POST /auth/login
        Backend->>AuthAPI: 返回 { token, user }
        AuthPage->>Dashboard: 保存 token,导航到仪表板
    else 错误
        AuthPage->>CapWidget: reset()
        AuthPage->>User: 显示错误消息
    end
Loading
sequenceDiagram
    actor User
    participant AppList as Application List
    participant AppEditor as ApplicationEditor
    participant ApplicationAPI as ApplicationAPI
    participant Backend as Backend

    User->>AppList: 点击新增或编辑应用
    AppList->>AppEditor: 打开模态(editingApplication)
    
    User->>AppEditor: 填写应用信息<br/>(名称、描述)<br/>点击提交
    AppEditor->>AppEditor: 验证表单<br/>(zod 验证)
    
    alt 创建应用
        AppEditor->>ApplicationAPI: createApplication(data)
        ApplicationAPI->>Backend: POST /applications
    else 编辑应用
        AppEditor->>ApplicationAPI: updateApplication(id, data)
        ApplicationAPI->>Backend: PUT /applications/{id}
    end
    
    Backend->>ApplicationAPI: 返回应用数据
    AppEditor->>AppList: onClose()
    AppList->>ApplicationAPI: 刷新应用列表
    ApplicationAPI->>Backend: GET /applications
    Backend->>ApplicationAPI: 返回应用列表
    AppList->>AppList: 更新表格数据
    AppEditor->>User: 显示成功提示
Loading

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~45 minutes

Poem

🐰 验证码来防护城,应用编辑新组件生,
菜单随角色而变幻,认证流程再扩展。
应用管理换新衣,类方法组织井井然。
代码重构齐步走,安全认证更完善~ 🎉

✨ Finishing Touches
  • 📝 Generate docstrings (stacked PR)
  • 📝 Generate docstrings (commit on current branch)
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch feat/application-crud

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@github-actions
Copy link
Copy Markdown

🚀 预览部署完成!

📱 预览地址: https://fcc-dashboard-8nvrqu5rlh.edgeone.run?eo_token=bf9b2726172e367a1951a6892d25511b&eo_time=1773311722

此预览链接将在部署完成后可用,请稍等片刻再访问。


由 GitHub Actions 自动生成

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant