@lobehub/lobehub 2.0.0-next.8 → 2.0.0-next.81

package/src/features/ChatInput/ActionBar/Model/GPT51ReasoningEffortSlider.tsx

@@ -0,0 +1,58 @@
+import { Slider } from 'antd';
+import { memo, useCallback } from 'react';
+import { Flexbox } from 'react-layout-kit';
+
+import { useAgentStore } from '@/store/agent';
+import { agentChatConfigSelectors } from '@/store/agent/selectors';
+
+const GPT51ReasoningEffortSlider = memo(() => {
+  const [config, updateAgentChatConfig] = useAgentStore((s) => [
+    agentChatConfigSelectors.currentChatConfig(s),
+    s.updateAgentChatConfig,
+  ]);
+
+  const gpt5_1ReasoningEffort = config.gpt5_1ReasoningEffort || 'none'; // Default to 'none' if not set
+
+  const marks = {
+    0: 'none',
+    1: 'low',
+    2: 'medium',
+    3: 'high',
+  };
+
+  const effortValues = ['none', 'low', 'medium', 'high'];
+  const indexValue = effortValues.indexOf(gpt5_1ReasoningEffort);
+  const currentValue = indexValue === -1 ? 0 : indexValue;
+
+  const updateGPT51ReasoningEffort = useCallback(
+    (value: number) => {
+      const effort = effortValues[value] as 'none' | 'low' | 'medium' | 'high';
+      updateAgentChatConfig({ gpt5_1ReasoningEffort: effort });
+    },
+    [updateAgentChatConfig],
+  );
+
+  return (
+    <Flexbox
+      align={'center'}
+      gap={12}
+      horizontal
+      paddingInline={'0 20px'}
+      style={{ minWidth: 200, width: '100%' }}
+    >
+      <Flexbox flex={1}>
+        <Slider
+          marks={marks}
+          max={3}
+          min={0}
+          onChange={updateGPT51ReasoningEffort}
+          step={1}
+          tooltip={{ open: false }}
+          value={currentValue}
+        />
+      </Flexbox>
+    </Flexbox>
+  );
+});
+
+export default GPT51ReasoningEffortSlider;

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

@@ -1,3 +1,4 @@
+import { getMessageError } from '@lobechat/fetch-sse';
 import { ChatMessageError } from '@lobechat/types';
 import { SpeechRecognitionOptions, useSpeechRecognition } from '@lobehub/tts/react';
 import isEqual from 'fast-deep-equal';
@@ -8,12 +9,11 @@ import { SWRConfiguration } from 'swr';
 import { useAgentStore } from '@/store/agent';
 import { agentSelectors } from '@/store/agent/slices/chat';
 import { useChatStore } from '@/store/chat';
-import { chatSelectors } from '@/store/chat/selectors';
+import { messageStateSelectors } from '@/store/chat/selectors';
 import { useGlobalStore } from '@/store/global';
 import { globalGeneralSelectors } from '@/store/global/selectors';
 import { useUserStore } from '@/store/user';
 import { settingsSelectors } from '@/store/user/selectors';
-import { getMessageError } from '@/utils/fetch';
 
 import CommonSTT from './common';
 
@@ -42,9 +42,9 @@ const BrowserSTT = memo<{ mobile?: boolean }>(({ mobile }) => {
   const [error, setError] = useState<ChatMessageError>();
   const { t } = useTranslation('chat');
 
-  const [loading, updateInputMessage] = useChatStore((s) => [
-    chatSelectors.isAIGenerating(s),
-    s.updateInputMessage,
+  const [loading, updateMessageInput] = useChatStore((s) => [
+    messageStateSelectors.isAIGenerating(s),
+    s.updateMessageInput,
   ]);
 
   const setDefaultError = useCallback(
@@ -76,7 +76,7 @@ const BrowserSTT = memo<{ mobile?: boolean }>(({ mobile }) => {
     },
     onTextChange: (text) => {
       if (loading) stop();
-      if (text) updateInputMessage(text);
+      if (text) updateMessageInput(text);
     },
   });
 

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

@@ -1,3 +1,4 @@
+import { getMessageError } from '@lobechat/fetch-sse';
 import { ChatMessageError } from '@lobechat/types';
 import { getRecordMineType } from '@lobehub/tts';
 import { OpenAISTTOptions, useOpenAISTT } from '@lobehub/tts/react';
@@ -11,12 +12,11 @@ import { API_ENDPOINTS } from '@/services/_url';
 import { useAgentStore } from '@/store/agent';
 import { agentSelectors } from '@/store/agent/selectors';
 import { useChatStore } from '@/store/chat';
-import { chatSelectors } from '@/store/chat/slices/message/selectors';
+import { messageStateSelectors } from '@/store/chat/slices/message/selectors';
 import { useGlobalStore } from '@/store/global';
 import { globalGeneralSelectors } from '@/store/global/selectors';
 import { useUserStore } from '@/store/user';
 import { settingsSelectors } from '@/store/user/selectors';
-import { getMessageError } from '@/utils/fetch';
 
 import CommonSTT from './common';
 
@@ -53,9 +53,9 @@ const OpenaiSTT = memo<{ mobile?: boolean }>(({ mobile }) => {
   const [error, setError] = useState<ChatMessageError>();
   const { t } = useTranslation('chat');
 
-  const [loading, updateInputMessage] = useChatStore((s) => [
-    chatSelectors.isAIGenerating(s),
-    s.updateInputMessage,
+  const [loading, updateMessageInput] = useChatStore((s) => [
+    messageStateSelectors.isAIGenerating(s),
+    s.updateMessageInput,
   ]);
 
   const setDefaultError = useCallback(
@@ -87,7 +87,7 @@ const OpenaiSTT = memo<{ mobile?: boolean }>(({ mobile }) => {
     },
     onTextChange: (text) => {
       if (loading) stop();
-      if (text) updateInputMessage(text);
+      if (text) updateMessageInput(text);
     },
   });
 

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

@@ -4,7 +4,6 @@ import { Globe } from 'lucide-react';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 
-import { isDeprecatedEdition } from '@/const/version';
 import { useAgentEnableSearch } from '@/hooks/useAgentEnableSearch';
 import { useIsMobile } from '@/hooks/useIsMobile';
 import { useAgentStore } from '@/store/agent';
@@ -25,7 +24,6 @@ const Search = memo(() => {
   const theme = useTheme();
   const isMobile = useIsMobile();
 
-  if (isDeprecatedEdition) return null;
   if (isLoading) return <Action disabled icon={GlobeOffIcon} />;
 
   return (
@@ -36,11 +34,11 @@ const Search = memo(() => {
         isMobile
           ? undefined
           : async (e) => {
-            e?.preventDefault?.();
-            e?.stopPropagation?.();
-            const next = mode === 'off' ? 'auto' : 'off';
-            await updateAgentChatConfig({ searchMode: next });
-          }
+              e?.preventDefault?.();
+              e?.stopPropagation?.();
+              const next = mode === 'off' ? 'auto' : 'off';
+              await updateAgentChatConfig({ searchMode: next });
+            }
       }
       popover={{
         content: <Controls />,

package/src/features/ChatInput/ActionBar/Token/TokenTag.tsx

@@ -13,7 +13,7 @@ import { useTokenCount } from '@/hooks/useTokenCount';
 import { useAgentStore } from '@/store/agent';
 import { agentChatConfigSelectors, agentSelectors } from '@/store/agent/selectors';
 import { useChatStore } from '@/store/chat';
-import { chatSelectors, topicSelectors } from '@/store/chat/selectors';
+import { dbMessageSelectors, topicSelectors } from '@/store/chat/selectors';
 import { useToolStore } from '@/store/tool';
 import { toolSelectors } from '@/store/tool/selectors';
 
@@ -77,7 +77,7 @@ const Token = memo<TokenTagProps>(({ total: messageString }) => {
   const inputTokenCount = useTokenCount(input);
 
   const chatsString = useMemo(() => {
-    const chats = chatSelectors.mainAIChatsWithHistoryConfig(useChatStore.getState());
+    const chats = dbMessageSelectors.activeDbMessages(useChatStore.getState());
     return chats.map((chat) => chat.content).join('');
   }, [messageString, historyCount, enableHistoryCount]);
 

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

@@ -9,7 +9,6 @@ import { useCheckPluginsIsInstalled } from '@/hooks/useCheckPluginsIsInstalled';
 import { useFetchInstalledPlugins } from '@/hooks/useFetchInstalledPlugins';
 import { useAgentStore } from '@/store/agent';
 import { agentSelectors } from '@/store/agent/selectors';
-import { featureFlagsSelectors, useServerConfigStore } from '@/store/serverConfig';
 import { useToolStore } from '@/store/tool';
 import { builtinToolSelectors, pluginSelectors } from '@/store/tool/selectors';
 
@@ -24,12 +23,11 @@ export const useControls = ({
 }) => {
   const { t } = useTranslation('setting');
   const list = useToolStore(pluginSelectors.installedPluginMetaList, isEqual);
-  const { showDalle } = useServerConfigStore(featureFlagsSelectors);
   const [checked, togglePlugin] = useAgentStore((s) => [
     agentSelectors.currentAgentPlugins(s),
     s.togglePlugin,
   ]);
-  const builtinList = useToolStore(builtinToolSelectors.metaList(showDalle), isEqual);
+  const builtinList = useToolStore(builtinToolSelectors.metaList, isEqual);
   const enablePluginCount = useAgentStore(
     (s) =>
       agentSelectors

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

@@ -1,12 +1,10 @@
-import { isServerMode } from '@/const/version';
 import { featureFlagsSelectors, useServerConfigStore } from '@/store/serverConfig';
 
-import ClientMode from './ClientMode';
 import ServerMode from './ServerMode';
 
 const Upload = () => {
   const { enableKnowledgeBase } = useServerConfigStore(featureFlagsSelectors);
-  return isServerMode && enableKnowledgeBase ? <ServerMode /> : <ClientMode />;
+  return enableKnowledgeBase && <ServerMode />;
 };
 
 export default Upload;

package/src/features/ChatInput/ActionBar/components/ActionDropdown.tsx

@@ -30,29 +30,14 @@ export interface ActionDropdownProps extends DropdownProps {
 }
 
 const ActionDropdown = memo<ActionDropdownProps>(
-  ({
-    menu,
-    maxHeight,
-    minWidth,
-    maxWidth,
-    children,
-    placement = 'top',
-    prefetch = false,
-    destroyOnHidden,
-    forceRender,
-    ...rest
-  }) => {
+  ({ menu, maxHeight, minWidth, maxWidth, children, placement = 'top', ...rest }) => {
     const { cx, styles } = useStyles();
     const isMobile = useIsMobile();
 
-    const dropdownForceRender = prefetch ? true : forceRender;
-    const dropdownDestroyOnHidden = prefetch ? false : destroyOnHidden;
-
     return (
       <Dropdown
         arrow={false}
-        destroyOnHidden={dropdownDestroyOnHidden}
-        forceRender={dropdownForceRender}
+        destroyOnHidden={false}
         menu={{
           ...menu,
           className: cx(styles.dropdownMenu, menu.className),

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

@@ -4,7 +4,7 @@ import { memo, useMemo } from 'react';
 import { useGlobalStore } from '@/store/global';
 import { systemStatusSelectors } from '@/store/global/selectors';
 import { useUserStore } from '@/store/user';
-import { preferenceSelectors } from '@/store/user/slices/preference/selectors';
+import { labPreferSelectors } from '@/store/user/slices/preference/selectors';
 
 import { ActionKeys, actionMap } from '../ActionBar/config';
 import { useChatInputStore } from '../store';
@@ -44,7 +44,7 @@ const ActionToolbar = memo(() => {
     systemStatusSelectors.expandInputActionbar(s),
     s.toggleExpandInputActionbar,
   ]);
-  const enableRichRender = useUserStore(preferenceSelectors.inputMarkdownRender);
+  const enableRichRender = useUserStore(labPreferSelectors.enableInputMarkdown);
 
   const leftActions = useChatInputStore((s) =>
     s.leftActions.filter((item) => (enableRichRender ? true : item !== 'typo')),

package/src/features/ChatInput/InputEditor/index.tsx

@@ -21,7 +21,7 @@ import { useHotkeysContext } from 'react-hotkeys-hook';
 import { useTranslation } from 'react-i18next';
 
 import { useUserStore } from '@/store/user';
-import { preferenceSelectors, settingsSelectors } from '@/store/user/selectors';
+import { labPreferSelectors, preferenceSelectors, settingsSelectors } from '@/store/user/selectors';
 
 import { useChatInputStore, useStoreApi } from '../store';
 import Placeholder from './Placeholder';
@@ -69,7 +69,7 @@ const InputEditor = memo<{ defaultRows?: number }>(({ defaultRows = 2 }) => {
     };
   }, [state.isEmpty]);
 
-  const enableRichRender = useUserStore(preferenceSelectors.inputMarkdownRender);
+  const enableRichRender = useUserStore(labPreferSelectors.enableInputMarkdown);
 
   const richRenderProps = useMemo(
     () =>

package/src/features/ChatItem/components/MessageContent.tsx

@@ -13,6 +13,7 @@ import { useStyles } from '../style';
 import { ChatItemProps } from '../type';
 
 export interface MessageContentProps {
+  className?: string;
   disabled?: ChatItemProps['disabled'];
   editing?: ChatItemProps['editing'];
   id: string;
@@ -39,6 +40,7 @@ const MessageContent = memo<MessageContentProps>(
     onDoubleClick,
     markdownProps,
     disabled,
+    className,
   }) => {
     const { t } = useTranslation('common');
     const { cx, styles } = useStyles({ disabled, editing, placement, primary, variant });
@@ -81,7 +83,7 @@ const MessageContent = memo<MessageContentProps>(
 
     return (
       <Flexbox
-        className={cx(styles.message, editing && styles.editingContainer)}
+        className={cx(styles.message, editing && styles.editingContainer, className)}
         onDoubleClick={onDoubleClick}
       >
         {messageContent}

package/src/features/ChatItem/components/Title.tsx

@@ -1,5 +1,5 @@
 import dayjs from 'dayjs';
-import { memo } from 'react';
+import { CSSProperties, memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
 
 import { useStyles } from '../style';
@@ -10,6 +10,7 @@ export interface TitleProps {
   className?: string;
   placement?: ChatItemProps['placement'];
   showTitle?: ChatItemProps['showTitle'];
+  style?: CSSProperties;
   time?: ChatItemProps['time'];
   titleAddon?: ChatItemProps['titleAddon'];
 }
@@ -27,21 +28,24 @@ const formatTime = (time: number): string => {
   }
 };
 
-const Title = memo<TitleProps>(({ showTitle, placement, time, avatar, titleAddon, className }) => {
-  const { styles, cx } = useStyles({ placement, showTitle, time });
+const Title = memo<TitleProps>(
+  ({ showTitle, placement, time, avatar, titleAddon, className, style }) => {
+    const { styles, cx } = useStyles({ placement, showTitle, time });
 
-  return (
-    <Flexbox
-      align={'center'}
-      className={cx(styles.name, className)}
-      direction={placement === 'left' ? 'horizontal' : 'horizontal-reverse'}
-      gap={4}
-    >
-      {showTitle ? avatar.title || 'untitled' : undefined}
-      {showTitle ? titleAddon : undefined}
-      {time && <time>{formatTime(time)}</time>}
-    </Flexbox>
-  );
-});
+    return (
+      <Flexbox
+        align={'center'}
+        className={cx(styles.name, className)}
+        direction={placement === 'left' ? 'horizontal' : 'horizontal-reverse'}
+        gap={4}
+        style={style}
+      >
+        {showTitle ? avatar.title || 'untitled' : undefined}
+        {showTitle ? titleAddon : undefined}
+        {time && <time>{formatTime(time)}</time>}
+      </Flexbox>
+    );
+  },
+);
 
 export default Title;

package/src/features/ChatItem/style.ts

@@ -86,6 +86,10 @@ export const useStyles = createStyles(
           padding-block: 24px 12px;
           padding-inline: 12px;
 
+          @supports (content-visibility: auto) {
+            contain-intrinsic-size: auto 100lvh;
+          }
+
           time {
             display: inline-block;
             white-space: nowrap;

package/src/features/Conversation/Error/AccessCodeForm.tsx

@@ -19,7 +19,7 @@ const AccessCodeForm = memo<AccessCodeFormProps>(({ id }) => {
     keyVaultsConfigSelectors.password(s),
     s.updateKeyVaults,
   ]);
-  const [resend, deleteMessage] = useChatStore((s) => [s.regenerateMessage, s.deleteMessage]);
+  const [resend, deleteMessage] = useChatStore((s) => [s.delAndRegenerateMessage, s.deleteMessage]);
 
   return (
     <>

package/src/features/Conversation/Error/ChatInvalidApiKey.tsx

@@ -13,7 +13,7 @@ interface ChatInvalidAPIKeyProps {
 const ChatInvalidAPIKey = memo<ChatInvalidAPIKeyProps>(({ id, provider }) => {
   const { t } = useTranslation('modelProvider');
   const { t: modelProviderErrorT } = useTranslation(['modelProvider', 'error']);
-  const [resend, deleteMessage] = useChatStore((s) => [s.regenerateMessage, s.deleteMessage]);
+  const [resend, deleteMessage] = useChatStore((s) => [s.delAndRegenerateMessage, s.deleteMessage]);
   const providerName = useProviderName(provider as GlobalLLMProviderKey);
 
   return (

package/src/features/Conversation/Error/ClerkLogin/index.tsx

@@ -15,7 +15,7 @@ const ClerkLogin = memo<{ id: string }>(({ id }) => {
   const [openSignIn, isSignedIn] = useUserStore((s) => [s.openLogin, s.isSignedIn]);
   const greeting = useGreeting();
   const nickName = useUserStore(userProfileSelectors.nickName);
-  const [resend, deleteMessage] = useChatStore((s) => [s.regenerateMessage, s.deleteMessage]);
+  const [resend, deleteMessage] = useChatStore((s) => [s.delAndRegenerateMessage, s.deleteMessage]);
 
   return (
     <ErrorActionContainer>

package/src/features/Conversation/Error/ErrorJsonViewer.tsx

@@ -4,18 +4,19 @@ import { memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
 
 interface ErrorJSONViewerProps {
+  block?: boolean;
   error?: ChatMessageError | null;
   id: string;
 }
 
-const ErrorJsonViewer = memo<ErrorJSONViewerProps>(({ error, id }) => {
+const ErrorJsonViewer = memo<ErrorJSONViewerProps>(({ error, id, block }) => {
   const errorBody = error?.body || error;
 
   if (!errorBody) return;
 
   return (
-    <Flexbox id={id} style={{ maxWidth: 600 }}>
-      <Highlighter actionIconSize={'small'} language={'json'}>
+    <Flexbox id={id} style={{ maxWidth: block ? '100%' : 600, width: block ? '100%' : undefined }}>
+      <Highlighter actionIconSize={'small'} language={'json'} wrap>
         {JSON.stringify(errorBody, null, 2)}
       </Highlighter>
     </Flexbox>

package/src/features/Conversation/Error/OAuthForm.tsx

@@ -18,7 +18,7 @@ const OAuthForm = memo<{ id: string }>(({ id }) => {
   const user = useUserStore(userProfileSelectors.userProfile);
   const isOAuthLoggedIn = useUserStore(authSelectors.isLoginWithAuth);
 
-  const [resend, deleteMessage] = useChatStore((s) => [s.regenerateMessage, s.deleteMessage]);
+  const [resend, deleteMessage] = useChatStore((s) => [s.delAndRegenerateMessage, s.deleteMessage]);
 
   const { message, modal } = App.useApp();
 

package/src/features/Conversation/Error/OllamaBizError/index.tsx

@@ -1,4 +1,4 @@
-import { UIChatMessage } from '@lobechat/types';
+import { ChatMessageError } from '@lobechat/types';
 import { Skeleton } from 'antd';
 import dynamic from 'next/dynamic';
 import { memo } from 'react';
@@ -24,7 +24,12 @@ interface OllamaErrorResponse {
 
 const UNRESOLVED_MODEL_REGEXP = /model "([\w+,-_]+)" not found/;
 
-const OllamaBizError = memo<UIChatMessage>(({ error, id }) => {
+interface OllamaBizErrorProps {
+  error?: ChatMessageError | null;
+  id: string;
+}
+
+const OllamaBizError = memo<OllamaBizErrorProps>(({ error, id }) => {
   const errorBody: OllamaErrorResponse = (error as any)?.body;
 
   const errorMessage = errorBody.error?.message;

package/src/features/Conversation/Error/index.tsx

@@ -1,5 +1,5 @@
 import { AgentRuntimeErrorType, ILobeAgentRuntimeErrorType } from '@lobechat/model-runtime';
-import { ChatErrorType, ChatMessageError, ErrorType, UIChatMessage } from '@lobechat/types';
+import { ChatErrorType, ChatMessageError, ErrorType } from '@lobechat/types';
 import { IPluginErrorType } from '@lobehub/chat-plugin-sdk';
 import type { AlertProps } from '@lobehub/ui';
 import { Skeleton } from 'antd';
@@ -12,9 +12,13 @@ import { useProviderName } from '@/hooks/useProviderName';
 import ChatInvalidAPIKey from './ChatInvalidApiKey';
 import ClerkLogin from './ClerkLogin';
 import ErrorJsonViewer from './ErrorJsonViewer';
-import InvalidAccessCode from './InvalidAccessCode';
 import { ErrorActionContainer } from './style';
 
+interface ErrorMessageData {
+  error?: ChatMessageError | null;
+  id: string;
+}
+
 const loading = () => <Skeleton active />;
 
 const OllamaBizError = dynamic(() => import('./OllamaBizError'), { loading, ssr: false });
@@ -87,7 +91,12 @@ export const useErrorContent = (error: any) => {
   }, [error]);
 };
 
-const ErrorMessageExtra = memo<{ data: UIChatMessage }>(({ data }) => {
+interface ErrorExtraProps {
+  block?: boolean;
+  data: ErrorMessageData;
+}
+
+const ErrorMessageExtra = memo<ErrorExtraProps>(({ data, block }) => {
   const error = data.error as ChatMessageError;
   if (!error?.type) return;
 
@@ -108,10 +117,6 @@ const ErrorMessageExtra = memo<{ data: UIChatMessage }>(({ data }) => {
       return <ClerkLogin id={data.id} />;
     }
 
-    case ChatErrorType.InvalidAccessCode: {
-      return <InvalidAccessCode id={data.id} provider={data.error?.body?.provider} />;
-    }
-
     case AgentRuntimeErrorType.NoOpenAIAPIKey: {
       {
         return <ChatInvalidAPIKey id={data.id} provider={data.error?.body?.provider} />;
@@ -123,10 +128,10 @@ const ErrorMessageExtra = memo<{ data: UIChatMessage }>(({ data }) => {
     return <ChatInvalidAPIKey id={data.id} provider={data.error?.body?.provider} />;
   }
 
-  return <ErrorJsonViewer error={data.error} id={data.id} />;
+  return <ErrorJsonViewer block={block} error={data.error} id={data.id} />;
 });
 
-export default memo<{ data: UIChatMessage }>(({ data }) => (
+export default memo<ErrorExtraProps>(({ data, block }) => (
   <Suspense
     fallback={
       <ErrorActionContainer>
@@ -134,6 +139,6 @@ export default memo<{ data: UIChatMessage }>(({ data }) => (
       </ErrorActionContainer>
     }
   >
-    <ErrorMessageExtra data={data} />
+    <ErrorMessageExtra block={block} data={data} />
   </Suspense>
 ));

package/src/features/Conversation/MarkdownElements/LobeArtifact/Render/index.tsx

@@ -7,7 +7,7 @@ import { useTranslation } from 'react-i18next';
 import { Center, Flexbox } from 'react-layout-kit';
 
 import { useChatStore } from '@/store/chat';
-import { chatPortalSelectors, chatSelectors } from '@/store/chat/selectors';
+import { chatPortalSelectors, messageStateSelectors } from '@/store/chat/selectors';
 import { dotLoading } from '@/styles/loading';
 
 import { InPortalThreadContext } from '../../../context/InPortalThreadContext';
@@ -66,7 +66,7 @@ const Render = memo<ArtifactProps>(({ identifier, title, type, language, childre
   const { message } = App.useApp();
   const [isGenerating, isArtifactTagClosed, openArtifact, closeArtifact] = useChatStore((s) => {
     return [
-      chatSelectors.isMessageGenerating(id)(s),
+      messageStateSelectors.isMessageGenerating(id)(s),
       chatPortalSelectors.isArtifactTagClosed(id)(s),
       s.openArtifact,
       s.closeArtifact,