@lobehub/chat 0.83.10 → 0.84.0-beta.2

package/src/app/welcome/features/Banner/style.ts

@@ -1,13 +1,8 @@
 import { createStyles } from 'antd-style';
 import { rgba } from 'polished';
 
-export const useStyles = createStyles(({ css, token, stylish, cx, prefixCls }) => {
+export const useStyles = createStyles(({ css, token, stylish, cx }) => {
   return {
-    buttonGroup: css`
-      .${prefixCls}-upload {
-        width: 100% !important;
-      }
-    `,
     container: css`
       z-index: 10;
 
@@ -54,12 +49,8 @@ export const useStyles = createStyles(({ css, token, stylish, cx, prefixCls }) =
     view: cx(
       stylish.noScrollbar,
       css`
-        position: relative;
-
         overflow-x: hidden;
         overflow-y: auto;
-
-        max-width: 1024px;
         height: 100vh;
         padding: 32px 16px;
       `,

package/src/app/welcome/layout.tsx

@@ -0,0 +1,22 @@
+import { PropsWithChildren } from 'react';
+
+import { isMobileDevice } from '@/utils/responsive';
+
+import Desktop from './DesktopLayout';
+import Mobile from './MobileLayout';
+import Footer from './features/Footer';
+
+const Layout = ({ children }: PropsWithChildren) => {
+  const mobile = isMobileDevice();
+
+  return mobile ? (
+    <Mobile>{children}</Mobile>
+  ) : (
+    <Desktop>
+      {children}
+      <Footer />
+    </Desktop>
+  );
+};
+
+export default Layout;

package/src/app/welcome/page.tsx

@@ -1,14 +1,12 @@
-import { isMobileDevice } from '@/utils/responsive';
+import { t } from 'i18next';
+import { Metadata } from 'next';
 
-import DesktopPage from './(desktop)';
-import MobilePage from './(mobile)';
+import Banner from './features/Banner';
 
-const Page = () => {
-  const mobile = isMobileDevice();
+export const generateMetadata = (): Metadata => ({
+  title: t('header', { ns: 'welcome' }),
+});
 
-  const Page = mobile ? MobilePage : DesktopPage;
-
-  return <Page />;
-};
+const Page = () => <Banner />;
 
 export default Page;

package/src/{layout/ResponsiveLayout.server.tsx → components/ResponsiveLayout.tsx}

@@ -1,14 +1,13 @@
 import { PropsWithChildren, ReactNode } from 'react';
 
-import { isMobileDevice } from '@/utils/responsive';
-
 interface ServerResponsiveLayoutProps {
   Desktop: (props: PropsWithChildren) => ReactNode;
   Mobile: (props: PropsWithChildren) => ReactNode;
   children?: ReactNode;
+  isMobile: () => boolean;
 }
-const ResponsiveLayout = ({ children, Desktop, Mobile }: ServerResponsiveLayoutProps) => {
-  const mobile = isMobileDevice();
+const ResponsiveLayout = ({ children, Desktop, Mobile, isMobile }: ServerResponsiveLayoutProps) => {
+  const mobile = isMobile();
 
   return mobile ? <Mobile>{children}</Mobile> : <Desktop>{children}</Desktop>;
 };

package/src/features/MobileTabBar/index.tsx

@@ -49,7 +49,7 @@ export default memo<{ className?: string }>(({ className }) => {
         key: SidebarTabKey.Setting,
         onClick: () => {
           setTab(SidebarTabKey.Setting);
-          router.push('/settings');
+          router.push('/settings/mobile');
         },
         title: t('tab.setting'),
       },

package/src/features/SideBar/BottomActions.tsx

@@ -102,7 +102,7 @@ const BottomActions = memo<BottomActionProps>(({ tab, setTab }) => {
         label: t('setting'),
         onClick: () => {
           setTab(SidebarTabKey.Setting);
-          router.push('/settings/common');
+          router.push('/settings');
         },
       },
     ],

package/src/layout/{AppLayout.desktop.tsx → AppLayout.tsx}

@@ -5,7 +5,7 @@ import { Flexbox } from 'react-layout-kit';
 import SideBar from '@/features/SideBar';
 import { useIsPWA } from '@/hooks/useIsPWA';
 
-const AppLayoutDesktop = memo<PropsWithChildren>(({ children }) => {
+const AppLayout = memo<PropsWithChildren>(({ children }) => {
   const isPWA = useIsPWA();
   const theme = useTheme();
   return (
@@ -20,4 +20,4 @@ const AppLayoutDesktop = memo<PropsWithChildren>(({ children }) => {
   );
 });
 
-export default AppLayoutDesktop;
+export default AppLayout;

package/src/layout/{AppLayout.mobile.tsx → AppMobileLayout.tsx}

@@ -43,7 +43,7 @@ interface AppMobileLayoutProps extends PropsWithChildren {
   title?: MobileNavBarTitleProps;
 }
 
-const AppLayoutMobile = memo<AppMobileLayoutProps>(
+const AppMobileLayout = memo<AppMobileLayoutProps>(
   ({ children, showTabBar, navBar, style, className }) => {
     const { styles, cx } = useStyles();
 
@@ -67,4 +67,4 @@ const AppLayoutMobile = memo<AppMobileLayoutProps>(
   },
 );
 
-export default AppLayoutMobile;
+export default AppMobileLayout;

package/src/layout/GlobalLayout/StoreHydration.tsx

@@ -1,14 +1,9 @@
-import { useResponsive } from 'antd-style';
 import { useRouter } from 'next/navigation';
 import { memo, useEffect } from 'react';
 
 import { useGlobalStore } from '@/store/global';
 import { usePluginStore } from '@/store/plugin';
-import {
-  useEffectAfterSessionHydrated,
-  useOnFinishHydrationSession,
-  useSessionStore,
-} from '@/store/session';
+import { useOnFinishHydrationSession, useSessionStore } from '@/store/session';
 
 const StoreHydration = memo(() => {
   const router = useRouter();
@@ -27,15 +22,6 @@ const StoreHydration = memo(() => {
     store.setState({ router });
   });
 
-  const { mobile } = useResponsive();
-
-  useEffectAfterSessionHydrated(
-    (store) => {
-      store.setState({ isMobile: mobile });
-    },
-    [mobile],
-  );
-
   return null;
 });
 

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

@@ -33,7 +33,7 @@ export const initLobeSession: LobeAgentSession = {
 
 export const initInbox = merge({}, initLobeSession, {
   config: {
-    systemRole: '',
+    systemRole: '你是一名 AI 助理',
   } as LobeAgentConfig,
   id: 'inbox',
   meta: {
@@ -42,7 +42,7 @@ export const initInbox = merge({}, initLobeSession, {
 } as Partial<LobeAgentSession>);
 
 export const initialSessionState: SessionState = {
-  activeId: 'inbox',
+  activeId: undefined,
   inbox: initInbox,
   isMobile: false,
   searchKeywords: '',

package/src/app/chat/(desktop)/layout.responsive.tsx

@@ -1,12 +0,0 @@
-import { PropsWithChildren, memo } from 'react';
-
-import ResponsiveLayout from '@/layout/ResponsiveLayout.client';
-
-import Mobile from '../(mobile)/layout.mobile';
-import Desktop from './layout.desktop';
-
-export default memo(({ children }: PropsWithChildren) => (
-  <ResponsiveLayout Desktop={Desktop} Mobile={Mobile}>
-    {children}
-  </ResponsiveLayout>
-));

package/src/app/chat/(mobile)/layout.mobile.tsx

@@ -1,17 +0,0 @@
-'use client';
-
-import { PropsWithChildren, memo } from 'react';
-
-import SessionHeader from '@/app/chat/(mobile)/features/SessionHeader';
-import AppLayoutMobile from '@/layout/AppLayout.mobile';
-import { useSwitchSideBarOnInit } from '@/store/global';
-import { SidebarTabKey } from '@/store/global/initialState';
-
-export default memo(({ children }: PropsWithChildren) => {
-  useSwitchSideBarOnInit(SidebarTabKey.Chat);
-  return (
-    <AppLayoutMobile navBar={<SessionHeader />} showTabBar>
-      {children}
-    </AppLayoutMobile>
-  );
-});

package/src/app/chat/(mobile)/mobile/index.tsx

@@ -1,19 +0,0 @@
-'use client';
-
-import { memo } from 'react';
-import { Flexbox } from 'react-layout-kit';
-
-import Conversation from '../../features/Conversation';
-import ChatInput from '../features/ChatInput';
-import TopicList from '../features/TopicList';
-import Layout from './layout.mobile';
-
-const Chat = memo(() => (
-  <Layout>
-    <Flexbox height={'calc(100vh - 44px)'} horizontal>
-      <Conversation chatInput={<ChatInput />} mobile />
-      <TopicList />
-    </Flexbox>
-  </Layout>
-));
-export default Chat;

package/src/app/chat/(mobile)/mobile/layout.mobile.tsx

@@ -1,11 +0,0 @@
-'use client';
-
-import { PropsWithChildren } from 'react';
-
-import AppLayoutMobile from '@/layout/AppLayout.mobile';
-
-import ChatHeader from '../features/ChatHeader';
-
-export default ({ children }: PropsWithChildren) => (
-  <AppLayoutMobile navBar={<ChatHeader />}>{children}</AppLayoutMobile>
-);

package/src/app/chat/settings/(desktop)/index.tsx

@@ -1,14 +0,0 @@
-'use client';
-
-import { memo } from 'react';
-
-import EditPage from '../features/EditPage';
-import Layout from './layout.responsive';
-
-const ChatSettings = memo(() => (
-  <Layout>
-    <EditPage />
-  </Layout>
-));
-
-export default ChatSettings;

package/src/app/chat/settings/(desktop)/layout.responsive.tsx

@@ -1,12 +0,0 @@
-import { PropsWithChildren, memo } from 'react';
-
-import ResponsiveLayout from '@/layout/ResponsiveLayout.client';
-
-import Mobile from '../(mobile)/layout.mobile';
-import Desktop from './layout.desktop';
-
-export default memo(({ children }: PropsWithChildren) => (
-  <ResponsiveLayout Desktop={Desktop} Mobile={Mobile}>
-    {children}
-  </ResponsiveLayout>
-));

package/src/app/chat/settings/(mobile)/index.tsx

@@ -1,14 +0,0 @@
-'use client';
-
-import { memo } from 'react';
-
-import EditPage from '../features/EditPage';
-import Layout from './layout.mobile';
-
-const ChatSettings = memo(() => (
-  <Layout>
-    <EditPage />
-  </Layout>
-));
-
-export default ChatSettings;

package/src/app/chat/settings/features/EditPage.tsx

@@ -1,38 +0,0 @@
-'use client';
-
-import isEqual from 'fast-deep-equal';
-import { memo } from 'react';
-import { useTranslation } from 'react-i18next';
-
-import PageTitle from '@/components/PageTitle';
-import AgentSetting from '@/features/AgentSetting';
-import { useSessionStore } from '@/store/session';
-import { agentSelectors } from '@/store/session/selectors';
-import { genSiteHeadTitle } from '@/utils/genSiteHeadTitle';
-
-const EditPage = memo(() => {
-  const { t } = useTranslation('setting');
-  const config = useSessionStore(agentSelectors.currentAgentConfig, isEqual);
-  const meta = useSessionStore(agentSelectors.currentAgentMeta, isEqual);
-  const [updateAgentConfig, updateAgentMeta, title] = useSessionStore((s) => [
-    s.updateAgentConfig,
-    s.updateAgentMeta,
-    agentSelectors.currentAgentTitle(s),
-  ]);
-
-  const pageTitle = genSiteHeadTitle(t('header.sessionWithName', { name: title }));
-
-  return (
-    <>
-      <PageTitle title={pageTitle} />
-      <AgentSetting
-        config={config}
-        meta={meta}
-        onConfigChange={updateAgentConfig}
-        onMetaChange={updateAgentMeta}
-      />
-    </>
-  );
-});
-
-export default EditPage;

package/src/app/market/(desktop)/index.tsx

@@ -1,12 +0,0 @@
-import { memo } from 'react';
-
-import { AgentCardProps } from '@/app/market/features/AgentCard';
-
-import Index from '../index';
-import Layout from './layout.responsive';
-
-export default memo<AgentCardProps>((props) => (
-  <Layout>
-    <Index {...props} />
-  </Layout>
-));

package/src/app/market/(desktop)/layout.responsive.tsx

@@ -1,16 +0,0 @@
-'use client';
-
-import { PropsWithChildren } from 'react';
-
-import ResponsiveLayout from '@/layout/ResponsiveLayout.client';
-
-import Mobile from '../(mobile)/layout.mobile';
-import Desktop from './layout.desktop';
-
-const Market = ({ children }: PropsWithChildren) => (
-  <ResponsiveLayout Desktop={Desktop} Mobile={Mobile}>
-    {children}
-  </ResponsiveLayout>
-);
-
-export default Market;

package/src/app/market/(mobile)/index.tsx

@@ -1,12 +0,0 @@
-import { memo } from 'react';
-
-import { AgentCardProps } from '@/app/market/features/AgentCard';
-
-import Index from '../index';
-import Layout from './layout.mobile';
-
-export default memo<AgentCardProps>((props) => (
-  <Layout>
-    <Index {...props} />
-  </Layout>
-));

package/src/app/settings/(desktop)/index.tsx

@@ -1,17 +0,0 @@
-'use client';
-
-import { memo } from 'react';
-
-import ResponsiveIndex from '@/components/ResponsiveIndex';
-
-import Mobile from '../(mobile)';
-import Common from '../common';
-import Layout from './layout.responsive';
-
-export default memo(() => (
-  <ResponsiveIndex Mobile={Mobile}>
-    <Layout>
-      <Common />
-    </Layout>
-  </ResponsiveIndex>
-));

package/src/app/settings/(desktop)/layout.responsive.tsx

@@ -1,14 +0,0 @@
-'use client';
-
-import { PropsWithChildren, memo } from 'react';
-
-import ResponsiveLayout from '@/layout/ResponsiveLayout.client';
-
-import MobileLayout from '../(mobile)/layout.mobile';
-import DesktopLayout from './layout.desktop';
-
-export default memo(({ children }: PropsWithChildren) => (
-  <ResponsiveLayout Desktop={DesktopLayout} Mobile={MobileLayout}>
-    {children}
-  </ResponsiveLayout>
-));

package/src/app/settings/(mobile)/features/Header/Home.tsx

@@ -1,8 +0,0 @@
-import { Logo, MobileNavBar } from '@lobehub/ui';
-import { memo } from 'react';
-
-const Header = memo(() => {
-  return <MobileNavBar center={<Logo type={'text'} />} />;
-});
-
-export default Header;

package/src/app/settings/(mobile)/index.tsx

@@ -1,3 +0,0 @@
-import Index from './mobile';
-
-export default () => <Index />;

package/src/app/settings/(mobile)/layout.mobile.tsx

@@ -1,19 +0,0 @@
-'use client';
-
-import { PropsWithChildren, memo } from 'react';
-import { Flexbox } from 'react-layout-kit';
-
-import AppLayoutMobile from '@/layout/AppLayout.mobile';
-import { useSwitchSideBarOnInit } from '@/store/global';
-import { SidebarTabKey } from '@/store/global/initialState';
-
-import Header from './features/Header';
-
-export default memo(({ children }: PropsWithChildren) => {
-  useSwitchSideBarOnInit(SidebarTabKey.Setting);
-  return (
-    <AppLayoutMobile navBar={<Header />}>
-      <Flexbox style={{ overflow: 'auto' }}>{children}</Flexbox>
-    </AppLayoutMobile>
-  );
-});

package/src/app/settings/(mobile)/mobile/layout.mobile.tsx

@@ -1,14 +0,0 @@
-'use client';
-
-import { PropsWithChildren, memo } from 'react';
-import { Flexbox } from 'react-layout-kit';
-
-import AppLayoutMobile from '@/layout/AppLayout.mobile';
-
-import Header from '../features/Header/Home';
-
-export default memo(({ children }: PropsWithChildren) => (
-  <AppLayoutMobile navBar={<Header />} showTabBar>
-    <Flexbox style={{ overflow: 'auto' }}>{children}</Flexbox>
-  </AppLayoutMobile>
-));

package/src/app/settings/agent/Agent.tsx

@@ -1,30 +0,0 @@
-import isEqual from 'fast-deep-equal';
-import { memo } from 'react';
-
-import AgentSetting from '@/features/AgentSetting';
-import { settingsSelectors, useGlobalStore } from '@/store/global';
-import { useSwitchSideBarOnInit } from '@/store/global/hooks/useSwitchSettingsOnInit';
-import { SettingsTabs } from '@/store/global/initialState';
-
-const Agent = memo(() => {
-  useSwitchSideBarOnInit(SettingsTabs.Agent);
-
-  const config = useGlobalStore(settingsSelectors.defaultAgentConfig, isEqual);
-  const meta = useGlobalStore(settingsSelectors.defaultAgentMeta, isEqual);
-  const [updateAgent] = useGlobalStore((s) => [s.updateDefaultAgent]);
-
-  return (
-    <AgentSetting
-      config={config}
-      meta={meta}
-      onConfigChange={(config) => {
-        updateAgent({ config });
-      }}
-      onMetaChange={(meta) => {
-        updateAgent({ meta });
-      }}
-    />
-  );
-});
-
-export default Agent;

package/src/app/settings/agent/index.tsx

@@ -1,23 +0,0 @@
-'use client';
-
-import { memo } from 'react';
-import { useTranslation } from 'react-i18next';
-
-import PageTitle from '@/components/PageTitle';
-import { useSwitchSideBarOnInit } from '@/store/global/hooks/useSwitchSettingsOnInit';
-import { SettingsTabs } from '@/store/global/initialState';
-import { genSiteHeadTitle } from '@/utils/genSiteHeadTitle';
-
-import Agent from './Agent';
-
-export default memo(() => {
-  useSwitchSideBarOnInit(SettingsTabs.Agent);
-  const { t } = useTranslation('setting');
-  const pageTitle = genSiteHeadTitle(t('tab.agent'));
-  return (
-    <>
-      <PageTitle title={pageTitle} />
-      <Agent />
-    </>
-  );
-});

package/src/app/settings/agent/layout.tsx

@@ -1 +0,0 @@
-export { default } from '../layout.server';

package/src/app/settings/common/index.tsx

@@ -1,23 +0,0 @@
-'use client';
-
-import { memo } from 'react';
-import { useTranslation } from 'react-i18next';
-
-import PageTitle from '@/components/PageTitle';
-import { useSwitchSideBarOnInit } from '@/store/global/hooks/useSwitchSettingsOnInit';
-import { SettingsTabs } from '@/store/global/initialState';
-import { genSiteHeadTitle } from '@/utils/genSiteHeadTitle';
-
-import Common from './Common';
-
-export default memo(() => {
-  useSwitchSideBarOnInit(SettingsTabs.Common);
-  const { t } = useTranslation('setting');
-  const pageTitle = genSiteHeadTitle(t('tab.common'));
-  return (
-    <>
-      <PageTitle title={pageTitle} />
-      <Common />
-    </>
-  );
-});

package/src/app/settings/common/layout.tsx

@@ -1 +0,0 @@
-export { default } from '../layout.server';

package/src/app/settings/layout.server.tsx

@@ -1,12 +0,0 @@
-import { PropsWithChildren, memo } from 'react';
-
-import ResponsiveLayout from '@/layout/ResponsiveLayout.server';
-
-import DesktopLayout from './(desktop)/layout.responsive';
-import MobileLayout from './(mobile)/layout.mobile';
-
-export default memo(({ children }: PropsWithChildren) => (
-  <ResponsiveLayout Desktop={DesktopLayout} Mobile={MobileLayout}>
-    {children}
-  </ResponsiveLayout>
-));

package/src/app/settings/llm/index.tsx

@@ -1,23 +0,0 @@
-'use client';
-
-import { memo } from 'react';
-import { useTranslation } from 'react-i18next';
-
-import PageTitle from '@/components/PageTitle';
-import { useSwitchSideBarOnInit } from '@/store/global/hooks/useSwitchSettingsOnInit';
-import { SettingsTabs } from '@/store/global/initialState';
-import { genSiteHeadTitle } from '@/utils/genSiteHeadTitle';
-
-import LLM from './LLM';
-
-export default memo(() => {
-  useSwitchSideBarOnInit(SettingsTabs.LLM);
-  const { t } = useTranslation('setting');
-  const pageTitle = genSiteHeadTitle(t('tab.llm'));
-  return (
-    <>
-      <PageTitle title={pageTitle} />
-      <LLM />
-    </>
-  );
-});

package/src/app/settings/llm/layout.tsx

@@ -1 +0,0 @@
-export { default } from '../layout.server';

package/src/app/welcome/(desktop)/features/Showcase.tsx

@@ -1,23 +0,0 @@
-'use client';
-
-import { GridShowcase } from '@lobehub/ui';
-import { memo } from 'react';
-import { Flexbox } from 'react-layout-kit';
-
-import Banner from '@/app/welcome/features/Banner';
-
-const Showcase = memo(() => (
-  <Flexbox
-    flex={1}
-    justify={'center'}
-    style={{ height: '100vh', position: 'relative', width: '100%' }}
-  >
-    <GridShowcase>
-      <Banner />
-    </GridShowcase>
-    {/*TODO：暂时隐藏，待模板完成后再补回*/}
-    {/*<AgentTemplate width={width} />*/}
-  </Flexbox>
-));
-
-export default Showcase;

package/src/app/welcome/(desktop)/index.tsx

@@ -1,19 +0,0 @@
-'use client';
-
-import { memo } from 'react';
-
-import ResponsiveIndex from '@/components/ResponsiveIndex';
-
-import Mobile from '../(mobile)';
-import Footer from './features/Footer';
-import Showcase from './features/Showcase';
-import Layout from './layout.responsive';
-
-export default memo(() => (
-  <ResponsiveIndex Mobile={Mobile}>
-    <Layout>
-      <Showcase />
-      <Footer />
-    </Layout>
-  </ResponsiveIndex>
-));