feat: #80 バッジタイプ別画像マッピングを追加

[kdix-23-071]

実装の概要

取得したバッチセクションでトロフィーを含む全バッジタイプを表示するため、BadgeListコンポーネントにバッジタイプ（trophy, gold, silver, bronze）に応じた画像マッピング機能を実装しました。

🔧 技術的な意思決定とトレードオフ (最重要)

採用したアプローチ

• 手法: バッジのtypeプロパティ（trophy, gold, silver, bronze）に基づいて、対応する画像ファイルを判定する条件分岐を実装。後方互換性のため、IDや名前による判別ロジックも保持。
• メリット:
  • バッジタイプと画像の対応関係が明確で可読性が高い
  • 新しいバッジタイプを追加する際の修正箇所が明確
  • 既存のバッジデータ（IDや名前ベース）との互換性を維持
• デメリット/リスク:
  • 画像ファイル名がハードコードされており、画像ファイル名変更時にコード修正が必要
  • バッジタイプと画像の対応を設定ファイルで管理していないため、柔軟性に欠ける

却下したアプローチ（代替案）

• 手法: 画像パスをバックエンドAPIから取得し、動的に表示する方法
• 却下理由: 現段階ではバッジの種類が限定的であり、APIの実装コストに対する利益が少ないと判断。将来的にバッジが大幅に増える場合は再検討の余地あり。

🧪 テスト戦略と範囲

追加したテストケース

• 正常系: 各バッジタイプ（trophy, gold, silver, bronze）が正しい画像で表示されることをブラウザで確認
• 異常系: （自動テストは未実装）
• テストしていないこと:
  • 画像ファイルが存在しない場合のフォールバック動作
  • バッジが大量にある場合のレンダリングパフォーマンス
  • 各種ブラウザでの互換性

セキュリティに関する自己評価

• 機密情報のハードコードはないか
• 入力値の検証（バリデーション）は行っているか（バッジデータはバックエンドから取得）
• 既知の脆弱性パターンへの対策は考慮したか

レビュワー（人間）への申し送り事項

• 実装完了後、動作確認のスクリーンショットを追加予定です
• 画像ファイル名の命名規則について、より適切な方法があればご提案ください

Closes #80

[kdix-23-071]