Add sorting options for contest summary (#357)

* add sorting by recent, collection, and placement

---------

Co-authored-by: ptlthg <[email protected]>

src/components/stats/jacob/crop-stats.svelte

@@ -4,8 +4,9 @@
 	import { getSelectedCrops } from '$lib/stores/selectedCrops';
 	import CropMedalCounts from '$comp/stats/jacob/crop-medal-counts.svelte';
 	import { CROP_TO_ELITE_CROP } from '$lib/constants/crops';
-	import { Crop, getCropFromName } from 'farming-weight';
+	import { Crop, getCropFromName, calcWeightForCrop } from 'farming-weight';
 	import ContestList from '$comp/stats/jacob/contest-list.svelte';
+	import * as Select from '$ui/select';
 	import { getStatsContext } from '$lib/stores/stats.svelte';
 
 	const ctx = getStatsContext();
@@ -30,13 +31,37 @@
 			.map(([key]) => key)
 	);
 
-	const contests = $derived(
-		crops.length === 0 ? Object.values(contestsByCrop).flat() : crops.flatMap((c) => contestsByCrop[c] ?? [])
-	);
+	let sortBy = $state<string>('recent');
+
+	const contests = $derived.by(() => {
+		let filteredContests =
+			crops.length === 0 ? Object.values(contestsByCrop).flat() : crops.flatMap((c) => contestsByCrop[c] ?? []);
+
+		// Filter unclaimed contests when sorting by placement
+		if (sortBy === 'placement') {
+			filteredContests = filteredContests.filter((contest) => (contest.position ?? -1) > -1);
+		}
+
+		return filteredContests.sort((a, b) => {
+			switch (sortBy) {
+				case 'collection':
+					return (b?.collected ?? 0) - (a?.collected ?? 0);
+				case 'placement':
+					return (a?.position ?? 0) - (b?.position ?? 0);
+				case 'weight': {
+					return (
+						(b.crop ? calcWeightForCrop(getCropFromName(b.crop) ?? Crop.Wheat, b.collected ?? 0) : 0) -
+						(a.crop ? calcWeightForCrop(getCropFromName(a.crop) ?? Crop.Wheat, a.collected ?? 0) : 0)
+					);
+				}
+				case 'recent':
+				default:
+					return (b?.timestamp ?? 0) - (a?.timestamp ?? 0);
+			}
+		});
+	});
 
-	const recentContests = $derived(
-		contests?.sort((a, b) => (b?.timestamp ?? 0) - (a?.timestamp ?? 0)).slice(0, 30) ?? []
-	);
+	const recentContests = $derived(contests?.slice(0, 30) ?? []);
 
 	const MEDAL_TYPES = ['diamond', 'platinum', 'gold', 'silver', 'bronze'] as const;
 
@@ -108,6 +133,31 @@
 				</div>
 			</div>
 		</div>
-		<ContestList contests={recentContests} remaining={contests.length - recentContests.length} />
+		<div class="w-full px-9">
+			<p class="mb-1.5 text-sm leading-none">Sort By</p>
+			<Select.Simple
+				class="md:w-48"
+				bind:value={sortBy}
+				options={[
+					{
+						value: 'recent',
+						label: 'Most Recent',
+					},
+					{
+						value: 'collection',
+						label: 'Highest Collection',
+					},
+					{
+						value: 'placement',
+						label: 'Best Placement',
+					},
+					{
+						value: 'weight',
+						label: 'Most Weight',
+					},
+				]}
+			/>
+		</div>
+		<ContestList contests={recentContests} remaining={Math.max(0, contests.length - recentContests.length)} />
 	</div>
 </div>