Merge branch 'main' into dev/more_icons

Author: dasmy

.env.azure-example

@@ -1,6 +1,6 @@
 OPENAI_API_KEY=XXXX
 OPENAI_API_TYPE=azure
-OPENAI_BASE_URL=https://your-resource-name.openai.azure.com
+OPENAI_API_BASE=https://your-resource-name.openai.azure.com
 OPENAI_API_VERSION=2023-03-15-preview
 # OPENAI_EXTRA_HEADERS={"key": "value"}
 AZURE_OPENAI_DEPLOYMENTS=[{"displayName": "GPT-3.5", "name": "your-gpt-3.5-deployment"}, {"displayName": "GPT-4", "name": "your-gpt-4-deployment"}]

.env.example

@@ -1,6 +1,6 @@
 OPENAI_API_KEY=sk-XXXX
 OPENAI_API_TYPE=open_ai
-OPENAI_BASE_URL=https://api.openai.com/v1
+OPENAI_API_BASE=https://api.openai.com/v1
 OPENAI_API_VERSION=2023-03-15-preview
 # OPENAI_EXTRA_HEADERS={"key": "value"}
 OPENAI_MODELS=[{"displayName": "GPT-3.5", "name": "gpt-3.5-turbo"}, {"displayName": "GPT-4", "name": "gpt-4"}]

frontend/src/App.tsx

@@ -117,8 +117,6 @@ function App() {
         }),
       });
 
-      
-
       const data = await response.json();
       const code = data.code;
 
@@ -129,8 +127,12 @@ function App() {
         return;
       }
 
-      submitCode(code);
-      setWaitingForSystem(WaitingStates.RunningCode);
+      if (!!code) {
+        submitCode(code);
+        setWaitingForSystem(WaitingStates.RunningCode);
+      } else {
+        setWaitingForSystem(WaitingStates.Idle);
+      }
     } catch (error) {
       console.error(
         "There has been a problem with your fetch operation:",

frontend/src/components/Chat.tsx

@@ -46,10 +46,29 @@ function Message(props: {
             </div>
           ) : (
             isMarkdown(text) ? 
-            <ReactMarkdown
-            children={text}
-            remarkPlugins={[remarkGfm]}
-            /> :
+              <ReactMarkdown
+              children={text}
+              remarkPlugins={[remarkGfm]}
+              components={{
+                code({node, inline, className, children, style, ...props}) {
+                  const match = /language-(\w+)/.exec(className || '')
+                  return !inline ? (
+                    <SyntaxHighlighter
+                      {...props}
+                      children={String(children).replace(/\n$/, '')}
+                      wrapLongLines={true}
+                      language={match ? match[1] : "python"}
+                      PreTag="div"
+                    />
+                  ) : (
+                    <code {...props} className={className}>
+                      {children}
+                    </code>
+                  )
+                }
+              }}
+            />
+          :
             <div className="cell-output" dangerouslySetInnerHTML={{ __html: text }}></div>
           ))}
 

gpt_code_ui/webapp/main.py

@@ -171,14 +171,7 @@ def extract_code(text):
             if single_match:
                 return single_match.group(1).strip()
 
-    def extract_non_code(text):
-        # Replace triple backtick blocks
-        text = re.sub(r'```(?:\w+\n)?(.+?)```', '', text, flags=re.DOTALL)
-        # Replace single backtick blocks
-        text = re.sub(r'`(.+?)`', '', text, flags=re.DOTALL)
-        return text.strip()
-
-    return extract_code(content), extract_non_code(content), 200
+    return extract_code(content), content.strip(), 200
 
 # We know this Flask app is for local use. So we can disable the verbose Werkzeug logger
 log = logging.getLogger('werkzeug')