From c2cc4370610844283650ae07055151652c1d9c45 Mon Sep 17 00:00:00 2001
From: Aidan Bleser <117548273+ieedan@users.noreply.github.com>
Date: Thu, 19 Jun 2025 09:40:09 -0500
Subject: [PATCH] feat: filter for free models on `/account/models` (#30)

---
 src/routes/account/models/+page.svelte | 22 +++++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)

diff --git a/src/routes/account/models/+page.svelte b/src/routes/account/models/+page.svelte
index a0bb89a..638f175 100644
--- a/src/routes/account/models/+page.svelte
+++ b/src/routes/account/models/+page.svelte
@@ -30,6 +30,11 @@
 		disabled: true,
 	});
 
+	const freeModelsToggle = new Toggle({
+		value: false,
+		disabled: false,
+	});
+
 	let initiallyEnabled = $state<string[]>([]);
 	$effect(() => {
 		if (Object.keys(models.enabled).length && initiallyEnabled.length === 0) {
@@ -42,7 +47,13 @@
 
 	const openRouterModels = $derived(
 		fuzzysearch({
-			haystack: models.from(Provider.OpenRouter),
+			haystack: models.from(Provider.OpenRouter).filter((m) => {
+				if (!freeModelsToggle.value) return true;
+
+				if (m.pricing.prompt === '0') return true;
+
+				return false;
+			}),
 			needle: search,
 			property: 'name',
 		}).sort((a, b) => {
@@ -76,6 +87,15 @@
 			<XIcon class="inline size-3 group-aria-[pressed=false]:hidden" />
 			<PlusIcon class="inline size-3 group-aria-[pressed=true]:hidden" />
 		</button>
+		<button
+			{...freeModelsToggle.trigger}
+			aria-label="Free Models"
+			class="group text-primary-foreground bg-primary aria-[pressed=false]:border-border border-primary aria-[pressed=false]:bg-background flex place-items-center gap-1 rounded-full border px-2 py-1 text-xs transition-all disabled:cursor-not-allowed disabled:opacity-50"
+		>
+			Free
+			<XIcon class="inline size-3 group-aria-[pressed=false]:hidden" />
+			<PlusIcon class="inline size-3 group-aria-[pressed=true]:hidden" />
+		</button>
 	</div>
 </div>