package playersview

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

templ PlayerSeasonsTab(seasonInfos []*db.PlayerSeasonInfo) {
	if len(seasonInfos) == 0 {
		<div class="bg-surface0 border border-surface1 rounded-lg p-8 text-center">
			<p class="text-subtext0 text-lg">No season history yet.</p>
			<p class="text-subtext1 text-sm mt-2">This player has not participated in any seasons.</p>
		</div>
	} else {
		<div class="bg-surface0 border border-surface1 rounded-lg overflow-hidden">
			<div class="overflow-x-auto">
				<table class="w-full">
					<thead class="bg-mantle border-b border-surface1">
						<tr>
							<th class="px-4 py-3 text-left text-sm font-semibold text-text">Season</th>
							<th class="px-4 py-3 text-left text-sm font-semibold text-text">League</th>
							<th class="px-4 py-3 text-left text-sm font-semibold text-text">Team</th>
							<th class="px-4 py-3 text-center text-sm font-semibold text-text">Role</th>
						</tr>
					</thead>
					<tbody class="divide-y divide-surface1">
						for _, info := range seasonInfos {
							<tr class="hover:bg-surface1 transition-colors">
								<td class="px-4 py-3 text-sm">
									<a
										href={ templ.SafeURL(fmt.Sprintf("/seasons/%s", info.Season.ShortName)) }
										class="text-blue hover:text-blue/80 transition"
									>
										{ info.Season.Name }
									</a>
								</td>
								<td class="px-4 py-3 text-sm text-subtext0">
									{ info.League.Name }
								</td>
								<td class="px-4 py-3 text-sm">
									<a
										href={ templ.SafeURL(fmt.Sprintf(
											"/seasons/%s/leagues/%s/teams/%d",
											info.Season.ShortName, info.League.ShortName, info.Team.ID,
										)) }
										class="text-blue hover:text-blue/80 transition"
									>
										<div class="flex items-center gap-2">
											if info.Team.Color != "" {
												<div
													class="w-3 h-3 rounded-full border border-surface1 shrink-0"
													style={ "background-color: " + templ.SafeCSS(info.Team.Color) }
												></div>
											}
											<span>{ info.Team.Name }</span>
										</div>
									</a>
								</td>
								<td class="px-4 py-3 text-sm text-center">
									if info.IsManager {
										<span class="px-2 py-0.5 bg-yellow/20 text-yellow rounded text-xs font-medium">
											Manager
										</span>
									} else {
										<span class="text-subtext1 text-xs">Player</span>
									}
								</td>
							</tr>
						}
					</tbody>
				</table>
			</div>
		</div>
	}
}