From 92bc5c78fd95cdd76be6ac343a3281be19127ade Mon Sep 17 00:00:00 2001
From: gwdgithubnom <gwd163nom@163.com>
Date: Wed, 27 May 2026 16:26:43 +0800
Subject: [PATCH 1/2] fix(ui): move 'add entry' button to entries toolbar

---
 .../sheets/forms/BaseProviderForm.tsx         | 26 ++++++++++---------
 .../sheets/forms/sharedForm.module.scss       |  4 +++
 2 files changed, 18 insertions(+), 12 deletions(-)

diff --git a/src/features/providers/sheets/forms/BaseProviderForm.tsx b/src/features/providers/sheets/forms/BaseProviderForm.tsx
index 03dd197..232d937 100644
--- a/src/features/providers/sheets/forms/BaseProviderForm.tsx
+++ b/src/features/providers/sheets/forms/BaseProviderForm.tsx
@@ -635,7 +635,20 @@ export function BaseProviderForm({
           defaultOpen
         >
           <div className={styles.entriesList}>
-            <div className={styles.entriesToolbar}>
+            <div className={`${styles.entriesToolbar} ${styles.entriesToolbarSplit}`}>
+              {/* Add entry button on the left */}
+              <button
+                type="button"
+                className={styles.addBtn}
+                disabled={mutating}
+                onClick={() =>
+                  updateField('apiKeyEntries', [emptyApiKeyEntry(), ...apiKeyEntries])
+                }
+              >
+                <IconPlus size={12} />
+                <span>{t('providersPage.form.addApiKeyEntry')}</span>
+              </button>
+              {/* Test all button on the right */}
               <button
                 type="button"
                 className={styles.connectivityBtn}
@@ -762,17 +775,6 @@ export function BaseProviderForm({
                 </div>
               );
             })}
-            <button
-              type="button"
-              className={styles.addBtn}
-              disabled={mutating}
-              onClick={() =>
-                updateField('apiKeyEntries', [...apiKeyEntries, emptyApiKeyEntry()])
-              }
-            >
-              <IconPlus size={12} />
-              <span>{t('providersPage.form.addApiKeyEntry')}</span>
-            </button>
           </div>
         </Collapsible>
       ) : null}
diff --git a/src/features/providers/sheets/forms/sharedForm.module.scss b/src/features/providers/sheets/forms/sharedForm.module.scss
index 1e5773f..f3079c3 100644
--- a/src/features/providers/sheets/forms/sharedForm.module.scss
+++ b/src/features/providers/sheets/forms/sharedForm.module.scss
@@ -221,6 +221,10 @@
   margin-bottom: 2px;
 }
 
+.entriesToolbarSplit {
+  justify-content: space-between;
+}
+
 .connectivityRow {
   display: flex;
   align-items: center;

From c958e3084b753b478fa0790bb67505a1f8daf643 Mon Sep 17 00:00:00 2001
From: gwdgithubnom <gwd163nom@163.com>
Date: Wed, 27 May 2026 23:19:30 +0800
Subject: [PATCH 2/2] fix(ui): resolve connectivity status mismatch after
 prepend insertion

Prepending new API key entries shifted all existing indices, causing useConnectivityTest index-based status tracking to desync.

Fix: keep array operations as append (stable indices) and reverse the rendering order so new entries appear at the top visually. Use realIdx for status lookups, React keys, and all updateField operations.
---
 .../sheets/forms/BaseProviderForm.tsx         | 21 ++++++++++---------
 1 file changed, 11 insertions(+), 10 deletions(-)

diff --git a/src/features/providers/sheets/forms/BaseProviderForm.tsx b/src/features/providers/sheets/forms/BaseProviderForm.tsx
index 232d937..820bb16 100644
--- a/src/features/providers/sheets/forms/BaseProviderForm.tsx
+++ b/src/features/providers/sheets/forms/BaseProviderForm.tsx
@@ -642,7 +642,7 @@ export function BaseProviderForm({
                 className={styles.addBtn}
                 disabled={mutating}
                 onClick={() =>
-                  updateField('apiKeyEntries', [emptyApiKeyEntry(), ...apiKeyEntries])
+                  updateField('apiKeyEntries', [...apiKeyEntries, emptyApiKeyEntry()])
                 }
               >
                 <IconPlus size={12} />
@@ -663,16 +663,17 @@ export function BaseProviderForm({
                 <span>{t('providersPage.connectivity.testAll')}</span>
               </button>
             </div>
-            {apiKeyEntries.map((entry, idx) => {
-              const status = connectivity.openaiStatuses[idx] ?? {
+            {[...apiKeyEntries].reverse().map((entry, visualIdx) => {
+              const realIdx = apiKeyEntries.length - 1 - visualIdx;
+              const status = connectivity.openaiStatuses[realIdx] ?? {
                 state: 'idle' as ConnectivityState,
                 message: '',
               };
               return (
-                <div key={idx} className={styles.entryCard}>
+                <div key={realIdx} className={styles.entryCard}>
                   <div className={styles.entryCardHeader}>
                     <span>
-                      {t('providersPage.form.apiKeyEntry', { index: idx + 1 })}
+                      {t('providersPage.form.apiKeyEntry', { index: realIdx + 1 })}
                     </span>
                     <div className={styles.entryCardHeaderRight}>
                       <ConnectivityStatusIcon state={status.state} />
@@ -680,7 +681,7 @@ export function BaseProviderForm({
                         type="button"
                         className={styles.connectivityBtnGhost}
                         disabled={mutating || status.state === 'loading'}
-                        onClick={() => void connectivity.runOpenAIKey(idx)}
+                        onClick={() => void connectivity.runOpenAIKey(realIdx)}
                       >
                         {status.state === 'loading' ? (
                           <span className={`${styles.statusIcon} ${styles.statusIconLoading}`}>
@@ -696,7 +697,7 @@ export function BaseProviderForm({
                         onClick={() =>
                           updateField(
                             'apiKeyEntries',
-                            apiKeyEntries.filter((_, i) => i !== idx)
+                            apiKeyEntries.filter((_, i) => i !== realIdx)
                           )
                         }
                       >
@@ -716,7 +717,7 @@ export function BaseProviderForm({
                         updateField(
                           'apiKeyEntries',
                           apiKeyEntries.map((it, i) =>
-                            i === idx ? { ...it, apiKey: e.target.value } : it
+                            i === realIdx ? { ...it, apiKey: e.target.value } : it
                           )
                         )
                       }
@@ -735,7 +736,7 @@ export function BaseProviderForm({
                         updateField(
                           'apiKeyEntries',
                           apiKeyEntries.map((it, i) =>
-                            i === idx ? { ...it, proxyUrl: e.target.value } : it
+                            i === realIdx ? { ...it, proxyUrl: e.target.value } : it
                           )
                         )
                       }
@@ -759,7 +760,7 @@ export function BaseProviderForm({
                         updateField(
                           'apiKeyEntries',
                           apiKeyEntries.map((it, i) =>
-                            i === idx ? { ...it, headersText: e.target.value } : it
+                            i === realIdx ? { ...it, headersText: e.target.value } : it
                           )
                         )
                       }