From c262fd75e1500ade5cad0a272d981b53c76e58a4 Mon Sep 17 00:00:00 2001
From: kangfenmao <kangfenmao@qq.com>
Date: Thu, 24 Jul 2025 15:43:26 +0800
Subject: [PATCH] refactor(ModelList): streamline button layout and improve
 accessibility

- Removed tooltip wrappers from manage and add model buttons for a cleaner UI.
- Introduced a new Flex container for primary and default buttons, enhancing layout consistency.
- Updated button rendering to improve accessibility and user experience.
---
 .../src/components/ModelList/ModelList.tsx         | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/renderer/src/components/ModelList/ModelList.tsx b/src/renderer/src/components/ModelList/ModelList.tsx
index b9c54d0c9f..5a3b12b9a0 100644
--- a/src/renderer/src/components/ModelList/ModelList.tsx
+++ b/src/renderer/src/components/ModelList/ModelList.tsx
@@ -112,12 +112,6 @@ const ModelList: React.FC<ModelListProps> = ({ providerId }) => {
             <CollapsibleSearchBar onSearch={setSearchText} />
           </HStack>
           <HStack>
-            <Tooltip title={t('button.manage')} mouseLeaveDelay={0}>
-              <Button type="text" onClick={onManageModel} icon={<ListCheck size={16} />} disabled={isHealthChecking} />
-            </Tooltip>
-            <Tooltip title={t('button.add')} mouseLeaveDelay={0}>
-              <Button type="text" onClick={onAddModel} icon={<Plus size={16} />} disabled={isHealthChecking} />
-            </Tooltip>
             <Tooltip title={t('settings.models.check.button_caption')} mouseLeaveDelay={0}>
               <Button
                 type="text"
@@ -163,6 +157,14 @@ const ModelList: React.FC<ModelListProps> = ({ providerId }) => {
           <div style={{ height: 5 }} />
         )}
       </Flex>
+      <Flex gap={10} style={{ marginTop: 10 }}>
+        <Button type="primary" onClick={onManageModel} icon={<ListCheck size={16} />} disabled={isHealthChecking}>
+          {t('button.manage')}
+        </Button>
+        <Button type="default" onClick={onAddModel} icon={<Plus size={16} />} disabled={isHealthChecking}>
+          {t('button.add')}
+        </Button>
+      </Flex>
       {models.map((model) => (
         <ModelEditContent
           provider={provider}