chore: completion payload format

config/config.ts

@@ -14,7 +14,7 @@ const isProduction = env === 'production';
 const t = Date.now();
 export default defineConfig({
   proxy: {
-    ...proxy()
+    ...proxy('http://192.168.50.3')
   },
   history: {
     type: 'hash'

src/components/logs-viewer/index.less

@@ -8,8 +8,11 @@
     z-index: 100;
 
     button {
-      background-color: rgba(255, 255, 255, 90%);
+      color: rgba(255, 255, 255, 70%);
-      border: none;
+
+      &:hover {
+        color: rgba(255, 255, 255, 90%) !important;
+      }
     }
   }
 

src/components/logs-viewer/index.tsx

@@ -123,7 +123,7 @@ const LogsViewer: React.FC<LogsViewerProps> = (props) => {
       <span className="copy">
         <CopyButton
           text={logs?.map((item) => item.content).join('\n')}
-          type="default"
+          type="text"
           size="small"
         ></CopyButton>
       </span>

src/components/version-info/index.tsx

@@ -10,7 +10,8 @@ const VersionInfo: React.FC<{ intl: any }> = ({ intl }) => {
   const latestVersion = getAtomStorage(UpdateCheckAtom).latest_version;
   const currentVersion = getAtomStorage(GPUStackVersionAtom)?.version;
 
-  const isProd = currentVersion !== '0.0.0';
+  const isProd =
+    currentVersion !== '0.0.0' && currentVersion.indexOf('rc') === -1;
 
   const uiVersion = document.documentElement.getAttribute('data-version');
 
@@ -38,7 +39,9 @@ const VersionInfo: React.FC<{ intl: any }> = ({ intl }) => {
                 {' '}
                 {intl.formatMessage({ id: 'common.footer.version.server' })}
               </span>
-              {getAtomStorage(GPUStackVersionAtom)?.git_commit}
+              {currentVersion === '0.0.0'
+                ? getAtomStorage(GPUStackVersionAtom)?.git_commit
+                : getAtomStorage(GPUStackVersionAtom)?.version}
             </span>
             <span className="item">
               <span className="tl">UI</span>
@@ -47,7 +50,7 @@ const VersionInfo: React.FC<{ intl: any }> = ({ intl }) => {
           </span>
         )}
       </div>
-      {getAtomStorage(userAtom)?.is_admin && (
+      {getAtomStorage(userAtom)?.is_admin && isProd && (
         <div className="upgrade">
           <span className="m-l-5">
             {latestVersion &&

src/pages/playground/components/ground-left.tsx

@@ -14,7 +14,7 @@ import {
   useState
 } from 'react';
 import { CHAT_API } from '../apis';
-import { Roles, formatMessageParams } from '../config';
+import { Roles, generateMessages } from '../config';
 import { MessageItem } from '../config/types';
 import '../style/ground-left.less';
 import '../style/system-message-wrap.less';
@@ -134,52 +134,23 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
       setMessageList((pre) => {
         return [...pre, ...currentMessageRef.current];
       });
-      const formatMessages = _.map(
+      console.log('messageList:', [
-        [...messageList, ...currentMessageRef.current],
+        ...messageList,
-        (item: MessageItem) => {
+        ...currentMessageRef.current
-          return {
+      ]);
-            role: item.role,
-            content: [
-              {
-                type: 'text',
-                text: item.content
-              },
-              ..._.map(
-                item.imgs,
-                (img: { uid: string | number; dataUrl: string }) => {
-                  return {
-                    type: 'image_url',
-                    image_url: {
-                      url: img.dataUrl
-                    }
-                  };
-                }
-              )
-            ]
-          };
-        }
-      );
-      const messageParams = systemMessage
-        ? [
-            {
-              role: Roles.System,
-              content: [
-                {
-                  type: 'text',
-                  text: systemMessage
-                }
-              ]
-            },
-            ...formatMessages
-          ]
-        : [...formatMessages];
 
-      const finalMessageParams = formatMessageParams(messageParams);
+      const messageParams = [
+        { role: Roles.System, content: systemMessage },
+        ...messageList,
+        ...currentMessageRef.current
+      ];
 
-      setViewCodeMessage(finalMessageParams);
+      const messages = generateMessages(messageParams);
+
+      setViewCodeMessage(messages);
 
       const chatParams = {
-        messages: finalMessageParams,
+        messages: messages,
         ...parameters,
         stream: true,
         stream_options: {

src/pages/playground/components/message-input.tsx

@@ -340,10 +340,12 @@ const MessageInput: React.FC<MessageInputProps> = ({
                 {intl.formatMessage({ id: `playground.${message.role}` })}
               </Button>
               <Divider type="vertical" style={{ margin: 0 }} />
-              <UploadImg
+              {message.role === Roles.User && (
-                handleUpdateImgList={handleUpdateImgList}
+                <UploadImg
-                size="middle"
+                  handleUpdateImgList={handleUpdateImgList}
-              ></UploadImg>
+                  size="middle"
+                ></UploadImg>
+              )}
             </>
           )}
           <Tooltip

src/pages/playground/components/multiple-chat/model-item.tsx

@@ -24,7 +24,7 @@ import React, {
 } from 'react';
 import 'simplebar-react/dist/simplebar.min.css';
 import { CHAT_API } from '../../apis';
-import { Roles, formatMessageParams } from '../../config';
+import { Roles, generateMessages } from '../../config';
 import CompareContext from '../../config/compare-context';
 import { MessageItem, ModelSelectionItem } from '../../config/types';
 import '../../style/model-item.less';
@@ -123,63 +123,22 @@ const ModelItem: React.FC<ModelItemProps> = forwardRef(
         setMessageList((preList) => {
           return [...preList, ...currentMessageRef.current];
         });
-        const messages = _.map(
-          [...messageList, ...currentMessageRef.current],
-          (item: MessageItem) => {
-            return {
-              role: item.role,
-              content: item.content,
-              imgs: item.imgs || []
-            };
-          }
-        );
 
         contentRef.current = '';
         // ====== payload =================
-        const formatMessages = _.map(messages, (item: MessageItem) => {
-          return {
-            role: item.role,
-            content: [
-              {
-                type: 'text',
-                text: item.content
-              },
-              ..._.map(
-                item.imgs,
-                (img: { uid: string | number; dataUrl: string }) => {
-                  return {
-                    type: 'image_url',
-                    image_url: {
-                      url: img.dataUrl
-                    }
-                  };
-                }
-              )
-            ]
-          };
-        });
 
-        const messageParams = systemMessage
+        const messageParams = [
-          ? [
+          { role: Roles.System, content: systemMessage },
-              {
+          ...messageList,
-                role: Roles.System,
+          ...currentMessageRef.current
-                content: [
+        ];
-                  {
-                    type: 'text',
-                    text: systemMessage
-                  }
-                ]
-              },
-              ...formatMessages
-            ]
-          : [...formatMessages];
 
-        const finalMessageParams = formatMessageParams(messageParams);
+        const messages = generateMessages(messageParams);
 
-        setViewCodeMessage(finalMessageParams);
+        setViewCodeMessage(messages);
 
         const chatParams = {
-          messages: finalMessageParams,
+          messages: messages,
           ...params,
           stream: true,
           stream_options: {

src/pages/playground/config/index.ts

@@ -1,3 +1,6 @@
+import { map } from 'lodash';
+import { MessageItem } from './types';
+
 export const Roles = {
   User: 'user',
   Assistant: 'assistant',
@@ -40,3 +43,63 @@ export const formatMessageParams = (messageList: any[]) => {
   });
   return result;
 };
+
+export const generateMessagesByListContent = (messageList: any[]) => {
+  if (!messageList.length) return [];
+
+  return messageList.map((item: MessageItem) => {
+    const content = map(
+      item.imgs,
+      (img: { uid: string | number; dataUrl: string }) => {
+        return {
+          type: 'image_url',
+          image_url: {
+            url: img.dataUrl
+          }
+        };
+      }
+    );
+
+    if (item.content) {
+      content.push({
+        type: 'text',
+        text: item.content
+      });
+    }
+    return {
+      role: item.role,
+      content: content
+    };
+  });
+};
+
+export const generateMessages = (messageList: Omit<MessageItem, 'uid'>[]) => {
+  if (!messageList.length) return [];
+
+  const result: any[] = [];
+
+  messageList.forEach((item: Omit<MessageItem, 'uid'>) => {
+    if (item.imgs?.length) {
+      const imgList = item.imgs.map((img) => {
+        return {
+          type: 'image_url',
+          image_url: {
+            url: img.dataUrl
+          }
+        };
+      });
+      result.push({
+        role: item.role,
+        content: imgList
+      });
+    }
+    if (item.content) {
+      result.push({
+        role: item.role,
+        content: item.content
+      });
+    }
+  });
+
+  return result;
+};