From d2494e6b3b7cd4c57a89524b444ce8f55a4dee69 Mon Sep 17 00:00:00 2001
From: Danny Avila <messagedaniel@protonmail.com>
Date: Sat, 10 Feb 2024 13:13:38 -0500
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=8C=20fix:=20Minor=20Plugins=20Improve?=
 =?UTF-8?q?ments=20(#1766)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix(PluginsClient): don't invoke `getFunctionModelName` when using Azure OpenAI

* fix: plugins styling fix with new cursor

* ci(PluginsClient): test azure exception for getFunctionModelName
---
 api/app/clients/PluginsClient.js              |  2 +-
 api/app/clients/specs/PluginsClient.test.js   | 36 +++++++++++++++++--
 .../Chat/Messages/Content/Markdown.tsx        |  8 ++++-
 .../Chat/Messages/Content/MessageContent.tsx  |  2 +-
 .../components/Messages/Content/Plugin.tsx    |  2 +-
 client/src/style.css                          |  2 +-
 6 files changed, 45 insertions(+), 7 deletions(-)

diff --git a/api/app/clients/PluginsClient.js b/api/app/clients/PluginsClient.js
index 6118c3547a1..ab04dd133eb 100644
--- a/api/app/clients/PluginsClient.js
+++ b/api/app/clients/PluginsClient.js
@@ -30,7 +30,7 @@ class PluginsClient extends OpenAIClient {
 
     super.setOptions(options);
 
-    if (this.functionsAgent && this.agentOptions.model && !this.useOpenRouter) {
+    if (this.functionsAgent && this.agentOptions.model && !this.useOpenRouter && !this.azure) {
       this.agentOptions.model = this.getFunctionModelName(this.agentOptions.model);
     }
 
diff --git a/api/app/clients/specs/PluginsClient.test.js b/api/app/clients/specs/PluginsClient.test.js
index b4e42b1fc51..9a4663934fc 100644
--- a/api/app/clients/specs/PluginsClient.test.js
+++ b/api/app/clients/specs/PluginsClient.test.js
@@ -2,8 +2,8 @@ const { HumanChatMessage, AIChatMessage } = require('langchain/schema');
 const PluginsClient = require('../PluginsClient');
 const crypto = require('crypto');
 
-jest.mock('../../../lib/db/connectDb');
-jest.mock('../../../models/Conversation', () => {
+jest.mock('~/lib/db/connectDb');
+jest.mock('~/models/Conversation', () => {
   return function () {
     return {
       save: jest.fn(),
@@ -12,6 +12,12 @@ jest.mock('../../../models/Conversation', () => {
   };
 });
 
+const defaultAzureOptions = {
+  azureOpenAIApiInstanceName: 'your-instance-name',
+  azureOpenAIApiDeploymentName: 'your-deployment-name',
+  azureOpenAIApiVersion: '2020-07-01-preview',
+};
+
 describe('PluginsClient', () => {
   let TestAgent;
   let options = {
@@ -187,4 +193,30 @@ describe('PluginsClient', () => {
       expect(client.getFunctionModelName('')).toBe('gpt-3.5-turbo');
     });
   });
+  describe('Azure OpenAI tests specific to Plugins', () => {
+    // TODO: add more tests for Azure OpenAI integration with Plugins
+    // let client;
+    // beforeEach(() => {
+    //   client = new PluginsClient('dummy_api_key');
+    // });
+
+    test('should not call getFunctionModelName when azure options are set', () => {
+      const spy = jest.spyOn(PluginsClient.prototype, 'getFunctionModelName');
+      const model = 'gpt-4-turbo';
+
+      // note, without the azure change in PR #1766, `getFunctionModelName` is called twice
+      const testClient = new PluginsClient('dummy_api_key', {
+        agentOptions: {
+          model,
+          agent: 'functions',
+        },
+        azure: defaultAzureOptions,
+      });
+
+      expect(spy).not.toHaveBeenCalled();
+      expect(testClient.agentOptions.model).toBe(model);
+
+      spy.mockRestore();
+    });
+  });
 });
diff --git a/client/src/components/Chat/Messages/Content/Markdown.tsx b/client/src/components/Chat/Messages/Content/Markdown.tsx
index e1d0268b5d7..8761e2f8c2d 100644
--- a/client/src/components/Chat/Messages/Content/Markdown.tsx
+++ b/client/src/components/Chat/Messages/Content/Markdown.tsx
@@ -72,7 +72,13 @@ const Markdown = memo(({ content, message, showCursor }: TContentProps) => {
 
   if (isInitializing) {
     rehypePlugins.pop();
-    return <span className="result-thinking" />;
+    return (
+      <div className="absolute">
+        <p className="relative">
+          <span className="result-thinking" />
+        </p>
+      </div>
+    );
   }
 
   let isValidIframe: string | boolean | null = false;
diff --git a/client/src/components/Chat/Messages/Content/MessageContent.tsx b/client/src/components/Chat/Messages/Content/MessageContent.tsx
index 2415259aeac..b47fa0c140c 100644
--- a/client/src/components/Chat/Messages/Content/MessageContent.tsx
+++ b/client/src/components/Chat/Messages/Content/MessageContent.tsx
@@ -127,7 +127,7 @@ const MessageContent = ({
           {showText ? (
             <DisplayMessage
               key={`display-${messageId}-${idx}`}
-              showCursor={isLastIndex && isLast}
+              showCursor={isLastIndex && isLast && isSubmitting}
               text={currentText}
               {...props}
             />
diff --git a/client/src/components/Messages/Content/Plugin.tsx b/client/src/components/Messages/Content/Plugin.tsx
index ed78c97175d..86e6b79bfe8 100644
--- a/client/src/components/Messages/Content/Plugin.tsx
+++ b/client/src/components/Messages/Content/Plugin.tsx
@@ -86,7 +86,7 @@ const Plugin: React.FC<PluginProps> = ({ plugin }) => {
               <div
                 className={cn(
                   plugin.loading ? 'bg-green-100' : 'bg-gray-20',
-                  'flex items-center rounded p-3 text-xs text-gray-900',
+                  'my-1 flex items-center rounded p-3 text-xs text-gray-900',
                 )}
               >
                 <div>
diff --git a/client/src/style.css b/client/src/style.css
index 30e55895078..4f8fcfd49a7 100644
--- a/client/src/style.css
+++ b/client/src/style.css
@@ -1815,7 +1815,7 @@ html {
   display:block;
   height:12px;
   position:absolute;
-  top:32px;
+  top:-11px;
   -webkit-transform:translateZ(0);
   transform:translateZ(0);
   -webkit-transform-origin:center;