- Fix uptime service card bottom spacing by removing flex layout
- Replace IconRotate with IconSend for request count to better represent semantic meaning
- Add skeleton loading placeholders for all dashboard statistics with 500ms minimum duration
- Unify avgRPM and avgTPM calculation with consistent NaN handling
- Standardize skeleton usage across HeaderBar and Detail components with active animations
- Remove unnecessary empty wrapper elements in skeleton implementations
- Remove gradient styling from system name in header
The changes improve user experience with consistent loading states, better semantic icons,
and eliminate visual layout issues in the dashboard cards.
- Remove flex layout from uptime service card to eliminate bottom spacing
- Remove flex-1 and mt-auto classes that caused unnecessary stretching
- Replace IconRotate with IconSend for request count to better represent the semantic meaning
- Legend now sits directly below content instead of being pushed to bottom
Fixes the visual issue where uptime service availability card had unwanted white space at the bottom when content was minimal.
* Added an “Jump” (`ExternalLink`) tag to each API entry that opens the URL in a new tab
* Placed “Speed Test” and “Jump” tags on the same line as the route
* Route is left-aligned; tags are right-aligned and wrap to next line when space is insufficient
* Inserted `<Divider />` between API items to improve visual separation
* Tweaked flex gaps and utility classes for consistent spacing and readability
Summary
• Added visual model icons to dropdown options in both Token (`EditToken.js`) and Channel (`EditChannel.js`) editors.
Details
1. Token Editor
- Imported `getModelCategories` from helpers.
- Re-built Model Limits option list to prepend the matching icon to each model label.
2. Channel Editor
- Imported `getModelCategories`.
- Extended model‐option construction to include icons, unifying behaviour with Token editor.
- Maintained existing logic for merging origin options and user-selected models.
Benefits
• Provides immediate visual identification of model vendors.
• Aligns UX with existing icon usage across the application, improving consistency and clarity.
• No functional changes to data handling; purely UI/UX enhancement.
Co-authored-by: [Your Name]
Changes:
• `Form.Select` for “Model Limits” now supports in-dropdown searching (`filter` + `searchPosition='dropdown'`) enabling quick model lookup.
• Removed `maxTagCount` to display all selected models without truncation.
Benefit: simplifies selecting specific models when the list is large, improving usability during token creation/editing.
Backend
• `model/channel.go`
– On multi-key channel updates, recalculate `MultiKeySize` from the current key list.
– If the request omits `key`, fetch existing keys from DB to avoid resetting the count to `0/0`.
– Remove out-of-range entries from `MultiKeyStatusList` to keep data consistent.
Frontend
• `web/src/pages/Channel/EditChannel.js`
– Vertex AI channels no longer require re-uploading a key file in edit mode.
– When no new key is provided during editing, exclude the `key` field from the payload to prevent overwriting the stored value.
These changes ensure that editing a channel no longer zeroes out the enabled key counter and that Vertex AI channels can be modified without mandatory key re-submission.
Add custom validator to the `expired_time` DatePicker in `EditToken.js`
to ensure that selected expiration timestamps are strictly in the future.
- Introduce Promise-based validator that:
• Rejects invalid date formats with a clear error message
• Prevents past or current dates and shows “Expiration time cannot be earlier than the current time!”
- Keeps support for the special “never expires” value (-1)
- Blocks form submission until a valid future datetime is provided
This change prevents accidental creation of already expired tokens and
improves overall robustness of token management.
This commit overhauls the `TokensTable` component to deliver a cleaner, more intuitive experience.
Key changes
1. Quota
• Merged “Used” & “Remaining” into a single “Quota” column.
• Uses a circular `Progress` with %-label; full details shown on tooltip.
2. Status
• Tag now embeds a small `Switch` (prefixIcon) to enable/disable a token in-place.
• Removed enable/disable actions from the old dropdown.
3. Columns & layout
• Added dedicated “Group” column (moved from Status).
• Added “Key” column:
– Read-only `Input` styled like Home page base-URL field.
– Masked value (`sk-abc********xyz`) by default.
– Eye button toggles reveal/hide; Copy button copies full key (without modal).
• Dropped “More” menu; Delete is now a direct button in the action area.
4. Model limits
• Shows vendor icons inside an `AvatarGroup`; tooltip lists the exact models.
5. IP restriction
• Displays first IP, extra count as “+N” Tag with tooltip.
• Unlimited shows white Tag.
6. Cleanup / misc.
• Removed unused helpers (`getQuotaPerUnit`), icons (`IconMore`, eye/copy duplicates, etc.).
• Replaced legacy modal view of key with inline input behaviour.
• Tweaked paddings, themes, sizes to align with design system.
BREAKING CHANGE: Table column order & names have changed; update any tests or docs referencing the old structure.
- import Kling & Jimeng icons from @lobehub/icons
- extend getChannelIcon() to return corresponding icons for new channel types 50 (Kling) and 51 (Jimeng)
- enhance EditChannel type selector:
• introduce useMemo‐based channelOptionList with leading icons
• utilize getChannelIcon for consistent icon rendering in dropdown options
- minor refactor: add useMemo and getChannelIcon imports in EditChannel.js
Summary
• **EditChannel.js**
– Relocated the following conditional inputs from “Advanced Settings” to the initial “Basic Info” card:
• Model version (type 18)
• Deployment region (type 41)
• Knowledge-base ID (type 21)
• Account ID (type 39)
• Agent ID (type 49)
• OpenAI organization (type 1)
– No functional changes; layout only.
Why
These fields are commonly filled during the first steps of channel creation. Surfacing them earlier reduces scrolling and streamlines the user workflow.
Summary
• **EditChannel.js**
– Displays “Fetch Model List” button for both *create* and *edit* modes (removed `isEdit` guard).
– Unified model selector placeholder to “Please choose supported models”.
– Added null-safety checks when parsing Axios responses.
– Sends requests with `{ skipErrorHandler: true }`, preventing generic *500 Internal Server Error* toasts and relying on context-specific messages instead.
• **helpers/api.js**
– Introduced `skipErrorHandler` flag in the Axios response interceptor.
If present, global `showError` is bypassed, giving callers full control over user-facing notifications.
– Ensures `Promise.reject(error)` is returned for proper error propagation.
Why
Channel creators now enjoy the same convenience as editors when importing upstream model lists.
Meanwhile, suppressing redundant toasts removes confusion caused by simultaneous custom and generic error messages.
This commit brings System Settings in line with Payment Settings and
prepares the whole component for multi-language deployments.
Key points
----------
• Introduced a “General Settings” card in `SystemSetting.js`
- Adds a `ServerAddress` field (copied from Payment Settings).
- Explains that this URL is used for payment callback & default homepage.
- Implements `submitServerAddress` to persist the option.
• Internationalisation
- Imported `useTranslation` and wrapped **all** Chinese UI strings in `t()`.
- Localised section titles, labels, placeholders, banners, buttons,
modal texts and toast messages.
- Dynamic banner/tool-tip descriptions now combine `t()` fragments with
template literals for runtime URLs.
• UX improvements
- Added contextual `extraText` under the ServerAddress input.
- Ensured placeholders like “sensitive info…” are translatable.
With these changes, administrators can configure the server URL from the
System Settings tab, and the entire page is ready for seamless language
switching via the existing i18n framework.
Summary
1. Load `channel_info` when editing:
• Detect if the channel is in multi-key mode (`is_multi_key`).
• Auto-initialize `batch`, `multiToSingle`, and `multiKeyMode` from backend data.
2. Visibility logic
• Creation page: “Batch create / Multi-key mode” always available.
• Edit page: show these controls **only when** the channel itself is multi-key.
3. State consistency
• `multi_key_mode` added to `inputs`; `setValues(inputs)` now preserves the user’s selection.
Result
Single-key channels no longer display irrelevant “key aggregation” options, while multi-key channels open with the correct defaults, providing a cleaner and more accurate editing experience.
Introduce two new visualizations to the “Model Data Analysis” panel:
1. Model Consumption Trend (line chart)
• Added `spec_model_line` state and legend support.
• Calculates per-model counts over time and updates via `updateChartData`.
2. Model Call Ranking (bar chart)
• Added `spec_rank_bar` state with `seriesField` and legend enabled.
• Ranks models by total call count.
Additional changes:
• Extended tab navigation with two new `TabPane`s and adjusted chart rendering logic.
• Swapped icons/texts to match new chart purposes.
• Reused existing color mapping to ensure consistent palette.
No breaking changes; UI now offers richer insights into model usage patterns.
Summary:
• Imported InputNumber from @douyinfe/semi-ui.
• Swapped plain Input for InputNumber in “Add Quota” modal.
• Added UX tweaks: full-width styling, showClear, step = 500 000.
• Initialized addQuotaLocal to an empty string so the field starts blank.
• Adjusted state handling and kept quota calculation logic unchanged.
This improves numeric input accuracy and overall user experience without breaking existing functionality.
Motivation
• Remove unused UI components to keep the bundle lean and silence linter warnings.
• Ensure every time the side-sheet opens it reflects the latest tag data, avoiding stale form values (e.g., model / group mismatches).
Key Changes
1. UI Imports
– Dropped `Input`, `Select`, `TextArea` from `@douyinfe/semi-ui` (unused in Form-based version).
2. State Reset & Form Sync
– On `visible` or `tag` change:
• Refresh model & group options.
• Reset `inputs` to clean defaults (`originInputs`) carrying the current `tag`.
• Pre-fill Form through `formApiRef` to keep controlled fields aligned.
3. Minor Cleanup
– Added inline comment clarifying local state reset purpose.
Result
Opening the “Edit Tag” side-sheet now always displays accurate data without residual selections, and build output is cleaner due to removed dead imports.
Overview
• Migrated both `EditChannel.js` and `EditToken.js` to fully leverage Semi UI `Form.*` components, removing legacy `Input/Select/TextArea` + manual labels.
• Unified data-loading strategy: when the drawer becomes visible we load (or reset) data via `props.visible + id` effect and `formApi.setValues()`, guaranteeing fields are always populated; form resets on close.
• Fixed blank-form bug when opening the same record twice.
Key improvements
1. Validation
• `type`, `models` always required.
• `key` required only while creating (not on edit).
2. Batch key creation
• Checkbox moved into `extraText`; hidden when editing or when channel type = 41.
3. Layout & UI
• `Row / Col` (12 + 12) for “Priority” and “Weight”.
• Placeholders revised; model selector now shows creation hint; removed obsolete banner.
• Help / extraText used for long hints, template buttons (`model_mapping`, `status_code_mapping`, `param_override`, etc.), and API address notice.
• Added `showClear`, `min`, rounded card class names for consistency.
4. Reusable helpers
• `batchAllowed`, `batchExtra` utilities.
• `getInitValues()` + centralized `inputs`→form synchronization.
5. Token editor aligned to the same pattern (`props.visiable` watcher).
Result
Cleaner code, consistent UX, instant field population on every open, and clearer validation/error feedback across both editors.
Previously, the "Fetch Model List" button was visible in the channel-creation view even though
it only functions once a channel record exists, leading to user confusion.
Changes introduced:
• Render the "Fetch Model List" button only when editing an existing channel (`isEdit === true`).
• Display an informational Banner in creation mode to remind users that the upstream model list
can be fetched after the channel has been created.
• Refactored JSX to apply the above conditional rendering without altering existing logic.
This update streamlines the creation workflow and sets clearer expectations for users.
Changes in `web/src/pages/User/EditUser.js`:
• Added `rules` to
– `Form.Select group`: now required with error “Please select group”.
– `Form.InputNumber quota`: now required with error “Please enter quota”.
• Added `step={500000}` to quota `InputNumber` for quicker numeric input.
• Replaced invalid `readonly` with React-correct `readOnly`, and added descriptive placeholders for all binding-info fields (GitHub/OIDC/WeChat/Email/Telegram).
• Removed unused `downloadTextAsFile` import.
These updates tighten form validation, improve data entry ergonomics, and restore clear read-only indicators for third-party bindings.
SUMMARY
• Re-implemented `EditToken.js` with Semi Form components, eliminating manual state handling and reducing re-renders.
• Added grid-based layout; “Expiration Time” selector now sits inline with quick-set buttons for consistent alignment on desktop & mobile.
• Introduced dedicated “Quota”, “Access”, “Model Limits”, and “Group” cards for clearer field grouping.
• Reworked model-limit interaction: single multi-select list replaces checkbox toggle; backend flag `model_limits_enabled` is now inferred automatically.
• Applied required validation rules to critical fields (`name`, `remain_quota`, `group`, `expired_time`, `tokenCount`) with localized messages.
• Enabled dynamic option loading for models & groups; default auto-group honoured.
• Added unlimited-quota switch, quota presets, and helpful extraText/tooltips.
• Removed obsolete `handleInputChange` & `setUnlimitedQuota` helpers; formApi now manages all data flow.
• Cleaned imports (e.g., dropped unused `IconUserGroup`), fixed linter errors, and updated submit logic to use `formApi.submitForm()`.
RESULT
The token creation/editing experience is faster, more accessible, and easier to maintain, fully aligned with Semi Design best practices.
Summary
• Replaced gradient header blocks with compact, neutral headers wrapped in `Avatar` across the following pages:
- Channel / EditChannel.js
- Channel / EditTagModal.js
- Redemption / EditRedemption.js
- Token / EditToken.js
- User / EditUser.js
- User / AddUser.js
Details
1. Added `Avatar` import and substituted raw icon elements, assigning semantic colors (`blue`, `green`, `purple`, `orange`, etc.) and consistent 16 px icons for a cleaner look.
2. Removed gradient backgrounds, decorative “blur-ball” shapes, and extra paddings from header containers to achieve a tight, flat design.
3. Stripped all `size="large"` attributes from `Button`, `Input`, `Select`, `DatePicker`, `AutoComplete`, and `Avatar` components, allowing default sizing for better visual density.
4. Eliminated redundant `bodyStyle` background overrides in some `SideSheet` components.
5. No business logic touched; all changes are purely presentational.
Result
The editing and creation dialogs now share a unified, compact style consistent with the latest design language, improving readability and user experience without altering functionality.
This commit refreshes the visual design of the authentication pages and aligns them with the Home banner style.
Details
• LoginForm.js / RegisterForm.js / PasswordResetForm.js / PasswordResetConfirm.js
– Wrap top-level container with `relative overflow-hidden` to provide a positioning context.
– Inject two decorative blur balls:
▸ Indigo ball on the top-right (`blur-ball-indigo`).
▸ Teal ball on the middle-left (`blur-ball-teal`).
– Disabled the default X-axis transform on the indigo ball to keep the ball anchored to the corner.
– Removed redundant `mt-[64px]` from the outer container and shifted it to the inner wrapper to maintain vertical rhythm without affecting the background placement.
Result
The auth screens now feature subtle, non-intrusive atmospheric gradients in the top-right and mid-left corners, offering a cohesive look & feel across the application without obstructing the main content.
• Added read-only Base URL input that shows `status.server_address` (fallback `window.location.origin`) and copies value on click.
• Embedded `ScrollList` as input `suffix`; auto-cycles common endpoints every 3 s and allows manual selection.
• Introduced `API_ENDPOINTS` array in `web/src/constants/common.constant.js` for centralized endpoint management.
• Implemented custom CSS to hide ScrollList wheel indicators / scrollbars for a cleaner look.
• Created two blurred colour spheres behind the banner (`blur-ball-indigo`, `blur-ball-teal`) with light-/dark-mode opacity tweaks and lower vertical placement.
• Increased letter-spacing for Chinese heading via conditional `tracking-wide` / `md:tracking-wider` classes to improve readability.
• Misc: updated imports, helper functions, and responsive sizes to keep UI consistent across devices.
• Unify the Select option structure as `{ key, label, value }`; add missing `key` to prevent duplicated rendering by Semi-UI.
• Trim and deduplicate the `models` array via `Set` inside `handleInputChange`, ensuring state always contains unique values.
• In the options-merging `useEffect`, use a `Map` keyed by `value` (after `trim`) to guarantee a unique `optionList` when combining backend data with currently selected models.
• Apply the same structure and de-duplication when:
– Fetching models from `/api/channel/models`
– Adding custom models (`addCustomModels`)
– Fetching upstream model lists (`fetchUpstreamModelList`)
• Replace obsolete `text` field with `label` in custom option objects for consistency.
No backend changes are required; the fix is entirely front-end.
Closes#1292
* Added a dedicated effect to merge origin and selected models, ensuring selected items always remain in the dropdown list.
* Enhanced “Copy all models” button:
* Shows info message when list is empty.
* Displays success / error notification based on copy result.
* Unified UI look-and-feel by applying `!rounded-lg` class to inputs, selects, banners and buttons.
* i18n: added English translations for new prompts
- "No models to copy"
- "Model list copied to clipboard"
- "Copy failed"
Add a `useEffect` hook in `UpstreamRatioSync.js` to automatically set
`currentPage` to `1` whenever `ratioTypeFilter` or `searchKeyword`
updates.
This prevents the table from appearing empty when users switch to the
“model_price” (fixed price) filter or perform a new search while on a
later page.
Additional changes:
- Import `useEffect` from React.
This enhancement delivers a smoother UX by ensuring the first page of
results is always shown after any filtering action.
Introduce the ability to quickly locate models with conflicting billing configurations.
Key points
• Added `hasConflict` flag to detect models that define both a fixed price (`ModelPrice`) and any ratio (`ModelRatio` or `CompletionRatio`).
• Added “Show Only Conflict Rates” `Checkbox` to toolbar; filtering logic now supports keyword + conflict filtering.
• Display a red `Tag` beside the model name when a conflict is detected for immediate visual feedback.
• Kept `hasConflict` state in sync during add, update and delete operations.
• Imported `Checkbox` and `Tag` from **@douyinfe/semi-ui**.
• Minor UI tweaks (circle tag style, margin) for consistency.
This enhancement helps administrators swiftly identify and resolve incompatible pricing rules, addressing the need discussed in issue #1286.
• SettingsAnnouncements.js
– Placeholder now states “Supports Markdown/HTML” for both small & expanded editors
– Success/alert messages unified to use Chinese quotation marks
• SettingsFAQ.js
– Answer textarea placeholder updated with Markdown/HTML support note
– Unified success/alert messages punctuation
These tweaks clarify rich-text support and keep UI copy consistent.
