💄 style: fix function message style

lobehub · Dec 15, 2023 · 4fee0b1 · 4fee0b1
1 parent 388eb85
commit 4fee0b1
Show file tree

Hide file tree

Showing 6 changed files with 20 additions and 12 deletions.
diff --git a/package.json b/package.json
@@ -74,7 +74,7 @@
     "@ant-design/icons": "^5",
     "@icons-pack/react-simple-icons": "^9",
     "@lobehub/chat-plugin-sdk": "latest",
-    "@lobehub/chat-plugins-gateway": "1.8.1",
+    "@lobehub/chat-plugins-gateway": "latest",
     "@lobehub/tts": "latest",
     "@lobehub/ui": "latest",
     "@vercel/analytics": "^1",

diff --git a/src/app/chat/features/Conversation/ChatList/Messages/Function.tsx b/src/app/chat/features/Conversation/ChatList/Messages/Function.tsx
@@ -18,7 +18,7 @@ export const FunctionMessage = memo<ChatMessage>(({ id, content, plugin }) => {
   const [showRender, setShow] = useState(true);
 
   return (
-    <Flexbox gap={12} id={id}>
+    <Flexbox gap={12} id={id} width={'100%'}>
       <Inspector showRender={showRender} {...fcProps} setShow={setShow} />
       {showRender && (
         <PluginRender

diff --git a/src/app/chat/features/Conversation/ChatList/Plugins/Inspector/index.tsx b/src/app/chat/features/Conversation/ChatList/Plugins/Inspector/index.tsx
@@ -50,7 +50,7 @@ const Inspector = memo<InspectorProps>(
     const pluginMeta = useToolStore(pluginSelectors.getPluginMetaById(id), isEqual);
     const showRightAction = useToolStore(pluginSelectors.isPluginHasUI(id));
     const pluginAvatar = pluginHelpers.getPluginAvatar(pluginMeta);
-    const pluginTitle = pluginHelpers.getPluginTitle(pluginMeta) ?? t('plugins.unknown');
+    const pluginTitle = pluginHelpers.getPluginTitle(pluginMeta) ?? t('plugins.loading');
 
     const avatar = pluginAvatar ? (
       <Avatar avatar={pluginAvatar} size={32} />
@@ -80,7 +80,7 @@ const Inspector = memo<InspectorProps>(
             ) : (
               avatar
             )}
-            {loading ? t('plugins.loading') : pluginTitle}
+            {pluginTitle}
             {showRightAction && <Icon icon={showRender ? LucideChevronUp : LucideChevronDown} />}
           </Flexbox>
           {

diff --git a/src/app/chat/features/Conversation/ChatList/Plugins/Render/DefaultType/index.tsx b/src/app/chat/features/Conversation/ChatList/Plugins/Render/DefaultType/index.tsx
@@ -72,7 +72,7 @@ export interface PluginDefaultTypeProps {
   name?: string;
 }
 
-const PluginDefaultType = memo<PluginDefaultTypeProps>(({ content, name }) => {
+const PluginDefaultType = memo<PluginDefaultTypeProps>(({ content, name, loading }) => {
   const manifest = useToolStore(pluginSelectors.getPluginManifestById(name || ''));
   let isJSON = true;
   try {
@@ -85,9 +85,11 @@ const PluginDefaultType = memo<PluginDefaultTypeProps>(({ content, name }) => {
 
   if (!isJSON) {
     return (
-      <Flexbox gap={8}>
-        <Loading />
-      </Flexbox>
+      loading && (
+        <Flexbox gap={8}>
+          <Loading />
+        </Flexbox>
+      )
     );
   }
 

diff --git a/src/app/chat/features/Conversation/ChatList/Plugins/Render/index.tsx b/src/app/chat/features/Conversation/ChatList/Plugins/Render/index.tsx
@@ -13,14 +13,14 @@ export interface PluginRenderProps {
   type?: LobePluginType;
 }
 
-const PluginRender = memo<PluginRenderProps>(({ content, id, payload, name, type }) => {
+const PluginRender = memo<PluginRenderProps>(({ content, id, payload, name, type, loading }) => {
   switch (type) {
     case 'standalone': {
       return <Standalone id={id} name={name} payload={payload} />;
     }
 
     default: {
-      return <DefaultType content={content} name={name} />;
+      return <DefaultType content={content} loading={loading} name={name} />;
     }
   }
 });

diff --git a/src/store/chat/actions/plugin.ts b/src/store/chat/actions/plugin.ts
@@ -40,12 +40,18 @@ export const chatPlugin: StateCreator<
   runPluginDefaultType: async (id, payload) => {
     const { refreshMessages, coreProcessMessage, toggleChatLoading } = get();
     let data: string;
+
     try {
       const abortController = toggleChatLoading(true, id, n('fetchPlugin') as string);
       data = await chatService.runPluginApi(payload, { signal: abortController?.signal });
     } catch (error) {
-      await messageService.updateMessageError(id, error as any);
-      await refreshMessages();
+      const err = error as Error;
+
+      // ignore the aborted request error
+      if (!err.message.includes('The user aborted a request.')) {
+        await messageService.updateMessageError(id, error as any);
+        await refreshMessages();
+      }
 
       data = '';
     }