* Introduced `showWithRecharge` switch in the actions bar to display model prices based on recharge cost.
* Added a `Select` dropdown (USD / CNY) that appears only when the recharge-price mode is enabled.
* Implemented `displayPrice()` helper to:
* Convert USD prices to recharge prices using `status.price` and `status.usd_exchange_rate`.
* Format output according to the selected currency.
* Updated price rendering for both quota types to use the new helper and respect K/M unit conversion.
* Removed the old currency switch from the header, retaining only the K/M unit toggle.
* Extended `SearchAndActions` memo dependencies; imported `Select` from Semi UI.
* Minor refactors and comment clean-up.
No breaking changes.
* Introduced a currency switch to toggle prices between USD and CNY.
* CNY prices are calculated by multiplying USD prices with the site-wide `price` rate from `/api/status`.
* Added a second switch to display prices per 1 M tokens or per 1 K tokens.
* When “K” is selected, prices are divided by 1 000 and labels are updated accordingly.
* Extended component state with `currency` and `tokenUnit` variables.
* Integrated `StatusContext` to retrieve and memoize the current exchange rate.
* Updated price rendering logic and labels to reflect selected currency and token unit.
* Minor UI tweaks: kept Switch components compact and aligned with the table header.
No breaking changes.
BREAKING CHANGE:
helpers/utils.js no longer exports `isMobile()`.
Any external code that relied on this function must switch to the `useIsMobile` React hook.
Summary
-------
1. Deleted the obsolete `isMobile()` function from helpers/utils.js.
2. Introduced `MOBILE_BREAKPOINT` constant and `matchMedia`-based detection for non-React contexts.
3. Reworked toast positioning logic in utils.js to rely on `matchMedia`.
4. Updated render.js:
• Removed isMobile import.
• Added MOBILE_BREAKPOINT detection in `truncateText`.
5. Migrated every page/component to the `useIsMobile` hook:
• Layout: HeaderBar, PageLayout, SiderBar
• Pages: Home, Detail, Playground, User (Add/Edit), Token, Channel, Redemption, Ratio Sync
• Components: ChannelsTable, ChannelSelectorModal, ConflictConfirmModal
6. Purged all remaining `isMobile()` calls and legacy imports.
7. Added missing `const isMobile = useIsMobile()` declarations where required.
Benefits
--------
• Unifies mobile detection with a React-friendly hook.
• Eliminates duplicated logic and improves maintainability.
• Keeps non-React helpers lightweight by using `matchMedia` directly.
Backend
1. controller/channel.go
• Always hydrate `ChannelInfo` from DB in `UpdateChannel`, keeping `IsMultiKey` true so `MultiKeySize` is recalculated.
2. model/channel.go
• getKeys(): accept both newline-separated keys and JSON array (`[ {...}, {...} ]`).
• Update(): reuse new parser-logic to recalc `MultiKeySize`; prune stale indices in `MultiKeyStatusList`.
Frontend
1. pages/Channel/EditChannel.js
• `handleVertexUploadChange`
– Reset `vertexErroredNames` on every change so the “ignored files” prompt always re-appears.
– In single-key mode keep only the last file; in batch mode keep all valid files.
– Parse files, display “以下文件解析失败，已忽略：…”.
• Batch-toggle checkbox
– When switching from batch→single while multiple files are present, show a confirm dialog and retain only the first file (synchronises state, form and local caches).
• On opening the “new channel” side-sheet, clear `vertexErroredNames` to restore error prompts.
Result
• “已启用 x/x” count updates immediately after editing multi-key channels.
• Vertex-AI key upload works intuitively: proper error feedback, no duplicated files, and safe down-switch from batch to single mode.
* Refactored the render logic of the **Channel** column
* Wrapped tooltip around the first `Tag` only to restore hover behavior when multi-key mode is enabled
* Added i18n-friendly fallback (`t('未知渠道')`) for cases where `channel_name` is missing
* Improves user experience for administrators by reliably showing channel names even with multiple keys
Summary
• Re-architect the status column to embed quota information directly inside the Tag suffix.
• Consolidate rendering logic for clearer structure and easier maintenance.
Details
• Moved the quota Progress bar under the remaining / total text, inside `quotaSuffix`.
• Added “Unlimited” label for tokens with `unlimited_quota`; hides Progress and Tooltip in this case.
• Tightened vertical spacing with a flex container (`gap-[2px]`, `leading-none`) and removed extra wrappers; Progress now has zero top/bottom margin and full-width style.
• Refactored variables:
– Replaced `tagNode/bodyContent` with a single `content` node.
– Wrapped `content` with Tooltip only when quota is limited.
• Visual tweaks:
– Applied `size='large'` to the Tag for better alignment.
– Ensured consistent color via shared `getProgressColor`.
• Deleted obsolete comments and redundant code.
Result
Improves readability of the component and delivers a cleaner, more compact quota display.
Includes ChannelsTable, RedemptionsTable and UsersTable:
• Refactor `refresh(page = activePage)` in all three tables so data reloads the requested (or current) page instead of forcing page 1.
• On single-row deletion (and bulk deletion in ChannelsTable):
– Refresh current page immediately.
– If the refreshed page has no data and `activePage > 1`, automatically load the previous page to avoid blank views.
• RedemptionsTable: corrected prior bug where `refresh` used `activePage - 1`.
• Misc: removed outdated inline comments and aligned search / reset flows.
Result: smoother UX—users stay on their working page, and pagination gracefully adjusts after deletions.
Adds UI fallback in TokensTable “Available Models” column:
• Tracks models already matched to a known vendor icon.
• Collects unmatched models and renders a neutral “Other” avatar (labelled via `t('其他')`) with a tooltip listing the model names.
• Removes previous generic fallback so every model is now either vendor-specific or grouped under “Other”.
This improves clarity for users by explicitly indicating models from unrecognized providers rather than leaving them unlabelled.
• Display remaining-quota percentage instead of used-quota in the Progress indicator
- 100 % when quota is untouched, shown in green
- Warn at ≤ 30 % (yellow) and at ≤ 10 % (red)
- Hide internal label (`showInfo={false}`) and move the percentage text into the Tooltip
- Switch Progress `size` to `small` for a lighter visual footprint
• Update Tooltip to list used, remaining, total quota and the new percentage value
• Uniformly set `size="small"` on all header Buttons and Form inputs within the table
— enhances readability and keeps the main content centered
UI/UX improvement only; no backend logic affected.
Backend
• `types/error.go`
– Return empty string when receiver itself is `nil`.
– If `Err` is `nil`, fall back to `errorCode` string to avoid calling `nil.Error()`.
This prevents runtime panics when the error handler builds an OpenAI-style error response but the underlying `Err` field has not been set.
Previously, the tooltip that appears when more than one IP address is configured
skipped the second IP (`ips.slice(2)`), so users could not see it unless they
expanded the list in another way.
Changed the slice start index to `1`, ensuring that **every IP after the first
display tag** is included in the tooltip (`ips.slice(1).join(', ')`).
File affected:
- web/src/components/table/TokensTable.js
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.
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.
* backend
- constant/endpoint_type.go
• Add EndpointTypeMidjourney, EndpointTypeSuno, EndpointTypeKling, EndpointTypeJimeng.
- common/endpoint_type.go
• Map Midjourney / MidjourneyPlus, SunoAPI, Kling, Jimeng channel types to the new endpoint types.
* frontend
- ModelPricing.js
• Add “Supported Endpoint Type” column.
• Implement renderSupportedEndpoints with `stringToColor` for consistent tag colors.
These changes allow `/api/pricing` and model lists to return accurate
`supported_endpoint_types` covering all non-OpenAI providers and display
them clearly in the UI.
No breaking changes.
Summary:
The redemption list occasionally displayed an invalid range such as “Items -9 - 0” and failed to highlight page 1 after a refresh. This was caused by the table being initialized with `currentPage = 0`.
Changes:
• update `useEffect` to load data starting from page 1 instead of page 0
• refactor `loadRedemptions` to accept `page` (default 1) and sanitize backend‐returned pages (`<= 0` coerced to 1)
• keep other logic unchanged
Impact:
Pagination text and page selection now show correct values on first load or refresh, eliminating negative ranges and ensuring the first page is properly highlighted.
Previously, the table did not enter the loading state after performing actions such as deleting, enabling, or disabling a redemption code. This caused a brief period where the UI appeared unresponsive while awaiting the backend response.
Changes made:
• Added `setLoading(true)` at the beginning of `loadRedemptions` to activate the loading spinner whenever data is (re)fetched.
• Added an explanatory code comment to clarify the intent.
This improves user experience by clearly indicating that the system is processing and prevents confusion during data refresh operations.
• Removed the custom `renderArrow` helper and its `Dropdown`-based arrow navigation, simplifying the component logic.
• Switched the `<Tabs>` component to rely on Semi UI’s built-in behaviour (no more `renderArrow` override).
• Kept `type="card"` and `collapsible` props for consistent visual appearance while still using the default style.
• Eliminated the now-unused `Dropdown` import.
This cleanup reduces bespoke UI code, makes future maintenance easier, and keeps the interface consistent with the rest of the application.
• 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.
• Removed the dropdown menu previously used for tag-level operations.
• Added a standalone “Edit” button directly after the “Disable All” button, reducing the number of clicks required to edit a tag group.
• Deleted the now-unused `IconEdit` import and its icon reference.
This streamlines the tag management flow and keeps the UI cleaner and more accessible.
All operation-related UI controls in `ChannelsTable` (buttons, dropdowns,
switches, inputs, tags, etc.) now explicitly use `size="small"`.
Reasons & benefits:
- Creates a more compact and consistent look across the table and modals.
- Improves visual coherence between desktop and mobile views.
- Purely presentational; no functional logic is affected.
No database changes or API interactions are involved.
* ChannelsTable
- Added row-level checkboxes to the model-testing table for multi-selection
- Implemented cross-page “Select All / Deselect All” via rowSelection.onSelectAll
- Introduced allSelectingRef to ignore redundant onChange after onSelectAll
- Added “Copy Selected” button to copy chosen model names (comma-separated) using helpers.copy
- Added “Select Successful” button to auto-tick all models that passed testing
- Moved search bar and new action buttons into the modal title for better UX
- Centralised page size constant MODEL_TABLE_PAGE_SIZE in channel.constants.js
- Fixed pagination slicing and auto-page-switch logic during batch testing
* channel.constants
- Exported MODEL_TABLE_PAGE_SIZE (default 10) for unified pagination control
This commit enables users to conveniently copy or filter successful models, fully supports cross-page bulk operations, and resolves previous selection inconsistencies.
Refs: #1288
Frontend (`ChannelsTable.js`)
1. Initialize `loading` state to `true` so the spinner is visible while the first data request is in-flight.
2. Set `<Table>` prop `loading={loading || searching}` — the spinner now appears for both the initial load and any subsequent search requests.
Result
Users immediately see a loading indicator on page entry and whenever a search is running, improving perceived responsiveness.
1. Backend
• `controller/channel.go`
– Added pagination (`p`, `page_size`) support to `SearchChannels`.
– Added independent `type` filter (keeps `type_counts` unaffected).
– Returned `total`, `type_counts` to match `/api/channel/` response.
2. Frontend
• `ChannelsTable.js`
– `loadChannels` / `searchChannels` now pass `p`, `page_size`, `id_sort`, `type`, `status` correctly.
– Pagination, page-size selector and type tabs work for both normal list and search mode.
– Switch for “ID sort” calls proper API and keeps UI state in sync.
– Removed unnecessary `normalize` helper; `getFormValues` back to concise form.
Result
• Search mode and normal listing now share identical pagination and filtering behavior.
• Type tabs show correct counts even after searching.
• “ID Sort” toggle no longer inverses actual behaviour.
Refactors `ChannelsTable.js` to ensure that the selected group filter is **never lost** when:
1. Cycling between channel-type tabs.
2. Changing the status dropdown (all / enabled / disabled).
Key points:
• `loadChannels` now detects active search filters (keyword / group / model) and transparently delegates to `searchChannels`, guaranteeing all parameters are sent in every request.
• `searchChannels` accepts optional `typeKey` and `statusF` arguments, enabling reuse without code duplication.
• Loading state handling is unified; no extra renders or side effects were introduced, keeping UI performance intact.
• Duplicate logic removed and responsibilities clearly separated for easier future maintenance.
Replaced the verbose placeholder “Search channel ID, name, key and API address ...”
with a concise version “Channel ID, name, key, API address” in
`ChannelsTable.js` and synchronized the corresponding i18n entries.
This improves readability and keeps UI text consistent across languages.
Ensure that the selected "group" filter (and other form search values) persist across
type tab changes, status filter updates, pagination, and page-size changes.
Changes include:
• loadChannels: added `searchParams` argument and now appends keyword, group and model
query strings to API calls.
• refresh / page handlers / type tabs / status Select: now pass current form values
to loadChannels, keeping filters intact.
• searchChannels: maintains active type and status filters when issuing search requests.
• Form.Select (searchGroup): triggers loadChannels when only group filter is active,
preventing parameter loss.
• Minor cleanup and comment adjustments.
WHAT’S NEW
• Backend
– Introduced `parseStatusFilter` helper to normalize `status` query across handlers.
– `GET /api/channel` & `GET /api/channel/search` now accept `status=enabled|disabled` to return only enabled or disabled channels.
– Tag-mode branch respects both `statusFilter` and `typeFilter`; SQL paths trimmed to one query + one lightweight `GROUP BY` for `type_counts`.
• Frontend (`ChannelsTable.js`)
– Added “Status Filter” `<Select>` (All / Enabled / Disabled) with localStorage persistence.
– All data-loading and search requests now always append `type` (when not “all”) and `status` params, so filtering & pagination are handled entirely server-side.
– Removed client-side post-filtering for type, preventing short pages and reducing CPU work.
– Tabs’ type counts stay in sync via backend-provided `type_counts`.
IMPROVEMENTS
• Eliminated duplicated status-parsing logic; single source of truth eases future extension.
• Reduced redundant queries, improved consistency of counts in UI.
• Secured key leakage with `Omit("key")` unchanged; no perf regressions observed.
Closes#1289
Summary
• Added per-table “Compact / Adaptive” view toggle to all major table components (Tokens, Channels, Logs, MjLogs, TaskLogs, Redemptions, Users).
• Persist user preference in a single localStorage entry (`table_compact_modes`) instead of scattered keys.
Details
1. utils.js
• Re-implemented `getTableCompactMode` / `setTableCompactMode` to read & write a shared JSON object.
• Imported storage-key constant from `constants`.
2. hooks/useTableCompactMode.js
• Hook now consumes the unified helpers and listens to `storage` events via the shared key constant.
3. constants
• Added `TABLE_COMPACT_MODES_KEY` to `common.constant.js` and re-exported via `constants/index.js`.
4. Table components
• Integrated `useTableCompactMode('<tableName>')`.
• Dynamically remove `fixed: 'right'` column and horizontal `scroll` when in compact mode.
• UI: toggle button placed at card title’s right; responsive layout on small screens.
5. UI polish
• Replaced all lucide-react `List`/`ListIcon` usages with Semi UI `IconDescend` for consistency.
• Restored correct icons where `Hash` was intended (TaskLogsTable).
Benefits
• Consistent UX for switching list density across the app.
• Cleaner localStorage footprint with easier future maintenance.
This commit enhances the “Copy Selected Tokens to Clipboard” feature in `TokensTable.js` by introducing a user-friendly modal that lets users choose how they want to copy tokens.
Changes made
• Replaced direct copy logic with a `Modal.info` dialog.
• Modal displays the prompt “Please choose your copy mode”.
• Added two buttons in a custom footer:
– **Name + Secret**: copies `tokenName sk-tokenKey`.
– **Secret Only**: copies `sk-tokenKey`.
• Each button triggers the copy operation and closes the dialog.
• Maintains existing validations (e.g., selection check, clipboard feedback).
Benefits
• Gives users clear control over copy format, reducing manual editing.
• Aligns UI with Semi UI’s best practices via custom modal footer.
No backend/API changes are involved; all updates are limited to the front-end UI logic.
