@lobehub/chat 0.70.1 → 0.70.3

package/src/pages/market/index.page.tsx

@@ -0,0 +1,30 @@
+import { useResponsive } from 'antd-style';
+import Head from 'next/head';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import { genSiteHeadTitle } from '@/utils/genSiteHeadTitle';
+
+import DesktopLayout from './layout';
+import MobileLayout from './layout.mobile';
+
+const Market = memo(() => {
+  const { t } = useTranslation('common');
+  const pageTitle = genSiteHeadTitle(t('tab.market'));
+  const { mobile } = useResponsive();
+
+  const RenderLayout = mobile ? MobileLayout : DesktopLayout;
+
+  return (
+    <>
+      <Head>
+        <title>{pageTitle}</title>
+      </Head>
+      <RenderLayout>
+        <h1>🤯 Coming Soon</h1>
+      </RenderLayout>
+    </>
+  );
+});
+
+export default Market;

package/src/pages/market/layout.mobile.tsx

@@ -0,0 +1,19 @@
+import { ReactNode, memo } from 'react';
+import { Center } from 'react-layout-kit';
+
+import AppMobileLayout from '@/layout/AppMobileLayout';
+import { useSwitchSideBarOnInit } from '@/store/global';
+
+import Header from './features/Header';
+
+const ChatMobileLayout = memo<{ children: ReactNode }>(({ children }) => {
+  useSwitchSideBarOnInit('chat');
+
+  return (
+    <AppMobileLayout navBar={<Header />} showTabBar>
+      <Center flex={1}>{children}</Center>
+    </AppMobileLayout>
+  );
+});
+
+export default ChatMobileLayout;

package/src/pages/market/layout.tsx

@@ -0,0 +1,23 @@
+import { PropsWithChildren, memo } from 'react';
+import { Center, Flexbox } from 'react-layout-kit';
+
+import AppLayout from '../../layout/AppLayout';
+import Header from './features/Header';
+
+const MarketLayout = memo<PropsWithChildren>(({ children }) => {
+  return (
+    <AppLayout>
+      <Flexbox
+        flex={1}
+        height={'100vh'}
+        id={'lobe-market-container'}
+        style={{ position: 'relative' }}
+      >
+        <Header />
+        <Center flex={1}>{children}</Center>
+      </Flexbox>
+    </AppLayout>
+  );
+});
+
+export default MarketLayout;

package/src/pages/settings/{Header.tsx → features/Header/Desktop.tsx}

@@ -4,7 +4,7 @@ import { useTranslation } from 'react-i18next';
 
 import { useSessionStore } from '@/store/session';
 
-const Header = memo(() => {
+const Index = memo(() => {
   const { t } = useTranslation('setting');
   const [switchBackToChat] = useSessionStore((s) => [s.switchBackToChat]);
 
@@ -17,4 +17,4 @@ const Header = memo(() => {
   );
 });
 
-export default Header;
+export default Index;

package/src/pages/settings/features/Header/Mobile.tsx

@@ -0,0 +1,18 @@
+import { MobileNavBar, MobileNavBarTitle } from '@lobehub/ui';
+import Router from 'next/router';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+const Header = memo(() => {
+  const { t } = useTranslation('setting');
+
+  return (
+    <MobileNavBar
+      center={<MobileNavBarTitle title={t('header.global')} />}
+      onBackClick={() => Router.push('/chat')}
+      showBackButton
+    />
+  );
+});
+
+export default Header;

package/src/pages/settings/features/Header/index.tsx

@@ -0,0 +1,14 @@
+import { useResponsive } from 'antd-style';
+import { memo } from 'react';
+
+import Desktop from './Desktop';
+import Mobile from './Mobile';
+
+const Header = memo(() => {
+  const { mobile } = useResponsive();
+  const Render = mobile ? Mobile : Desktop;
+
+  return <Render />;
+});
+
+export default Header;

package/src/pages/settings/{Settings → features/Settings}/index.tsx

@@ -6,8 +6,7 @@ import { memo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Center, Flexbox } from 'react-layout-kit';
 
-import pkg from '@/../package.json';
-
+import pkg from '../../../../../package.json';
 import Agent from './Agent';
 import Common from './Common';
 

package/src/pages/settings/index.page.tsx

@@ -2,17 +2,14 @@ import { useResponsive } from 'antd-style';
 import Head from 'next/head';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { Flexbox } from 'react-layout-kit';
 
-import SafeSpacing from '@/components/SafeSpacing';
 import { createI18nNext } from '@/locales/create';
 import { useOnFinishHydrationGlobal, useSwitchSideBarOnInit } from '@/store/global';
 import { genSiteHeadTitle } from '@/utils/genSiteHeadTitle';
 
-import Header from './Header';
-import Settings from './Settings';
-import SettingLayout from './layout';
-import Mobile from './mobile';
+import Settings from './features/Settings';
+import DesktopLayout from './layout';
+import MobileLayout from './layout.mobile';
 
 const initI18n = createI18nNext({ namespace: 'setting' });
 
@@ -21,6 +18,8 @@ const Setting = memo(() => {
   const { t } = useTranslation('setting');
   const pageTitle = genSiteHeadTitle(t('header.global'));
 
+  const RenderLayout = mobile ? MobileLayout : DesktopLayout;
+
   useSwitchSideBarOnInit('settings');
 
   useOnFinishHydrationGlobal(() => {
@@ -32,21 +31,9 @@ const Setting = memo(() => {
       <Head>
         <title>{pageTitle}</title>
       </Head>
-      {mobile ? (
-        <Mobile>
-          <Flexbox align={'center'} padding={16} style={{ overflow: 'auto' }}>
-            <Settings />
-          </Flexbox>
-        </Mobile>
-      ) : (
-        <SettingLayout>
-          <Header />
-          <Flexbox align={'center'} flex={1} padding={24} style={{ overflow: 'auto' }}>
-            <SafeSpacing />
-            <Settings />
-          </Flexbox>
-        </SettingLayout>
-      )}
+      <RenderLayout>
+        <Settings />
+      </RenderLayout>
     </>
   );
 });

package/src/pages/settings/layout.mobile.tsx

@@ -0,0 +1,18 @@
+import { ReactNode, memo } from 'react';
+import { Flexbox } from 'react-layout-kit';
+
+import AppMobileLayout from '@/layout/AppMobileLayout';
+
+import Header from './features/Header';
+
+const SettingLayout = memo<{ children: ReactNode }>(({ children }) => {
+  return (
+    <AppMobileLayout navBar={<Header />}>
+      <Flexbox align={'center'} padding={16} style={{ overflow: 'auto' }}>
+        {children}
+      </Flexbox>
+    </AppMobileLayout>
+  );
+});
+
+export default SettingLayout;

package/src/pages/settings/layout.tsx

@@ -1,13 +1,20 @@
 import { ReactNode, memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
 
+import SafeSpacing from '@/components/SafeSpacing';
 import AppLayout from '@/layout/AppLayout';
 
+import Header from './features/Header';
+
 const SettingLayout = memo<{ children: ReactNode }>(({ children }) => {
   return (
     <AppLayout>
       <Flexbox flex={1} height={'100vh'} style={{ position: 'relative' }}>
-        {children}
+        <Header />
+        <Flexbox align={'center'} flex={1} padding={24} style={{ overflow: 'auto' }}>
+          <SafeSpacing />
+          {children}
+        </Flexbox>
       </Flexbox>
     </AppLayout>
   );

package/src/pages/welcome/{Banner → features/Banner}/AgentTemplate.tsx

@@ -2,8 +2,8 @@ import { useResponsive } from 'antd-style';
 import { memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
 
-import { useStyles } from '../style';
 import AgentCard, { type AgentCardProps } from './AgentCard';
+import { useStyles } from './style';
 
 const items: AgentCardProps['meta'][] = [
   {

package/src/pages/welcome/{Banner → features/Banner}/Hero.tsx

@@ -3,7 +3,7 @@ import { useResponsive } from 'antd-style';
 import { memo, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 
-import { genSize, useStyles } from '../style';
+import { genSize, useStyles } from './style';
 
 const Hero = memo<{ width: number }>(({ width }) => {
   const size = useMemo(

package/src/pages/welcome/{Banner → features/Banner}/index.tsx

@@ -11,8 +11,8 @@ import { SESSION_CHAT_URL } from '@/const/url';
 import { useImportConfig } from '@/hooks/useImportConfig';
 import { useSessionStore } from '@/store/session';
 
-import { useStyles } from '../style';
 import Hero from './Hero';
+import { useStyles } from './style';
 
 const Banner = memo<{ mobile?: boolean }>(() => {
   const { importConfig } = useImportConfig();

package/src/pages/welcome/index.page.tsx

@@ -5,10 +5,10 @@ import { useTranslation } from 'react-i18next';
 
 import { genSiteHeadTitle } from '@/utils/genSiteHeadTitle';
 
-import Banner from './Banner';
-import Footer from './Footer';
+import Banner from './features/Banner';
+import Footer from './features/Footer';
 import Layout from './layout';
-import Mobile from './mobile';
+import Mobile from './layout.mobile';
 
 const Welcome = memo(() => {
   const { mobile } = useResponsive();

package/src/pages/welcome/layout.tsx

@@ -4,7 +4,7 @@ import { PropsWithChildren, memo } from 'react';
 import { Center, Flexbox } from 'react-layout-kit';
 
 import AppLayout from '../../layout/AppLayout';
-import { useStyles } from './style';
+import { useStyles } from './features/Banner/style';
 
 const WelcomeLayout = memo<PropsWithChildren>(({ children }) => {
   const { styles } = useStyles();

package/src/store/session/slices/session/action.ts

@@ -158,13 +158,13 @@ export const createSessionSlice: StateCreator<
 
     get().activeSession(id);
 
-    Router.push(SESSION_CHAT_URL(id));
+    Router.push(SESSION_CHAT_URL(id, get().isMobile));
   },
   switchSession: (sessionId = INBOX_SESSION_ID) => {
     if (get().activeId === sessionId) return;
 
     get().activeSession(sessionId);
 
-    Router.push(SESSION_CHAT_URL(sessionId));
+    Router.push(SESSION_CHAT_URL(sessionId, get().isMobile));
   },
 });

package/src/store/session/slices/session/initialState.ts

@@ -13,6 +13,7 @@ export interface SessionState {
   activeId: string | undefined;
   // 默认会话
   inbox: LobeAgentSession;
+  isMobile?: boolean;
   searchKeywords: string;
   sessions: Record<string, LobeAgentSession>;
 }
@@ -40,6 +41,7 @@ export const initInbox = merge({}, initLobeSession, {
 export const initialSessionState: SessionState = {
   activeId: undefined,
   inbox: initInbox,
+  isMobile: false,
   searchKeywords: '',
   sessions: {},
 };

package/src/pages/chat/setting/Header.tsx

@@ -1,82 +0,0 @@
-import {
-  ActionIcon,
-  ChatHeader,
-  ChatHeaderTitle,
-  MobileNavBar,
-  MobileNavBarTitle,
-} from '@lobehub/ui';
-import { Dropdown, MenuProps } from 'antd';
-import { HardDriveDownload, Share2 } from 'lucide-react';
-import { memo, useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
-
-import { exportSingleAgent, exportSingleSession } from '@/helpers/export';
-import { useSessionStore } from '@/store/session';
-
-const Header = memo<{ mobile?: boolean }>(({ mobile }) => {
-  const { t } = useTranslation('setting');
-  const [id, onBack] = useSessionStore((s) => [s.activeId, s.switchBackToChat]);
-
-  const items = useMemo<MenuProps['items']>(
-    () => [
-      {
-        key: 'agent',
-        label: <div>{t('exportType.agent', { ns: 'common' })}</div>,
-        onClick: () => {
-          if (!id) return;
-
-          exportSingleAgent(id);
-        },
-      },
-      {
-        key: 'agentWithMessage',
-        label: <div>{t('exportType.agentWithMessage', { ns: 'common' })}</div>,
-        onClick: () => {
-          if (!id) return;
-
-          exportSingleSession(id);
-        },
-      },
-    ],
-    [],
-  );
-
-  if (mobile)
-    return (
-      <MobileNavBar
-        center={<MobileNavBarTitle title={t('header.session')} />}
-        onBackClick={onBack}
-        right={
-          <>
-            <ActionIcon icon={Share2} title={t('share', { ns: 'common' })} />
-            <Dropdown arrow={false} menu={{ items }} trigger={['click']}>
-              <ActionIcon icon={HardDriveDownload} title={t('export', { ns: 'common' })} />
-            </Dropdown>
-          </>
-        }
-        showBackButton
-      />
-    );
-
-  return (
-    <ChatHeader
-      left={<ChatHeaderTitle title={t('header.session')} />}
-      onBackClick={onBack}
-      right={
-        <>
-          <ActionIcon icon={Share2} size={{ fontSize: 24 }} title={t('share', { ns: 'common' })} />
-          <Dropdown arrow={false} menu={{ items }} trigger={['click']}>
-            <ActionIcon
-              icon={HardDriveDownload}
-              size={{ fontSize: 24 }}
-              title={t('export', { ns: 'common' })}
-            />
-          </Dropdown>
-        </>
-      }
-      showBackButton
-    />
-  );
-});
-
-export default Header;

package/src/pages/chat/setting/mobile.tsx

@@ -1,11 +0,0 @@
-import { PropsWithChildren, memo } from 'react';
-
-import AppMobileLayout from '@/layout/AppMobileLayout';
-
-import Header from './Header';
-
-const MobileLayout = memo<PropsWithChildren>(({ children }) => {
-  return <AppMobileLayout navBar={<Header mobile />}>{children}</AppMobileLayout>;
-});
-
-export default MobileLayout;

package/src/pages/settings/mobile.tsx

@@ -1,20 +0,0 @@
-import { MobileNavBar, MobileNavBarTitle } from '@lobehub/ui';
-import { ReactNode, memo } from 'react';
-import { useTranslation } from 'react-i18next';
-
-import AppMobileLayout from '@/layout/AppMobileLayout';
-
-const SettingLayout = memo<{ children: ReactNode }>(({ children }) => {
-  const { t } = useTranslation('setting');
-
-  return (
-    <AppMobileLayout
-      navBar={<MobileNavBar center={<MobileNavBarTitle title={t('header.global')} />} />}
-      showTabBar
-    >
-      {children}
-    </AppMobileLayout>
-  );
-});
-
-export default SettingLayout;