manage generate and browse histories on the client side

Author: adesousa_microsoft

frontend/src/pages/chat/Chat.tsx

@@ -101,9 +101,15 @@ const Chat = ({ type = ChatType.Browse }: Props) => {
 
   useEffect(() => {
     console.log('Route changed, refresh the contents');
-    refreshContent();
+
+    if (type === ChatType.Browse) {
+      appStateContext?.dispatch({ type: 'UPDATE_CURRENT_CHAT', payload: appStateContext?.state.browseChat });
+    } else {
+      appStateContext?.dispatch({ type: 'UPDATE_CURRENT_CHAT', payload: appStateContext?.state.generateChat });
+    }
   }, [location]);
 
+
   useEffect(() => {
     if (
       appStateContext?.state.isCosmosDBAvailable?.status !== CosmosDBStatus.Working &&
@@ -697,6 +703,13 @@ const Chat = ({ type = ChatType.Browse }: Props) => {
     } else {
       setMessages([])
     }
+
+    if (type === ChatType.Browse) {
+      appStateContext?.dispatch({ type: 'UPDATE_BROWSE_CHAT', payload: appStateContext?.state.currentChat });
+    } else {
+      appStateContext?.dispatch({ type: 'UPDATE_GENERATE_CHAT', payload: appStateContext?.state.currentChat })
+    }
+
   }, [appStateContext?.state.currentChat])
 
   useLayoutEffect(() => {

frontend/src/state/AppProvider.tsx

@@ -24,6 +24,8 @@ export interface AppState {
   chatHistory: Conversation[] | null
   filteredChatHistory: Conversation[] | null
   currentChat: Conversation | null
+  browseChat: Conversation | null
+  generateChat: Conversation | null
   frontendSettings: FrontendSettings | null
   feedbackState: { [answerId: string]: Feedback.Neutral | Feedback.Positive | Feedback.Negative }
   draftedDocument: DraftedDocument | null
@@ -56,6 +58,8 @@ const initialState: AppState = {
   chatHistory: null,
   filteredChatHistory: null,
   currentChat: null,
+  browseChat: null,
+  generateChat: null,
   isCosmosDBAvailable: {
     cosmosDB: false,
     status: CosmosDBStatus.NotConfigured

frontend/src/state/AppReducer.tsx

@@ -95,6 +95,10 @@ export const appStateReducer = (state: AppState, action: Action): AppState => {
         }
     case 'UPDATE_DRAFTED_DOCUMENT':
       return { ...state, draftedDocument: action.payload }
+    case 'UPDATE_BROWSE_CHAT':
+      return { ...state, browseChat: action.payload }
+    case 'UPDATE_GENERATE_CHAT':
+      return { ...state, generateChat: action.payload }
     default:
       return state
   }