package seasonsview

import "git.haelnorr.com/h/oslstats/internal/db"
import "git.haelnorr.com/h/oslstats/internal/contexts"
import "git.haelnorr.com/h/oslstats/internal/permissions"
import "fmt"

templ SeasonLeagueFinalsPage(
	season *db.Season,
	league *db.League,
	bracket *db.PlayoffBracket,
	topGoals []*db.LeagueTopGoalScorer,
	topAssists []*db.LeagueTopAssister,
	topSaves []*db.LeagueTopSaver,
	allStats []*db.LeaguePlayerStats,
) {
	@SeasonLeagueLayout("finals", season, league) {
		@SeasonLeagueFinals(season, league, bracket, topGoals, topAssists, topSaves, allStats)
	}
}

templ SeasonLeagueFinals(
	season *db.Season,
	league *db.League,
	bracket *db.PlayoffBracket,
	topGoals []*db.LeagueTopGoalScorer,
	topAssists []*db.LeagueTopAssister,
	topSaves []*db.LeagueTopSaver,
	allStats []*db.LeaguePlayerStats,
) {
	{{
		permCache := contexts.Permissions(ctx)
		canManagePlayoffs := permCache != nil && permCache.HasPermission(permissions.PlayoffsManage)
		hasStats := len(topGoals) > 0 || len(topAssists) > 0 || len(topSaves) > 0 || len(allStats) > 0
	}}
	<div id="finals-content">
		if bracket != nil {
			@PlayoffBracketView(season, league, bracket)
			<!-- Finals Stats Section -->
			if hasStats {
				<div class="mt-8">
					@finalsStatsSection(season, league, topGoals, topAssists, topSaves, allStats)
				</div>
			}
		} else if canManagePlayoffs {
			@finalsNotYetConfigured(season, league)
		} else {
			@finalsNotConfigured()
		}
	</div>
}

templ finalsStatsSection(
	season *db.Season,
	league *db.League,
	topGoals []*db.LeagueTopGoalScorer,
	topAssists []*db.LeagueTopAssister,
	topSaves []*db.LeagueTopSaver,
	allStats []*db.LeaguePlayerStats,
) {
	<script src="/static/js/sortable-table.js"></script>
	<div class="space-y-8">
		<div class="flex items-center gap-2">
			<span class="text-yellow">&#9733;</span>
			<h2 class="text-xl font-bold text-text">Finals Stats</h2>
		</div>
		<!-- Trophy Leaders -->
		if len(topGoals) > 0 || len(topAssists) > 0 || len(topSaves) > 0 {
			<div class="space-y-4">
				<h3 class="text-lg font-bold text-text text-center">Trophy Leaders</h3>
				<div class="flex flex-col items-center gap-6 w-full">
					<div class="flex flex-col lg:flex-row gap-6 justify-center items-stretch w-full lg:w-auto">
						@topGoalScorersTable(season, league, topGoals)
						@topAssistersTable(season, league, topAssists)
					</div>
					@topSaversTable(season, league, topSaves)
				</div>
			</div>
		}
		<!-- All Finals Stats -->
		if len(allStats) > 0 {
			<div class="space-y-4">
				<h3 class="text-lg font-bold text-text text-center">All Finals Stats</h3>
				@allStatsTable(season, league, allStats)
			</div>
		}
	</div>
}

templ finalsNotYetConfigured(season *db.Season, league *db.League) {
	<div class="bg-surface0 border border-surface1 rounded-lg p-8 text-center">
		<div class="mb-4">
			<svg class="w-12 h-12 mx-auto text-subtext0 mb-3" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
				<path stroke-linecap="round" stroke-linejoin="round" d="M16.5 18.75h-9m9 0a3 3 0 013 3h-15a3 3 0 013-3m9 0v-3.375c0-.621-.503-1.125-1.125-1.125h-.871M7.5 18.75v-3.375c0-.621.504-1.125 1.125-1.125h.872m5.007 0H9.497m5.007 0a7.454 7.454 0 01-.982-3.172M9.497 14.25a7.454 7.454 0 00.981-3.172M5.25 4.236c-.982.143-1.954.317-2.916.52A6.003 6.003 0 007.73 9.728M5.25 4.236V4.5c0 2.108.966 3.99 2.48 5.228M5.25 4.236V2.721C7.456 2.41 9.71 2.25 12 2.25c2.291 0 4.545.16 6.75.47v1.516M18.75 4.236c.982.143 1.954.317 2.916.52A6.003 6.003 0 0016.27 9.728M18.75 4.236V4.5c0 2.108-.966 3.99-2.48 5.228m0 0a6.003 6.003 0 01-2.77.836 6.003 6.003 0 01-2.77-.836"></path>
			</svg>
		</div>
		<p class="text-text text-lg font-semibold mb-2">No Finals Configured</p>
		<p class="text-subtext0 mb-6">
			Set up the playoff bracket for this league.
		</p>
		<button
			hx-get={ fmt.Sprintf("/seasons/%s/leagues/%s/finals/setup", season.ShortName, league.ShortName) }
			hx-target="#finals-content"
			hx-swap="innerHTML"
			class="px-6 py-3 bg-blue hover:bg-blue/80 text-mantle rounded-lg font-semibold transition hover:cursor-pointer"
		>
			Begin Finals
		</button>
	</div>
}

templ finalsNotConfigured() {
	<div class="bg-surface0 border border-surface1 rounded-lg p-8 text-center">
		<p class="text-subtext0 text-lg">No finals configured for this league.</p>
	</div>
}