ui: final sweep extracting SortFilter and standardizing empty notifications to ui.EmptyState

internal/shared/ui/sort_filter.templ

@@ -0,0 +1,38 @@
+package ui
+
+type SortFilterOptions struct {
+	Sort   string // "title", "date", "score"
+	Order  string // "asc", "desc"
+	View   string // for watchlist: "grid", "table"
+	Status string // for watchlist: "all", "watching", etc
+}
+
+templ SortFilter(opts SortFilterOptions) {
+	<div class="sort-filter">
+		<div class="sort-filter-group">
+			<label for="sort-select">Sort by</label>
+			<select id="sort-select" class="sort-filter-select" onchange="document.getElementById('sort-input').value = this.value; document.getElementById('sort-form').submit()">
+				<option value="date" selected?={ opts.Sort == "date" }>Date added</option>
+				<option value="title" selected?={ opts.Sort == "title" }>Title</option>
+				<option value="score" selected?={ opts.Sort == "score" }>Score</option>
+			</select>
+		</div>
+		<div class="sort-filter-group">
+			<label for="order-select">Order</label>
+			<select id="order-select" class="sort-filter-select" onchange="document.getElementById('order-input').value = this.value; document.getElementById('sort-form').submit()">
+				<option value="desc" selected?={ opts.Order == "desc" }>Descending</option>
+				<option value="asc" selected?={ opts.Order == "asc" }>Ascending</option>
+			</select>
+		</div>
+	</div>
+	<form id="sort-form" method="get" style="display: none;">
+		<input type="hidden" name="sort" id="sort-input" value={ opts.Sort }/>
+		<input type="hidden" name="order" id="order-input" value={ opts.Order }/>
+		if opts.View != "" {
+			<input type="hidden" name="view" value={ opts.View }/>
+		}
+		if opts.Status != "" {
+			<input type="hidden" name="status" value={ opts.Status }/>
+		}
+	</form>
+}