mirror of
https://github.com/router-for-me/Cli-Proxy-API-Management-Center.git
synced 2026-02-19 03:00:49 +08:00
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:
@@ -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>
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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",
|
||||||
|
|||||||
@@ -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": "管理中心信息",
|
||||||
|
|||||||
@@ -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),
|
||||||
|
|||||||
Reference in New Issue
Block a user