Merge branch '27103_gpt_turbo' into '1DEVT'

27103_gpt_turbo

See merge request !42

@@ -250,6 +250,19 @@
     font-size: 14px;
     font-size: 14px;
 }
 }
 
 
+.suggested-header-title {
+  font-size: 1.5em;
+  font-weight: bold;
+}
+
+.suggested-header-title p:first-child {
+  font-size: 1.57em;
+}
+
+.suggested-header-title p {
+  margin: 0;
+}
+
 ul.suggested-options {
 ul.suggested-options {
     cursor: pointer;
     cursor: pointer;
     overflow-x: hidden;
     overflow-x: hidden;

@@ -14,14 +14,23 @@ function App() {
   const [chatInput, setChatInput] = useState("");
   const [chatInput, setChatInput] = useState("");
   const [models, setModels] = useState([]);
   const [models, setModels] = useState([]);
   const [temperature, setTemperature] = useState(0.7);
   const [temperature, setTemperature] = useState(0.7);
-  const [currentModel, setCurrentModel] = useState("text-davinci-003");
+  const GPTTurbo = "gpt-3.5-turbo";
+  const GPTTurbo0301 = "gpt-3.5-turbo-0301";
+  const [currentModel, setCurrentModel] = useState(GPTTurbo);
   const [chatLog, setChatLog] = useState([{
   const [chatLog, setChatLog] = useState([{
     user: "gpt",
     user: "gpt",
     message: "Welcome to AI-PRO... How can I help you?"
     message: "Welcome to AI-PRO... How can I help you?"
   }]);
   }]);
+  // "gpt-3.5-turbo"
+  const defaultChatLogTurbo = [
+    { role: "system", content: "You are a helpful assistant."}
+  ];
+  const [chatLogTurbo, setChatLogTurbo] = useState(defaultChatLogTurbo);
+  //
 
 
   function clearChat(){
   function clearChat(){
     setChatLog([]);
     setChatLog([]);
+    setChatLogTurbo(defaultChatLogTurbo);
     setChatInput("");
     setChatInput("");
     setStartedInteraction(false);
     setStartedInteraction(false);
   }
   }
@@ -66,7 +75,13 @@ function App() {
     const userMessage = { user: "gpt", message: "..." };
     const userMessage = { user: "gpt", message: "..." };
     setChatLog(prevChatLog => [...prevChatLog, userMessage]);
     setChatLog(prevChatLog => [...prevChatLog, userMessage]);
 
 
-    const messages = chatLogNew.map((message) => message.message).join("\n")
+    var messages = chatLogNew.map((message) => message.message).join("\n")
+    if(currentModel == GPTTurbo || currentModel == GPTTurbo0301) {
+      // "gpt-3.5-turbo"
+      let chatLogTurboNew = [...chatLogTurbo, { role: "user", content: chatInput }];
+      setChatLogTurbo(chatLogTurboNew);
+      messages = JSON.stringify(chatLogTurboNew);
+    }
     let intervalId = startInterval();
     let intervalId = startInterval();
 
 
     try {
     try {
@@ -78,11 +93,16 @@ function App() {
         body: JSON.stringify({
         body: JSON.stringify({
           message: messages,
           message: messages,
           currentModel,
           currentModel,
+          temperature
         })
         })
       });
       });
 
 
       const data = await response.json();
       const data = await response.json();
       const parsedData = data.message.trim();
       const parsedData = data.message.trim();
+      // "gpt-3.5-turbo"
+      let chatLogTurboNew = [...chatLogTurbo, { role: "assistant", content: parsedData }];
+      setChatLogTurbo(chatLogTurboNew);
+      //
       clearInterval(intervalId);
       clearInterval(intervalId);
       const programmingKeywords = ['code', 'application', 'controller', 'rails' , 'PHP', 'java', 'javascript', 'script', 'console', 'python', 'programming', 'table'];
       const programmingKeywords = ['code', 'application', 'controller', 'rails' , 'PHP', 'java', 'javascript', 'script', 'console', 'python', 'programming', 'table'];
 
 

 const SideMenu = ({ clearChat, currentModel, setCurrentModel, models, setTemperature, temperature }) =>
 const SideMenu = ({ clearChat, currentModel, setCurrentModel, models, setTemperature, temperature }) =>
 <aside className="sidemenu">
 <aside className="sidemenu">
   <div className="ai-logo-container">
   <div className="ai-logo-container">
-    <img className="ai-logo" alt="Ai-pro logo" src="../assets/images/AIPRO-WHITE.png" height="50px"/>
+    <img className="ai-logo" alt="Ai-pro logo" src="../assets/images/chatgpt-aipro.png" height="50px"/>
   </div>
   </div>
       <div className="side-menu-button" onClick={clearChat}>
       <div className="side-menu-button" onClick={clearChat}>
         <span>+</span>
         <span>+</span>

@@ -21,7 +21,10 @@ const SuggestedOptions = ({ setChatInput }) => {
   return (
   return (
     <div className="suggested">
     <div className="suggested">
       <div className="suggestedrow title">
       <div className="suggestedrow title">
-        <h1>Welcome to AI-PRO</h1>
+        <div className="suggested-header-title">
+          <p>ChatGPT</p>
+          <p>by AI-PRO</p>
+        </div>
         <p>This chatbot is capable of answering questions and generating text based on the input you provide.</p>
         <p>This chatbot is capable of answering questions and generating text based on the input you provide.</p>
       </div>
       </div>
       <div className="suggestedcol rack1">
       <div className="suggestedcol rack1">

@@ -34,6 +34,11 @@ app.use(rateLimiter)
 app.post('/api', async (req, res) => {
 app.post('/api', async (req, res) => {
 	const { message, currentModel, temperature } = req.body;
 	const { message, currentModel, temperature } = req.body;
 
 
+	if(currentModel == "gpt-3.5-turbo" || currentModel == "gpt-3.5-turbo-0301") {
+		runGPTTurbo(req,res);
+		return;
+	}
+
 	let greetingPrompt = 'Hello, how can I assist you?'
 	let greetingPrompt = 'Hello, how can I assist you?'
 	const greetings = ['hi', 'hello', 'hey']
 	const greetings = ['hi', 'hello', 'hey']
 
 
@@ -78,6 +83,34 @@ app.post('/api', async (req, res) => {
 
 
 });
 });
 
 
+async function runGPTTurbo(req, res) {
+	// "gpt-3.5-turbo"
+	const { message, currentModel, temperature } = req.body;
+	var returnMessage = '';
+	try {
+		const response = await openai.createChatCompletion({
+			model: `${currentModel}`,
+			messages: JSON.parse(message),
+			max_tokens: 3000,
+			temperature
+		});
+		returnMessage = response.data.choices[0].message.content
+	} catch (e) {
+		let error_msg = e.response.data.error.message ?  e.response.data.error.message : '';
+		if (error_msg.indexOf('maximum context length')>=0){
+			returnMessage = "The output for your prompt is too long for us to process. Please reduce your prompt and try again.";
+		}else{
+			console.log(e.response);
+		}
+	} finally {
+		res.json({
+			prompt: JSON.parse(message),
+			message: returnMessage
+		});
+		return;
+	}
+}
+
 // Get Models Route
 // Get Models Route
 app.get('/models', async (req, res) => {
 app.get('/models', async (req, res) => {
 	const response = await openai.listEngines();
 	const response = await openai.listEngines();

@@ -15,6 +15,6 @@
     "express": "^4.18.2",
     "express": "^4.18.2",
     "express-rate-limit": "^6.7.0",
     "express-rate-limit": "^6.7.0",
     "morgan": "^1.10.0",
     "morgan": "^1.10.0",
-    "openai": "^3.1.0"
+    "openai": "^3.2.0"
   }
   }
 }
 }