v0.2.0-alpha Add Live stat Tracking

[a1ly404]

🏁 Major Features Added:

• Live stat tracking during roller derby bouts with real-time updates
• Position-specific rules enforcement (blockers can't score, position-based stats)
• Comprehensive bout score integration with batched updates
• End bout functionality with detailed summary page

📊 Live Stat Tracking Components:

• PlayerStatCard: Individual player stat management with position-aware controls
• LiveBoutHeader: Bout header with jam controls, timer, and end bout button
• JamLineupSelector: Team lineup selection for each jam
• StatButton: Reusable stat increment/decrement controls

🎮 Game Rules Implementation:

• Position-based scoring restrictions (blockers show blocks/assists instead of points)
• Pivot star passing functionality with visual indicators
• Automatic jam timer (2 minutes) with manual end jam capability
• Lead jammer tracking and penalty management

💾 Database Integration:

• Bout score updates batched at jam end to prevent UI spinners during gameplay
• Real-time player stat persistence with upsert operations for duplicate handling
• Bout status management (in_progress → completed)
• Comprehensive player statistics tracking (jams, points, blocks, assists, penalties)

🎨 UI/UX Improvements:

• Compact player cards designed to fit 5 players per team on screen
• Inline player info layout (number, name, position on same line)
• Quick stats display with 4 key metrics per player
• Position-colored badges and indicators
• Responsive design for various screen sizes

📈 Bout Summary & Reporting:

• Complete bout summary page showing final scores and winner
• Detailed player statistics for all participants
• Team-organized player performance breakdown
• Navigation options for new bout or return to bout list

🔧 Technical Implementation:

• React TypeScript components with proper type safety
• Supabase integration for real-time data persistence
• State management for live gameplay with jam-specific point tracking
• CSS Grid and Flexbox layouts for optimal space utilization
• Error handling and loading states throughout the application

This implementation provides a barebones solution for live roller derby bout tracking.

[Copilot]

Pull Request Overview

This PR introduces live stat tracking functionality for roller derby bouts, adding real-time statistics management with comprehensive test coverage. The implementation includes position-specific rule enforcement, bout management integration, and a complete testing infrastructure using Vitest and happy-dom.

Key Changes

• Live stat tracking system with jam-by-jam management and real-time player statistics
• Comprehensive test suite (119 tests, 87.15% coverage) with CI/CD pipeline integration
• Database performance optimizations for RLS policies and foreign key indexing

Reviewed Changes

Copilot reviewed 49 out of 52 changed files in this pull request and generated 4 comments.

Show a summary per file

File	Description
src/components/LiveStatTracker.tsx	Core live tracking component with bout management
src/components/PlayerStatCard.tsx	Interactive player stat cards with position-aware controls
src/components/JamLineupSelector.tsx	Lineup selection interface for jam management
src/components/LiveBoutHeader.tsx	Bout header with timer and jam controls
src/components/BoutSummary.tsx	Post-bout summary with detailed statistics
src/components/StatButton.tsx	Reusable stat increment/decrement controls
src/App.tsx	Integration of live tracking with navigation flow
src/components/Bouts.tsx	Added live tracking launch capability
src/components/Navigation.tsx	Added live track navigation option
vitest.config.ts	Test configuration using happy-dom environment
src/test/setup.ts	Comprehensive test setup with Supabase mocks
package.json	Test dependencies and script additions

Comments suppressed due to low confidence (1)

src/components/Bouts.tsx:167

• The date parsing logic assumes the date format contains 'T'. Consider using a more robust date parsing approach like new Date(bout.bout_date).toISOString().split('T')[0] to handle edge cases and ensure consistent formatting.

            bout_date: bout.bout_date.split('T')[0], // Convert to date input format

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[Copilot]

Pull Request Overview

Copilot reviewed 26 out of 28 changed files in this pull request and generated 4 comments.

Comments suppressed due to low confidence (1)

src/components/Bouts.tsx:167

• The date parsing logic assumes the bout_date always contains a 'T' character, but this could fail if the date format is different. Consider using new Date(bout.bout_date).toISOString().split('T')[0] for more robust date handling.

            bout_date: bout.bout_date.split('T')[0], // Convert to date input format

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[Copilot]

Pull Request Overview

Copilot reviewed 26 out of 28 changed files in this pull request and generated 3 comments.

Comments suppressed due to low confidence (1)

src/components/LiveBoutHeader.tsx:1

• Duplicate CSS definitions for .jam-number and .jam-timer. The first definitions at lines 63-66 and 68-75 should be removed to avoid conflicting styles.

import React, { useState, useEffect } from 'react'

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}