From ac6292b812f400b9180c5a26b5ccae7611a88703 Mon Sep 17 00:00:00 2001
From: silentoplayz <jacwoo21@outlook.com>
Date: Fri, 26 Sep 2025 13:28:35 -0400
Subject: [PATCH] Fix: truncate long model tags with a character limit

Long model tags on the Models page in the workspace section were not truncated consistently, which could cause layout issues.

This change implements a hard character limit of 32 characters on the model tags. Tags longer than 32 characters are truncated with an ellipsis (...) directly in the code. The full tag name remains available in the tooltip.
---
 src/lib/components/workspace/Models.svelte | 22 ++++++++++++----------
 1 file changed, 12 insertions(+), 10 deletions(-)

diff --git a/src/lib/components/workspace/Models.svelte b/src/lib/components/workspace/Models.svelte
index 9710a71d4e..f6a2deb40e 100644
--- a/src/lib/components/workspace/Models.svelte
+++ b/src/lib/components/workspace/Models.svelte
@@ -305,16 +305,18 @@
 				</button>
 
 				{#each tags as tag}
-					<button
-						class="min-w-fit outline-none p-1.5 {selectedTag === tag
-							? ''
-							: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition capitalize"
-						on:click={() => {
-							selectedTag = tag;
-						}}
-					>
-						{tag}
-					</button>
+					<Tooltip content={tag}>
+						<button
+							class="min-w-fit outline-none p-1.5 {selectedTag === tag
+								? ''
+								: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition capitalize"
+							on:click={() => {
+								selectedTag = tag;
+							}}
+						>
+							{tag.length > 32 ? `${tag.slice(0, 32)}...` : tag}
+						</button>
+					</Tooltip>
 				{/each}
 			</div>
 		</div>