feat: dashboard and chart improvements

- Add 4 new leagues: Eredivisie (N1), Primeira Liga (P1), Scottish Premiership (SC0), Championship (E1)
- Replace Defence with Clean Sheets in Team Performance radar chart
- Rename Goals Trend to Goal Trends
- Convert date labels to gameweeks (GW1-GW38) for better readability
- Show team names and date in Highest Scoring Match stat
- Remove SQL Ball logo from European League Analytics heading

Author: ThomasJButler

backend/api/dashboard.py

@@ -202,23 +202,16 @@ async def get_chart_data(
         chart_data = None
 
         if chart_type == "goals_trend":
-            # Calculate goals per match over time
+            # Calculate goals per match over time with gameweek labels
             dates = []
             home_goals = []
             away_goals = []
             total_goals = []
 
-            for match in matches[:380]:  # Full season of matches to show complete timeline
-                # Format date as "Mon DD" for better display
-                match_date = match.get('match_date', '')
-                if match_date:
-                    try:
-                        dt = datetime.fromisoformat(str(match_date).replace('Z', '+00:00'))
-                        formatted_date = dt.strftime('%b %d')
-                    except:
-                        formatted_date = str(match_date)[:10]  # Fallback to YYYY-MM-DD
-                else:
-                    formatted_date = ''
+            for idx, match in enumerate(matches[:380]):  # Full season of matches to show complete timeline
+                # Convert to gameweek format (every 10 games = 1 gameweek)
+                gameweek = (idx // 10) + 1
+                formatted_date = f'GW{gameweek}'
 
                 dates.append(formatted_date)
                 home_goals.append(match.get('home_score', 0) or 0)

backend/chroma_db/26374997-a192-4f1c-952f-d2dc72f2bf57/length.bin

@@ -65,7 +65,7 @@
   let mostCommonScore = '0-0';
   let topScoringTeam = '';
   let totalTeams = 0;
-  let highestScoringMatch = { goals: 0, score: '0-0' };
+  let highestScoringMatch = { goals: 0, score: '0-0', homeTeam: '', awayTeam: '', date: '' };
 
   let goalsChart: ChartData<"line", number[], string> = {
     labels: [],
@@ -120,14 +120,26 @@
           // Calculate highest scoring match
           let highestMatchGoals = 0;
           let highestMatchScore = '0-0';
+          let highestMatchHomeTeam = '';
+          let highestMatchAwayTeam = '';
+          let highestMatchDate = '';
           dashboardData.recent_matches.forEach(m => {
             const totalGoals = (m.home_score || 0) + (m.away_score || 0);
             if (totalGoals > highestMatchGoals) {
               highestMatchGoals = totalGoals;
               highestMatchScore = `${m.home_score || 0}-${m.away_score || 0}`;
+              highestMatchHomeTeam = m.home_team || '';
+              highestMatchAwayTeam = m.away_team || '';
+              highestMatchDate = m.match_date || '';
             }
           });
-          highestScoringMatch = { goals: highestMatchGoals, score: highestMatchScore };
+          highestScoringMatch = {
+            goals: highestMatchGoals,
+            score: highestMatchScore,
+            homeTeam: highestMatchHomeTeam,
+            awayTeam: highestMatchAwayTeam,
+            date: highestMatchDate
+          };
         }
 
         console.log('Dashboard loaded from API:', {
@@ -241,14 +253,26 @@
     // Calculate highest scoring match
     let highestMatchGoals = 0;
     let highestMatchScore = '0-0';
+    let highestMatchHomeTeam = '';
+    let highestMatchAwayTeam = '';
+    let highestMatchDate = '';
     validMatches.forEach(m => {
       const totalGoals = (m.home_score || 0) + (m.away_score || 0);
       if (totalGoals > highestMatchGoals) {
         highestMatchGoals = totalGoals;
         highestMatchScore = `${m.home_score || 0}-${m.away_score || 0}`;
+        highestMatchHomeTeam = m.home_team || '';
+        highestMatchAwayTeam = m.away_team || '';
+        highestMatchDate = m.match_date || '';
       }
     });
-    highestScoringMatch = { goals: highestMatchGoals, score: highestMatchScore };
+    highestScoringMatch = {
+      goals: highestMatchGoals,
+      score: highestMatchScore,
+      homeTeam: highestMatchHomeTeam,
+      awayTeam: highestMatchAwayTeam,
+      date: highestMatchDate
+    };
 
     // Count unique teams (should be close to 397 from European leagues)
     const teams = new Set<string>();
@@ -527,8 +551,7 @@
         </div>
       {/if}
 
-      <h2 class="text-2xl font-bold text-slate-800 dark:text-green-400 mb-6 flex items-center gap-3">
-        <img src="/sqlballlogo.svg" alt="SQL Ball Logo" class="w-8 h-8" />
+      <h2 class="text-2xl font-bold text-slate-800 dark:text-green-400 mb-6">
         European League Analytics
       </h2>
       <EnhancedVisualizations
@@ -619,6 +642,16 @@
         <div class="text-xs text-slate-500 dark:text-slate-500 leading-tight">
           {highestScoringMatch.score}
         </div>
+        {#if highestScoringMatch.homeTeam && highestScoringMatch.awayTeam}
+          <div class="text-xs text-slate-600 dark:text-slate-400 mt-2 font-medium">
+            {highestScoringMatch.homeTeam} vs {highestScoringMatch.awayTeam}
+          </div>
+        {/if}
+        {#if highestScoringMatch.date}
+          <div class="text-xs text-slate-500 dark:text-slate-500 mt-1">
+            {format(new Date(highestScoringMatch.date), 'MMM d, yyyy')}
+          </div>
+        {/if}
       </div>
     </div>
   {/if}

public/sqlballlogo.svg public/football.svgpublic/sqlballlogo.svg renamed to public/football.svg

@@ -75,7 +75,11 @@
     { value: 'SP1', label: 'La Liga', icon: '🇪🇸' },
     { value: 'D1', label: 'Bundesliga', icon: '🇩🇪' },
     { value: 'I1', label: 'Serie A', icon: '🇮🇹' },
-    { value: 'F1', label: 'Ligue 1', icon: '🇫🇷' }
+    { value: 'F1', label: 'Ligue 1', icon: '🇫🇷' },
+    { value: 'N1', label: 'Eredivisie', icon: '🇳🇱' },
+    { value: 'P1', label: 'Primeira Liga', icon: '🇵🇹' },
+    { value: 'SC0', label: 'Scottish Premiership', icon: '🏴󠁧󠁢󠁳󠁣󠁴󠁿' },
+    { value: 'E1', label: 'Championship', icon: '🏴󠁧󠁢󠁥󠁮󠁧󠁿' }
   ];
 
   // League-specific top teams (based on typical strong performers)
@@ -84,7 +88,11 @@
     'SP1': ['Real Madrid', 'Barcelona', 'Atletico Madrid', 'Real Sociedad', 'Betis', 'Villarreal', 'Athletic Club', 'Valencia'],
     'D1': ['Bayern Munich', 'Dortmund', 'RB Leipzig', 'Union Berlin', 'Eintracht Frankfurt', 'Bayer Leverkusen', 'Freiburg', 'Wolfsburg'],
     'I1': ['Inter', 'Juventus', 'AC Milan', 'Napoli', 'Roma', 'Lazio', 'Atalanta', 'Fiorentina'],
-    'F1': ['PSG', 'Marseille', 'Monaco', 'Lyon', 'Lille', 'Rennes', 'Nice', 'Lens']
+    'F1': ['PSG', 'Marseille', 'Monaco', 'Lyon', 'Lille', 'Rennes', 'Nice', 'Lens'],
+    'N1': ['PSV', 'Ajax', 'Feyenoord', 'AZ Alkmaar', 'Twente', 'Utrecht', 'Go Ahead Eagles', 'Heerenveen'],
+    'P1': ['Benfica', 'Porto', 'Sporting CP', 'Braga', 'Vitoria Guimaraes', 'Moreirense', 'Famalicao', 'Casa Pia'],
+    'SC0': ['Celtic', 'Rangers', 'Hearts', 'Aberdeen', 'Hibernian', 'Motherwell', 'Dundee Utd', 'Kilmarnock'],
+    'E1': ['Leicester', 'Leeds', 'Southampton', 'Burnley', 'Sheffield Utd', 'Norwich', 'Middlesbrough', 'West Brom']
   };
 
   // Filter matches based on league with loading state
@@ -336,12 +344,10 @@
       };
     }
 
-    const labels = recentMatches.map(m => {
-      try {
-        return format(new Date(m.match_date), 'MMM dd');
-      } catch (e) {
-        return 'Invalid Date';
-      }
+    // Convert to gameweek labels (every 10 games = 1 gameweek)
+    const labels = recentMatches.map((m, idx) => {
+      const gameweek = Math.floor(idx / 10) + 1;
+      return `GW${gameweek}`;
     });
     const homeGoals = recentMatches.map(m => m.home_score || 0);
     const awayGoals = recentMatches.map(m => m.away_score || 0);
@@ -447,7 +453,7 @@
       const apiData = apiChartData.team_performance;
       const colors = ['#10b981', '#f59e0b', '#ef4444', '#8b5cf6', '#06b6d4', '#f97316'];
       return {
-        labels: apiData.labels || ['Wins', 'Points/Game', 'Goals/Game', 'Defense', 'Form'],
+        labels: apiData.labels || ['Wins', 'Points/Game', 'Goals/Game', 'Clean Sheets', 'Form'],
         datasets: (apiData.datasets || []).map((dataset: any, index: number) => ({
           ...dataset,
           borderColor: dataset.borderColor || colors[index] || '#10b981',
@@ -493,24 +499,31 @@
       const matchesPlayed = teamMatches.length;
       const goalDifference = goals - goalsAgainst;
 
+      // Calculate clean sheets (matches where team conceded 0 goals)
+      const cleanSheets = teamMatches.filter(m => {
+        if (m.home_team === team) return (m.away_score || 0) === 0;
+        if (m.away_team === team) return (m.home_score || 0) === 0;
+        return false;
+      }).length;
+
       return {
         wins: wins * 2, // Scale for visualization
         points: points / Math.max(matchesPlayed, 1) * 10, // Points per game * 10
         goals: goals / Math.max(matchesPlayed, 1) * 15, // Goals per game * 15
-        defense: Math.max(0, (20 - (goalsAgainst / Math.max(matchesPlayed, 1) * 10))), // Defensive rating
+        cleanSheets: cleanSheets * 2, // Clean sheets scaled for visualization
         form: goalDifference > 0 ? Math.min(goalDifference * 2, 20) : 0 // Goal difference scaled
       };
     });
 
     return {
-      labels: ['Wins', 'Points/Game', 'Goals/Game', 'Defense', 'Form'],
+      labels: ['Wins', 'Points/Game', 'Goals/Game', 'Clean Sheets', 'Form'],
       datasets: teams.map((team, i) => ({
         label: team,
         data: [
           stats[i].wins,
           stats[i].points,
           stats[i].goals,
-          stats[i].defense,
+          stats[i].cleanSheets,
           stats[i].form
         ],
         borderColor: colors[i] || '#10b981',
@@ -835,10 +848,10 @@
     <div class="flex items-center justify-between mb-4">
       <div class="flex items-center gap-2">
         <TrendingUp class="w-4 h-4 sm:w-5 sm:h-5 text-green-500" />
-        <h3 class="text-base sm:text-lg font-bold text-slate-900 dark:text-green-400 font-mono">Goals Trend</h3>
+        <h3 class="text-base sm:text-lg font-bold text-slate-900 dark:text-green-400 font-mono">Goal Trends</h3>
       </div>
       <button
-        on:click={() => handleQueryClick('goals_trend', 'Goals Trend')}
+        on:click={() => handleQueryClick('goals_trend', 'Goal Trends')}
         class="flex items-center gap-1.5 px-3 py-1.5 bg-green-500 hover:bg-green-600 text-white text-xs sm:text-sm rounded-lg transition-colors shadow-sm"
         title="Generate SQL query for this chart"
       >