♻️ refactor(web): migrate React modules from .js to .jsx and align entrypoint

- Rename React components/pages/utilities that contain JSX to `.jsx` across `web/src`
- Update import paths and re-exports to match new `.jsx` extensions
- Fix Vite entry by switching `web/index.html` from `/src/index.js` to `/src/index.jsx`
- Verified remaining `.js` files are plain JS (hooks/helpers/constants) and do not require JSX
- No runtime behavior changes; extension and reference alignment only

Context: Resolves the Vite pre-transform error caused by the stale `/src/index.js` entry after migrating to `.jsx`.

web/index.html

@@ -1,19 +1,19 @@
 <!doctype html>
 <html lang="zh">
-  <head>
+
-    <meta charset="utf-8" />
+<head>
-    <link rel="icon" href="/logo.png" />
+  <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <link rel="icon" href="/logo.png" />
-    <meta name="theme-color" content="#ffffff" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <meta
+  <meta name="theme-color" content="#ffffff" />
-      name="description"
+  <meta name="description" content="OpenAI 接口聚合管理，支持多种渠道包括 Azure，可用于二次分发管理 key，仅单可执行文件，已打包好 Docker 镜像，一键部署，开箱即用" />
-      content="OpenAI 接口聚合管理，支持多种渠道包括 Azure，可用于二次分发管理 key，仅单可执行文件，已打包好 Docker 镜像，一键部署，开箱即用"
+  <title>New API</title>
-    />
+</head>
-    <title>New API</title>
+
-  </head>
+<body>
-  <body>
+  <noscript>You need to enable JavaScript to run this app.</noscript>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
+  <div id="root"></div>
-    <div id="root"></div>
+  <script type="module" src="/src/index.jsx"></script>
-    <script type="module" src="/src/index.js"></script>
+</body>
-  </body>
+
-</html>
+</html>

web/src/App.jsx

@@ -19,17 +19,17 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React, { lazy, Suspense } from 'react';
 import { Route, Routes, useLocation } from 'react-router-dom';
-import Loading from './components/common/ui/Loading.js';
+import Loading from './components/common/ui/Loading';
 import User from './pages/User';
 import { AuthRedirect, PrivateRoute, AdminRoute } from './helpers';
-import RegisterForm from './components/auth/RegisterForm.js';
+import RegisterForm from './components/auth/RegisterForm';
-import LoginForm from './components/auth/LoginForm.js';
+import LoginForm from './components/auth/LoginForm';
 import NotFound from './pages/NotFound';
 import Forbidden from './pages/Forbidden';
 import Setting from './pages/Setting';
 
-import PasswordResetForm from './components/auth/PasswordResetForm.js';
+import PasswordResetForm from './components/auth/PasswordResetForm';
-import PasswordResetConfirm from './components/auth/PasswordResetConfirm.js';
+import PasswordResetConfirm from './components/auth/PasswordResetConfirm';
 import Channel from './pages/Channel';
 import Token from './pages/Token';
 import Redemption from './pages/Redemption';
@@ -38,14 +38,14 @@ import Log from './pages/Log';
 import Chat from './pages/Chat';
 import Chat2Link from './pages/Chat2Link';
 import Midjourney from './pages/Midjourney';
-import Pricing from './pages/Pricing/index.js';
+import Pricing from './pages/Pricing';
-import Task from './pages/Task/index.js';
+import Task from './pages/Task';
-import ModelPage from './pages/Model/index.js';
+import ModelPage from './pages/Model';
-import Playground from './pages/Playground/index.js';
+import Playground from './pages/Playground';
-import OAuth2Callback from './components/auth/OAuth2Callback.js';
+import OAuth2Callback from './components/auth/OAuth2Callback';
-import PersonalSetting from './components/settings/PersonalSetting.js';
+import PersonalSetting from './components/settings/PersonalSetting';
-import Setup from './pages/Setup/index.js';
+import Setup from './pages/Setup';
-import SetupCheck from './components/layout/SetupCheck.js';
+import SetupCheck from './components/layout/SetupCheck';
 
 const Home = lazy(() => import('./pages/Home'));
 const Dashboard = lazy(() => import('./pages/Dashboard'));

web/src/components/auth/LoginForm.jsx

@@ -19,7 +19,7 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React, { useContext, useEffect, useState } from 'react';
 import { Link, useNavigate, useSearchParams } from 'react-router-dom';
-import { UserContext } from '../../context/User/index.js';
+import { UserContext } from '../../context/User';
 import {
   API,
   getLogo,
@@ -32,7 +32,7 @@ import {
   onGitHubOAuthClicked,
   onOIDCClicked,
   onLinuxDOOAuthClicked
-} from '../../helpers/index.js';
+} from '../../helpers';
 import Turnstile from 'react-turnstile';
 import {
   Button,
@@ -47,10 +47,10 @@ import Text from '@douyinfe/semi-ui/lib/es/typography/text';
 import TelegramLoginButton from 'react-telegram-login';
 
 import { IconGithubLogo, IconMail, IconLock } from '@douyinfe/semi-icons';
-import OIDCIcon from '../common/logo/OIDCIcon.js';
+import OIDCIcon from '../common/logo/OIDCIcon';
-import WeChatIcon from '../common/logo/WeChatIcon.js';
+import WeChatIcon from '../common/logo/WeChatIcon';
-import LinuxDoIcon from '../common/logo/LinuxDoIcon.js';
+import LinuxDoIcon from '../common/logo/LinuxDoIcon';
-import TwoFAVerification from './TwoFAVerification.js';
+import TwoFAVerification from './TwoFAVerification';
 import { useTranslation } from 'react-i18next';
 
 const LoginForm = () => {

web/src/components/auth/RegisterForm.jsx

@@ -28,7 +28,7 @@ import {
   updateAPI,
   getSystemName,
   setUserData
-} from '../../helpers/index.js';
+} from '../../helpers';
 import Turnstile from 'react-turnstile';
 import {
   Button,
@@ -45,12 +45,12 @@ import {
   onGitHubOAuthClicked,
   onLinuxDOOAuthClicked,
   onOIDCClicked,
-} from '../../helpers/index.js';
+} from '../../helpers';
-import OIDCIcon from '../common/logo/OIDCIcon.js';
+import OIDCIcon from '../common/logo/OIDCIcon';
-import LinuxDoIcon from '../common/logo/LinuxDoIcon.js';
+import LinuxDoIcon from '../common/logo/LinuxDoIcon';
-import WeChatIcon from '../common/logo/WeChatIcon.js';
+import WeChatIcon from '../common/logo/WeChatIcon';
 import TelegramLoginButton from 'react-telegram-login/src';
-import { UserContext } from '../../context/User/index.js';
+import { UserContext } from '../../context/User';
 import { useTranslation } from 'react-i18next';
 
 const RegisterForm = () => {

web/src/components/dashboard/index.jsx

@@ -19,8 +19,8 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React, { useContext, useEffect } from 'react';
 import { getRelativeTime } from '../../helpers';
-import { UserContext } from '../../context/User/index.js';
+import { UserContext } from '../../context/User';
-import { StatusContext } from '../../context/Status/index.js';
+import { StatusContext } from '../../context/Status';
 
 import DashboardHeader from './DashboardHeader';
 import StatsCards from './StatsCards';

web/src/components/layout/HeaderBar.js

@@ -17,4 +17,4 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
 For commercial licensing, please contact support@quantumnous.com
 */
 
-export { default } from './HeaderBar/index.js';
+export { default } from './HeaderBar/index';

web/src/components/layout/HeaderBar/ActionButtons.jsx

@@ -18,11 +18,11 @@ For commercial licensing, please contact support@quantumnous.com
 */
 
 import React from 'react';
-import NewYearButton from './NewYearButton.js';
+import NewYearButton from './NewYearButton';
-import NotificationButton from './NotificationButton.js';
+import NotificationButton from './NotificationButton';
-import ThemeToggle from './ThemeToggle.js';
+import ThemeToggle from './ThemeToggle';
-import LanguageSelector from './LanguageSelector.js';
+import LanguageSelector from './LanguageSelector';
-import UserArea from './UserArea.js';
+import UserArea from './UserArea';
 
 const ActionButtons = ({
   isNewYear,

web/src/components/layout/HeaderBar/HeaderLogo.jsx

@@ -20,7 +20,7 @@ For commercial licensing, please contact support@quantumnous.com
 import React from 'react';
 import { Link } from 'react-router-dom';
 import { Typography, Tag } from '@douyinfe/semi-ui';
-import SkeletonWrapper from './SkeletonWrapper.js';
+import SkeletonWrapper from './SkeletonWrapper';
 
 const HeaderLogo = ({
   isMobile,

web/src/components/layout/HeaderBar/Navigation.jsx

@@ -19,7 +19,7 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React from 'react';
 import { Link } from 'react-router-dom';
-import SkeletonWrapper from './SkeletonWrapper.js';
+import SkeletonWrapper from './SkeletonWrapper';
 
 const Navigation = ({
   mainNavLinks,

web/src/components/layout/HeaderBar/UserArea.jsx

@@ -32,8 +32,8 @@ import {
   IconCreditCard,
   IconKey,
 } from '@douyinfe/semi-icons';
-import { stringToColor } from '../../../helpers/index.js';
+import { stringToColor } from '../../../helpers';
-import SkeletonWrapper from './SkeletonWrapper.js';
+import SkeletonWrapper from './SkeletonWrapper';
 
 const UserArea = ({
   userState,

web/src/components/layout/HeaderBar/index.jsx

@@ -18,14 +18,14 @@ For commercial licensing, please contact support@quantumnous.com
 */
 
 import React from 'react';
-import { useHeaderBar } from '../../../hooks/common/useHeaderBar.js';
+import { useHeaderBar } from '../../../hooks/common/useHeaderBar';
-import { useNotifications } from '../../../hooks/common/useNotifications.js';
+import { useNotifications } from '../../../hooks/common/useNotifications';
-import { useNavigation } from '../../../hooks/common/useNavigation.js';
+import { useNavigation } from '../../../hooks/common/useNavigation';
-import NoticeModal from '../NoticeModal.js';
+import NoticeModal from '../NoticeModal';
-import MobileMenuButton from './MobileMenuButton.js';
+import MobileMenuButton from './MobileMenuButton';
-import HeaderLogo from './HeaderLogo.js';
+import HeaderLogo from './HeaderLogo';
-import Navigation from './Navigation.js';
+import Navigation from './Navigation';
-import ActionButtons from './ActionButtons.js';
+import ActionButtons from './ActionButtons';
 
 const HeaderBar = ({ onMobileMenuToggle, drawerOpen }) => {
   const {

web/src/components/layout/NoticeModal.jsx

@@ -23,7 +23,7 @@ import { useTranslation } from 'react-i18next';
 import { API, showError, getRelativeTime } from '../../helpers';
 import { marked } from 'marked';
 import { IllustrationNoContent, IllustrationNoContentDark } from '@douyinfe/semi-illustrations';
-import { StatusContext } from '../../context/Status/index.js';
+import { StatusContext } from '../../context/Status';
 import { Bell, Megaphone } from 'lucide-react';
 
 const NoticeModal = ({ visible, onClose, isMobile, defaultTab = 'inApp', unreadKeys = [] }) => {

web/src/components/layout/PageLayout.jsx

@@ -17,19 +17,19 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
 For commercial licensing, please contact support@quantumnous.com
 */
 
-import HeaderBar from './HeaderBar.js';
+import HeaderBar from './HeaderBar';
 import { Layout } from '@douyinfe/semi-ui';
-import SiderBar from './SiderBar.js';
+import SiderBar from './SiderBar';
-import App from '../../App.js';
+import App from '../../App';
-import FooterBar from './Footer.js';
+import FooterBar from './Footer';
 import { ToastContainer } from 'react-toastify';
 import React, { useContext, useEffect, useState } from 'react';
-import { useIsMobile } from '../../hooks/common/useIsMobile.js';
+import { useIsMobile } from '../../hooks/common/useIsMobile';
-import { useSidebarCollapsed } from '../../hooks/common/useSidebarCollapsed.js';
+import { useSidebarCollapsed } from '../../hooks/common/useSidebarCollapsed';
 import { useTranslation } from 'react-i18next';
-import { API, getLogo, getSystemName, showError, setStatusData } from '../../helpers/index.js';
+import { API, getLogo, getSystemName, showError, setStatusData } from '../../helpers';
-import { UserContext } from '../../context/User/index.js';
+import { UserContext } from '../../context/User';
-import { StatusContext } from '../../context/Status/index.js';
+import { StatusContext } from '../../context/Status';
 import { useLocation } from 'react-router-dom';
 const { Sider, Content, Header } = Layout;
 

web/src/components/layout/SiderBar.jsx

@@ -20,14 +20,14 @@ For commercial licensing, please contact support@quantumnous.com
 import React, { useEffect, useMemo, useState } from 'react';
 import { Link, useLocation } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
-import { getLucideIcon } from '../../helpers/render.js';
+import { getLucideIcon } from '../../helpers/render';
 import { ChevronLeft } from 'lucide-react';
-import { useSidebarCollapsed } from '../../hooks/common/useSidebarCollapsed.js';
+import { useSidebarCollapsed } from '../../hooks/common/useSidebarCollapsed';
 import {
   isAdmin,
   isRoot,
   showError
-} from '../../helpers/index.js';
+} from '../../helpers';
 
 import {
   Nav,

web/src/components/settings/ChannelSelectorModal.jsx

@@ -18,7 +18,7 @@ For commercial licensing, please contact support@quantumnous.com
 */
 
 import React, { useState, useEffect, forwardRef, useImperativeHandle } from 'react';
-import { useIsMobile } from '../../hooks/common/useIsMobile.js';
+import { useIsMobile } from '../../hooks/common/useIsMobile';
 import {
   Modal,
   Table,

web/src/components/settings/ChatsSetting.jsx

@@ -19,7 +19,7 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React, { useEffect, useState } from 'react';
 import { Card, Spin } from '@douyinfe/semi-ui';
-import SettingsChats from '../../pages/Setting/Chat/SettingsChats.js';
+import SettingsChats from '../../pages/Setting/Chat/SettingsChats';
 import { API, showError, toBoolean } from '../../helpers';
 
 const ChatsSetting = () => {

web/src/components/settings/DashboardSetting.jsx

@@ -20,11 +20,11 @@ For commercial licensing, please contact support@quantumnous.com
 import React, { useEffect, useState, useMemo } from 'react';
 import { Card, Spin, Button, Modal } from '@douyinfe/semi-ui';
 import { API, showError, showSuccess, toBoolean } from '../../helpers';
-import SettingsAPIInfo from '../../pages/Setting/Dashboard/SettingsAPIInfo.js';
+import SettingsAPIInfo from '../../pages/Setting/Dashboard/SettingsAPIInfo';
-import SettingsAnnouncements from '../../pages/Setting/Dashboard/SettingsAnnouncements.js';
+import SettingsAnnouncements from '../../pages/Setting/Dashboard/SettingsAnnouncements';
-import SettingsFAQ from '../../pages/Setting/Dashboard/SettingsFAQ.js';
+import SettingsFAQ from '../../pages/Setting/Dashboard/SettingsFAQ';
-import SettingsUptimeKuma from '../../pages/Setting/Dashboard/SettingsUptimeKuma.js';
+import SettingsUptimeKuma from '../../pages/Setting/Dashboard/SettingsUptimeKuma';
-import SettingsDataDashboard from '../../pages/Setting/Dashboard/SettingsDataDashboard.js';
+import SettingsDataDashboard from '../../pages/Setting/Dashboard/SettingsDataDashboard';
 
 const DashboardSetting = () => {
   let [inputs, setInputs] = useState({

web/src/components/settings/DrawingSetting.jsx

@@ -19,7 +19,7 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React, { useEffect, useState } from 'react';
 import { Card, Spin } from '@douyinfe/semi-ui';
-import SettingsDrawing from '../../pages/Setting/Drawing/SettingsDrawing.js';
+import SettingsDrawing from '../../pages/Setting/Drawing/SettingsDrawing';
 import { API, showError, toBoolean } from '../../helpers';
 
 const DrawingSetting = () => {

web/src/components/settings/ModelSetting.jsx

@@ -22,9 +22,9 @@ import { Card, Spin, Tabs } from '@douyinfe/semi-ui';
 
 import { API, showError, showSuccess, toBoolean } from '../../helpers';
 import { useTranslation } from 'react-i18next';
-import SettingGeminiModel from '../../pages/Setting/Model/SettingGeminiModel.js';
+import SettingGeminiModel from '../../pages/Setting/Model/SettingGeminiModel';
-import SettingClaudeModel from '../../pages/Setting/Model/SettingClaudeModel.js';
+import SettingClaudeModel from '../../pages/Setting/Model/SettingClaudeModel';
-import SettingGlobalModel from '../../pages/Setting/Model/SettingGlobalModel.js';
+import SettingGlobalModel from '../../pages/Setting/Model/SettingGlobalModel';
 
 const ModelSetting = () => {
   const { t } = useTranslation();

web/src/components/settings/OperationSetting.jsx

@@ -19,11 +19,11 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React, { useEffect, useState } from 'react';
 import { Card, Spin } from '@douyinfe/semi-ui';
-import SettingsGeneral from '../../pages/Setting/Operation/SettingsGeneral.js';
+import SettingsGeneral from '../../pages/Setting/Operation/SettingsGeneral';
-import SettingsSensitiveWords from '../../pages/Setting/Operation/SettingsSensitiveWords.js';
+import SettingsSensitiveWords from '../../pages/Setting/Operation/SettingsSensitiveWords';
-import SettingsLog from '../../pages/Setting/Operation/SettingsLog.js';
+import SettingsLog from '../../pages/Setting/Operation/SettingsLog';
-import SettingsMonitoring from '../../pages/Setting/Operation/SettingsMonitoring.js';
+import SettingsMonitoring from '../../pages/Setting/Operation/SettingsMonitoring';
-import SettingsCreditLimit from '../../pages/Setting/Operation/SettingsCreditLimit.js';
+import SettingsCreditLimit from '../../pages/Setting/Operation/SettingsCreditLimit';
 import { API, showError, toBoolean } from '../../helpers';
 
 const OperationSetting = () => {

web/src/components/settings/OtherSetting.jsx

@@ -31,7 +31,7 @@ import {
 import { API, showError, showSuccess, timestamp2string } from '../../helpers';
 import { marked } from 'marked';
 import { useTranslation } from 'react-i18next';
-import { StatusContext } from '../../context/Status/index.js';
+import { StatusContext } from '../../context/Status';
 import Text from '@douyinfe/semi-ui/lib/es/typography/text';
 
 const OtherSetting = () => {

web/src/components/settings/PaymentSetting.jsx

@@ -19,9 +19,9 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React, { useEffect, useState } from 'react';
 import { Card, Spin } from '@douyinfe/semi-ui';
-import SettingsGeneralPayment from '../../pages/Setting/Payment/SettingsGeneralPayment.js';
+import SettingsGeneralPayment from '../../pages/Setting/Payment/SettingsGeneralPayment';
-import SettingsPaymentGateway from '../../pages/Setting/Payment/SettingsPaymentGateway.js';
+import SettingsPaymentGateway from '../../pages/Setting/Payment/SettingsPaymentGateway';
-import SettingsPaymentGatewayStripe from '../../pages/Setting/Payment/SettingsPaymentGatewayStripe.js';
+import SettingsPaymentGatewayStripe from '../../pages/Setting/Payment/SettingsPaymentGatewayStripe';
 import { API, showError, toBoolean } from '../../helpers';
 import { useTranslation } from 'react-i18next';
 

web/src/components/settings/RateLimitSetting.jsx

@@ -20,9 +20,9 @@ For commercial licensing, please contact support@quantumnous.com
 import React, { useEffect, useState } from 'react';
 import { Card, Spin } from '@douyinfe/semi-ui';
 
-import { API, showError, toBoolean } from '../../helpers/index.js';
+import { API, showError, toBoolean } from '../../helpers';
 import { useTranslation } from 'react-i18next';
-import RequestRateLimit from '../../pages/Setting/RateLimit/SettingsRequestRateLimit.js';
+import RequestRateLimit from '../../pages/Setting/RateLimit/SettingsRequestRateLimit';
 
 const RateLimitSetting = () => {
   const { t } = useTranslation();

web/src/components/settings/RatioSetting.jsx

@@ -21,11 +21,11 @@ import React, { useEffect, useState } from 'react';
 import { Card, Spin, Tabs } from '@douyinfe/semi-ui';
 import { useTranslation } from 'react-i18next';
 
-import GroupRatioSettings from '../../pages/Setting/Ratio/GroupRatioSettings.js';
+import GroupRatioSettings from '../../pages/Setting/Ratio/GroupRatioSettings';
-import ModelRatioSettings from '../../pages/Setting/Ratio/ModelRatioSettings.js';
+import ModelRatioSettings from '../../pages/Setting/Ratio/ModelRatioSettings';
-import ModelSettingsVisualEditor from '../../pages/Setting/Ratio/ModelSettingsVisualEditor.js';
+import ModelSettingsVisualEditor from '../../pages/Setting/Ratio/ModelSettingsVisualEditor';
-import ModelRatioNotSetEditor from '../../pages/Setting/Ratio/ModelRationNotSetEditor.js';
+import ModelRatioNotSetEditor from '../../pages/Setting/Ratio/ModelRationNotSetEditor';
-import UpstreamRatioSync from '../../pages/Setting/Ratio/UpstreamRatioSync.js';
+import UpstreamRatioSync from '../../pages/Setting/Ratio/UpstreamRatioSync';
 
 import { API, showError, toBoolean } from '../../helpers';
 

web/src/components/table/channels/ChannelsColumnDefs.jsx

@@ -35,8 +35,8 @@ import {
   renderQuota,
   getChannelIcon,
   renderQuotaWithAmount
-} from '../../../helpers/index.js';
+} from '../../../helpers';
-import { CHANNEL_OPTIONS } from '../../../constants/index.js';
+import { CHANNEL_OPTIONS } from '../../../constants';
 import { IconTreeTriangleDown, IconMore } from '@douyinfe/semi-icons';
 import { FaRandom } from 'react-icons/fa';
 

web/src/components/table/channels/ChannelsTable.jsx

@@ -19,12 +19,12 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React, { useMemo } from 'react';
 import { Empty } from '@douyinfe/semi-ui';
-import CardTable from '../../common/ui/CardTable.js';
+import CardTable from '../../common/ui/CardTable';
 import {
   IllustrationNoResult,
   IllustrationNoResultDark
 } from '@douyinfe/semi-illustrations';
-import { getChannelsColumns } from './ChannelsColumnDefs.js';
+import { getChannelsColumns } from './ChannelsColumnDefs';
 
 const ChannelsTable = (channelsData) => {
   const {

web/src/components/table/channels/ChannelsTabs.jsx

@@ -19,8 +19,8 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React from 'react';
 import { Tabs, TabPane, Tag } from '@douyinfe/semi-ui';
-import { CHANNEL_OPTIONS } from '../../../constants/index.js';
+import { CHANNEL_OPTIONS } from '../../../constants';
-import { getChannelIcon } from '../../../helpers/index.js';
+import { getChannelIcon } from '../../../helpers';
 
 const ChannelsTabs = ({
   enableTagMode,

web/src/components/table/channels/index.jsx

@@ -18,19 +18,19 @@ For commercial licensing, please contact support@quantumnous.com
 */
 
 import React from 'react';
-import CardPro from '../../common/ui/CardPro.js';
+import CardPro from '../../common/ui/CardPro';
-import ChannelsTable from './ChannelsTable.jsx';
+import ChannelsTable from './ChannelsTable';
-import ChannelsActions from './ChannelsActions.jsx';
+import ChannelsActions from './ChannelsActions';
-import ChannelsFilters from './ChannelsFilters.jsx';
+import ChannelsFilters from './ChannelsFilters';
-import ChannelsTabs from './ChannelsTabs.jsx';
+import ChannelsTabs from './ChannelsTabs';
-import { useChannelsData } from '../../../hooks/channels/useChannelsData.js';
+import { useChannelsData } from '../../../hooks/channels/useChannelsData';
-import { useIsMobile } from '../../../hooks/common/useIsMobile.js';
+import { useIsMobile } from '../../../hooks/common/useIsMobile';
-import BatchTagModal from './modals/BatchTagModal.jsx';
+import BatchTagModal from './modals/BatchTagModal';
-import ModelTestModal from './modals/ModelTestModal.jsx';
+import ModelTestModal from './modals/ModelTestModal';
-import ColumnSelectorModal from './modals/ColumnSelectorModal.jsx';
+import ColumnSelectorModal from './modals/ColumnSelectorModal';
-import EditChannelModal from './modals/EditChannelModal.jsx';
+import EditChannelModal from './modals/EditChannelModal';
-import EditTagModal from './modals/EditTagModal.jsx';
+import EditTagModal from './modals/EditTagModal';
-import MultiKeyManageModal from './modals/MultiKeyManageModal.jsx';
+import MultiKeyManageModal from './modals/MultiKeyManageModal';
 import { createCardProPagination } from '../../../helpers/utils';
 
 const ChannelsPage = () => {

web/src/components/table/channels/modals/ColumnSelectorModal.jsx

@@ -19,7 +19,7 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React from 'react';
 import { Modal, Button, Checkbox } from '@douyinfe/semi-ui';
-import { getChannelsColumns } from '../ChannelsColumnDefs.js';
+import { getChannelsColumns } from '../ChannelsColumnDefs';
 
 const ColumnSelectorModal = ({
   showColumnSelector,

web/src/components/table/channels/modals/EditChannelModal.jsx

@@ -26,7 +26,7 @@ import {
   showSuccess,
   verifyJSON,
 } from '../../../../helpers';
-import { useIsMobile } from '../../../../hooks/common/useIsMobile.js';
+import { useIsMobile } from '../../../../hooks/common/useIsMobile';
 import { CHANNEL_OPTIONS } from '../../../../constants';
 import {
   SideSheet,
@@ -1653,50 +1653,50 @@ const EditChannelModal = (props) => {
                   />
 
                   <Form.TextArea
-                      field='param_override'
+                    field='param_override'
-                      label={t('参数覆盖')}
+                    label={t('参数覆盖')}
-                      placeholder={
+                    placeholder={
-                          t('此项可选，用于覆盖请求参数。不支持覆盖 stream 参数') +
+                      t('此项可选，用于覆盖请求参数。不支持覆盖 stream 参数') +
-                          '\n' + t('旧格式（直接覆盖）：') +
+                      '\n' + t('旧格式（直接覆盖）：') +
-                          '\n{\n  "temperature": 0,\n  "max_tokens": 1000\n}' +
+                      '\n{\n  "temperature": 0,\n  "max_tokens": 1000\n}' +
-                          '\n\n' + t('新格式（支持条件判断与json自定义）：') +
+                      '\n\n' + t('新格式（支持条件判断与json自定义）：') +
-                          '\n{\n  "operations": [\n    {\n      "path": "temperature",\n      "mode": "set",\n      "value": 0.7,\n      "conditions": [\n        {\n          "path": "model",\n          "mode": "prefix",\n          "value": "gpt"\n        }\n      ]\n    }\n  ]\n}'
+                      '\n{\n  "operations": [\n    {\n      "path": "temperature",\n      "mode": "set",\n      "value": 0.7,\n      "conditions": [\n        {\n          "path": "model",\n          "mode": "prefix",\n          "value": "gpt"\n        }\n      ]\n    }\n  ]\n}'
-                      }
+                    }
-                      autosize
+                    autosize
-                      onChange={(value) => handleInputChange('param_override', value)}
+                    onChange={(value) => handleInputChange('param_override', value)}
-                      extraText={
+                    extraText={
-                        <div className="flex gap-2 flex-wrap">
+                      <div className="flex gap-2 flex-wrap">
-                          <Text
+                        <Text
-                              className="!text-semi-color-primary cursor-pointer"
+                          className="!text-semi-color-primary cursor-pointer"
-                              onClick={() => handleInputChange('param_override', JSON.stringify({ temperature: 0 }, null, 2))}
+                          onClick={() => handleInputChange('param_override', JSON.stringify({ temperature: 0 }, null, 2))}
-                          >
+                        >
-                            {t('旧格式模板')}
+                          {t('旧格式模板')}
-                          </Text>
+                        </Text>
-                          <Text
+                        <Text
-                              className="!text-semi-color-primary cursor-pointer"
+                          className="!text-semi-color-primary cursor-pointer"
-                              onClick={() => handleInputChange('param_override', JSON.stringify({
+                          onClick={() => handleInputChange('param_override', JSON.stringify({
-                                operations: [
+                            operations: [
+                              {
+                                path: "temperature",
+                                mode: "set",
+                                value: 0.7,
+                                conditions: [
                                   {
-                                    path: "temperature",
+                                    path: "model",
-                                    mode: "set",
+                                    mode: "prefix",
-                                    value: 0.7,
+                                    value: "gpt"
-                                    conditions: [
-                                      {
-                                        path: "model",
-                                        mode: "prefix",
-                                        value: "gpt"
-                                      }
-                                    ],
-                                    logic: "AND"
                                   }
-                                ]
+                                ],
-                              }, null, 2))}
+                                logic: "AND"
-                          >
+                              }
-                            {t('新格式模板')}
+                            ]
-                          </Text>
+                          }, null, 2))}
-                        </div>
+                        >
-                      }
+                          {t('新格式模板')}
-                      showClear
+                        </Text>
+                      </div>
+                    }
+                    showClear
                   />
 
 

web/src/components/table/channels/modals/ModelSelectModal.jsx

@@ -1,5 +1,24 @@
+/*
+Copyright (C) 2025 QuantumNous
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+For commercial licensing, please contact support@quantumnous.com
+*/
+
 import React, { useState, useEffect } from 'react';
-import { useIsMobile } from '../../../../hooks/common/useIsMobile.js';
+import { useIsMobile } from '../../../../hooks/common/useIsMobile';
 import { Modal, Checkbox, Spin, Input, Typography, Empty, Tabs, Collapse } from '@douyinfe/semi-ui';
 import {
   IllustrationNoResult,

web/src/components/table/channels/modals/ModelTestModal.jsx

@@ -27,8 +27,8 @@ import {
   Typography
 } from '@douyinfe/semi-ui';
 import { IconSearch } from '@douyinfe/semi-icons';
-import { copy, showError, showInfo, showSuccess } from '../../../../helpers/index.js';
+import { copy, showError, showInfo, showSuccess } from '../../../../helpers';
-import { MODEL_TABLE_PAGE_SIZE } from '../../../../constants/index.js';
+import { MODEL_TABLE_PAGE_SIZE } from '../../../../constants';
 
 const ModelTestModal = ({
   showModelTestModal,

web/src/components/table/channels/modals/MultiKeyManageModal.jsx

@@ -38,7 +38,7 @@ import {
   Card
 } from '@douyinfe/semi-ui';
 import { IllustrationNoResult, IllustrationNoResultDark } from '@douyinfe/semi-illustrations';
-import { API, showError, showSuccess, timestamp2string } from '../../../../helpers/index.js';
+import { API, showError, showSuccess, timestamp2string } from '../../../../helpers';
 
 const { Text } = Typography;
 

web/src/components/table/mj-logs/MjLogsTable.jsx

@@ -19,12 +19,12 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React, { useMemo } from 'react';
 import { Empty } from '@douyinfe/semi-ui';
-import CardTable from '../../common/ui/CardTable.js';
+import CardTable from '../../common/ui/CardTable';
 import {
   IllustrationNoResult,
   IllustrationNoResultDark,
 } from '@douyinfe/semi-illustrations';
-import { getMjLogsColumns } from './MjLogsColumnDefs.js';
+import { getMjLogsColumns } from './MjLogsColumnDefs';
 
 const MjLogsTable = (mjLogsData) => {
   const {

web/src/components/table/mj-logs/index.jsx

@@ -19,14 +19,14 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React from 'react';
 import { Layout } from '@douyinfe/semi-ui';
-import CardPro from '../../common/ui/CardPro.js';
+import CardPro from '../../common/ui/CardPro';
-import MjLogsTable from './MjLogsTable.jsx';
+import MjLogsTable from './MjLogsTable';
-import MjLogsActions from './MjLogsActions.jsx';
+import MjLogsActions from './MjLogsActions';
-import MjLogsFilters from './MjLogsFilters.jsx';
+import MjLogsFilters from './MjLogsFilters';
-import ColumnSelectorModal from './modals/ColumnSelectorModal.jsx';
+import ColumnSelectorModal from './modals/ColumnSelectorModal';
-import ContentModal from './modals/ContentModal.jsx';
+import ContentModal from './modals/ContentModal';
-import { useMjLogsData } from '../../../hooks/mj-logs/useMjLogsData.js';
+import { useMjLogsData } from '../../../hooks/mj-logs/useMjLogsData';
-import { useIsMobile } from '../../../hooks/common/useIsMobile.js';
+import { useIsMobile } from '../../../hooks/common/useIsMobile';
 import { createCardProPagination } from '../../../helpers/utils';
 
 const MjLogsPage = () => {

web/src/components/table/mj-logs/modals/ColumnSelectorModal.jsx

@@ -19,7 +19,7 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React from 'react';
 import { Modal, Button, Checkbox } from '@douyinfe/semi-ui';
-import { getMjLogsColumns } from '../MjLogsColumnDefs.js';
+import { getMjLogsColumns } from '../MjLogsColumnDefs';
 
 const ColumnSelectorModal = ({
   showColumnSelector,

web/src/components/table/models/ModelsActions.jsx

@@ -18,13 +18,13 @@ For commercial licensing, please contact support@quantumnous.com
 */
 
 import React, { useState } from 'react';
-import MissingModelsModal from './modals/MissingModelsModal.jsx';
+import MissingModelsModal from './modals/MissingModelsModal';
-import PrefillGroupManagement from './modals/PrefillGroupManagement.jsx';
+import PrefillGroupManagement from './modals/PrefillGroupManagement';
-import EditPrefillGroupModal from './modals/EditPrefillGroupModal.jsx';
+import EditPrefillGroupModal from './modals/EditPrefillGroupModal';
 import { Button, Modal } from '@douyinfe/semi-ui';
 import { showSuccess, showError, copy } from '../../../helpers';
 import CompactModeToggle from '../../common/ui/CompactModeToggle';
-import SelectionNotification from './components/SelectionNotification.jsx';
+import SelectionNotification from './components/SelectionNotification';
 
 const ModelsActions = ({
   selectedKeys,

web/src/components/table/models/ModelsTable.jsx

@@ -19,12 +19,12 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React, { useMemo } from 'react';
 import { Empty } from '@douyinfe/semi-ui';
-import CardTable from '../../common/ui/CardTable.js';
+import CardTable from '../../common/ui/CardTable';
 import {
   IllustrationNoResult,
   IllustrationNoResultDark,
 } from '@douyinfe/semi-illustrations';
-import { getModelsColumns } from './ModelsColumnDefs.js';
+import { getModelsColumns } from './ModelsColumnDefs';
 
 const ModelsTable = (modelsData) => {
   const {

web/src/components/table/models/index.jsx

@@ -19,12 +19,12 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React from 'react';
 import CardPro from '../../common/ui/CardPro';
-import ModelsTable from './ModelsTable.jsx';
+import ModelsTable from './ModelsTable';
-import ModelsActions from './ModelsActions.jsx';
+import ModelsActions from './ModelsActions';
-import ModelsFilters from './ModelsFilters.jsx';
+import ModelsFilters from './ModelsFilters';
-import ModelsTabs from './ModelsTabs.jsx';
+import ModelsTabs from './ModelsTabs';
-import EditModelModal from './modals/EditModelModal.jsx';
+import EditModelModal from './modals/EditModelModal';
-import EditVendorModal from './modals/EditVendorModal.jsx';
+import EditVendorModal from './modals/EditVendorModal';
 import { useModelsData } from '../../../hooks/models/useModelsData';
 import { useIsMobile } from '../../../hooks/common/useIsMobile';
 import { createCardProPagination } from '../../../helpers/utils';

web/src/components/table/redemptions/RedemptionsTable.jsx

@@ -19,7 +19,7 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React, { useMemo, useState } from 'react';
 import { Empty } from '@douyinfe/semi-ui';
-import CardTable from '../../common/ui/CardTable.js';
+import CardTable from '../../common/ui/CardTable';
 import {
   IllustrationNoResult,
   IllustrationNoResultDark

web/src/components/table/redemptions/index.jsx

@@ -19,10 +19,10 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React from 'react';
 import CardPro from '../../common/ui/CardPro';
-import RedemptionsTable from './RedemptionsTable.jsx';
+import RedemptionsTable from './RedemptionsTable';
-import RedemptionsActions from './RedemptionsActions.jsx';
+import RedemptionsActions from './RedemptionsActions';
-import RedemptionsFilters from './RedemptionsFilters.jsx';
+import RedemptionsFilters from './RedemptionsFilters';
-import RedemptionsDescription from './RedemptionsDescription.jsx';
+import RedemptionsDescription from './RedemptionsDescription';
 import EditRedemptionModal from './modals/EditRedemptionModal';
 import { useRedemptionsData } from '../../../hooks/redemptions/useRedemptionsData';
 import { useIsMobile } from '../../../hooks/common/useIsMobile';

web/src/components/table/redemptions/modals/EditRedemptionModal.jsx

@@ -27,7 +27,7 @@ import {
   renderQuota,
   renderQuotaWithPrompt,
 } from '../../../../helpers';
-import { useIsMobile } from '../../../../hooks/common/useIsMobile.js';
+import { useIsMobile } from '../../../../hooks/common/useIsMobile';
 import {
   Button,
   Modal,

web/src/components/table/task-logs/TaskLogsTable.jsx

@@ -19,12 +19,12 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React, { useMemo } from 'react';
 import { Empty } from '@douyinfe/semi-ui';
-import CardTable from '../../common/ui/CardTable.js';
+import CardTable from '../../common/ui/CardTable';
 import {
   IllustrationNoResult,
   IllustrationNoResultDark,
 } from '@douyinfe/semi-illustrations';
-import { getTaskLogsColumns } from './TaskLogsColumnDefs.js';
+import { getTaskLogsColumns } from './TaskLogsColumnDefs';
 
 const TaskLogsTable = (taskLogsData) => {
   const {

web/src/components/table/task-logs/index.jsx

@@ -19,14 +19,14 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React from 'react';
 import { Layout } from '@douyinfe/semi-ui';
-import CardPro from '../../common/ui/CardPro.js';
+import CardPro from '../../common/ui/CardPro';
-import TaskLogsTable from './TaskLogsTable.jsx';
+import TaskLogsTable from './TaskLogsTable';
-import TaskLogsActions from './TaskLogsActions.jsx';
+import TaskLogsActions from './TaskLogsActions';
-import TaskLogsFilters from './TaskLogsFilters.jsx';
+import TaskLogsFilters from './TaskLogsFilters';
-import ColumnSelectorModal from './modals/ColumnSelectorModal.jsx';
+import ColumnSelectorModal from './modals/ColumnSelectorModal';
-import ContentModal from './modals/ContentModal.jsx';
+import ContentModal from './modals/ContentModal';
-import { useTaskLogsData } from '../../../hooks/task-logs/useTaskLogsData.js';
+import { useTaskLogsData } from '../../../hooks/task-logs/useTaskLogsData';
-import { useIsMobile } from '../../../hooks/common/useIsMobile.js';
+import { useIsMobile } from '../../../hooks/common/useIsMobile';
 import { createCardProPagination } from '../../../helpers/utils';
 
 const TaskLogsPage = () => {

web/src/components/table/task-logs/modals/ColumnSelectorModal.jsx

@@ -19,7 +19,7 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React from 'react';
 import { Modal, Button, Checkbox } from '@douyinfe/semi-ui';
-import { getTaskLogsColumns } from '../TaskLogsColumnDefs.js';
+import { getTaskLogsColumns } from '../TaskLogsColumnDefs';
 
 const ColumnSelectorModal = ({
   showColumnSelector,

web/src/components/table/tokens/TokensTable.jsx

@@ -19,12 +19,12 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React, { useMemo } from 'react';
 import { Empty } from '@douyinfe/semi-ui';
-import CardTable from '../../common/ui/CardTable.js';
+import CardTable from '../../common/ui/CardTable';
 import {
   IllustrationNoResult,
   IllustrationNoResultDark,
 } from '@douyinfe/semi-illustrations';
-import { getTokensColumns } from './TokensColumnDefs.js';
+import { getTokensColumns } from './TokensColumnDefs';
 
 const TokensTable = (tokensData) => {
   const {

web/src/components/table/tokens/index.jsx

@@ -21,10 +21,10 @@ import React, { useEffect, useRef, useState } from 'react';
 import { Notification, Button, Space, Toast, Typography, Select } from '@douyinfe/semi-ui';
 import { API, showError, getModelCategories, selectFilter } from '../../../helpers';
 import CardPro from '../../common/ui/CardPro';
-import TokensTable from './TokensTable.jsx';
+import TokensTable from './TokensTable';
-import TokensActions from './TokensActions.jsx';
+import TokensActions from './TokensActions';
-import TokensFilters from './TokensFilters.jsx';
+import TokensFilters from './TokensFilters';
-import TokensDescription from './TokensDescription.jsx';
+import TokensDescription from './TokensDescription';
 import EditTokenModal from './modals/EditTokenModal';
 import { useTokensData } from '../../../hooks/tokens/useTokensData';
 import { useIsMobile } from '../../../hooks/common/useIsMobile';
@@ -222,7 +222,7 @@ function TokensPage() {
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [modelOptions, selectedModel, tokensData.t, fluentNoticeOpen]);
-  
+
   useEffect(() => {
     const selector = '#fluent-new-api-container';
     const root = document.body || document.documentElement;

web/src/components/table/tokens/modals/EditTokenModal.jsx

@@ -28,7 +28,7 @@ import {
   getModelCategories,
   selectFilter,
 } from '../../../../helpers';
-import { useIsMobile } from '../../../../hooks/common/useIsMobile.js';
+import { useIsMobile } from '../../../../hooks/common/useIsMobile';
 import {
   Button,
   SideSheet,