From e3b0cb7db78a4b393e7a0792c15110ae30fc4db3 Mon Sep 17 00:00:00 2001
From: Wentao Lyu <35-wentao.lyu@users.noreply.git.stereye.tech>
Date: Thu, 16 Mar 2023 21:59:20 +0800
Subject: [PATCH] feat: show model at the top of conversation messages.

---
 client/src/components/Messages/index.jsx | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/client/src/components/Messages/index.jsx b/client/src/components/Messages/index.jsx
index 611a0231d3..27fd406425 100644
--- a/client/src/components/Messages/index.jsx
+++ b/client/src/components/Messages/index.jsx
@@ -8,10 +8,14 @@ import { useSelector } from 'react-redux';
 const Messages = ({ messages, messageTree }) => {
   const [currentEditId, setCurrentEditId] = useState(-1);
   const { conversationId } = useSelector((state) => state.convo);
+  const { model, customModel, chatGptLabel } = useSelector((state) => state.submit);
+  const { models } = useSelector((state) => state.models);
   const [showScrollButton, setShowScrollButton] = useState(false);
   const scrollableRef = useRef(null);
   const messagesEndRef = useRef(null);
 
+  const modelName = models.find(element => element.model==model)?.name
+
   useEffect(() => {
     const timeoutId = setTimeout(() => {
       const scrollable = scrollableRef.current;
@@ -60,6 +64,9 @@ const Messages = ({ messages, messageTree }) => {
     >
       {/* <div className="flex-1 overflow-hidden"> */}
       <div className="dark:gpt-dark-gray h-full">
+        <div className="flex w-full items-center justify-center gap-1 border-b border-black/10 bg-gray-50 p-3 text-gray-500 dark:border-gray-900/50 dark:bg-gray-700 dark:text-gray-300 text-sm">
+          Model: {modelName} {customModel?`(${customModel})`:null}
+        </div>
         <div className="dark:gpt-dark-gray flex h-full flex-col items-center text-sm">
           {messageTree.length === 0 ? (
             <Spinner />