feat: タスク中断ボタンの実装

[Copilot]

タスク中断ボタン機能の実装 ✅

• TaskContext に handlePauseTask アクションを追加
• useTaskActions フックに中断処理ロジックを実装
• SortableTask コンポーネントに中断ボタンを追加（実行中タスクのみ表示）
• CurrentTaskFooter（画面下部のフッター）に中断ボタンを追加
• Prettierフォーマットチェックに対応（全ファイル合格） ← 完了
• ビルドとリントのチェック完了
• 中断機能のテストを追加（全52テストが成功）
• コードレビューのフィードバックに対応
• セキュリティスキャン完了（問題なし）
• 実装ドキュメント作成完了

実装概要

主な機能

• 実行中のタスクにオレンジ色の中断ボタン（Pauseアイコン）を追加
  • タスクカード内（右側）
  • 画面下部のフッター（停止ボタンの左側）
• ボタンクリックで現在のタスクを完了し、同じ属性で新しいタスクを自動作成
• 保持される属性: タイトル、説明、見積もり時間、カテゴリ、タスク日付
• リセットされる属性: 開始時刻、終了時刻、タスク順序

変更されたファイル

• ui/src/hooks/useTaskActions.ts - 中断ロジック実装
• ui/src/contexts/TaskContext.tsx - 型定義追加
• ui/src/components/task/SortableTask.tsx - タスクカードUI実装
• ui/src/components/CurrentTaskFooter.tsx - フッターUI実装
• ui/src/pages/TaskList/TaskList.tsx - フッターにhandlePauseTask渡し
• ui/src/hooks/useTaskActions.test.ts - テスト追加（新規）
• ui/.prettierignore - ビルド成果物を除外（新規）
• ui/.gitignore - dist/フォルダを除外

品質指標

• ✅ TypeScript ビルド: 成功
• ✅ ESLint: 合格
• ✅ Prettier: 合格（npx prettier --check "ui/**/*.{ts,tsx,js,jsx,json,md,yml}"）
• ✅ テスト: 52/52 合格
• ✅ CodeQL セキュリティスキャン: 問題なし
• ✅ コードレビュー: フィードバック対応済み

Original prompt

---

This section details on the original issue you should resolve

<issue_title>中断ボタンをつけたい</issue_title>
<issue_description>タスクを中断する際に押すボタンを作成したい。
中断ボタンを押した際は、該当のタスクには終了時刻を入れて完了させ、新たに同名のタスクを同じ属性(カテゴリ、見積もり時間)で作成するようにする。</issue_description>

<agent_instructions>日本語でprを作成して</agent_instructions>

Comments on the Issue (you are @copilot in this section)

• Fixes 中断ボタンをつけたい #66

---

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

[vercel]

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

Project	Deployment	Review	Updated (UTC)
tryjunie	Ready	Preview, Comment	Jan 9, 2026 3:06am

[nannany]

@copilot
実施中のタスクが画面下部に出ると思いますが、そこにも中断ボタンを足してほしい

[Copilot]

@copilot
実施中のタスクが画面下部に出ると思いますが、そこにも中断ボタンを足してほしい

画面下部のフッターに中断ボタンを追加しました（コミット: da3c963）

変更内容:

• CurrentTaskFooter.tsx: オレンジ色の中断ボタンを停止ボタンの左側に追加
• TaskList.tsx: フッターにhandlePauseTask関数を渡すように更新

ボタン配置:

[経過時間] [中断] [停止]
           ⬆ 新規追加

中断ボタンをクリックすると、現在のタスクを完了させ、同じ属性で新しいタスクを自動作成します。

[nannany]

@copilot npx prettier --check "ui/**/*.{ts,tsx,js,jsx,json,md,yml}"で警告されないようにして

[Copilot]

@copilot npx prettier --check "ui/**/*.{ts,tsx,js,jsx,json,md,yml}"で警告されないようにして

Prettierフォーマットチェックに対応しました（コミット: 2f7b6a1, 2d2de32）

変更内容:

• useTaskActions.test.ts: 長い行を分割してフォーマット
• .prettierignore: ビルド成果物を除外するファイルを追加
• .gitignore: dist/フォルダを追加

npx prettier --check "ui/**/*.{ts,tsx,js,jsx,json,md,yml}" が警告なしで成功するようになりました。