refactored view package

internal/view/seasonsview/list_page.templ

@@ -0,0 +1,110 @@
+package seasonsview
+
+import "git.haelnorr.com/h/oslstats/internal/db"
+import "git.haelnorr.com/h/oslstats/internal/view/baseview"
+import "git.haelnorr.com/h/oslstats/internal/view/pagination"
+import "git.haelnorr.com/h/oslstats/internal/view/sort"
+import "fmt"
+import "time"
+import "github.com/uptrace/bun"
+
+templ ListPage(seasons *db.List[db.Season]) {
+	@baseview.Layout("Seasons") {
+		<div class="max-w-screen-2xl mx-auto px-2">
+			@SeasonsList(seasons)
+		</div>
+	}
+}
+
+templ SeasonsList(seasons *db.List[db.Season]) {
+	{{
+		sortOpts := []db.OrderOpts{
+			{
+				Order:   bun.OrderDesc,
+				OrderBy: "start_date",
+				Label:   "Start Date (Newest First)",
+			},
+			{
+				Order:   bun.OrderAsc,
+				OrderBy: "start_date",
+				Label:   "Start Date (Oldest First)",
+			},
+			{
+				Order:   bun.OrderAsc,
+				OrderBy: "name",
+				Label:   "Name (A-Z)",
+			},
+			{
+				Order:   bun.OrderDesc,
+				OrderBy: "name",
+				Label:   "Name (Z-A)",
+			},
+		}
+	}}
+	<div id="seasons-list-container">
+		<form
+			id="seasons-form"
+			hx-target="#seasons-list-container"
+			hx-swap="outerHTML"
+			hx-push-url="true"
+			x-data={ templ.JSFuncCall("paginateData", 
+        "seasons-form",
+        "/seasons",
+				seasons.PageOpts.Page, 
+				seasons.PageOpts.PerPage, 
+				seasons.PageOpts.Order, 
+				seasons.PageOpts.OrderBy).CallInline }
+		>
+			<!-- Header with title and sort controls -->
+			<div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 mb-6 px-4">
+				<div class="flex gap-4 items-center">
+					<span class="text-3xl font-bold">Seasons</span>
+					<a
+						href="/seasons/new"
+						class="rounded-lg px-2 py-1 hover:cursor-pointer text-center text-sm
+                bg-green hover:bg-green/75 text-mantle transition"
+					>Add season</a>
+				</div>
+				@sort.Dropdown(seasons.PageOpts, sortOpts)
+			</div>
+			<!-- Results section -->
+			if len(seasons.Items) == 0 {
+				<div class="bg-mantle border border-surface1 rounded-lg p-8 text-center">
+					<p class="text-subtext0 text-lg">No seasons found</p>
+				</div>
+			} else {
+				<!-- Card grid -->
+				<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+					for _, s := range seasons.Items {
+						<a
+							class="bg-mantle border border-surface1 rounded-lg p-6 hover:bg-surface0 transition-colors"
+							href={ fmt.Sprintf("/seasons/%s", s.ShortName) }
+						>
+							<!-- Header: Name + Status Badge -->
+							<div class="flex justify-between items-start mb-3">
+								<h3 class="text-xl font-bold text-text">{ s.Name }</h3>
+								@StatusBadge(s, true, true)
+							</div>
+							<!-- Info Row: Short Name + Start Date -->
+							<div class="flex items-center gap-3 text-sm">
+								<span class="px-2 py-1 bg-surface1 rounded text-subtext0 font-mono">
+									{ s.ShortName }
+								</span>
+								<span class="text-subtext0">
+									Started: { formatDate(s.StartDate) }
+								</span>
+							</div>
+						</a>
+					}
+				</div>
+				<!-- Pagination controls -->
+				@pagination.Pagination(seasons.PageOpts, seasons.Total)
+			}
+		</form>
+		<script src="/static/js/pagination.js"></script>
+	</div>
+}
+
+func formatDate(t time.Time) string {
+	return t.Format("02/01/2006") // DD/MM/YYYY
+}