diff --git a/apps/maple-research/frontend/src/components/ModelSelector.tsx b/apps/maple-research/frontend/src/components/ModelSelector.tsx
index 116e438e7..e62ecf349 100644
--- a/apps/maple-research/frontend/src/components/ModelSelector.tsx
+++ b/apps/maple-research/frontend/src/components/ModelSelector.tsx
@@ -296,12 +296,17 @@ export function ModelSelector({
const elements: React.ReactNode[] = [];
if (selectedModel) {
- elements.push(selectedModel.display_name || selectedModel.short_name || modelId);
+ elements.push(
+
+ {selectedModel.display_name || selectedModel.short_name || modelId}
+
+ );
const badges = getModelBadges(modelId);
if (badges && badges.length > 0) {
badges.forEach((badge, index) => {
- let badgeClass = "rounded-md px-1.5 py-0.5 text-[10px] font-medium";
+ let badgeClass =
+ "shrink-0 whitespace-nowrap rounded-md px-1.5 py-0.5 text-[10px] font-medium leading-4";
if (badge === "Coming Soon") {
badgeClass += " bg-muted text-muted-foreground";
@@ -327,20 +332,18 @@ export function ModelSelector({
}
if (showLock && !hasAccessToModel(modelId)) {
- elements.push(