Skip to content

Commit dc761f3

Browse files
fetch history on button click and not on web page load
1 parent 63ff6fb commit dc761f3

File tree

4 files changed

+59
-42
lines changed

4 files changed

+59
-42
lines changed

frontend/src/components/ChatHistory/ChatHistoryPanel.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,7 @@ export function ChatHistoryPanel(_props: ChatHistoryPanelProps) {
7373
const handleHistoryClick = () => {
7474
appStateContext?.dispatch({ type: 'TOGGLE_CHAT_HISTORY' })
7575
}
76-
76+
7777
const onShowContextualMenu = React.useCallback((ev: React.MouseEvent<HTMLElement>) => {
7878
ev.preventDefault() // don't navigate
7979
setShowContextualMenu(true)

frontend/src/pages/chat/Chat.tsx

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -422,6 +422,9 @@ const Chat = ({ type = ChatType.Browse }: Props) => {
422422
let conversation
423423
if (conversationId) {
424424
conversation = appStateContext?.state?.chatHistory?.find(conv => conv.id === conversationId)
425+
if(!conversation){
426+
conversation = appStateContext?.state?.currentChat
427+
}
425428
if (!conversation) {
426429
console.error('Conversation not found.')
427430
setIsLoading(false)
@@ -460,6 +463,9 @@ const Chat = ({ type = ChatType.Browse }: Props) => {
460463
let resultConversation
461464
if (conversationId) {
462465
resultConversation = appStateContext?.state?.chatHistory?.find(conv => conv.id === conversationId)
466+
if(!resultConversation){
467+
resultConversation = appStateContext?.state?.currentChat
468+
}
463469
if (!resultConversation) {
464470
console.error('Conversation not found.')
465471
setIsLoading(false)
@@ -530,6 +536,9 @@ const Chat = ({ type = ChatType.Browse }: Props) => {
530536
let resultConversation
531537
if (conversationId) {
532538
resultConversation = appStateContext?.state?.chatHistory?.find(conv => conv.id === conversationId)
539+
if(!resultConversation){
540+
resultConversation = appStateContext?.state?.currentChat
541+
}
533542
if (!resultConversation) {
534543
console.error('Conversation not found.')
535544
setIsLoading(false)
@@ -585,6 +594,9 @@ const Chat = ({ type = ChatType.Browse }: Props) => {
585594
let resultConversation
586595
if (conversationId) {
587596
resultConversation = appStateContext?.state?.chatHistory?.find(conv => conv.id === conversationId)
597+
if(!resultConversation){
598+
resultConversation = appStateContext?.state?.currentChat
599+
}
588600
if (!resultConversation) {
589601
console.error('Conversation not found.')
590602
setIsLoading(false)

frontend/src/pages/layout/Layout.tsx

Lines changed: 44 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { Link, Outlet, useLocation } from 'react-router-dom'
33
import { Dialog, Stack, TextField } from '@fluentui/react'
44
import { CopyRegular } from '@fluentui/react-icons'
55

6-
import { CosmosDBStatus } from '../../api'
6+
import { CosmosDBStatus, Conversation, historyList, ChatHistoryLoadingState } from '../../api'
77
import Contoso from '../../assets/Contoso.svg'
88
import { HistoryButton, ShareButton } from '../../components/common/Button'
99
import { AppStateContext } from '../../state/AppProvider'
@@ -39,6 +39,49 @@ const Layout = () => {
3939

4040
const handleHistoryClick = () => {
4141
appStateContext?.dispatch({ type: 'TOGGLE_CHAT_HISTORY' })
42+
43+
// Fetch chat history if it's not already loaded
44+
if(!appStateContext?.state.chatHistory) {
45+
appStateContext?.dispatch({ type: 'UPDATE_CHAT_HISTORY_LOADING_STATE', payload: ChatHistoryLoadingState.Loading })
46+
fetchChatHistory()
47+
.then(res => {
48+
if (res) {
49+
appStateContext?.dispatch({ type: 'UPDATE_CHAT_HISTORY_LOADING_STATE', payload: ChatHistoryLoadingState.Success })
50+
} else {
51+
appStateContext?.dispatch({ type: 'UPDATE_CHAT_HISTORY_LOADING_STATE', payload: ChatHistoryLoadingState.Fail })
52+
appStateContext?.dispatch({
53+
type: 'SET_COSMOSDB_STATUS',
54+
payload: { cosmosDB: false, status: CosmosDBStatus.NotWorking }
55+
})
56+
}
57+
})
58+
.catch(_err => {
59+
appStateContext?.dispatch({ type: 'UPDATE_CHAT_HISTORY_LOADING_STATE', payload: ChatHistoryLoadingState.Fail })
60+
appStateContext?.dispatch({
61+
type: 'SET_COSMOSDB_STATUS',
62+
payload: { cosmosDB: false, status: CosmosDBStatus.NotWorking }
63+
})
64+
})
65+
}
66+
}
67+
68+
const fetchChatHistory = async (offset = 0): Promise<Conversation[] | null> => {
69+
const result = await historyList(offset)
70+
.then(response => {
71+
if (response) {
72+
appStateContext?.dispatch({ type: 'FETCH_CHAT_HISTORY', payload: response })
73+
} else {
74+
appStateContext?.dispatch({ type: 'FETCH_CHAT_HISTORY', payload: null })
75+
}
76+
return response
77+
})
78+
.catch(_err => {
79+
appStateContext?.dispatch({ type: 'UPDATE_CHAT_HISTORY_LOADING_STATE', payload: ChatHistoryLoadingState.Fail })
80+
appStateContext?.dispatch({ type: 'FETCH_CHAT_HISTORY', payload: null })
81+
console.error('There was an issue fetching your data.')
82+
return null
83+
})
84+
return result
4285
}
4386

4487
useEffect(() => {

frontend/src/state/AppProvider.tsx

Lines changed: 2 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -103,51 +103,13 @@ export const AppStateProvider: React.FC<AppStateProviderProps> = ({ children })
103103
const [state, dispatch] = useReducer(appStateReducer, initialState)
104104

105105
useEffect(() => {
106-
// Check for cosmosdb config and fetch initial data here
107-
const fetchChatHistory = async (offset = 0): Promise<Conversation[] | null> => {
108-
const result = await historyList(offset)
109-
.then(response => {
110-
if (response) {
111-
dispatch({ type: 'FETCH_CHAT_HISTORY', payload: response })
112-
} else {
113-
dispatch({ type: 'FETCH_CHAT_HISTORY', payload: null })
114-
}
115-
return response
116-
})
117-
.catch(_err => {
118-
dispatch({ type: 'UPDATE_CHAT_HISTORY_LOADING_STATE', payload: ChatHistoryLoadingState.Fail })
119-
dispatch({ type: 'FETCH_CHAT_HISTORY', payload: null })
120-
console.error('There was an issue fetching your data.')
121-
return null
122-
})
123-
return result
124-
}
125-
126106
const getHistoryEnsure = async () => {
127107
dispatch({ type: 'UPDATE_CHAT_HISTORY_LOADING_STATE', payload: ChatHistoryLoadingState.Loading })
128108
historyEnsure()
129109
.then(response => {
130110
if (response?.cosmosDB) {
131-
fetchChatHistory()
132-
.then(res => {
133-
if (res) {
134-
dispatch({ type: 'UPDATE_CHAT_HISTORY_LOADING_STATE', payload: ChatHistoryLoadingState.Success })
135-
dispatch({ type: 'SET_COSMOSDB_STATUS', payload: response })
136-
} else {
137-
dispatch({ type: 'UPDATE_CHAT_HISTORY_LOADING_STATE', payload: ChatHistoryLoadingState.Fail })
138-
dispatch({
139-
type: 'SET_COSMOSDB_STATUS',
140-
payload: { cosmosDB: false, status: CosmosDBStatus.NotWorking }
141-
})
142-
}
143-
})
144-
.catch(_err => {
145-
dispatch({ type: 'UPDATE_CHAT_HISTORY_LOADING_STATE', payload: ChatHistoryLoadingState.Fail })
146-
dispatch({
147-
type: 'SET_COSMOSDB_STATUS',
148-
payload: { cosmosDB: false, status: CosmosDBStatus.NotWorking }
149-
})
150-
})
111+
dispatch({ type: 'SET_COSMOSDB_STATUS', payload: response })
112+
dispatch({ type: 'UPDATE_CHAT_HISTORY_LOADING_STATE', payload: ChatHistoryLoadingState.Success })
151113
} else {
152114
dispatch({ type: 'UPDATE_CHAT_HISTORY_LOADING_STATE', payload: ChatHistoryLoadingState.Fail })
153115
dispatch({ type: 'SET_COSMOSDB_STATUS', payload: response })

0 commit comments

Comments
 (0)