♻️ 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/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 NotificationButton from './NotificationButton.js';
-import ThemeToggle from './ThemeToggle.js';
-import LanguageSelector from './LanguageSelector.js';
-import UserArea from './UserArea.js';
+import NewYearButton from './NewYearButton';
+import NotificationButton from './NotificationButton';
+import ThemeToggle from './ThemeToggle';
+import LanguageSelector from './LanguageSelector';
+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 SkeletonWrapper from './SkeletonWrapper.js';
+import { stringToColor } from '../../../helpers';
+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 { useNotifications } from '../../../hooks/common/useNotifications.js';
-import { useNavigation } from '../../../hooks/common/useNavigation.js';
-import NoticeModal from '../NoticeModal.js';
-import MobileMenuButton from './MobileMenuButton.js';
-import HeaderLogo from './HeaderLogo.js';
-import Navigation from './Navigation.js';
-import ActionButtons from './ActionButtons.js';
+import { useHeaderBar } from '../../../hooks/common/useHeaderBar';
+import { useNotifications } from '../../../hooks/common/useNotifications';
+import { useNavigation } from '../../../hooks/common/useNavigation';
+import NoticeModal from '../NoticeModal';
+import MobileMenuButton from './MobileMenuButton';
+import HeaderLogo from './HeaderLogo';
+import Navigation from './Navigation';
+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 App from '../../App.js';
-import FooterBar from './Footer.js';
+import SiderBar from './SiderBar';
+import App from '../../App';
+import FooterBar from './Footer';
 import { ToastContainer } from 'react-toastify';
 import React, { useContext, useEffect, useState } from 'react';
-import { useIsMobile } from '../../hooks/common/useIsMobile.js';
-import { useSidebarCollapsed } from '../../hooks/common/useSidebarCollapsed.js';
+import { useIsMobile } from '../../hooks/common/useIsMobile';
+import { useSidebarCollapsed } from '../../hooks/common/useSidebarCollapsed';
 import { useTranslation } from 'react-i18next';
-import { API, getLogo, getSystemName, showError, setStatusData } from '../../helpers/index.js';
-import { UserContext } from '../../context/User/index.js';
-import { StatusContext } from '../../context/Status/index.js';
+import { API, getLogo, getSystemName, showError, setStatusData } from '../../helpers';
+import { UserContext } from '../../context/User';
+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,