Skip to content

progress.md

Latest commit

 

History

History
326 lines (239 loc) · 15.1 KB

progress.md

File metadata and controls

326 lines (239 loc) · 15.1 KB

walipay 開発進捗チェックリスト

エージェント向け指示: セッション開始時にこのファイルを確認し、次のタスクを把握すること。 タスク完了後は必ずこのファイルを更新して進捗を永続化すること。

最終更新: 2026-03-09 | テスト: 273/273 pass + E2E 9件 | カバレッジ: 95.94%+ | Playwright MCP 導入済み

凡例

  • ✅ 完了（テスト含む）
  • 🔨 実装済み・テスト不足
  • ❌ 未実装
  • ⚠️ 要確認・ブロッカーあり

Phase 0: プロジェクト初期化 ✅ 完了

  • Next.js 14 App Router セットアップ
  • TypeScript + Tailwind CSS 設定
  • shadcn/ui + Radix UI インストール
  • Privy + wagmi + viem インストール
  • Supabase クライアント設定 (lib/supabase.ts)
  • wagmi 設定 (lib/wagmi.ts) — Sepolia Testnet のみ
  • Vitest + Testing Library 設定 (vitest.config.ts)
  • Playwright E2E 設定 (playwright.config.ts)
  • ディレクトリ構造 (app/, components/, hooks/, lib/, types/)
  • 型定義 (types/database.ts)
  • Providers 設定 (app/providers.tsx)

Phase 1: 基本機能

1-A: バックエンド (API Routes) ✅ 完了

  • POST /api/groups — グループ作成 (テスト: 6件)
  • GET /api/groups/[id] — グループ詳細取得 (テスト: 3件)
  • POST /api/groups/[id]/expenses — 支出追加 (テスト: 6件)
  • DELETE /api/groups/[id]/expenses/[expenseId] — 支出削除 (テスト: 2件)
  • GET/POST /api/groups/[id]/notes — 日付メモ CRUD (テスト: 6件)
  • POST /api/groups/[id]/analyze — AI 分析 (テスト: 3件)
  • POST /api/groups/[id]/transactions — トランザクション記録 ✅ (テスト: 6件)

1-B: ライブラリ関数 ✅ 完了

  • lib/calculate-settlement.ts — 清算計算アルゴリズム (テスト: 10件)
  • lib/format-currency.ts — 通貨フォーマット JPY/USD/EUR (テスト: 10件)
  • lib/parse-web3-error.ts — Web3 エラーパース (テスト: 11件)
  • lib/contracts.ts — コントラクトアドレス管理
  • lib/erc20-abi.ts — ERC-20 ABI

1-C: Hooks ✅ 完了

  • hooks/use-group.ts — グループ・メンバー取得/操作 (テスト: 16件)
  • hooks/use-expenses.ts — 支出 CRUD (テスト: 14件)
  • hooks/use-settlement.ts — 清算計算 hook (テスト: 4件)
  • hooks/use-token-balance.ts — ERC-20 残高取得 (テスト: 3件)
  • hooks/use-gas-estimate.ts — ガス代見積もり (テスト: 2件)
  • hooks/use-token-transfer.ts — トークン送金 (テスト: 1件)

1-D: UI コンポーネント

  • components/shared/LoadingSpinner.tsx — ローディング (テスト: 1件) ✅
  • components/shared/ErrorDisplay.tsx — エラー表示 (テスト: 3件) ✅
  • components/group/GroupForm.tsx — グループ作成フォーム (テスト: 3件) ✅
  • components/expense/ExpenseForm.tsx — 支出追加フォーム (テスト: 1件) ✅
  • components/settlement/SettlementList.tsx — 清算リスト (テスト: 3件) ✅
  • components/wallet/WalletConnect.tsx — ウォレット接続 (テスト: 6件) ✅
  • components/note/NoteEditor.tsx — 日付メモ編集 (テスト: 5件) ✅
  • components/ai/AIAnalysisModal.tsx — AI 分析結果モーダル (テスト: 7件) ✅

1-E: ページ

  • app/page.tsx — ホーム (グループ作成) ✅
  • app/g/[id]/page.tsx — グループ詳細ページ ✅
    • ✅ NoteEditor 統合済み
    • ✅ AI 分析ボタン統合済み
    • ✅ PaymentModal 統合済み

Phase 2: Web3 統合 ❌ 進行中

2-A: ウォレット接続

  • WalletConnect.tsx — Privy login/logout 実際に呼び出す ✅
  • Sepolia Testnet 自動切り替え ✅
    • useSwitchChain で自動チェーン切り替え
    • 間違ったチェーンの場合は警告バナー + Switch ボタン表示

2-B: トークン残高表示

  • WalletConnect にトークン残高表示 ✅
    • Sepolia 接続時に USDC / JPYC / EURC 残高表示

Phase 3: Stablecoin 決済 ❌ 未実装

3-A: 決済コンポーネント

  • components/payment/PaymentModal.tsx — 決済フロー ✅ (テスト: 10件)
    • ウォレット未接続チェック
    • トークン選択 (USDC/JPYC/EURC) + 残高表示
    • 確認画面（宛先/トークン/金額）
    • MetaMask 承認待ち (isPending)
    • ブロックチェーン処理中 (isLoading)
    • 完了 + Etherscan リンク
  • SettlementList.tsx に「支払う」ボタン追加 ✅ (テスト: 5件)
    • PaymentModal を開くトリガー
  • app/g/[id]/page.tsx に PaymentModal 統合 ✅

3-B: 決済 API

  • app/api/groups/[id]/transactions/route.ts — トランザクション記録 ✅ (テスト: 6件)
    • POST: tx_hash, from/to member, amount, token 記録

3-C: 為替レート

  • lib/exchange-rate.ts — Exchangerate-API + フォールバック ✅ (テスト: 8件)
  • hooks/use-exchange-rate.ts — 為替レート hook ✅ (テスト: 5件)

3-D: トランザクション履歴

  • components/payment/TransactionHistory.tsx ✅ (テスト: 実装済み)
  • グループページに「送金履歴」セクション追加 ✅
  • hooks/use-transactions.ts — 取引履歴フェッチ hook ✅ (テスト: 5件)

Phase 4: UI/UX ❌ 未実装

4-A: メモ機能

  • components/note/NoteEditor.tsx — 日付メモ ✅ (既存)
  • グループページに日付別メモセクション追加 ✅ (既存)

4-B: レスポンシブ

  • components/layout/Header.tsx — レスポンシブヘッダー ✅ (テスト: 5件)
  • モバイル: カードレイアウト、デスクトップ: テーブルレイアウト ✅
  • タッチ操作最適化 (ボタン 44x44px min-h-[44px]) ✅

4-C: UX 改善

  • components/group/ShareButton.tsx — URL シェアボタン ✅
  • components/shared/ErrorBoundary.tsx — エラーバウンダリ ✅
  • components/group/MemberManager.tsx — メンバー追加/削除 UI ✅ (テスト: 4件)
  • グループページに MemberManager セクション統合 ✅
  • グループ設定編集 (名前・通貨変更) ✅ components/group/GroupSettings.tsx (テスト: 4件)

E2E テスト ✅ 実装済み

  • e2e/group-flow.spec.ts — グループ作成・表示フロー ✅ (3件, API モック使用)
  • e2e/expense-flow.spec.ts — 支出追加・表示フロー ✅ (3件, API モック使用)
  • e2e/blockchain/payment.spec.ts — 決済 UI フロー ✅ (3件, API モック使用, ウォレット未接続シナリオ)

Documentation ✅ 更新済み

  • ルート README.md を追加（英語、開発導線と主要ドキュメントへの入口を整理）
  • UI 言語切り替えを追加（英語デフォルト / 日本語タブ切り替え対応、主要画面とモーダル文言を翻訳）
  • マルチ通貨支出の為替レートを自動補完（支出保存時に JPY 換算レートを保存、既存 rate=1 データは読込時に補完）
  • Vercel preview deploy の既定 scope を akinobu-onos-projects としてドキュメント化
  • .env.local の値を Vercel preview / production 環境変数へ同期
  • Vercel production deploy 完了 (https://mvp-test-mu.vercel.app, 2026-03-09)
  • Vercel 新規 project walipay-mvp を作成し production deploy 完了 (https://walipay-mvp.vercel.app, 2026-03-09)
  • ホーム Hero のキャッチコピーを短文化し、上下余白を拡張 (app/page.tsx, 2026-03-09)
  • GitHub Actions で push 時の Vercel 自動 deploy を追加 (.github/workflows/vercel-deploy.yml, 2026-03-09)

テスト状況サマリー

ファイル テスト数 ステータス
app/api/groups/route.test.ts 6 ✅
app/api/groups/[id]/route.test.ts 3 ✅
app/api/groups/[id]/expenses/route.test.ts 6 ✅
app/api/groups/[id]/expenses/[expenseId]/route.test.ts 2 ✅
app/api/groups/[id]/notes/route.test.ts 6 ✅
app/api/groups/[id]/analyze/route.test.ts 3 ✅
hooks/use-expenses.test.ts 14 ✅
hooks/use-group.test.ts 16 ✅
hooks/use-settlement.test.ts 4 ✅
hooks/use-token-balance.test.ts 3 ✅
hooks/use-gas-estimate.test.ts 2 ✅
hooks/use-token-transfer.test.ts 1 ✅
lib/calculate-settlement.test.ts — ✅
lib/format-currency.test.ts 10 ✅
lib/parse-web3-error.test.ts 11 ✅
components/group/GroupForm.test.tsx 3 ✅
components/expense/ExpenseForm.test.tsx 1 ✅
components/settlement/SettlementList.test.tsx 3 ✅
components/shared/ErrorDisplay.test.tsx 3 ✅
components/shared/LoadingSpinner.test.tsx 1 ✅
components/wallet/WalletConnect.test.tsx 6 ✅
components/note/NoteEditor.test.tsx 5 ✅
components/ai/AIAnalysisModal.test.tsx 7 ✅
components/payment/PaymentModal.test.tsx 10 ✅
app/g/[id]/page.test.tsx 8 ✅
app/page.test.tsx 1 ✅
components/group/GroupSettings.test.tsx 4 ✅
合計 199 全 pass

カバレッジ状況

ディレクトリ 目標 現在 ステータス
lib/ 90%+ 76.5% ⚠️ (contracts/supabase/wagmiは設定ファイルで除外検討)
hooks/ 85%+ 98.8% ✅
components/ 80%+ ~96% ✅
app/api/ 85%+ ~94% ✅
全体 80%+ 92.8% ✅

注意: lib/contracts.ts, lib/supabase.ts, lib/wagmi.ts は設定ファイルのため実質テスト不可。 vitest.config.ts の exclude に追加することでカバレッジ目標を達成可能。

コマンド早見表

bunx vitest run              # ユニットテスト
bunx vitest run --coverage   # カバレッジ確認
bun run test:e2e             # E2E テスト
bun run test:e2e:blockchain  # Blockchain E2E
bun dev                      # 開発サーバー起動 (http://localhost:3000)

⚠️ bun test は Bun 組み込みランナーが動くため 使用禁止。必ず bunx vitest run を使うこと。

ブラウザ動作確認 (Playwright MCP)

Claude Code は Playwright MCP を使って実ブラウザで UI を確認できる。 実装後は bun dev → Playwright MCP で確認 → E2E テスト作成の順で進める。

詳細: docs/browser-verification.md

Phase 5: ウォレット統合強化 ✅ 完了

memo2.md 要件 — 2026-03-01 実装完了。テスト: 224/224 pass | カバレッジ: 95.94%

5-A: グループ作成フォームにウォレットアドレス入力追加 ✅

  • components/group/GroupForm.tsx — メンバー行ごとに「ウォレットアドレス / ENS (任意)」入力フィールド追加
  • hooks/use-group.ts — createGroup() の引数を {name: string, wallet_address?: string}[] に変更 (MemberInput 型)
  • app/api/groups/route.ts — members を {name, wallet_address?}[] 形式で受け取り DB へ保存 (string[] 後方互換あり)
  • テスト更新: GroupForm.test.tsx, app/api/groups/route.test.ts, use-group.test.ts

5-B: ホームページのウォレット統合 + グループ一覧 ✅

  • app/page.tsx — ヘッダーに <WalletConnect /> を追加
  • app/api/groups/route.ts に GET メソッド追加 — ?wallet_address=0x... クエリで所属グループ一覧を返す
  • hooks/use-my-groups.ts 新規作成 — 接続ウォレットアドレスでグループ一覧を取得
  • app/page.tsx — ウォレット接続時に「あなたのグループ」セクションを表示
  • テスト: GET /api/groups route test (4件), use-my-groups.test.ts (5件)

5-C: 精算ボタンのウォレット制限 + 支払済み表示 ✅

  • SettlementList.tsx — connectedWalletAddress?: string, paidPairs?: Set<string> props 追加
  • from.wallet_address と接続ウォレットの照合 (case-insensitive) でボタン有効/無効制御
  • paidPairs に含まれる精算に「一部支払済み」バッジ表示
  • app/g/[id]/page.tsx — useAccount() で address 取得, paidPairs 導出, SettlementList に渡す
  • テスト: SettlementList.test.tsx 更新 (9件 → wallet制限・支払済みバッジ)

5-D: 追加支出後の精算再計算ロジック ✅

  • lib/calculate-settlement.ts — calculateBalances() に paidTransactions 引数追加
  • hooks/use-settlement.ts — transactions を受け取り completed 分だけ抽出して計算に渡す
  • app/g/[id]/page.tsx — transactions を useSettlement() に渡す
  • テスト: calculateBalances (3件) + calculateSettlement with paid (3件) 追加

Phase 6: マルチ通貨対応 ✅ 完了

要件: 支出ごとに通貨を設定可能（JPY/USD/EUR 混在 OK）、グループレベルの通貨設定を廃止。

6-A: グループレベル通貨設定の廃止 ✅

  • components/group/GroupForm.tsx — 通貨ドロップダウン削除
  • components/group/GroupSettings.tsx — 通貨ドロップダウン削除
  • hooks/use-group.ts — createGroup() の currency 引数削除（内部で 'JPY' デフォルト）
  • app/api/groups/route.ts — currency 省略可能にする（デフォルト 'JPY'）

6-B: 支出ごとの通貨選択 ✅

  • components/expense/ExpenseForm.tsx — 通貨セレクター追加（JPY/USD/EUR）
  • components/expense/ExpenseEditModal.tsx — 通貨セレクター追加、expense.currency で初期化、currency プロップ削除
  • app/g/[id]/page.tsx — 支出一覧に通貨表示、ExpenseEditModal の currency プロップ削除

6-C: 精算計算のマルチ通貨対応 ✅

  • lib/calculate-settlement.ts — expense.amount * (expense.rate ?? 1) で JPY 換算して計算

6-D: テスト更新 ✅ (261/261 pass)

  • GroupForm.test.tsx — createGroup 呼び出しの通貨引数を削除
  • GroupSettings.test.tsx — 通貨関連テスト更新
  • ExpenseForm.test.tsx — 通貨セレクター追加テスト
  • lib/calculate-settlement.test.ts — マルチ通貨テスト追加
  • app/api/groups/route.test.ts — 通貨省略可能テスト更新

6-E: 清算画面の通貨切り替えタブ ✅

  • app/g/[id]/page.tsx — 清算セクションに ¥円/USD/EUR タブ追加
  • useExchangeRate('JPY', displayCurrency) で JPY→選択通貨レートを取得
  • displayedSettlements — 全精算金額をレート換算して SettlementList に渡す
  • app/g/[id]/page.test.tsx — タブ表示テスト 2件追加

次のアクション (残タスク)

Phase 5・6 実装完了。テスト: 259/259 pass。

  1. ブラウザ動作確認 — bun dev → Playwright MCP で支出追加（通貨選択）フローを検証
  2. 実 Sepolia E2E — MetaMask 拡張 + テストウォレット + Sepolia ETH が必要な場合のみ実施