@lobehub/chat 1.11.8 → 1.12.0

package/src/database/server/schemas/lobechat/session.ts

@@ -0,0 +1,77 @@
+/* eslint-disable sort-keys-fix/sort-keys-fix  */
+import { boolean, integer, pgTable, text, unique, uniqueIndex, varchar } from 'drizzle-orm/pg-core';
+import { createInsertSchema } from 'drizzle-zod';
+
+import { idGenerator, randomSlug } from '../../utils/idGenerator';
+import { createdAt, updatedAt } from './_helpers';
+import { users } from './user';
+
+//  ======= sessionGroups ======= //
+
+export const sessionGroups = pgTable(
+  'session_groups',
+  {
+    id: text('id')
+      .$defaultFn(() => idGenerator('sessionGroups'))
+      .primaryKey(),
+    name: text('name').notNull(),
+    sort: integer('sort'),
+
+    userId: text('user_id')
+      .references(() => users.id, { onDelete: 'cascade' })
+      .notNull(),
+
+    clientId: text('client_id'),
+    createdAt: createdAt(),
+    updatedAt: updatedAt(),
+  },
+  (table) => ({
+    clientIdUnique: unique('session_group_client_id_user_unique').on(table.clientId, table.userId),
+  }),
+);
+
+export const insertSessionGroupSchema = createInsertSchema(sessionGroups);
+
+export type NewSessionGroup = typeof sessionGroups.$inferInsert;
+export type SessionGroupItem = typeof sessionGroups.$inferSelect;
+
+//  ======= sessions ======= //
+
+export const sessions = pgTable(
+  'sessions',
+  {
+    id: text('id')
+      .$defaultFn(() => idGenerator('sessions'))
+      .primaryKey(),
+    slug: varchar('slug', { length: 100 })
+      .notNull()
+      .$defaultFn(() => randomSlug()),
+    title: text('title'),
+    description: text('description'),
+    avatar: text('avatar'),
+    backgroundColor: text('background_color'),
+
+    type: text('type', { enum: ['agent', 'group'] }).default('agent'),
+
+    userId: text('user_id')
+      .references(() => users.id, { onDelete: 'cascade' })
+      .notNull(),
+    groupId: text('group_id').references(() => sessionGroups.id, { onDelete: 'set null' }),
+    clientId: text('client_id'),
+    pinned: boolean('pinned').default(false),
+
+    createdAt: createdAt(),
+    updatedAt: updatedAt(),
+  },
+  (t) => ({
+    slugUserIdUnique: uniqueIndex('slug_user_id_unique').on(t.slug, t.userId),
+
+    clientIdUnique: unique('sessions_client_id_user_id_unique').on(t.clientId, t.userId),
+  }),
+);
+
+export const insertSessionSchema = createInsertSchema(sessions);
+// export const selectSessionSchema = createSelectSchema(sessions);
+
+export type NewSession = typeof sessions.$inferInsert;
+export type SessionItem = typeof sessions.$inferSelect;

package/src/database/server/schemas/lobechat/topic.ts

@@ -0,0 +1,32 @@
+//  ======== topics ======= //
+import { boolean, pgTable, text, unique } from 'drizzle-orm/pg-core';
+
+import { idGenerator } from '../../utils/idGenerator';
+import { createdAt, updatedAt } from './_helpers';
+import { sessions } from './session';
+import { users } from './user';
+
+export const topics = pgTable(
+  'topics',
+  {
+    clientId: text('client_id'),
+    createdAt: createdAt(),
+    favorite: boolean('favorite').default(false),
+    id: text('id')
+      .$defaultFn(() => idGenerator('topics'))
+      .primaryKey(),
+    sessionId: text('session_id').references(() => sessions.id, { onDelete: 'cascade' }),
+    title: text('title'),
+
+    updatedAt: updatedAt(),
+    userId: text('user_id')
+      .references(() => users.id, { onDelete: 'cascade' })
+      .notNull(),
+  },
+  (t) => ({
+    clientIdUnique: unique('topic_client_id_user_id_unique').on(t.clientId, t.userId),
+  }),
+);
+
+export type NewTopic = typeof topics.$inferInsert;
+export type TopicItem = typeof topics.$inferSelect;

package/src/database/server/schemas/lobechat/user.ts

@@ -1,22 +1,13 @@
 /* eslint-disable sort-keys-fix/sort-keys-fix  */
-import {
-  boolean,
-  integer,
-  jsonb,
-  pgTable,
-  text,
-} from 'drizzle-orm/pg-core';
+import { LobeChatPluginManifest } from '@lobehub/chat-plugin-sdk';
+import { boolean, integer, jsonb, pgTable, primaryKey, text } from 'drizzle-orm/pg-core';
 
 import { DEFAULT_PREFERENCE } from '@/const/user';
+import { CustomPluginParams } from '@/types/tool/plugin';
 
 import { createdAt, timestamptz, updatedAt } from './_helpers';
 
-/**
- * This table stores users. Users are created in Clerk, then Clerk calls a
- * webhook at /api/webhook/clerk to inform this application a user was created.
- */
 export const users = pgTable('users', {
-  // The ID will be the user's ID from Clerk
   id: text('id').primaryKey().notNull(),
   username: text('username').unique(),
   email: text('email'),
@@ -43,6 +34,20 @@ export const users = pgTable('users', {
 export type NewUser = typeof users.$inferInsert;
 export type UserItem = typeof users.$inferSelect;
 
+export const userSettings = pgTable('user_settings', {
+  id: text('id')
+    .references(() => users.id, { onDelete: 'cascade' })
+    .primaryKey(),
+
+  tts: jsonb('tts'),
+  keyVaults: text('key_vaults'),
+  general: jsonb('general'),
+  languageModel: jsonb('language_model'),
+  systemAgent: jsonb('system_agent'),
+  defaultAgent: jsonb('default_agent'),
+  tool: jsonb('tool'),
+});
+
 export const userSubscriptions = pgTable('user_subscriptions', {
   id: text('id').primaryKey().notNull(),
   userId: text('user_id')
@@ -96,16 +101,26 @@ export const userBudgets = pgTable('user_budgets', {
 export type NewUserBudgets = typeof userBudgets.$inferInsert;
 export type UserBudgetItem = typeof userBudgets.$inferSelect;
 
-export const userSettings = pgTable('user_settings', {
-  id: text('id')
-    .references(() => users.id, { onDelete: 'cascade' })
-    .primaryKey(),
-
-  tts: jsonb('tts'),
-  keyVaults: text('key_vaults'),
-  general: jsonb('general'),
-  languageModel: jsonb('language_model'),
-  systemAgent: jsonb('system_agent'),
-  defaultAgent: jsonb('default_agent'),
-  tool: jsonb('tool'),
-});
+export const installedPlugins = pgTable(
+  'user_installed_plugins',
+  {
+    userId: text('user_id')
+      .references(() => users.id, { onDelete: 'cascade' })
+      .notNull(),
+
+    identifier: text('identifier').notNull(),
+    type: text('type', { enum: ['plugin', 'customPlugin'] }).notNull(),
+    manifest: jsonb('manifest').$type<LobeChatPluginManifest>(),
+    settings: jsonb('settings'),
+    customParams: jsonb('custom_params').$type<CustomPluginParams>(),
+
+    createdAt: createdAt(),
+    updatedAt: updatedAt(),
+  },
+  (self) => ({
+    id: primaryKey({ columns: [self.userId, self.identifier] }),
+  }),
+);
+
+export type NewInstalledPlugin = typeof installedPlugins.$inferInsert;
+export type InstalledPluginItem = typeof installedPlugins.$inferSelect;

package/src/database/server/utils/idGenerator.ts

@@ -5,6 +5,7 @@ import { createNanoId } from '@/utils/uuid';
 const prefixes = {
   agents: 'agt',
   files: 'file',
+  knowledgeBases: 'kb',
   messages: 'msg',
   plugins: 'plg',
   sessionGroups: 'sg',

package/src/features/ChatInput/ActionBar/Clear.tsx

@@ -13,7 +13,7 @@ import { useFileStore } from '@/store/file';
 const Clear = memo(() => {
   const { t } = useTranslation('setting');
   const [clearMessage] = useChatStore((s) => [s.clearMessage]);
-  const [clearImageList] = useFileStore((s) => [s.clearImageList]);
+  const [clearImageList] = useFileStore((s) => [s.clearChatUploadFileList]);
   const hotkeys = [META_KEY, ALT_KEY, CLEAN_MESSAGE_KEY].join('+');
   const [confirmOpened, updateConfirmOpened] = useState(false);
   const mobile = useIsMobile();

package/src/features/ChatInput/ActionBar/Knowledge/Dropdown.tsx

@@ -0,0 +1,160 @@
+import { Icon } from '@lobehub/ui';
+import { Dropdown } from 'antd';
+import { createStyles } from 'antd-style';
+import type { ItemType } from 'antd/es/menu/interface';
+import isEqual from 'fast-deep-equal';
+import { ArrowRight, LibraryBig } from 'lucide-react';
+import { PropsWithChildren, memo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Flexbox } from 'react-layout-kit';
+
+import FileIcon from '@/components/FileIcon';
+import RepoIcon from '@/components/RepoIcon';
+import { AssignKnowledgeBaseModal } from '@/features/KnowledgeBaseModal';
+import { useAgentStore } from '@/store/agent';
+import { agentSelectors } from '@/store/agent/selectors';
+
+import ListItem from './ListItem';
+
+const useStyles = createStyles(({ css, prefixCls }) => ({
+  knowledgeBase: css``,
+  menu: css`
+    &.${prefixCls}-dropdown-menu {
+      padding-block: 8px;
+    }
+
+    .${prefixCls}-dropdown-menu-item-group-list .${prefixCls}-dropdown-menu-item {
+      padding: 0;
+      padding-inline-start: 8px;
+      border-radius: 4px;
+    }
+  `,
+}));
+
+const DropdownMenu = memo<PropsWithChildren>(({ children }) => {
+  const { t } = useTranslation('chat');
+
+  const { styles } = useStyles();
+  const [open, setOpen] = useState(false);
+  const files = useAgentStore(agentSelectors.currentAgentFiles, isEqual);
+  const knowledgeBases = useAgentStore(agentSelectors.currentAgentKnowledgeBases, isEqual);
+
+  const [toggleFile, toggleKnowledgeBase] = useAgentStore((s) => [
+    s.toggleFile,
+    s.toggleKnowledgeBase,
+  ]);
+
+  const items: ItemType[] = [
+    // {
+    //   children: [
+    //     {
+    //       icon: <RepoIcon />,
+    //       key: 'allFiles',
+    //       label: <KnowledgeBaseItem id={'all'} label={t('knowledgeBase.allFiles')} />,
+    //     },
+    //     {
+    //       icon: <RepoIcon />,
+    //       key: 'allRepos',
+    //       label: <KnowledgeBaseItem id={'all'} label={t('knowledgeBase.allKnowledgeBases')} />,
+    //     },
+    //   ],
+    //   key: 'all',
+    //   label: (
+    //     <Flexbox horizontal justify={'space-between'}>
+    //       {t('knowledgeBase.all')}
+    //       {/*<Link href={'/files'}>{t('knowledgeBase.more')}</Link>*/}
+    //     </Flexbox>
+    //   ),
+    //   type: 'group',
+    // },
+    {
+      children: [
+        // first the files
+        ...files.map((item) => ({
+          icon: <FileIcon fileName={item.name} fileType={item.type} size={20} />,
+          key: item.id,
+          label: (
+            <ListItem
+              enabled={item.enabled}
+              id={item.id}
+              label={item.name}
+              onUpdate={async (id, enabled) => {
+                await toggleFile(id, enabled);
+              }}
+            />
+          ),
+        })),
+
+        // then the knowledge bases
+        ...knowledgeBases.map((item) => ({
+          icon: <RepoIcon />,
+          key: item.id,
+          label: (
+            <ListItem
+              enabled={item.enabled}
+              id={item.id}
+              label={item.name}
+              onUpdate={async (id, enabled) => {
+                await toggleKnowledgeBase(id, enabled);
+              }}
+            />
+          ),
+        })),
+        {
+          icon: (
+            <Icon
+              icon={LibraryBig}
+              size={{ fontSize: 16 }}
+              style={{ marginInlineEnd: 0, paddingInlineStart: 4 }}
+            />
+          ),
+          key: 'knowledge-base-store',
+          label: (
+            <Flexbox gap={40} horizontal justify={'space-between'} padding={'8px 12px'}>
+              {t('knowledgeBase.viewMore')} <Icon icon={ArrowRight} />
+            </Flexbox>
+          ),
+          onClick: (e) => {
+            e.domEvent.stopPropagation();
+            setOpen(true);
+          },
+        },
+      ],
+      className: styles.knowledgeBase,
+      key: 'relativeFilesOrKnowledgeBases',
+      label: (
+        <Flexbox horizontal justify={'space-between'}>
+          {t('knowledgeBase.relativeFilesOrKnowledgeBases')}
+          {/*<Link href={'/files'}>{t('knowledgeBase.more')}</Link>*/}
+        </Flexbox>
+      ),
+      type: 'group',
+    },
+  ];
+
+  return (
+    <>
+      <Dropdown
+        arrow={false}
+        menu={{
+          className: styles.menu,
+          items,
+          onClick: (e) => {
+            e.domEvent.preventDefault();
+          },
+          style: {
+            maxHeight: 500,
+            overflowY: 'scroll',
+          },
+        }}
+        placement={'top'}
+        trigger={['click']}
+      >
+        {children}
+      </Dropdown>
+      <AssignKnowledgeBaseModal open={open} setOpen={setOpen} />
+    </>
+  );
+});
+
+export default DropdownMenu;

package/src/features/ChatInput/ActionBar/Knowledge/ListItem.tsx

@@ -0,0 +1,52 @@
+import { Icon } from '@lobehub/ui';
+import { Checkbox } from 'antd';
+import { Loader2 } from 'lucide-react';
+import { memo, useState } from 'react';
+import { Center, Flexbox } from 'react-layout-kit';
+
+interface FileItemProps {
+  enabled?: boolean;
+  id: string;
+  label: string;
+  onUpdate: (id: string, enabled: boolean) => Promise<void>;
+}
+
+const ListItem = memo<FileItemProps>(({ id, onUpdate, label, enabled }) => {
+  const [loading, setLoading] = useState(false);
+
+  const updateState = async () => {
+    setLoading(true);
+    await onUpdate(id, !enabled);
+    setLoading(false);
+  };
+
+  return (
+    <Flexbox
+      gap={24}
+      horizontal
+      justify={'space-between'}
+      onClick={async (e) => {
+        e.stopPropagation();
+        updateState();
+      }}
+      padding={'8px 12px'}
+    >
+      {label}
+      {loading ? (
+        <Center width={18}>
+          <Icon icon={Loader2} spin />
+        </Center>
+      ) : (
+        <Checkbox
+          checked={enabled}
+          onClick={(e) => {
+            e.stopPropagation();
+            updateState();
+          }}
+        />
+      )}
+    </Flexbox>
+  );
+});
+
+export default ListItem;

package/src/features/ChatInput/ActionBar/Knowledge/index.tsx

@@ -0,0 +1,54 @@
+import { ActionIcon } from '@lobehub/ui';
+import { LibraryBig, LucideLoader2 } from 'lucide-react';
+import { Suspense, memo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import TipGuide from '@/components/TipGuide';
+import { isServerMode } from '@/const/version';
+import { useUserStore } from '@/store/user';
+import { preferenceSelectors } from '@/store/user/selectors';
+
+import DropdownMenu from './Dropdown';
+
+const enableKnowledge = isServerMode;
+
+const Knowledge = memo(() => {
+  const { t } = useTranslation('chat');
+
+  const [showTip, updateGuideState] = useUserStore((s) => [
+    preferenceSelectors.showUploadFileInKnowledgeBaseTip(s),
+    s.updateGuideState,
+  ]);
+
+  const content = (
+    <DropdownMenu>
+      <ActionIcon
+        disable={!enableKnowledge}
+        icon={LibraryBig}
+        placement={'bottom'}
+        title={enableKnowledge ? t('knowledgeBase.title') : t('knowledgeBase.disabled')}
+      />
+    </DropdownMenu>
+  );
+
+  return (
+    <Suspense fallback={<ActionIcon icon={LucideLoader2} spin />}>
+      {showTip ? (
+        <TipGuide
+          onOpenChange={() => {
+            updateGuideState({ uploadFileInKnowledgeBase: false });
+          }}
+          open={showTip}
+          placement={'top'}
+          title={t('knowledgeBase.uploadGuide')}
+        >
+          {content}
+        </TipGuide>
+      ) : (
+        content
+      )}
+    </Suspense>
+  );
+});
+
+export default Knowledge;

package/src/features/ChatInput/ActionBar/Tools/index.tsx

@@ -17,7 +17,7 @@ const Tools = memo(() => {
   const enableFC = useUserStore(modelProviderSelectors.isModelEnabledFunctionCall(model));
 
   return (
-    <Suspense fallback={<ActionIcon icon={LucideLoader2} />}>
+    <Suspense fallback={<ActionIcon icon={LucideLoader2} spin />}>
       <DropdownMenu>
         <ActionIcon
           disable={!enableFC}

package/src/features/ChatInput/ActionBar/Upload/ClientMode.tsx

@@ -0,0 +1,52 @@
+import { ActionIcon } from '@lobehub/ui';
+import { Upload } from 'antd';
+import { FileUp, LucideImage } from 'lucide-react';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import { useAgentStore } from '@/store/agent';
+import { agentSelectors } from '@/store/agent/slices/chat';
+import { useFileStore } from '@/store/file';
+import { useUserStore } from '@/store/user';
+import { modelProviderSelectors } from '@/store/user/selectors';
+
+const FileUpload = memo(() => {
+  const { t } = useTranslation('chat');
+
+  const upload = useFileStore((s) => s.uploadChatFiles);
+
+  const model = useAgentStore(agentSelectors.currentAgentModel);
+  const [canUpload, enabledFiles] = useUserStore((s) => [
+    modelProviderSelectors.isModelEnabledUpload(model)(s),
+    modelProviderSelectors.isModelEnabledFiles(model)(s),
+  ]);
+
+  return (
+    <Upload
+      accept={enabledFiles ? undefined : 'image/*'}
+      beforeUpload={async (file) => {
+        await upload([file]);
+
+        return false;
+      }}
+      disabled={!canUpload}
+      multiple={true}
+      showUploadList={false}
+    >
+      <ActionIcon
+        disable={!canUpload}
+        icon={enabledFiles ? FileUp : LucideImage}
+        placement={'bottom'}
+        title={t(
+          canUpload
+            ? enabledFiles
+              ? 'upload.clientMode.actionFiletip'
+              : 'upload.clientMode.actionTooltip'
+            : 'upload.clientMode.disabled',
+        )}
+      />
+    </Upload>
+  );
+});
+
+export default FileUpload;

package/src/features/ChatInput/ActionBar/Upload/ServerMode.tsx

@@ -0,0 +1,104 @@
+import { ActionIcon, Icon, Tooltip } from '@lobehub/ui';
+import { Dropdown, MenuProps, Upload } from 'antd';
+import { css, cx } from 'antd-style';
+import { FileUp, FolderUp, ImageUp, Paperclip } from 'lucide-react';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import { useAgentStore } from '@/store/agent';
+import { agentSelectors } from '@/store/agent/slices/chat';
+import { useFileStore } from '@/store/file';
+import { useUserStore } from '@/store/user';
+import { modelProviderSelectors } from '@/store/user/selectors';
+
+const hotArea = css`
+  &::before {
+    content: '';
+    position: absolute;
+    inset: 0;
+    background-color: transparent;
+  }
+`;
+
+const FileUpload = memo(() => {
+  const { t } = useTranslation('chat');
+
+  const upload = useFileStore((s) => s.uploadChatFiles);
+
+  const model = useAgentStore(agentSelectors.currentAgentModel);
+
+  const canUploadImage = useUserStore(modelProviderSelectors.isModelEnabledVision(model));
+
+  const items: MenuProps['items'] = [
+    {
+      disabled: !canUploadImage,
+      icon: <Icon icon={ImageUp} />,
+      key: 'upload-image',
+      label: canUploadImage ? (
+        <Upload
+          accept={'image/*'}
+          beforeUpload={async (file) => {
+            await upload([file]);
+
+            return false;
+          }}
+          multiple
+          showUploadList={false}
+        >
+          <div className={cx(hotArea)}>{t('upload.action.imageUpload')}</div>
+        </Upload>
+      ) : (
+        <Tooltip placement={'right'} title={t('upload.action.imageDisabled')}>
+          <div className={cx(hotArea)}>{t('upload.action.imageUpload')}</div>
+        </Tooltip>
+      ),
+    },
+    {
+      icon: <Icon icon={FileUp} />,
+      key: 'upload-file',
+      label: (
+        <Upload
+          beforeUpload={async (file) => {
+            if (!canUploadImage && file.type.startsWith('image')) return false;
+
+            await upload([file]);
+
+            return false;
+          }}
+          multiple
+          showUploadList={false}
+        >
+          <div className={cx(hotArea)}>{t('upload.action.fileUpload')}</div>
+        </Upload>
+      ),
+    },
+    {
+      icon: <Icon icon={FolderUp} />,
+      key: 'upload-folder',
+      label: (
+        <Upload
+          beforeUpload={async (file) => {
+            if (!canUploadImage && file.type.startsWith('image')) return false;
+
+            await upload([file]);
+
+            return false;
+          }}
+          directory
+          multiple={true}
+          showUploadList={false}
+        >
+          <div className={cx(hotArea)}>{t('upload.action.folderUpload')}</div>
+        </Upload>
+      ),
+    },
+  ];
+
+  return (
+    <Dropdown menu={{ items }} placement="top">
+      <ActionIcon icon={Paperclip} placement={'bottom'} title={t('upload.action.tooltip')} />
+    </Dropdown>
+  );
+});
+
+export default FileUpload;

package/src/features/ChatInput/ActionBar/Upload/index.tsx

@@ -0,0 +1,8 @@
+import { isServerMode } from '@/const/version';
+
+import ClientMode from './ClientMode';
+import ServerMode from './ServerMode';
+
+const Upload = isServerMode ? ServerMode : ClientMode;
+
+export default Upload;