From 2fa7519dbd74e73643e978244d32fe5ba3757199 Mon Sep 17 00:00:00 2001
From: Peter Marsh <pmarsh@scottlogic.com>
Date: Fri, 22 Mar 2024 11:31:30 +0000
Subject: [PATCH] makes frontend use thie resultingChatInfoMessage

---
 .../components/ControlPanel/ControlPanel.tsx  |  5 ++++-
 .../src/components/MainComponent/MainBody.tsx |  1 +
 frontend/src/components/ModelBox/ModelBox.tsx |  6 ++++--
 .../ModelBox/ModelConfiguration.tsx           | 21 +++++++++++--------
 4 files changed, 21 insertions(+), 12 deletions(-)

diff --git a/frontend/src/components/ControlPanel/ControlPanel.tsx b/frontend/src/components/ControlPanel/ControlPanel.tsx
index 9719bcd25..3d14f3b37 100644
--- a/frontend/src/components/ControlPanel/ControlPanel.tsx
+++ b/frontend/src/components/ControlPanel/ControlPanel.tsx
@@ -2,7 +2,7 @@ import { DEFENCES_HIDDEN_LEVEL3_IDS, MODEL_DEFENCES } from '@src/Defences';
 import DefenceBox from '@src/components/DefenceBox/DefenceBox';
 import DocumentViewButton from '@src/components/DocumentViewer/DocumentViewButton';
 import ModelBox from '@src/components/ModelBox/ModelBox';
-import { ChatModel } from '@src/models/chat';
+import { ChatMessage, ChatModel } from '@src/models/chat';
 import {
 	DEFENCE_ID,
 	DefenceConfigItem,
@@ -24,6 +24,7 @@ function ControlPanel({
 	setDefenceConfiguration,
 	openDocumentViewer,
 	addInfoMessage,
+	addChatMessage,
 }: {
 	currentLevel: LEVEL_NAMES;
 	defences: Defence[];
@@ -41,6 +42,7 @@ function ControlPanel({
 	) => Promise<boolean>;
 	openDocumentViewer: () => void;
 	addInfoMessage: (message: string) => void;
+	addChatMessage: (chatMessage: ChatMessage) => void;
 }) {
 	const configurableDefences =
 		currentLevel === LEVEL_NAMES.SANDBOX
@@ -103,6 +105,7 @@ function ControlPanel({
 								setChatModelId={setChatModelId}
 								chatModelOptions={chatModelOptions}
 								addInfoMessage={addInfoMessage}
+								addChatMessage={addChatMessage}
 							/>
 						)}
 					</details>
diff --git a/frontend/src/components/MainComponent/MainBody.tsx b/frontend/src/components/MainComponent/MainBody.tsx
index 70e937bc0..ae6066231 100644
--- a/frontend/src/components/MainComponent/MainBody.tsx
+++ b/frontend/src/components/MainComponent/MainBody.tsx
@@ -71,6 +71,7 @@ function MainBody({
 					setDefenceConfiguration={setDefenceConfiguration}
 					openDocumentViewer={openDocumentViewer}
 					addInfoMessage={addInfoMessage}
+					addChatMessage={addChatMessage}
 				/>
 			</div>
 			<div className="centre-area">
diff --git a/frontend/src/components/ModelBox/ModelBox.tsx b/frontend/src/components/ModelBox/ModelBox.tsx
index 09f66ba43..97ffba269 100644
--- a/frontend/src/components/ModelBox/ModelBox.tsx
+++ b/frontend/src/components/ModelBox/ModelBox.tsx
@@ -1,4 +1,4 @@
-import { ChatModel } from '@src/models/chat';
+import { ChatMessage, ChatModel } from '@src/models/chat';
 
 import ModelConfiguration from './ModelConfiguration';
 import ModelSelection from './ModelSelection';
@@ -10,11 +10,13 @@ function ModelBox({
 	setChatModelId,
 	chatModelOptions,
 	addInfoMessage,
+	addChatMessage,
 }: {
 	chatModel?: ChatModel;
 	setChatModelId: (modelId: string) => void;
 	chatModelOptions: string[];
 	addInfoMessage: (message: string) => void;
+	addChatMessage: (chatMessage: ChatMessage) => void;
 }) {
 	return (
 		<div className="model-box">
@@ -26,7 +28,7 @@ function ModelBox({
 			/>
 			<ModelConfiguration
 				chatModel={chatModel}
-				addInfoMessage={addInfoMessage}
+				addChatMessage={addChatMessage}
 			/>
 		</div>
 	);
diff --git a/frontend/src/components/ModelBox/ModelConfiguration.tsx b/frontend/src/components/ModelBox/ModelConfiguration.tsx
index e3ba14237..99642b577 100644
--- a/frontend/src/components/ModelBox/ModelConfiguration.tsx
+++ b/frontend/src/components/ModelBox/ModelConfiguration.tsx
@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react';
 
 import {
+	ChatMessage,
 	ChatModel,
 	CustomChatModelConfiguration,
 	MODEL_CONFIG_ID,
@@ -48,10 +49,10 @@ const DEFAULT_CONFIGS: CustomChatModelConfiguration[] = [
 
 function ModelConfiguration({
 	chatModel,
-	addInfoMessage,
+	addChatMessage,
 }: {
 	chatModel?: ChatModel;
-	addInfoMessage: (message: string) => void;
+	addChatMessage: (chatMessage: ChatMessage) => void;
 }) {
 	const [customChatModelConfigs, setCustomChatModel] =
 		useState<CustomChatModelConfiguration[]>(DEFAULT_CONFIGS);
@@ -77,13 +78,15 @@ function ModelConfiguration({
 
 		setCustomChatModelByID(id, newValue);
 
-		void chatService.configureGptModel(id, newValue).then((success) => {
-			if (success) {
-				addInfoMessage(`changed ${id} to ${newValue}`);
-			} else {
-				setCustomChatModelByID(id, prevValue);
-			}
-		});
+		void chatService
+			.configureGptModel(id, newValue)
+			.then((resultingChatInfoMessage) => {
+				if (resultingChatInfoMessage) {
+					addChatMessage(resultingChatInfoMessage);
+				} else {
+					setCustomChatModelByID(id, prevValue);
+				}
+			});
 	}
 
 	useEffect(() => {