feat(frontend): implement auth access flow

[Alexander-Noah]

关联 Issue

Closes #194

• [feat(frontend): 建立登录注册、认证初始化与路由守卫闭环]

变更概述

实现登录注册页面、认证接口适配、表单逻辑复用、应用认证状态切换及相关测试。

依赖与测试配置

• frontend/package.json

  • 增加 react-dom、react-native-web 和 @expo/metro-runtime，支持 Expo Web 运行。
  • 增加 Jest、React Native Testing Library 和 React Test Renderer 测试依赖。
  • 保留组织仓库现有 Vitest 和 SQLite 测试依赖。
  • 增加 web、test:jest 和 test:vitest 脚本。
  • test 脚本统一执行 Vitest 和 Jest。
  • 配置 jest-expo 测试预设。

• frontend/package-lock.json

  • 同步新增依赖及其传递依赖的锁定版本。
  • 该文件由 npm 自动生成，不包含手写业务逻辑。

认证契约与接口适配

• frontend/src/contracts/auth.ts

  • 定义 AuthAccessRequest 和 AuthAccessResponse。
  • 定义统一认证调用类型 AuthAccess。
  • 定义用户名、密码和凭证相关业务错误码。
  • 定义业务错误、无效响应、网络错误和超时错误类型。
  • 新增中文契约注释，说明各类型的职责和使用范围。
  • 使用 AuthAccessError 隔离页面与具体 HTTP 实现。

• frontend/src/api/auth.ts

  • 新增统一认证适配器 createAuthAccess。
  • 调用 POST /auth/access 提交用户名和密码。
  • 使用 AbortController 实现 15 秒请求超时。
  • 校验 account_id 和 access_token 必须为非空白字符串。
  • 校验 expires_in 必须为大于 0 的有限数字。
  • 拒绝无效 JSON、不完整响应和空白 Token。
  • 兼容嵌套与扁平两种业务错误码响应结构。
  • 将业务错误、无效响应、网络错误和超时统一转换为 AuthAccessError。

• frontend/src/infrastructure/network/client.ts

  • 新增通用 ApiRequest 类型。
  • 新增 ApiError，保留失败响应的 HTTP 状态码和响应体。
  • 新增 ApiResponseError，区分成功响应中的无效 JSON。
  • 错误响应无法解析 JSON 时仍保留原始 HTTP 错误语义。

登录注册界面

• frontend/src/screens/LoginScreen.tsx

  • 新增统一登录注册页面。
  • 展示“首次使用创建账号，已有账号直接登录”的入口说明。
  • 增加用户名去除首尾空格及必填校验。
  • 增加密码必填和最少 8 个字符校验。
  • 请求期间禁用输入框和提交按钮，防止重复提交。
  • 请求结束后恢复表单操作状态。
  • 展示用户名、密码、凭证、网络和超时错误提示。
  • 认证成功后通过 onAuthenticated 向应用根组件传递响应。
  • 增加输入焦点、键盘提交、实时错误提示和无障碍属性。
  • 增加响应式宽度及登录页面视觉样式。

• frontend/src/features/auth/presentation/useAuthAccessForm.ts

  • 统一管理用户名、密码、字段错误和提交状态。
  • 集中处理表单校验、用户名规范化及认证提交。
  • 集中处理业务错误、网络错误和超时错误提示。
  • 页面不再重复维护认证请求和表单状态逻辑。
  • 未注册成功回调时仍会正常执行认证请求。

• frontend/src/app/AppRoot.tsx

  • 将登录注册页面接入应用根组件。
  • 在内存中保存成功的认证响应。
  • 认证成功后离开登录表单并展示账号信息。
  • 认证成功页面不展示或输出访问 Token。
  • 当前仅实现轻量页面切换，尚未建立完整路由守卫。

• frontend/src/shared/ui/theme.ts

  • 增加登录页面使用的背景色、表面色、边框色和输入框颜色。
  • 增加焦点色、错误色、强调色和次要文字颜色。
  • 补充 xs、sm、lg、xl 和 xxl 间距规格。

自动化测试

• frontend/src/api/auth.test.ts

  • 验证认证请求路径、请求方法和请求体。
  • 验证业务错误码映射和网络错误处理。
  • 验证 15 秒超时、主动中止和计时器清理。
  • 验证无效 JSON、不完整响应、空白账号和空白 Token 被拒绝。

• frontend/src/infrastructure/network/client.test.ts

  • 验证未配置环境变量时使用 /v1 回退地址。
  • 验证成功 JSON 响应解析。
  • 验证成功响应包含无效 JSON 时抛出 ApiResponseError。
  • 验证 HTTP 错误的状态码和响应体得到保留。

• frontend/src/features/auth/presentation/useAuthAccessForm.test.tsx

  • 验证编辑字段时只清除对应字段错误。
  • 验证用户名规范化及认证成功回调。
  • 验证未注册成功回调时认证请求仍会执行。

• frontend/src/screens/LoginScreen.test.tsx

  • 验证统一登录注册页面的基础控件。
  • 验证空字段和密码长度校验。
  • 验证用户名规范化和认证请求提交。
  • 验证提交期间禁止重复操作。
  • 验证业务错误、网络错误和超时提示。
  • 验证请求结束后表单恢复可操作状态。

• frontend/src/app/AppRoot.test.tsx

  • 验证认证成功后离开登录页面。
  • 验证成功页面展示账号 ID。
  • 验证访问 Token 不会出现在渲染结果中。

• frontend/tests/integration/scheduleLocalRepository.test.ts

  • 保留并通过组织仓库现有的本地日程仓储集成测试。

变更原因

Issue #194 需要建立统一的前端认证入口。

本 PR 完成登录或创建账号的基础闭环，并将页面交互、表单状态、认证契约和 HTTP 请求适配分离，减少登录注册代码冗余。

只有完整有效的认证响应才能进入成功状态。业务错误、网络异常、无效响应和请求超时会转换为稳定的前端错误语义，并允许用户重新提交。

破坏性变更

无已知破坏性变更。

验证结果

• ESLint 代码检查通过
• Prettier 格式检查通过
• TypeScript 类型检查通过
• Vitest：1 个测试文件、6 个测试用例通过
• Jest：5 个测试套件、24 个测试用例通过
• 登录表单校验和防重复提交测试通过
• 认证成功、业务错误和网络错误处理测试通过
• 15 秒请求超时处理测试通过
• 无效 JSON、空白账号和空白 Token 拒绝测试通过
• 登录成功后的应用页面切换测试通过
• 真实前后端登录联调完成

本次不包含

• 认证会话的安全持久化存储
• 应用启动时的认证状态恢复
• 完整的 loading、authenticated、unauthenticated 状态机
• 完整路由守卫
• Token 到期时间计算和本地过期清理
• HTTP Bearer Token 自动注入
• 并发 401 的统一认证失效处理
• WebSocket Token 鉴权
• 主动退出登录和账号相关状态清理
• Refresh Token 和自动续期
• 密码找回、第三方登录和账号管理

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
timeflow	Ready	Preview	Aug 11, 2026 11:15am

[Alexander-Noah]

/review

[fennoai]

Found two concrete issues: the default API prefix no longer matches the repository backend contract, and the lockfile introduces an undeclared third-party registry dependency.

Validation: npm ci and npm run check completed successfully.

Findings without inline locations

• frontend/package-lock.json:451: [P2] Regenerate the lockfile against the repository registry. This lockfile introduces 275 resolved URLs from registry.npmmirror.com, although the previous lockfile used registry.npmjs.org and the repository has no .npmrc declaring a mirror. Because npm ci follows these pinned tarball URLs, CI and developer installs now depend on an undeclared third-party registry. Please regenerate with the official registry, or add an explicit reviewed registry policy if this mirror is intentional.

[fennoai]

Found one blocking integration regression in the new client fallback. The focused test commands could not run in this workspace because the installed vitest/tsc executables lack execute permission; git diff --check passed.