@lobehub/chat 1.97.7 → 1.97.8

package/CHANGELOG.md

@@ -2,6 +2,23 @@
 
 # Changelog
 
+### [Version 1.97.8](https://github.com/lobehub/lobe-chat/compare/v1.97.7...v1.97.8)
+
+<sup>Released on **2025-07-10**</sup>
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ### [Version 1.97.7](https://github.com/lobehub/lobe-chat/compare/v1.97.6...v1.97.7)
 
 <sup>Released on **2025-07-10**</sup>

package/changelog/v1.json

@@ -1,4 +1,9 @@
 [
+  {
+    "children": {},
+    "date": "2025-07-10",
+    "version": "1.97.8"
+  },
   {
     "children": {
       "improvements": [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "1.97.7",
+  "version": "1.97.8",
   "description": "Lobe Chat - an open-source, high-performance chatbot framework that supports speech synthesis, multimodal, and extensible Function Call plugin system. Supports one-click free deployment of your private ChatGPT/LLM web application.",
   "keywords": [
     "framework",
@@ -171,7 +171,7 @@
     "@xterm/xterm": "^5.5.0",
     "ahooks": "^3.8.5",
     "ai": "^3.4.33",
-    "antd": "5.26.2",
+    "antd": "^5.26.4",
     "antd-style": "^3.7.1",
     "brotli-wasm": "^3.0.1",
     "chroma-js": "^3.1.2",

package/src/app/[variants]/(main)/discover/(detail)/assistant/[...slugs]/features/Details/Nav.tsx

@@ -28,12 +28,13 @@ const useStyles = createStyles(({ css, token }) => {
     `,
   };
 });
-
-const Nav = memo<{
+interface NavProps {
   activeTab?: AssistantNavKey;
   mobile?: boolean;
   setActiveTab?: (tab: AssistantNavKey) => void;
-}>(({ mobile, setActiveTab, activeTab = AssistantNavKey.Overview }) => {
+}
+
+const Nav = memo<NavProps>(({ mobile, setActiveTab, activeTab = AssistantNavKey.Overview }) => {
   const { t } = useTranslation('discover');
   const { pluginCount, knowledgeCount, identifier } = useDetailContext();
   const { styles } = useStyles();

package/src/app/[variants]/(main)/discover/(detail)/features/MakedownRender.tsx

@@ -13,6 +13,7 @@ const MarkdownRender = memo<{ children?: string }>(({ children }) => {
         <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
       </Center>
     );
+
   return (
     <Markdown
       allowHtml
@@ -29,6 +30,8 @@ const MarkdownRender = memo<{ children?: string }>(({ children }) => {
         h5: H5,
         img: ({ src, ...rest }: { src: string }) => {
           if (src.includes('glama.ai')) return;
+
+          // eslint-disable-next-line @next/next/no-img-element
           if (src && src.startsWith('http')) return <img src={src} {...rest} />;
           return;
         },

package/src/app/[variants]/(main)/discover/(detail)/features/Toc/useToc.tsx

@@ -4,12 +4,19 @@ import { AnchorProps } from 'antd';
 import { unionBy } from 'lodash-es';
 import { FC, PropsWithChildren, createContext, useContext, useState } from 'react';
 
-const TocContext = createContext<{
+interface TocState {
   isLoading: boolean;
   setFinished: () => void;
   setToc: (data: any) => void;
   toc?: AnchorProps['items'];
-}>({ isLoading: true, setFinished: () => {}, setToc: () => {}, toc: [] });
+}
+
+const TocContext = createContext<TocState>({
+  isLoading: true,
+  setFinished: () => {},
+  setToc: () => {},
+  toc: [],
+});
 
 export interface TOCItem {
   href: string;

package/src/app/[variants]/(main)/discover/(detail)/model/[...slugs]/features/Details/Nav.tsx

@@ -26,11 +26,13 @@ const useStyles = createStyles(({ css, token }) => {
   };
 });
 
-const Nav = memo<{
+interface NavProps {
   activeTab?: ModelNavKey;
   mobile?: boolean;
   setActiveTab?: (tab: ModelNavKey) => void;
-}>(({ mobile, setActiveTab, activeTab = ModelNavKey.Overview }) => {
+}
+
+const Nav = memo<NavProps>(({ mobile, setActiveTab, activeTab = ModelNavKey.Overview }) => {
   const { t } = useTranslation('discover');
   const { styles } = useStyles();
 

package/src/app/[variants]/(main)/discover/(detail)/provider/[...slugs]/features/Details/Nav.tsx

@@ -29,11 +29,13 @@ const useStyles = createStyles(({ css, token }) => {
   };
 });
 
-const Nav = memo<{
+interface NavProps {
   activeTab?: ProviderNavKey;
   mobile?: boolean;
   setActiveTab?: (tab: ProviderNavKey) => void;
-}>(({ mobile, setActiveTab, activeTab = ProviderNavKey.Overview }) => {
+}
+
+const Nav = memo<NavProps>(({ mobile, setActiveTab, activeTab = ProviderNavKey.Overview }) => {
   const { t } = useTranslation('discover');
   const { identifier } = useDetailContext();
   const { styles } = useStyles();

package/src/app/[variants]/(main)/discover/(list)/features/SortButton/index.tsx

@@ -167,6 +167,7 @@ const SortButton = memo(() => {
   return (
     <Dropdown
       menu={{
+        // @ts-expect-error 等待 antd 修复
         activeKey: activeItem.key,
         items: items as DropdownMenuItemType[],
         onClick: ({ key }) => handleSort(key),

package/src/app/[variants]/(main)/files/(content)/@modal/(.)[id]/page.tsx

@@ -15,3 +15,5 @@ const Page = async (props: PagePropsWithId) => {
 };
 
 export default Page;
+
+export const dynamic = 'force-static';

package/src/app/[variants]/(main)/files/[id]/page.tsx

@@ -39,3 +39,5 @@ const FilePage = async (props: PagePropsWithId) => {
 };
 
 export default FilePage;
+
+export const dynamic = 'force-static';

package/src/app/[variants]/(main)/repos/[id]/Client.tsx

@@ -0,0 +1,29 @@
+'use client';
+
+import { memo } from 'react';
+import { Flexbox } from 'react-layout-kit';
+
+import FileManager from '@/features/FileManager';
+import FilePanel from '@/features/FileSidePanel';
+import { knowledgeBaseSelectors, useKnowledgeBaseStore } from '@/store/knowledgeBase';
+
+import Menu from './features/Menu';
+import { useKnowledgeBaseItem } from './hooks/useKnowledgeItem';
+
+const RepoClientPage = memo<{ id: string }>(({ id }) => {
+  useKnowledgeBaseItem(id);
+  const name = useKnowledgeBaseStore(knowledgeBaseSelectors.getKnowledgeBaseNameById(id));
+
+  return (
+    <>
+      <FilePanel>
+        <Menu id={id} />
+      </FilePanel>
+      <Flexbox flex={1} style={{ overflow: 'hidden', position: 'relative' }}>
+        <FileManager knowledgeBaseId={id} title={name} />
+      </Flexbox>
+    </>
+  );
+});
+
+export default RepoClientPage;

package/src/app/[variants]/(main)/repos/[id]/features/Menu/Head/index.tsx

@@ -1,13 +1,17 @@
 'use client';
 
 import { Text } from '@lobehub/ui';
+import { Skeleton } from 'antd';
 import { memo } from 'react';
 import { Center, Flexbox } from 'react-layout-kit';
 
 import GoBack from '@/components/GoBack';
 import RepoIcon from '@/components/RepoIcon';
+import { knowledgeBaseSelectors, useKnowledgeBaseStore } from '@/store/knowledgeBase';
+
+const Head = memo<{ id: string }>(({ id }) => {
+  const name = useKnowledgeBaseStore(knowledgeBaseSelectors.getKnowledgeBaseNameById(id));
 
-const Head = memo<{ name?: string }>(({ name }) => {
   return (
     <Flexbox gap={8}>
       <GoBack href={'/files'} />
@@ -16,9 +20,13 @@ const Head = memo<{ name?: string }>(({ name }) => {
           <RepoIcon />
         </Center>
 
-        <Text ellipsis strong style={{ fontSize: 16 }}>
-          {name}
-        </Text>
+        {!name ? (
+          <Skeleton active paragraph={false} title={{ style: { marginBottom: 0 }, width: 80 }} />
+        ) : (
+          <Text ellipsis strong style={{ fontSize: 16 }}>
+            {name}
+          </Text>
+        )}
       </Flexbox>
     </Flexbox>
   );

package/src/app/[variants]/(main)/repos/[id]/features/Menu/Menu/index.tsx

@@ -10,12 +10,15 @@ import { Flexbox } from 'react-layout-kit';
 
 import Menu from '@/components/Menu';
 import type { MenuProps } from '@/components/Menu';
+import { useKnowledgeBaseStore } from '@/store/knowledgeBase';
 import { featureFlagsSelectors, useServerConfigStore } from '@/store/serverConfig';
 
-const FileMenu = memo<{ id: string }>(({ id }) => {
+const FileMenu = memo(() => {
   const { t } = useTranslation('knowledgeBase');
   const pathname = usePathname();
   const { enableRAGEval } = useServerConfigStore(featureFlagsSelectors);
+  const id = useKnowledgeBaseStore((s) => s.activeKnowledgeBaseId);
+
   const [activeKey, setActiveKey] = useState(
     pathname.startsWith(`/repos/${id}/evals`) ? 'eval' : 'files',
   );

package/src/app/[variants]/(main)/repos/[id]/features/Menu/index.tsx

@@ -4,14 +4,14 @@ import { Flexbox } from 'react-layout-kit';
 import Head from './Head';
 import Menu from './Menu';
 
-type Props = { id: string; name: string };
-
-const ComposeMenu = memo<Props>(({ id, name }) => (
-  <Flexbox gap={16} height={'100%'} paddingInline={12} style={{ paddingTop: 12 }}>
-    <Head name={name} />
-    <Menu id={id} />
-  </Flexbox>
-));
+const ComposeMenu = memo<{ id: string }>(({ id }) => {
+  return (
+    <Flexbox gap={16} height={'100%'} paddingInline={12} style={{ paddingTop: 12 }}>
+      <Head id={id} />
+      <Menu />
+    </Flexbox>
+  );
+});
 
 ComposeMenu.displayName = 'ComposeMenu';
 

package/src/app/[variants]/(main)/repos/[id]/layout.tsx

@@ -9,3 +9,5 @@ const Layout = ServerLayout<LayoutProps>({ Desktop, Mobile });
 Layout.displayName = 'RepoLayout';
 
 export default (props: LayoutProps) => <Layout {...props} />;
+
+export const dynamic = 'force-static';

package/src/app/[variants]/(main)/repos/[id]/page.tsx

@@ -1,29 +1,9 @@
-import { redirect } from 'next/navigation';
-import { Flexbox } from 'react-layout-kit';
-
-import { KnowledgeBaseModel } from '@/database/models/knowledgeBase';
-import { getServerDB } from '@/database/server';
-import FileManager from '@/features/FileManager';
-import FilePanel from '@/features/FileSidePanel';
 import { PagePropsWithId } from '@/types/next';
 
-import Menu from './features/Menu';
+import Client from './Client';
 
 export default async (props: PagePropsWithId) => {
   const params = await props.params;
 
-  const serverDB = await getServerDB();
-  const item = await KnowledgeBaseModel.findById(serverDB, params.id);
-  if (!item) return redirect('/repos');
-
-  return (
-    <>
-      <FilePanel>
-        <Menu id={params.id} name={item.name} />
-      </FilePanel>
-      <Flexbox flex={1} style={{ overflow: 'hidden', position: 'relative' }}>
-        <FileManager knowledgeBaseId={params.id} title={item.name} />
-      </Flexbox>
-    </>
-  );
+  return <Client id={params.id} />;
 };

package/src/app/[variants]/(main)/repos/loading.tsx

@@ -0,0 +1,3 @@
+import Loading from '@/components/Loading/BrandTextLoading';
+
+export default () => <Loading />;

package/src/app/[variants]/(main)/settings/agent/AgentMenu/Menu.tsx

@@ -0,0 +1,17 @@
+'use client';
+
+import { useQueryState } from 'nuqs';
+import { memo } from 'react';
+
+import { AgentCategory } from '@/features/AgentSetting';
+import { ChatSettingsTabs } from '@/store/global/initialState';
+
+const Menu = memo(() => {
+  const [tab, setTab] = useQueryState('tab', {
+    defaultValue: ChatSettingsTabs.Prompt,
+  });
+
+  return <AgentCategory setTab={setTab} tab={tab} />;
+});
+
+export default Menu;

package/src/app/[variants]/(main)/settings/agent/AgentMenu/index.tsx

@@ -1,14 +1,13 @@
 'use client';
 
 import { Alert } from '@lobehub/ui';
+import { Skeleton } from 'antd';
 import { useTheme } from 'antd-style';
-import { useQueryState } from 'nuqs';
-import { memo } from 'react';
+import { Suspense, memo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
 
-import { AgentCategory } from '@/features/AgentSetting';
-import { ChatSettingsTabs } from '@/store/global/initialState';
+import Menu from './Menu';
 
 interface ProviderMenuProps {
   mobile?: boolean;
@@ -16,9 +15,6 @@ interface ProviderMenuProps {
 const ProviderMenu = memo(({ mobile }: ProviderMenuProps) => {
   const theme = useTheme();
   const { t } = useTranslation('setting');
-  const [tab, setTab] = useQueryState('tab', {
-    defaultValue: ChatSettingsTabs.Prompt,
-  });
 
   const width = mobile ? undefined : 260;
   return (
@@ -41,7 +37,15 @@ const ProviderMenu = memo(({ mobile }: ProviderMenuProps) => {
         }}
         variant={'filled'}
       />
-      <AgentCategory setTab={setTab} tab={tab} />
+      <Suspense
+        fallback={
+          <Flexbox gap={4} paddingBlock={8} paddingInline={8}>
+            <Skeleton active paragraph={{ rows: 4 }} title={false} />
+          </Flexbox>
+        }
+      >
+        <Menu />
+      </Suspense>
     </Flexbox>
   );
 });

package/src/app/[variants]/(main)/settings/agent/page.tsx

@@ -1,8 +1,13 @@
+import { Skeleton } from 'antd';
+import { Suspense } from 'react';
+
 import { metadataModule } from '@/server/metadata';
 import { translation } from '@/server/translation';
 import { DynamicLayoutProps } from '@/types/next';
 import { RouteVariants } from '@/utils/server/routeVariants';
 
+import Page from './index';
+
 export const generateMetadata = async (props: DynamicLayoutProps) => {
   const locale = await RouteVariants.getLocale(props);
   const { t } = await translation('setting', locale);
@@ -12,4 +17,13 @@ export const generateMetadata = async (props: DynamicLayoutProps) => {
     url: '/settings/agent',
   });
 };
-export { default } from './index';
+
+export default () => {
+  return (
+    <Suspense fallback={<Skeleton active paragraph={{ rows: 5 }} title={false} />}>
+      <Page />
+    </Suspense>
+  );
+};
+
+export const dynamic = 'force-static';

package/src/app/[variants]/(main)/settings/provider/(detail)/[id]/ClientMode.tsx

@@ -1,22 +1,34 @@
 'use client';
 
-import { memo } from 'react';
+import { useRouter } from 'next/navigation';
+import { memo, useEffect } from 'react';
 import { Flexbox } from 'react-layout-kit';
-import useSWR from 'swr';
 
+import Loading from '@/components/Loading/BrandTextLoading';
+import { useClientDataSWR } from '@/libs/swr';
 import { aiProviderService } from '@/services/aiProvider';
 
 import ModelList from '../../features/ModelList';
 import ProviderConfig from '../../features/ProviderConfig';
 
 const ClientMode = memo<{ id: string }>(({ id }) => {
-  const { data, isLoading } = useSWR('get-client-provider', () =>
+  const { data, isLoading } = useClientDataSWR('get-client-provider', () =>
     aiProviderService.getAiProviderById(id),
   );
 
+  const router = useRouter();
+
+  useEffect(() => {
+    if (!isLoading && !data?.id) {
+      router.push('/settings/provider');
+    }
+  }, [isLoading, data]);
+
+  if (isLoading || !data || !data.id) return <Loading />;
+
   return (
     <Flexbox gap={24} paddingBlock={8}>
-      {!isLoading && data && <ProviderConfig {...data} />}
+      <ProviderConfig {...data} id={id} name={data.name || ''} />
       <ModelList id={id} />
     </Flexbox>
   );

package/src/app/[variants]/(main)/settings/provider/(detail)/[id]/page.tsx

@@ -1,14 +1,5 @@
-import { redirect } from 'next/navigation';
-
 import { DEFAULT_MODEL_PROVIDER_LIST } from '@/config/modelProviders';
-import { isDesktop, isServerMode } from '@/const/version';
-import { AiInfraRepos } from '@/database/repositories/aiInfra';
-import { serverDB } from '@/database/server';
-import { getServerGlobalConfig } from '@/server/globalConfig';
-import { KeyVaultsGateKeeper } from '@/server/modules/KeyVaultsEncrypt';
 import { PagePropsWithId } from '@/types/next';
-import { ProviderConfig } from '@/types/user/settings';
-import { getUserAuth } from '@/utils/server/auth';
 
 import ClientMode from './ClientMode';
 import ProviderDetail from './index';
@@ -20,28 +11,9 @@ const Page = async (props: PagePropsWithId) => {
   // if builtin provider
   if (!!builtinProviderCard) return <ProviderDetail source={'builtin'} {...builtinProviderCard} />;
 
-  // if user custom provider
-  if (!isDesktop && isServerMode) {
-    const { userId } = await getUserAuth();
-
-    const { aiProvider } = await getServerGlobalConfig();
-    const aiInfraRepos = new AiInfraRepos(
-      serverDB,
-      userId!,
-      aiProvider as Record<string, ProviderConfig>,
-    );
-
-    const userCard = await aiInfraRepos.getAiProviderDetail(
-      params.id,
-      KeyVaultsGateKeeper.getUserKeyVaults,
-    );
-
-    if (!userCard) return redirect('/settings/provider');
-
-    return <ProviderDetail {...userCard} />;
-  }
-
   return <ClientMode id={params.id} />;
 };
 
 export default Page;
+
+export const dynamic = 'force-static';

package/src/app/[variants]/(main)/settings/provider/layout.tsx

@@ -19,5 +19,3 @@ const ProviderSettingsLayout = ({ children, ...res }: PropsWithChildren) => {
 ProviderSettingsLayout.displayName = 'ProviderSettingsLayout';
 
 export default ProviderSettingsLayout;
-
-export const dynamic = 'auto';

package/src/components/NProgress/index.tsx

@@ -4,16 +4,20 @@ import { useTheme } from 'antd-style';
 import NextTopLoader from 'nextjs-toploader';
 import { memo } from 'react';
 
+import { isDesktop } from '@/const/version';
+
 const NProgress = memo(() => {
   const theme = useTheme();
   return (
-    <NextTopLoader
-      color={theme.colorText}
-      height={2}
-      shadow={false}
-      showSpinner={false}
-      zIndex={1000}
-    />
+    !isDesktop && (
+      <NextTopLoader
+        color={theme.colorText}
+        height={2}
+        shadow={false}
+        showSpinner={false}
+        zIndex={1000}
+      />
+    )
   );
 });
 

package/src/features/ChatInput/ActionBar/STT/common.tsx

@@ -51,6 +51,7 @@ const CommonSTT = memo<{
     return (
       <Dropdown
         menu={{
+          // @ts-expect-error 等待 antd 修复
           activeKey: 'time',
           items: [
             {

package/src/features/KnowledgeBaseModal/CreateNew/CreateForm.tsx

@@ -1,4 +1,5 @@
 import { Button, Form, Input, TextArea } from '@lobehub/ui';
+import { useRouter } from 'next/navigation';
 import { memo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -13,14 +14,17 @@ const CreateForm = memo<CreateFormProps>(({ onClose }) => {
   const { t } = useTranslation('knowledgeBase');
   const [loading, setLoading] = useState(false);
   const createNewKnowledgeBase = useKnowledgeBaseStore((s) => s.createNewKnowledgeBase);
+  const router = useRouter();
 
   const onFinish = async (values: CreateKnowledgeBaseParams) => {
     setLoading(true);
 
     try {
-      await createNewKnowledgeBase(values);
+      const id = await createNewKnowledgeBase(values);
       setLoading(false);
       onClose?.();
+
+      router.push(`/repos/${id}`);
     } catch (e) {
       console.error(e);
       setLoading(false);

package/src/features/MCPPluginDetail/Schema/Prompts.tsx

@@ -14,11 +14,13 @@ import { useDetailContext } from '../DetailProvider';
 import { useStyles } from './style';
 import { ModeType } from './types';
 
-const Prompts = memo<{
+interface PromptsProps {
   activeKey?: string[];
   mode?: ModeType;
   setActiveKey?: (key: string[]) => void;
-}>(({ mode, activeKey = [], setActiveKey }) => {
+}
+
+const Prompts = memo<PromptsProps>(({ mode, activeKey = [], setActiveKey }) => {
   const { t } = useTranslation('discover');
   const { prompts } = useDetailContext();
   const { styles, theme } = useStyles();

package/src/features/MCPPluginDetail/Schema/Tools.tsx

@@ -14,11 +14,13 @@ import { useDetailContext } from '../DetailProvider';
 import { useStyles } from './style';
 import { ModeType } from './types';
 
-const Tools = memo<{
+interface ToolsProps {
   activeKey?: string[];
   mode?: ModeType;
   setActiveKey?: (key: string[]) => void;
-}>(({ mode, activeKey = [], setActiveKey }) => {
+}
+
+const Tools = memo<ToolsProps>(({ mode, activeKey = [], setActiveKey }) => {
   const { t } = useTranslation('discover');
   const { tools } = useDetailContext();
   const { styles, theme } = useStyles();

package/src/features/MCPPluginDetail/Score/GithubBadge/index.tsx

@@ -59,6 +59,7 @@ const GithubBadge = memo(() => {
       <Snippet language={'md'} style={{ fontSize: 12 }} variant={'outlined'}>
         {badgeLite}
       </Snippet>
+      {/* eslint-disable-next-line @next/next/no-img-element */}
       <img
         alt="MCP Badge"
         height={selectedStyle === 'for-the-badge' ? 28 : 20}
@@ -74,6 +75,7 @@ const GithubBadge = memo(() => {
       <Snippet language={'md'} style={{ fontSize: 12 }} variant={'outlined'}>
         {badge}
       </Snippet>
+      {/* eslint-disable-next-line @next/next/no-img-element */}
       <img alt="MCP Badge" src={styledBadgeFullUrl} />
     </>
   );

package/src/features/ModelSelect/index.tsx

@@ -69,13 +69,15 @@ const ModelSelect = memo<ModelSelectProps>(({ value, onChange, showAbility = tru
   return (
     <Select
       className={styles.select}
+      classNames={{
+        popup: { root: styles.popup },
+      }}
       defaultValue={`${value?.provider}/${value?.model}`}
       onChange={(value, option) => {
         const model = value.split('/').slice(1).join('/');
         onChange?.({ model, provider: (option as unknown as ModelOption).provider });
       }}
       options={options}
-      popupClassName={styles.popup}
       popupMatchSelectWidth={false}
       value={`${value?.provider}/${value?.model}`}
     />

package/src/features/ModelSwitchPanel/index.tsx

@@ -141,6 +141,7 @@ const ModelSwitchPanel = memo<IProps>(({ children, onOpenChange, open }) => {
   return (
     <ActionDropdown
       menu={{
+        // @ts-expect-error 等待 antd 修复
         activeKey: menuKey(provider, model),
         className: styles.menu,
         items,

package/src/services/aiProvider/type.ts

@@ -1,4 +1,5 @@
 import {
+  AiProviderDetailItem,
   AiProviderRuntimeState,
   AiProviderSortMap,
   CreateAiProviderParams,
@@ -10,7 +11,7 @@ export interface IAiProviderService {
 
   deleteAiProvider: (id: string) => Promise<any>;
 
-  getAiProviderById: (id: string) => Promise<any>;
+  getAiProviderById: (id: string) => Promise<AiProviderDetailItem | undefined>;
 
   getAiProviderList: () => Promise<any>;
 

package/src/store/knowledgeBase/slices/crud/action.ts

@@ -10,7 +10,7 @@ const FETCH_KNOWLEDGE_BASE_LIST_KEY = 'FETCH_KNOWLEDGE_BASE';
 const FETCH_KNOWLEDGE_BASE_ITEM_KEY = 'FETCH_KNOWLEDGE_BASE_ITEM';
 
 export interface KnowledgeBaseCrudAction {
-  createNewKnowledgeBase: (params: CreateKnowledgeBaseParams) => Promise<void>;
+  createNewKnowledgeBase: (params: CreateKnowledgeBaseParams) => Promise<string>;
   internal_toggleKnowledgeBaseLoading: (id: string, loading: boolean) => void;
   refreshKnowledgeBaseList: () => Promise<void>;
 
@@ -28,8 +28,11 @@ export const createCrudSlice: StateCreator<
   KnowledgeBaseCrudAction
 > = (set, get) => ({
   createNewKnowledgeBase: async (params) => {
-    await knowledgeBaseService.createKnowledgeBase(params);
+    const id = await knowledgeBaseService.createKnowledgeBase(params);
+
     await get().refreshKnowledgeBaseList();
+
+    return id;
   },
   internal_toggleKnowledgeBaseLoading: (id, loading) => {
     set(
@@ -58,8 +61,22 @@ export const createCrudSlice: StateCreator<
   },
 
   useFetchKnowledgeBaseItem: (id) =>
-    useClientDataSWR<KnowledgeBaseItem | undefined>([FETCH_KNOWLEDGE_BASE_ITEM_KEY, id], () =>
-      knowledgeBaseService.getKnowledgeBaseById(id),
+    useClientDataSWR<KnowledgeBaseItem | undefined>(
+      [FETCH_KNOWLEDGE_BASE_ITEM_KEY, id],
+      () => knowledgeBaseService.getKnowledgeBaseById(id),
+      {
+        onSuccess: (item) => {
+          if (!item) return;
+
+          set({
+            activeKnowledgeBaseId: id,
+            activeKnowledgeBaseItems: {
+              ...get().activeKnowledgeBaseItems,
+              [id]: item,
+            },
+          });
+        },
+      },
     ),
 
   useFetchKnowledgeBaseList: (params = {}) =>

package/src/store/knowledgeBase/slices/crud/initialState.ts

@@ -1,5 +1,8 @@
+import { KnowledgeBaseItem } from '@/types/knowledgeBase';
+
 export interface KnowledgeBaseState {
   activeKnowledgeBaseId: string | null;
+  activeKnowledgeBaseItems: Record<string, KnowledgeBaseItem>;
   initKnowledgeBaseList: boolean;
   knowledgeBaseLoadingIds: string[];
   knowledgeBaseRenamingId?: string | null;
@@ -7,6 +10,7 @@ export interface KnowledgeBaseState {
 
 export const initialKnowledgeBaseState: KnowledgeBaseState = {
   activeKnowledgeBaseId: null,
+  activeKnowledgeBaseItems: {},
   initKnowledgeBaseList: false,
   knowledgeBaseLoadingIds: [],
 };

package/src/store/knowledgeBase/slices/crud/selectors.ts

@@ -2,6 +2,13 @@ import { KnowledgeBaseStoreState } from '@/store/knowledgeBase/initialState';
 
 const activeKnowledgeBaseId = (s: KnowledgeBaseStoreState) => s.activeKnowledgeBaseId;
 
+const getKnowledgeBaseById = (id: string) => (s: KnowledgeBaseStoreState) =>
+  s.activeKnowledgeBaseItems[id];
+
+const getKnowledgeBaseNameById = (id: string) => (s: KnowledgeBaseStoreState) =>
+  getKnowledgeBaseById(id)(s)?.name;
+
 export const knowledgeBaseSelectors = {
   activeKnowledgeBaseId,
+  getKnowledgeBaseNameById,
 };