fix

@@ -71,38 +71,44 @@ function App() {
     // fetch response to the api combining the chat log array of messages and seinding it as a message to localhost:3000 as a post
     // fetch response to the api combining the chat log array of messages and seinding it as a message to localhost:3000 as a post
     const messages = chatLogNew.map((message) => message.message).join("\n")
     const messages = chatLogNew.map((message) => message.message).join("\n")
 
 
-    const response = await fetch(process.env.REACT_APP_SERVER_URL + "/api", {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json"
-      },
-      body: JSON.stringify({
-        message: messages,
-        currentModel,
-       })
+    try {
+      const response = await fetch(process.env.REACT_APP_SERVER_URL + "/api", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json"
+        },
+        body: JSON.stringify({
+          message: messages,
+          currentModel,
+        })
       });
       });
-    const data = await response.json();
-    const parsedData = data.message.trim();
-    // console.log(parsedData)
-    const programmingKeywords = ['code', 'application', 'controller', 'rails' , 'PHP', 'java', 'javascript', 'script', 'console', 'python', 'programming', 'table'];
-
-    const regex = new RegExp(`\\b(${programmingKeywords.join('|')})\\b`, 'gi');
-    // console.log(regex)
-    const matches = parsedData.match(regex);
-    // console.log(matches);
-    if (!matches) {
-      var replaceTags = (parsedData.replace(/(?:\r\n|\r|\n)/g, '<br>').replace(/\./g, '. '))
-      // console.log("not programming!")
-    } else {
-        replaceTags = (parsedData.replace(':',':<code>').replace('<?','&#60;?').replace('?>','?&#62;').replace(/\n/g, '<br>'))
-      // console.log("programming!")
-      //.replace('<?','&#60;' + '?').replace('?>','?'+'&#62;')
+      const data = await response.json();
+      const parsedData = data.message.trim();
+      // console.log(parsedData)
+      const programmingKeywords = ['code', 'application', 'controller', 'rails' , 'PHP', 'java', 'javascript', 'script', 'console', 'python', 'programming', 'table'];
+
+      const regex = new RegExp(`\\b(${programmingKeywords.join('|')})\\b`, 'gi');
+      // console.log(regex)
+      const matches = parsedData.match(regex);
+      // console.log(matches);
+      if (!matches) {
+        var replaceTags = (parsedData.replace(/(?:\r\n|\r|\n)/g, '<br>').replace(/\./g, '. '))
+        // console.log("not programming!")
+      } else {
+          replaceTags = (parsedData.replace(':',':<code>').replace('<?','&#60;?').replace('?>','?&#62;').replace(/\n/g, '<br>'))
+        // console.log("programming!")
+        //.replace('<?','&#60;' + '?').replace('?>','?'+'&#62;')
+      }
+      setChatLog([...chatLogNew, { user: "gpt", message: `${replaceTags}`} ])
+
+      // setChatLog([...chatLogNew, { user: "gpt", message: `<div>${parsedData}</div>`} ])
+      var scrollToTheBottomChatLog = document.getElementsByClassName("chat-log")[0];
+      scrollToTheBottomChatLog.scrollTop = scrollToTheBottomChatLog.scrollHeight;
+    } catch (error) {
+      const errorMsg = "We are currently experiencing heavy flow as of the moment, please try again.";
+      setChatLog([...chatLogNew, { user: "gpt", message: `<div class="errormsg">${errorMsg}</div>`} ])
+      // res.status(500).send(error || 'Something went wrong');
     }
     }
-    setChatLog([...chatLogNew, { user: "gpt", message: `${replaceTags}`} ])
-
-    // setChatLog([...chatLogNew, { user: "gpt", message: `<div>${parsedData}</div>`} ])
-    var scrollToTheBottomChatLog = document.getElementsByClassName("chat-log")[0];
-    scrollToTheBottomChatLog.scrollTop = scrollToTheBottomChatLog.scrollHeight;
   }
   }
 
 
   function handleTemp(temp) {
   function handleTemp(temp) {

@@ -2,6 +2,13 @@
   background-color: #101827 !important;
   background-color: #101827 !important;
 }
 }
 
 
+.errormsg {
+    border: 1px solid red;
+    padding: 15px 25px;
+    border-radius: 10px;
+    background: rgb(255 0 0 / 15%);
+}
+
 .side-menu-button {
 .side-menu-button {
   border:0 solid white;
   border:0 solid white;
     /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#cedbe9+0,aac5de+17,6199c7+50,3a84c3+51,419ad6+59,4bb8f0+71,3a8bc2+84,26558b+100;Blue+Gloss */
     /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#cedbe9+0,aac5de+17,6199c7+50,3a84c3+51,419ad6+59,4bb8f0+71,3a8bc2+84,26558b+100;Blue+Gloss */