🧾 概要

学習トラッカーのグラフ機能を拡張し、

「今日の学習時間(円グラフ)」 と 「累計学習時間(棒グラフ)」 をそれぞれ独立して表示できるようにした。

あわせて以下も対応:


📁 変更ファイル一覧

ファイル 主な変更内容
components/Chart.tsx BarChart を追加し累計学習時間を棒グラフで表示、todayData props を追加
components/ClientApp.tsx 今日の学習データを別集計、タスク完了のDB保存対応、日付バグ修正
components/TaskItem.tsx 軽微な修正
app/api/study-logs/route.ts POST エンドポイント新規追加、force-dynamic 設定
app/api/study-logs/[taskId]/route.ts 既存GETの修正
app/api/tasks/route.ts 軽微な修正
lib/db.ts updateTaskDB を追加、cache: "no-store" を設定
.claude/.settings.json ClaudeCode の設定ファイルを追加

🔍 変更詳細とソースコード解説


1️⃣ Chart.tsx — グラフを2種類に分割

■ props の型定義

type Props = {
  data: { name: string; value: number }[];      // 累計学習時間(棒グラフ用)
  todayData: { name: string; value: number }[]; // 今日の学習時間(円グラフ用)
};

export default function Chart({ data, todayData }: Props) {

👉 ポイント