@lobehub/lobehub 2.0.0-next.221 → 2.0.0-next.222

package/src/features/ModelSwitchPanel/styles.ts

@@ -0,0 +1,58 @@
+import { createStaticStyles } from 'antd-style';
+
+export const styles = createStaticStyles(({ css, cssVar }) => ({
+  container: css`
+    overflow: hidden;
+    padding: 0 !important;
+  `,
+  footer: css`
+    border-block-start: 1px solid ${cssVar.colorBorderSecondary};
+  `,
+
+  groupHeader: css`
+    width: 100%;
+    color: ${cssVar.colorTextSecondary};
+
+    .settings-icon {
+      opacity: 0;
+    }
+
+    &:hover {
+      .settings-icon {
+        opacity: 1;
+      }
+    }
+  `,
+  list: css`
+    position: relative;
+    overflow: hidden auto;
+    width: 100%;
+  `,
+  menuItem: css`
+    cursor: pointer;
+
+    position: relative;
+
+    gap: 8px;
+    align-items: center;
+
+    margin-block: 1px;
+    margin-inline: 4px;
+    padding-block: 8px;
+    padding-inline: 8px;
+    border-radius: ${cssVar.borderRadiusSM};
+
+    .settings-icon {
+      opacity: 0;
+    }
+
+    &:hover {
+      .settings-icon {
+        opacity: 1;
+      }
+    }
+  `,
+  toolbar: css`
+    border-block-end: 1px solid ${cssVar.colorBorderSecondary};
+  `,
+}));

package/src/features/ModelSwitchPanel/types.ts

@@ -0,0 +1,73 @@
+import type { AiModelForSelect } from 'model-bank';
+import type { ReactNode } from 'react';
+
+import type { EnabledProviderWithModels } from '@/types/aiProvider';
+
+export type GroupMode = 'byModel' | 'byProvider';
+
+export interface ModelWithProviders {
+  displayName: string;
+  model: AiModelForSelect;
+  providers: Array<{
+    id: string;
+    logo?: string;
+    name: string;
+    source?: EnabledProviderWithModels['source'];
+  }>;
+}
+
+export type VirtualItem =
+  | {
+      data: ModelWithProviders;
+      type: 'model-item-single';
+    }
+  | {
+      data: ModelWithProviders;
+      type: 'model-item-multiple';
+    }
+  | {
+      provider: EnabledProviderWithModels;
+      type: 'group-header';
+    }
+  | {
+      model: AiModelForSelect;
+      provider: EnabledProviderWithModels;
+      type: 'provider-model-item';
+    }
+  | {
+      provider: EnabledProviderWithModels;
+      type: 'empty-model';
+    }
+  | {
+      type: 'no-provider';
+    };
+
+export type DropdownPlacement =
+  | 'bottom'
+  | 'bottomLeft'
+  | 'bottomRight'
+  | 'top'
+  | 'topLeft'
+  | 'topRight';
+
+export interface ModelSwitchPanelProps {
+  children?: ReactNode;
+  /**
+   * Current model ID. If not provided, uses currentAgentModel from store.
+   */
+  model?: string;
+  /**
+   * Callback when model changes. If not provided, uses updateAgentConfig from store.
+   */
+  onModelChange?: (params: { model: string; provider: string }) => Promise<void>;
+  onOpenChange?: (open: boolean) => void;
+  open?: boolean;
+  /**
+   * Dropdown placement. Defaults to 'topLeft'.
+   */
+  placement?: DropdownPlacement;
+  /**
+   * Current provider ID. If not provided, uses currentAgentModelProvider from store.
+   */
+  provider?: string;
+}

package/src/features/ModelSwitchPanel/utils.ts

@@ -0,0 +1,24 @@
+import type { VirtualItem } from './types';
+
+export const menuKey = (provider: string, model: string) => `${provider}-${model}`;
+
+export const getVirtualItemKey = (item: VirtualItem): string => {
+  switch (item.type) {
+    case 'model-item-single':
+    case 'model-item-multiple': {
+      return item.data.displayName;
+    }
+    case 'provider-model-item': {
+      return menuKey(item.provider.id, item.model.id);
+    }
+    case 'group-header': {
+      return `header-${item.provider.id}`;
+    }
+    case 'empty-model': {
+      return `empty-${item.provider.id}`;
+    }
+    case 'no-provider': {
+      return 'no-provider';
+    }
+  }
+};

package/src/features/User/UserPanel/PanelContent.tsx

@@ -1,5 +1,4 @@
 import { ENABLE_BUSINESS_FEATURES } from '@lobechat/business-const';
-import { enableBetterAuth, enableNextAuth } from '@lobechat/const';
 import { Flexbox } from '@lobehub/ui';
 import { useRouter } from 'next/navigation';
 import { memo } from 'react';
@@ -10,6 +9,7 @@ import BusinessPanelContent from '@/business/client/features/User/BusinessPanelC
 import BrandWatermark from '@/components/BrandWatermark';
 import Menu from '@/components/Menu';
 import { isDesktop } from '@/const/version';
+import { enableBetterAuth, enableNextAuth } from '@/envs/auth';
 import { useUserStore } from '@/store/user';
 import { authSelectors } from '@/store/user/selectors';
 

package/src/features/User/__tests__/PanelContent.test.tsx

@@ -74,7 +74,7 @@ const { enableAuth, enableClerk, enableNextAuth } = vi.hoisted(() => ({
   enableNextAuth: { value: false },
 }));
 
-vi.mock('@/const/auth', () => ({
+vi.mock('@/envs/auth', () => ({
   get enableAuth() {
     return enableAuth.value;
   },

package/src/features/User/__tests__/UserAvatar.test.tsx

@@ -16,7 +16,7 @@ const { enableAuth, enableClerk, enableNextAuth } = vi.hoisted(() => ({
   enableNextAuth: { value: false },
 }));
 
-vi.mock('@/const/auth', () => ({
+vi.mock('@/envs/auth', () => ({
   get enableAuth() {
     return enableAuth.value;
   },

package/src/features/User/__tests__/useMenu.test.tsx

@@ -54,7 +54,7 @@ const { enableAuth, enableClerk } = vi.hoisted(() => ({
   enableClerk: { value: true },
 }));
 
-vi.mock('@/const/auth', () => ({
+vi.mock('@/envs/auth', () => ({
   get enableAuth() {
     return enableAuth.value;
   },

package/src/layout/GlobalProvider/StoreInitialization.tsx

@@ -1,10 +1,11 @@
 'use client';
 
-import { INBOX_SESSION_ID, enableNextAuth } from '@lobechat/const';
+import { INBOX_SESSION_ID } from '@lobechat/const';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { createStoreUpdater } from 'zustand-utils';
 
+import { enableNextAuth } from '@/envs/auth';
 import { useIsMobile } from '@/hooks/useIsMobile';
 import { useAgentStore } from '@/store/agent';
 import { useAiInfraStore } from '@/store/aiInfra';

package/src/libs/better-auth/auth-client.ts

@@ -10,7 +10,6 @@ import type { auth } from '@/auth';
 import { getAuthConfig } from '@/envs/auth';
 
 const { NEXT_PUBLIC_AUTH_URL } = getAuthConfig();
-const enableMagicLink = getAuthConfig().NEXT_PUBLIC_ENABLE_MAGIC_LINK;
 
 export const {
   linkSocial,
@@ -26,11 +25,16 @@ export const {
   useSession,
 } = createAuthClient({
   /** The base URL of the server (optional if you're using the same domain) */
-  baseURL: NEXT_PUBLIC_AUTH_URL,
+  ...(NEXT_PUBLIC_AUTH_URL
+    ? {
+        baseURL: NEXT_PUBLIC_AUTH_URL,
+      }
+    : {}),
   plugins: [
     adminClient(),
     inferAdditionalFields<typeof auth>(),
     genericOAuthClient(),
-    ...(enableMagicLink ? [magicLinkClient()] : []),
+    // Always include magicLinkClient - server will reject if not enabled
+    magicLinkClient(),
   ],
 });

package/src/libs/better-auth/define-config.ts

@@ -58,7 +58,7 @@ const getPasskeyOrigins = (): string[] | undefined => {
 const MAGIC_LINK_EXPIRES_IN = 900;
 // OTP expiration time (in seconds) - 5 minutes for mobile OTP verification
 const OTP_EXPIRES_IN = 300;
-const enableMagicLink = authEnv.NEXT_PUBLIC_ENABLE_MAGIC_LINK;
+const enableMagicLink = authEnv.ENABLE_MAGIC_LINK;
 const enabledSSOProviders = parseSSOProviders(authEnv.AUTH_SSO_PROVIDERS);
 
 const { socialProviders, genericOAuthProviders } = initBetterAuthSSOProviders();
@@ -91,7 +91,7 @@ export function defineConfig(customOptions: CustomBetterAuthOptions) {
       enabled: true,
       maxPasswordLength: 64,
       minPasswordLength: 8,
-      requireEmailVerification: authEnv.NEXT_PUBLIC_AUTH_EMAIL_VERIFICATION,
+      requireEmailVerification: authEnv.AUTH_EMAIL_VERIFICATION,
 
       // Compatible with bcrypt password hashes migrated from Clerk; after login, you can re-hash in the backend using BetterAuth's default scrypt.
       password: {

package/src/libs/next/proxy/define-config.ts

@@ -5,11 +5,10 @@ import { UAParser } from 'ua-parser-js';
 import urlJoin from 'url-join';
 
 import { auth } from '@/auth';
-import { OAUTH_AUTHORIZED } from '@/const/auth';
 import { LOBE_LOCALE_COOKIE } from '@/const/locale';
 import { isDesktop } from '@/const/version';
 import { appEnv } from '@/envs/app';
-import { authEnv } from '@/envs/auth';
+import { OAUTH_AUTHORIZED , authEnv } from '@/envs/auth';
 import NextAuth from '@/libs/next-auth';
 import { type Locales } from '@/locales/resources';
 import { parseBrowserLanguage } from '@/utils/locale';

package/src/libs/oidc-provider/provider.test.ts

@@ -4,7 +4,7 @@
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 
 // Mock dependencies
-vi.mock('@/const/auth', () => ({
+vi.mock('@/envs/auth', () => ({
   enableBetterAuth: false,
   enableClerk: false,
   enableNextAuth: false,

package/src/libs/trpc/async/context.ts

@@ -2,7 +2,7 @@ import { type LobeChatDatabase } from '@lobechat/database';
 import debug from 'debug';
 import { type NextRequest } from 'next/server';
 
-import { LOBE_CHAT_AUTH_HEADER } from '@/const/auth';
+import { LOBE_CHAT_AUTH_HEADER } from '@/envs/auth';
 import { KeyVaultsGateKeeper } from '@/server/modules/KeyVaultsEncrypt';
 
 const log = debug('lobe-async:context');

package/src/libs/trpc/lambda/context.ts

@@ -1,17 +1,16 @@
-import {
-  LOBE_CHAT_AUTH_HEADER,
-  LOBE_CHAT_OIDC_AUTH_HEADER,
-  enableBetterAuth,
-  enableClerk,
-  enableNextAuth,
-} from '@lobechat/const';
 import { type ClientSecretPayload } from '@lobechat/types';
 import { parse } from 'cookie';
 import debug from 'debug';
 import { type User } from 'next-auth';
 import { type NextRequest } from 'next/server';
 
-import { authEnv } from '@/envs/auth';
+import {
+  LOBE_CHAT_AUTH_HEADER,
+  LOBE_CHAT_OIDC_AUTH_HEADER,
+  enableBetterAuth,
+  enableClerk,
+  enableNextAuth,
+ authEnv } from '@/envs/auth';
 import { ClerkAuth, type IClerkAuth } from '@/libs/clerk-auth';
 import { validateOIDCJWT } from '@/libs/oidc-provider/jwt';
 

package/src/libs/trpc/middleware/userAuth.ts

@@ -1,6 +1,6 @@
 import { TRPCError } from '@trpc/server';
 
-import { enableBetterAuth, enableClerk, enableNextAuth } from '@/const/auth';
+import { enableBetterAuth, enableClerk, enableNextAuth } from '@/envs/auth';
 
 import { trpc } from '../lambda/init';
 

package/src/libs/trusted-client/getSessionUser.ts

@@ -1,4 +1,4 @@
-import { enableBetterAuth, enableClerk, enableNextAuth } from '@/const/auth';
+import { enableBetterAuth, enableClerk, enableNextAuth } from '@/envs/auth';
 
 import type { TrustedClientUserInfo } from './index';
 

package/src/locales/default/components.ts

@@ -114,6 +114,7 @@ export default {
   'ModelSwitchPanel.goToSettings': 'Go to settings',
   'ModelSwitchPanel.manageProvider': 'Manage Provider',
   'ModelSwitchPanel.provider': 'Provider',
+  'ModelSwitchPanel.searchPlaceholder': 'Search models...',
   'ModelSwitchPanel.title': 'Model',
   'ModelSwitchPanel.useModelFrom': 'Use this model from:',
   'MultiImagesUpload.actions.uploadMore': 'Click or drag to upload more',

package/src/server/globalConfig/index.ts

@@ -74,7 +74,9 @@ export const getServerGlobalConfig = async () => {
     defaultAgent: {
       config: parseAgentConfig(DEFAULT_AGENT_CONFIG),
     },
+    enableEmailVerification: authEnv.AUTH_EMAIL_VERIFICATION,
     enableKlavis: !!klavisEnv.KLAVIS_API_KEY,
+    enableMagicLink: authEnv.ENABLE_MAGIC_LINK,
     enableMarketTrustedClient: !!(
       appEnv.MARKET_TRUSTED_CLIENT_SECRET && appEnv.MARKET_TRUSTED_CLIENT_ID
     ),

package/src/server/routers/async/caller.ts

@@ -2,8 +2,8 @@ import { createTRPCClient, httpLink } from '@trpc/client';
 import superjson from 'superjson';
 import urlJoin from 'url-join';
 
-import { LOBE_CHAT_AUTH_HEADER } from '@/const/auth';
 import { appEnv } from '@/envs/app';
+import { LOBE_CHAT_AUTH_HEADER } from '@/envs/auth';
 import { createAsyncCallerFactory } from '@/libs/trpc/async';
 import { signInternalJWT } from '@/libs/trpc/utils/internalJwt';
 import { KeyVaultsGateKeeper } from '@/server/modules/KeyVaultsEncrypt';

package/src/server/routers/lambda/__tests__/user.test.ts

@@ -1,11 +1,11 @@
 // @vitest-environment node
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 
-import { enableClerk } from '@/const/auth';
 import { MessageModel } from '@/database/models/message';
 import { SessionModel } from '@/database/models/session';
 import { UserModel, UserNotFoundError } from '@/database/models/user';
 import { serverDB } from '@/database/server';
+import { enableClerk } from '@/envs/auth';
 import { KeyVaultsGateKeeper } from '@/server/modules/KeyVaultsEncrypt';
 import { NextAuthUserService } from '@/server/services/nextAuthUser';
 import { UserService } from '@/server/services/user';
@@ -28,7 +28,7 @@ vi.mock('@/server/modules/KeyVaultsEncrypt');
 vi.mock('@/server/modules/S3');
 vi.mock('@/server/services/user');
 vi.mock('@/server/services/nextAuthUser');
-vi.mock('@/const/auth', () => ({
+vi.mock('@/envs/auth', () => ({
   enableBetterAuth: false,
   enableClerk: true,
   enableNextAuth: false,

package/src/server/routers/lambda/user.ts

@@ -1,5 +1,5 @@
 import { type UserJSON } from '@clerk/backend';
-import { enableClerk, isDesktop } from '@lobechat/const';
+import { isDesktop } from '@lobechat/const';
 import {
   NextAuthAccountSchame,
   Plans,
@@ -20,6 +20,7 @@ import { getIsInWaitList, getReferralStatus, getSubscriptionPlan } from '@/busin
 import { MessageModel } from '@/database/models/message';
 import { SessionModel } from '@/database/models/session';
 import { UserModel, UserNotFoundError } from '@/database/models/user';
+import { enableClerk } from '@/envs/auth';
 import { ClerkAuth } from '@/libs/clerk-auth';
 import { pino } from '@/libs/logger';
 import { authedProcedure, router } from '@/libs/trpc/lambda';

package/src/services/_auth.ts

@@ -1,4 +1,3 @@
-import { LOBE_CHAT_AUTH_HEADER } from '@lobechat/const';
 import {
   type AWSBedrockKeyVault,
   type AzureOpenAIKeyVault,
@@ -11,6 +10,7 @@ import {
 import { clientApiKeyManager } from '@lobechat/utils/client';
 import { ModelProvider } from 'model-bank';
 
+import { LOBE_CHAT_AUTH_HEADER, SECRET_XOR_KEY } from '@/envs/auth';
 import { aiProviderSelectors, useAiInfraStore } from '@/store/aiInfra';
 import { useUserStore } from '@/store/user';
 import { userProfileSelectors } from '@/store/user/selectors';
@@ -107,7 +107,7 @@ export const getProviderAuthPayload = (
 const createAuthTokenWithPayload = (payload = {}) => {
   const userId = userProfileSelectors.userId(useUserStore.getState());
 
-  return obfuscatePayloadWithXOR<ClientSecretPayload>({ userId, ...payload });
+  return obfuscatePayloadWithXOR<ClientSecretPayload>({ userId, ...payload }, SECRET_XOR_KEY);
 };
 
 interface AuthParams {
@@ -130,7 +130,7 @@ export const createPayloadWithKeyVaults = (provider: string) => {
 
 export const createXorKeyVaultsPayload = (provider: string) => {
   const payload = createPayloadWithKeyVaults(provider);
-  return obfuscatePayloadWithXOR(payload);
+  return obfuscatePayloadWithXOR(payload, SECRET_XOR_KEY);
 };
 
 // eslint-disable-next-line no-undef

package/src/services/chat/index.ts

@@ -24,8 +24,8 @@ import {
 import { merge } from 'es-toolkit/compat';
 import { ModelProvider } from 'model-bank';
 
-import { enableAuth } from '@/const/auth';
 import { DEFAULT_AGENT_CONFIG } from '@/const/settings';
+import { enableAuth } from '@/envs/auth';
 import { getSearchConfig } from '@/helpers/getSearchConfig';
 import { createAgentToolsEngine, createToolsEngine } from '@/helpers/toolEngineering';
 import { getAgentStoreState } from '@/store/agent';

package/src/services/chat/mecha/contextEngineering.ts

@@ -74,7 +74,7 @@ interface ContextEngineeringContext {
   topicId?: string;
 }
 
-// REVIEW：可能这里可以约束一下 identity，preference，exp 的 重新排序或者裁切过的上下文进来而不是全部丢进来
+// REVIEW: Maybe we can constrain identity, preference, exp to reorder or trim the context instead of passing everything in
 export const contextEngineering = async ({
   messages = [],
   manifests,

package/src/store/global/initialState.ts

@@ -113,6 +113,14 @@ export interface SystemStatus {
   leftPanelWidth: number;
   mobileShowPortal?: boolean;
   mobileShowTopic?: boolean;
+  /**
+   * ModelSwitchPanel 的分组模式
+   */
+  modelSwitchPanelGroupMode?: 'byModel' | 'byProvider';
+  /**
+   * ModelSwitchPanel 的宽度
+   */
+  modelSwitchPanelWidth?: number;
   noWideScreen?: boolean;
   /**
    * number of pages (documents) to display per page
@@ -179,6 +187,8 @@ export const INITIAL_STATUS = {
   knowledgeBaseModalViewMode: 'list' as const,
   leftPanelWidth: 320,
   mobileShowTopic: false,
+  modelSwitchPanelGroupMode: 'byProvider',
+  modelSwitchPanelWidth: 430,
   noWideScreen: true,
   pagePageSize: 20,
   portalWidth: 400,

package/src/store/global/selectors/systemStatus.ts

@@ -24,6 +24,9 @@ const showImageTopicPanel = (s: GlobalState) => s.status.showImageTopicPanel;
 const hidePWAInstaller = (s: GlobalState) => s.status.hidePWAInstaller;
 const isShowCredit = (s: GlobalState) => s.status.isShowCredit;
 const language = (s: GlobalState) => s.status.language || 'auto';
+const modelSwitchPanelGroupMode = (s: GlobalState) =>
+  s.status.modelSwitchPanelGroupMode || 'byProvider';
+const modelSwitchPanelWidth = (s: GlobalState) => s.status.modelSwitchPanelWidth || 430;
 
 const showChatHeader = (s: GlobalState) => !s.status.zenMode;
 const inZenMode = (s: GlobalState) => s.status.zenMode;
@@ -68,6 +71,8 @@ export const systemStatusSelectors = {
   leftPanelWidth,
   mobileShowPortal,
   mobileShowTopic,
+  modelSwitchPanelGroupMode,
+  modelSwitchPanelWidth,
   pagePageSize,
   portalWidth,
   sessionGroupKeys,

package/src/store/serverConfig/selectors.ts

@@ -3,8 +3,12 @@ import { type ServerConfigStore } from './store';
 export const featureFlagsSelectors = (s: ServerConfigStore) => s.featureFlags;
 
 export const serverConfigSelectors = {
+  enableEmailVerification: (s: ServerConfigStore) =>
+    s.serverConfig.enableEmailVerification || false,
   enableKlavis: (s: ServerConfigStore) => s.serverConfig.enableKlavis || false,
-  enableMarketTrustedClient: (s: ServerConfigStore) => s.serverConfig.enableMarketTrustedClient || false,
+  enableMagicLink: (s: ServerConfigStore) => s.serverConfig.enableMagicLink || false,
+  enableMarketTrustedClient: (s: ServerConfigStore) =>
+    s.serverConfig.enableMarketTrustedClient || false,
   enableUploadFileToServer: (s: ServerConfigStore) => s.serverConfig.enableUploadFileToServer,
   enabledAccessCode: (s: ServerConfigStore) => !!s.serverConfig?.enabledAccessCode,
   enabledTelemetryChat: (s: ServerConfigStore) => s.serverConfig.telemetry.langfuse || false,