Merge branch 'development' into release-0.1

Author: Aliaksei Vavilau

.env.development

@@ -3,6 +3,9 @@ OPENAI_API_HOST=""
 OPENAI_API_KEY=""
 OPENAI_API_VERSION="2023-03-15-preview"
 
+# App Settings
+APP_BASE_PATH=""
+
 # AUTH
 AUTH_DISABLED="false"
 
@@ -83,4 +86,7 @@ AZURE_FUNCTIONS_API_HOST=""
 REPORT_ISSUE_CODE=""
 
 ## Request API Key code
-REQUEST_API_KEY_CODE=""
+REQUEST_API_KEY_CODE=""
+
+## Warning regarding code generation
+CODE_GENERATION_WARNING="Full responsibility for code correctness, security and licensing lies solely with the user, not with DIAL platform or LLM vendor."

README.md

@@ -1,8 +1,8 @@
 # DIAL Chat
 
-This is a default UI for [AI DIAL](https://epam-rail.com). AI DIAL can be used as headless system, but UI is recommended to learn the capability. 
+This is a default UI for [AI DIAL](https://epam-rail.com). AI DIAL can be used as headless system, but UI is recommended to learn the capability.
 
-Originally forked from [chatbot-ui](https://github.com/mckaywrigley/chatbot-ui) and then completely reworked and published under [apache 2.0 license](./LICENSE), while code taken from original repository is still subject to [original MIT license](./license-original). Due to rework we introduced lots of new features such as varios IDP support, model side-by-side compare, [DIAL extensions](https://epam-rail.com/extension-framework) support, conversation replays, branding and many more. 
+Originally forked from [chatbot-ui](https://github.com/mckaywrigley/chatbot-ui) and then completely reworked and published under [apache 2.0 license](./LICENSE), while code taken from original repository is still subject to [original MIT license](./license-original). Due to rework we introduced lots of new features such as varios IDP support, model side-by-side compare, [DIAL extensions](https://epam-rail.com/extension-framework) support, conversation replays, branding and many more.
 
 ![ai-dial-chat](./docs/ai-dial-chat.png)
 
@@ -107,6 +107,7 @@ This project leverages environment variables for configuration:
 | OPENAI_API_HOST                   | OpenAI API Host                                                                                                                      |                                                                                                                                                                                                                                  | true     |
 | OPENAI_API_KEY                    | OpenAI API Key                                                                                                                       |                                                                                                                                                                                                                                  | true     |
 | OPENAI_API_VERSION                | OpenAI API Version                                                                                                                   | 2023-03-15-preview                                                                                                                                                                                                               | true     |
+| APP_BASE_PATH                     | Application base path                                                                                                                |                                                                                                                                                                                                                                  |          |
 | ALLOWED_IFRAME_ORIGINS            | Allowed iFrame Origins                                                                                                               |                                                                                                                                                                                                                                  |          |
 | IS_IFRAME                         | Is iFrame                                                                                                                            | false                                                                                                                                                                                                                            |          |
 | ENABLED_FEATURES                  | Enabled Features                                                                                                                     | conversations-section,prompts-section,top-settings,top-clear-conversation,top-chat-info,top-chat-model-settings,empty-chat-settings,header,footer,request-api-key,report-an-issue,likes                                          |          |
@@ -127,6 +128,7 @@ This project leverages environment variables for configuration:
 | AZURE_FUNCTIONS_API_HOST          | Azure Functions API Host                                                                                                             |                                                                                                                                                                                                                                  |          |
 | REPORT_ISSUE_CODE                 | Report Issue Code                                                                                                                    |                                                                                                                                                                                                                                  |          |
 | REQUEST_API_KEY_CODE              | Request API Key Code                                                                                                                 |                                                                                                                                                                                                                                  |          |
+| CODE_GENERATION_WARNING           | Warning text regarding code generation                                                                                               | Full responsibility for code correctness, security and licensing lies solely with the user, not with DIAL platform or LLM vendor.                                                                                                |          |
 
 The .env file contains environment variables that can be used to configure your app's settings and behavior. These values can be changed as needed to suit your specific requirements.
 

e2e/src/core/fixtures.ts

@@ -1,4 +1,3 @@
-import { LocalStorageManager } from '../core/localStorageManager ';
 import { DialHomePage } from '../ui/pages';
 import { LoginPage } from '../ui/pages';
 import {
@@ -15,13 +14,15 @@ import {
 } from '../ui/webElements';
 import { ChatBar } from '../ui/webElements';
 import { PromptBar } from '../ui/webElements';
+import { LocalStorageManager } from './localStorageManager';
 
 import { ConversationData } from '@/e2e/src/testData';
 import { ApiHelper } from '@/e2e/src/testData/api/apiHelper';
 import { PromptData } from '@/e2e/src/testData/prompts/promptData';
 import { Addons } from '@/e2e/src/ui/webElements/addons';
 import { AddonsDialog } from '@/e2e/src/ui/webElements/addonsDialog';
 import { ChatInfoTooltip } from '@/e2e/src/ui/webElements/chatInfoTooltip';
+import { Compare } from '@/e2e/src/ui/webElements/compare';
 import { ConfirmationDialog } from '@/e2e/src/ui/webElements/confirmationDialog';
 import { DropdownMenu } from '@/e2e/src/ui/webElements/dropdownMenu';
 import { EntitySettings } from '@/e2e/src/ui/webElements/entitySettings';
@@ -75,6 +76,12 @@ const test = base.extend<
     moreInfo: MoreInfo;
     apiHelper: ApiHelper;
     chatInfoTooltip: ChatInfoTooltip;
+    compare: Compare;
+    compareConversationSelector: ModelSelector;
+    rightConversationSettings: ConversationSettings;
+    leftConversationSettings: ConversationSettings;
+    rightChatHeader: ChatHeader;
+    leftChatHeader: ChatHeader;
   }
 >({
   // eslint-disable-next-line no-empty-pattern
@@ -204,8 +211,8 @@ const test = base.extend<
     const moreInfo = entitySettings.getMoreInfo();
     await use(moreInfo);
   },
-  chatHeader: async ({ page }, use) => {
-    const chatHeader = new ChatHeader(page);
+  chatHeader: async ({ chat }, use) => {
+    const chatHeader = chat.getChatHeader();
     await use(chatHeader);
   },
   // eslint-disable-next-line no-empty-pattern
@@ -230,6 +237,32 @@ const test = base.extend<
     const chatInfoTooltip = new ChatInfoTooltip(page);
     await use(chatInfoTooltip);
   },
+  compare: async ({ chat }, use) => {
+    const compare = chat.getCompare();
+    await use(compare);
+  },
+  compareConversationSelector: async ({ compare }, use) => {
+    const compareConversationSelector = compare
+      .getConversationToCompare()
+      .getConversationSelector();
+    await use(compareConversationSelector);
+  },
+  rightConversationSettings: async ({ compare }, use) => {
+    const rightConversationSettings = compare.getRightConversationSettings();
+    await use(rightConversationSettings);
+  },
+  leftConversationSettings: async ({ compare }, use) => {
+    const leftConversationSettings = compare.getLeftConversationSettings();
+    await use(leftConversationSettings);
+  },
+  rightChatHeader: async ({ compare }, use) => {
+    const rightChatHeader = compare.getRightChatHeader();
+    await use(rightChatHeader);
+  },
+  leftChatHeader: async ({ compare }, use) => {
+    const leftChatHeader = compare.getLeftChatHeader();
+    await use(leftChatHeader);
+  },
 });
 
 export default test;

e2e/src/core/localStorageManager.ts

@@ -0,0 +1,76 @@
+import { Conversation } from '@/src/types/chat';
+import { FolderInterface } from '@/src/types/folder';
+import { Prompt } from '@/src/types/prompt';
+
+import { Page } from '@playwright/test';
+
+export class LocalStorageManager {
+  private page: Page;
+
+  constructor(page: Page) {
+    this.page = page;
+  }
+
+  setFoldersKey = () => (folders: string) => {
+    window.localStorage.setItem('folders', folders);
+  };
+
+  setConversationHistoryKey = () => (history: string) => {
+    window.localStorage.setItem('conversationHistory', history);
+  };
+
+  setPromptsKey = () => (prompt: string) => {
+    window.localStorage.setItem('prompts', prompt);
+  };
+
+  setSelectedConversationKey = () => (selected: string) => {
+    window.localStorage.setItem('selectedConversationIds', selected);
+  };
+
+  async setConversationHistory(...conversation: Conversation[]) {
+    await this.page.addInitScript(
+      this.setConversationHistoryKey(),
+      JSON.stringify(conversation),
+    );
+  }
+
+  async updateConversationHistory(...conversation: Conversation[]) {
+    await this.page.evaluate(
+      this.setConversationHistoryKey(),
+      JSON.stringify(conversation),
+    );
+  }
+
+  async setSelectedConversation(...conversation: Conversation[]) {
+    await this.page.addInitScript(
+      this.setSelectedConversationKey(),
+      JSON.stringify(conversation.map((c) => c.id)),
+    );
+  }
+
+  async updateSelectedConversation(...conversation: Conversation[]) {
+    await this.page.evaluate(
+      this.setSelectedConversationKey(),
+      JSON.stringify(conversation.map((c) => c.id)),
+    );
+  }
+
+  async setFolders(...folders: FolderInterface[]) {
+    await this.page.addInitScript(
+      this.setFoldersKey(),
+      JSON.stringify(folders),
+    );
+  }
+
+  async updateFolders(...folders: FolderInterface[]) {
+    await this.page.evaluate(this.setFoldersKey(), JSON.stringify(folders));
+  }
+
+  async setPrompts(...prompt: Prompt[]) {
+    await this.page.addInitScript(this.setPromptsKey(), JSON.stringify(prompt));
+  }
+
+  async updatePrompts(...prompt: Prompt[]) {
+    await this.page.evaluate(this.setPromptsKey(), JSON.stringify(prompt));
+  }
+}

e2e/src/testData/api/apiHelper.ts

@@ -1,5 +1,6 @@
 import { OpenAIEntityAddon, OpenAIEntityModel } from '@/src/types/openai';
 
+import { API } from '@/e2e/src/testData';
 import { APIRequestContext } from '@playwright/test';
 
 export class ApiHelper {
@@ -12,38 +13,43 @@ export class ApiHelper {
 
   public async getModelNames() {
     const allEntities = await this.getModels();
-    return allEntities.filter((e) => e.type === 'model').map((m) => m.name);
+    return allEntities.map((m) => m.name);
   }
 
   public async getEntity(entity: OpenAIEntityModel) {
-    const allEntities = await this.getModels();
+    const allEntities = await this.getModelEntities();
     return allEntities.find((e) => e.id === entity.id);
   }
 
   public async getApplicationNames() {
-    const allEntities = await this.getModels();
+    const allEntities = await this.getModelEntities();
     return allEntities
       .filter((e) => e.type === 'application')
       .map((app) => app.name);
   }
 
-  public async getAddonNameById(addonId: string) {
+  public async getAddonById(addonId: string) {
     const allEntities = await this.getAddons();
     return allEntities.find((e) => e.type === 'addon' && e.id === addonId);
   }
 
   public async getAssistant(assistant: string) {
-    const allEntities = await this.getModels();
+    const allEntities = await this.getModelEntities();
     return allEntities.find(
       (e) => e.type === 'assistant' && e.name === assistant,
     );
   }
 
   public async getApplication(app: string) {
-    const allEntities = await this.getModels();
+    const allEntities = await this.getModelEntities();
     return allEntities.find((e) => e.type === 'application' && e.name === app);
   }
 
+  public async getModel(model: string) {
+    const allEntities = await this.getModels();
+    return allEntities.find((e) => e.name === model);
+  }
+
   public async getApplicationDescription(app: string) {
     const application = await this.getApplication(app);
     const description = application!.description;
@@ -86,7 +92,7 @@ export class ApiHelper {
   }
 
   public async getEntitySelectedAddons(entity: string) {
-    const allEntities = await this.getModels();
+    const allEntities = await this.getModelEntities();
     const entityObject = allEntities.find((e) => e.name === entity);
     const selectedAddons: string[] = [];
     const entityAddonObjects = entityObject!.selectedAddons;
@@ -100,7 +106,12 @@ export class ApiHelper {
   }
 
   public async getModels() {
-    const response = await this.request.get('/api/models', {
+    const modelEntities = await this.getModelEntities();
+    return modelEntities.filter((e) => e.type === 'model');
+  }
+
+  public async getModelEntities() {
+    const response = await this.request.get(API.modelsHost, {
       failOnStatusCode: true,
       timeout: ApiHelper.requestTimeout,
     });
@@ -109,7 +120,7 @@ export class ApiHelper {
   }
 
   public async getAddons() {
-    const response = await this.request.get('/api/addons', {
+    const response = await this.request.get(API.addonsHost, {
       failOnStatusCode: true,
       timeout: ApiHelper.requestTimeout,
     });