From 579d7d1e5dc72d385647321c91f53f4aa0c952ae Mon Sep 17 00:00:00 2001
From: ousugo <dkzyxh@gmail.com>
Date: Fri, 18 Apr 2025 03:31:32 +0800
Subject: [PATCH] refactor(ModelList): extract NameSpan component and adjust
 styling for better layout

---
 .../settings/ProviderSettings/ModelList.tsx   | 27 +++++++++++--------
 1 file changed, 16 insertions(+), 11 deletions(-)

diff --git a/src/renderer/src/pages/settings/ProviderSettings/ModelList.tsx b/src/renderer/src/pages/settings/ProviderSettings/ModelList.tsx
index cd5d6f5e..30076786 100644
--- a/src/renderer/src/pages/settings/ProviderSettings/ModelList.tsx
+++ b/src/renderer/src/pages/settings/ProviderSettings/ModelList.tsx
@@ -289,9 +289,9 @@ const ModelList: React.FC<ModelListProps> = ({ providerId, modelStatuses = [], s
                             </Typography.Text>
                           }
                           placement="top">
-                          <span>{model.name}</span>
+                          <NameSpan>{model.name}</NameSpan>
                         </Tooltip>
-                        <ModelTagsWithLabel model={model} size={11} />
+                        <ModelTagsWithLabel model={model} size={11} style={{ flexShrink: 0 }} />
                       </ListItemName>
                     </HStack>
                     <Flex gap={4} align="center">
@@ -371,15 +371,20 @@ const ListItemName = styled.div`
   font-size: 14px;
   line-height: 1;
   font-weight: 600;
-  span {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    cursor: help;
-    font-family: 'Ubuntu';
-    line-height: 30px;
-    font-size: 14px;
-  }
+  min-width: 0;
+  overflow: hidden;
+  flex: 1;
+  width: 0;
+`
+
+const NameSpan = styled.span`
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  cursor: help;
+  font-family: 'Ubuntu';
+  line-height: 30px;
+  font-size: 14px;
 `
 
 const RemoveIcon = styled(MinusCircleOutlined)`