feat(quota): improve refresh button functionality and update translations

- Added a new `isRefreshing` state to streamline loading logic for the refresh button.
- Updated the refresh button's disabled and loading states for better user experience.
- Simplified the refresh button content display.
- Revised translations for the refresh action in both English and Chinese locales.
- Enhanced styles for button alignment and SVG display.
This commit is contained in:
moxi
2026-01-04 01:05:58 +08:00
parent 38a3e20427
commit 6364bac1f2
4 changed files with 16 additions and 15 deletions

View File

@@ -211,6 +211,8 @@ export function QuotaSection<TState extends QuotaStatusState, TData>({
</div> </div>
); );
const isRefreshing = sectionLoading || loading;
return ( return (
<Card <Card
title={titleNode} title={titleNode}
@@ -242,14 +244,12 @@ export function QuotaSection<TState extends QuotaStatusState, TData>({
variant="secondary" variant="secondary"
size="sm" size="sm"
onClick={handleRefresh} onClick={handleRefresh}
disabled={disabled || sectionLoading || loading || filteredFiles.length === 0} disabled={disabled || isRefreshing || filteredFiles.length === 0}
loading={sectionLoading || loading} loading={isRefreshing}
title={t('quota_management.refresh_files_and_quota')} title={t('quota_management.refresh_files_and_quota')}
aria-label={t('quota_management.refresh_files_and_quota')}
> >
<span className={styles.refreshButtonContent}> {!isRefreshing && <IconRefreshCw size={16} />}
{!sectionLoading && !loading && <IconRefreshCw size={18} />}
{t('quota_management.refresh_files_and_quota')}
</span>
</Button> </Button>
</div> </div>
} }

View File

@@ -713,7 +713,7 @@
"title": "Quota Management", "title": "Quota Management",
"description": "Monitor OAuth quota status for Antigravity, Codex, and Gemini CLI credentials.", "description": "Monitor OAuth quota status for Antigravity, Codex, and Gemini CLI credentials.",
"refresh_files": "Refresh auth files", "refresh_files": "Refresh auth files",
"refresh_files_and_quota": "Refresh auth files & page quota" "refresh_files_and_quota": "Refresh files & quota"
}, },
"system_info": { "system_info": {
"title": "Management Center Info", "title": "Management Center Info",

View File

@@ -713,7 +713,7 @@
"title": "配额管理", "title": "配额管理",
"description": "集中查看 OAuth 额度与剩余情况", "description": "集中查看 OAuth 额度与剩余情况",
"refresh_files": "刷新认证文件", "refresh_files": "刷新认证文件",
"refresh_files_and_quota": "刷新认证文件列表&当前页额度" "refresh_files_and_quota": "刷新认证文件&额度"
}, },
"system_info": { "system_info": {
"title": "管理中心信息", "title": "管理中心信息",

View File

@@ -31,6 +31,14 @@
gap: $spacing-sm; gap: $spacing-sm;
flex-wrap: wrap; flex-wrap: wrap;
align-items: center; align-items: center;
:global(.btn-sm) {
line-height: 16px;
}
:global(svg) {
display: block;
}
} }
.titleWrapper { .titleWrapper {
@@ -136,13 +144,6 @@
align-items: center; align-items: center;
} }
.refreshButtonContent {
display: inline-flex;
align-items: center;
gap: $spacing-xs;
white-space: nowrap;
}
.antigravityCard { .antigravityCard {
background-image: linear-gradient(180deg, background-image: linear-gradient(180deg,
rgba(224, 247, 250, 0.12), rgba(224, 247, 250, 0.12),