From cc14c03d51358e372dddf1a1a031ffd314ac5f45 Mon Sep 17 00:00:00 2001
From: Aleksander Grygier <aleksander.grygier@gmail.com>
Date: Thu, 24 Sep 2026 12:17:15 +0200
Subject: [PATCH] ui : cycle the table sort through three states

Assisted-by: pi:llama.cpp/DeepSeek-V4.1-Flash
---
 .../ModelsManagerModelsTable.svelte           | 25 +++++++++++++++----
 1 file changed, 20 insertions(+), 5 deletions(-)

diff --git a/tools/ui/src/lib/components/app/models/ModelsManager/ModelsManagerModelsTable.svelte b/tools/ui/src/lib/components/app/models/ModelsManager/ModelsManagerModelsTable.svelte
index 440b0ae281..7d18e9465e 100644
--- a/tools/ui/src/lib/components/app/models/ModelsManager/ModelsManagerModelsTable.svelte
+++ b/tools/ui/src/lib/components/app/models/ModelsManager/ModelsManagerModelsTable.svelte
@@ -239,15 +239,30 @@
 		return [...entries].sort((a, b) => direction * compareEntries(a, b));
 	}
 
+	/** A click on a new column sorts lowest first, then highest first, then clears. */
 	function toggleSort(key: SortKey): void {
-		if (sortKey === key) {
-			sortAsc = !sortAsc;
+		if (sortKey !== key) {
+			sortKey = key;
+			sortAsc = true;
 
 			return;
 		}
 
-		sortKey = key;
-		sortAsc = true;
+		if (sortAsc) {
+			sortAsc = false;
+
+			return;
+		}
+
+		sortKey = null;
+	}
+
+	function sortTitle(key: SortKey, label: string): string {
+		const name = label.toLowerCase();
+
+		if (sortKey !== key) return `Sort by ${name}, lowest first`;
+
+		return sortAsc ? `Sort by ${name}, highest first` : `Stop sorting by ${name}`;
 	}
 
 	function isLoadedOption(option: ModelOption): boolean {
@@ -283,7 +298,7 @@
 	<button
 		class="inline-flex cursor-pointer items-center gap-1 uppercase transition hover:text-foreground focus:outline-none"
 		onclick={() => toggleSort(key)}
-		title="Sort by {label.toLowerCase()}"
+		title={sortTitle(key, label)}
 		type="button"
 	>
 		{label}