fix: truncate long filter tags in model selector and prevent wrapping

This commit addresses an issue where long filter tags at the top of the model selector dropdown were not truncated correctly and would wrap to a new line, causing layout issues.

- A hard character limit of 16 characters is applied to the filter tags within the `Selector.svelte` component. Tags longer than 16 characters are truncated with an ellipsis (...) directly in the code. The full tag name remains available in the tooltip.
- The `whitespace-nowrap` class has been added to the tag container to ensure that the tags remain on a single, horizontally scrollable line.

src/lib/components/chat/ModelSelector/Selector.svelte

@@ -435,7 +435,7 @@
 						}}
 					>
 						<div
-							class="flex gap-1 w-fit text-center text-sm rounded-full bg-transparent px-1.5"
+							class="flex gap-1 w-fit text-center text-sm rounded-full bg-transparent px-1.5 whitespace-nowrap"
 							bind:this={tagsContainerElement}
 						>
 							{#if items.find((item) => item.model?.connection_type === 'local') || items.find((item) => item.model?.connection_type === 'external') || items.find((item) => item.model?.direct) || tags.length > 0}
@@ -500,6 +500,7 @@
 							{/if}
 
 							{#each tags as tag}
+								<Tooltip content={tag}>
 									<button
 										class="min-w-fit outline-none px-1.5 py-0.5 {selectedTag === tag
 											? ''
@@ -510,8 +511,9 @@
 											selectedTag = tag;
 										}}
 									>
-									{tag}
+										{tag.length > 16 ? `${tag.slice(0, 16)}...` : tag}
 									</button>
+								</Tooltip>
 							{/each}
 						</div>
 					</div>