From 75250f3a5f798a433a616b4f2ff5f3c471e7159a Mon Sep 17 00:00:00 2001 From: Danny Avila <110412045+danny-avila@users.noreply.github.com> Date: Wed, 5 Jul 2023 09:18:45 -0400 Subject: [PATCH] Fix: Azure "user_provided" Frontend Credentials and Save Last Selected Bing Settings (#587) * fix(Messages.jsx): fix tag warning * fix(NewConversationMenu): update localStorage with lastBingSettings when endpoint is 'bingAI' fix(getDefaultConversation): retrieve lastBingSettings from localStorage and use it to set default values for jailbreak and toneStyle when endpoint is 'bingAI' feat(settings.spec.js): add test to check if the active class is set on the selected endpoint in the settings menu * fix(BingAIOptions): add data-testid to BingAIOptions SelectDropDown component fix(settings.spec.js): update test to include additional steps for testing settings persistence * fix(azure): support user_provided credentials from client --- api/server/routes/ask/openAI.js | 2 +- .../components/Input/BingAIOptions/index.jsx | 1 + .../Input/NewConversationMenu/index.jsx | 9 ++++ .../components/Input/SetTokenDialog/index.jsx | 20 ++++---- client/src/components/Messages/index.jsx | 4 +- client/src/utils/getDefaultConversation.js | 6 ++- e2e/specs/settings.spec.js | 49 +++++++++++++++++++ 7 files changed, 76 insertions(+), 15 deletions(-) create mode 100644 e2e/specs/settings.spec.js diff --git a/api/server/routes/ask/openAI.js b/api/server/routes/ask/openAI.js index ae597a7bb..e123f462f 100644 --- a/api/server/routes/ask/openAI.js +++ b/api/server/routes/ask/openAI.js @@ -141,7 +141,7 @@ const ask = async ({ text, endpointOption, parentMessageId = null, endpoint, con let oaiApiKey = req.body?.token ?? process.env.OPENAI_API_KEY; if (process.env.AZURE_API_KEY && endpoint === 'azureOpenAI') { - clientOptions.azure = getAzureCredentials(); + clientOptions.azure = JSON.parse(req.body?.token) ?? getAzureCredentials(); // clientOptions.reverseProxyUrl = process.env.AZURE_REVERSE_PROXY ?? genAzureChatCompletion({ ...clientOptions.azure }); oaiApiKey = clientOptions.azure.azureOpenAIApiKey; } diff --git a/client/src/components/Input/BingAIOptions/index.jsx b/client/src/components/Input/BingAIOptions/index.jsx index 3237e8ef8..e1944af8b 100644 --- a/client/src/components/Input/BingAIOptions/index.jsx +++ b/client/src/components/Input/BingAIOptions/index.jsx @@ -61,6 +61,7 @@ function BingAIOptions({ show }) { setOption('jailbreak')(value === 'Sydney')} availableValues={['BingAI', 'Sydney']} showAbove={true} diff --git a/client/src/components/Input/NewConversationMenu/index.jsx b/client/src/components/Input/NewConversationMenu/index.jsx index 3b3d64774..7e827d4c0 100644 --- a/client/src/components/Input/NewConversationMenu/index.jsx +++ b/client/src/components/Input/NewConversationMenu/index.jsx @@ -83,6 +83,15 @@ export default function NewConversationMenu() { ); localStorage.setItem('lastConversationSetup', JSON.stringify(conversation)); } + + if (endpoint === 'bingAI') { + const lastBingSettings = JSON.parse(localStorage.getItem('lastBingSettings')) || {}; + const { jailbreak, toneStyle } = conversation; + localStorage.setItem( + 'lastBingSettings', + JSON.stringify({ ...lastBingSettings, jailbreak, toneStyle }) + ); + } }, [conversation]); // set the current model diff --git a/client/src/components/Input/SetTokenDialog/index.jsx b/client/src/components/Input/SetTokenDialog/index.jsx index 8180cf604..16af40683 100644 --- a/client/src/components/Input/SetTokenDialog/index.jsx +++ b/client/src/components/Input/SetTokenDialog/index.jsx @@ -181,7 +181,7 @@ const SetTokenDialog = ({ open, onOpenChange, endpoint }) => { setToken(JSON.stringify(data)); }} /> - ) : endpoint === 'openAI' ? ( + ) : endpoint === 'openAI' || endpoint === 'azureOpenAI' ? ( <> {!showPanel ? ( <> @@ -196,29 +196,29 @@ const SetTokenDialog = ({ open, onOpenChange, endpoint }) => { <> setAzure('instanceName', e.target.value || '')} + value={getAzure('azureOpenAIApiInstanceName') || ''} + onChange={(e) => setAzure('azureOpenAIApiInstanceName', e.target.value || '')} label={'Azure OpenAI Instance Name'} /> setAzure('deploymentName', e.target.value || '')} + value={getAzure('azureOpenAIApiDeploymentName') || ''} + onChange={(e) => setAzure('azureOpenAIApiDeploymentName', e.target.value || '')} label={'Azure OpenAI Deployment Name'} /> setAzure('version', e.target.value || '')} + value={getAzure('azureOpenAIApiVersion') || ''} + onChange={(e) => setAzure('azureOpenAIApiVersion', e.target.value || '')} label={'Azure OpenAI API Version'} /> setAzure('apiKey', e.target.value || '')} + value={getAzure('azureOpenAIApiKey') || ''} + onChange={(e) => setAzure('azureOpenAIApiKey', e.target.value || '')} label={'Azure OpenAI API Key'} /> @@ -227,7 +227,7 @@ const SetTokenDialog = ({ open, onOpenChange, endpoint }) => { setShowPanel(!showPanel)} > diff --git a/client/src/components/Messages/index.jsx b/client/src/components/Messages/index.jsx index 365153dcd..97e3903de 100644 --- a/client/src/components/Messages/index.jsx +++ b/client/src/components/Messages/index.jsx @@ -89,9 +89,9 @@ export default function Messages({ isSearchView = false }) {
{_messagesTree === null ? ( - +
- +
) : _messagesTree?.length == 0 && isSearchView ? (
Nothing found diff --git a/client/src/utils/getDefaultConversation.js b/client/src/utils/getDefaultConversation.js index 90d9b3036..34badbf42 100644 --- a/client/src/utils/getDefaultConversation.js +++ b/client/src/utils/getDefaultConversation.js @@ -6,6 +6,7 @@ const buildDefaultConversation = ({ }) => { const lastSelectedModel = JSON.parse(localStorage.getItem('lastSelectedModel')) || {}; const lastSelectedTools = JSON.parse(localStorage.getItem('lastSelectedTools')) || []; + const lastBingSettings = JSON.parse(localStorage.getItem('lastBingSettings')) || []; if (endpoint === 'azureOpenAI' || endpoint === 'openAI') { conversation = { @@ -43,13 +44,14 @@ const buildDefaultConversation = ({ topK: lastConversationSetup?.topK ?? 40 }; } else if (endpoint === 'bingAI') { + const { jailbreak, toneStyle } = lastBingSettings; conversation = { ...conversation, endpoint, - jailbreak: lastConversationSetup?.jailbreak ?? false, + jailbreak: lastConversationSetup?.jailbreak ?? jailbreak ?? false, context: lastConversationSetup?.context ?? null, systemMessage: lastConversationSetup?.systemMessage ?? null, - toneStyle: lastConversationSetup?.toneStyle ?? 'creative', + toneStyle: lastConversationSetup?.toneStyle ?? toneStyle ?? 'creative', jailbreakConversationId: lastConversationSetup?.jailbreakConversationId ?? null, conversationSignature: null, clientId: null, diff --git a/e2e/specs/settings.spec.js b/e2e/specs/settings.spec.js new file mode 100644 index 000000000..a2c7b1f55 --- /dev/null +++ b/e2e/specs/settings.spec.js @@ -0,0 +1,49 @@ +import { expect, test } from '@playwright/test'; + +test.describe('Settings suite', () => { + test('Last Bing settings', async ({ page }) => { + await page.goto('http://localhost:3080/'); + const newTopicButton = await page.getByRole('button', { name: 'New Topic' }); + await newTopicButton.click(); + + // includes the icon + endpoint names in obj property + const endpointItem = await page.getByRole('menuitemradio', { name: 'BingAI Bing' }) + await endpointItem.click(); + + await page.getByTestId('text-input').click(); + const button1 = await page.getByRole('button', { name: 'Mode: BingAI' }); + const button2 = await page.getByRole('button', { name: 'Mode: Sydney' }); + + try { + await button1.click({ timeout: 100}); + } catch (e) { + // console.log('Bing button', e); + } + + try { + await button2.click({ timeout: 100}); + } catch (e) { + // console.log('Sydney button', e); + } + await page.getByRole('option', { name: 'Sydney' }).click(); + await page.getByRole('tab', { name: 'Balanced' }).click(); + + // Change Endpoint to see if settings will persist + await newTopicButton.click(); + await page.getByRole('menuitemradio', { name: 'ChatGPT OpenAI' }).click(); + + // Close endpoint menu & re-select BingAI + await page.getByTestId('text-input').click(); + await newTopicButton.click(); + await endpointItem.click(); + + // Check if the settings persisted + const localStorage = await page.evaluate(() => window.localStorage); + const lastBingSettings = JSON.parse(localStorage.lastBingSettings); + const { jailbreak, toneStyle } = lastBingSettings; + expect(jailbreak).toBeTruthy(); + expect(toneStyle).toEqual('balanced'); + const button = await page.getByRole('button', { name: 'Mode: Sydney' }); + expect((button).count()).toBeTruthy(); + }); +});