Filter by feedback type in view messages dialog (#2869)

* Update get chat messages and stats filter to work with feedback type filter

* Add feedback type filter to view messages dialog

* Fix issues with feedback type filter
This commit is contained in:
Ilango
2024-07-26 20:17:58 +05:30
committed by GitHub
parent 1c730323e2
commit e5018d2743
6 changed files with 175 additions and 18 deletions
@@ -1,5 +1,5 @@
import { Request, Response, NextFunction } from 'express'
import { chatType, IReactFlowObject } from '../../Interface'
import { ChatMessageRatingType, chatType, IReactFlowObject } from '../../Interface'
import chatflowsService from '../../services/chatflows'
import chatMessagesService from '../../services/chat-messages'
import { clearSessionMemory } from '../../utils'
@@ -49,6 +49,26 @@ const getAllChatMessages = async (req: Request, res: Response, next: NextFunctio
const startDate = req.query?.startDate as string | undefined
const endDate = req.query?.endDate as string | undefined
const feedback = req.query?.feedback as boolean | undefined
let feedbackTypeFilters = req.query?.feedbackType as ChatMessageRatingType[] | undefined
if (feedbackTypeFilters) {
try {
const feedbackTypeFilterArray = JSON.parse(JSON.stringify(feedbackTypeFilters))
if (
feedbackTypeFilterArray.includes(ChatMessageRatingType.THUMBS_UP) &&
feedbackTypeFilterArray.includes(ChatMessageRatingType.THUMBS_DOWN)
) {
feedbackTypeFilters = [ChatMessageRatingType.THUMBS_UP, ChatMessageRatingType.THUMBS_DOWN]
} else if (feedbackTypeFilterArray.includes(ChatMessageRatingType.THUMBS_UP)) {
feedbackTypeFilters = [ChatMessageRatingType.THUMBS_UP]
} else if (feedbackTypeFilterArray.includes(ChatMessageRatingType.THUMBS_DOWN)) {
feedbackTypeFilters = [ChatMessageRatingType.THUMBS_DOWN]
} else {
feedbackTypeFilters = undefined
}
} catch (e) {
return res.status(500).send(e)
}
}
if (typeof req.params === 'undefined' || !req.params.id) {
throw new InternalFlowiseError(
StatusCodes.PRECONDITION_FAILED,
@@ -65,7 +85,8 @@ const getAllChatMessages = async (req: Request, res: Response, next: NextFunctio
startDate,
endDate,
messageId,
feedback
feedback,
feedbackTypeFilters
)
return res.json(apiResponse)
} catch (error) {
+30 -2
View File
@@ -1,7 +1,7 @@
import { StatusCodes } from 'http-status-codes'
import { Request, Response, NextFunction } from 'express'
import statsService from '../../services/stats'
import { chatType } from '../../Interface'
import { ChatMessageRatingType, chatType } from '../../Interface'
import { InternalFlowiseError } from '../../errors/internalFlowiseError'
import { getErrorMessage } from '../../errors/utils'
@@ -14,6 +14,7 @@ const getChatflowStats = async (req: Request, res: Response, next: NextFunction)
let chatTypeFilter = req.query?.chatType as chatType | undefined
const startDate = req.query?.startDate as string | undefined
const endDate = req.query?.endDate as string | undefined
let feedbackTypeFilters = req.query?.feedbackType as ChatMessageRatingType[] | undefined
if (chatTypeFilter) {
try {
const chatTypeFilterArray = JSON.parse(chatTypeFilter)
@@ -31,7 +32,34 @@ const getChatflowStats = async (req: Request, res: Response, next: NextFunction)
)
}
}
const apiResponse = await statsService.getChatflowStats(chatflowid, chatTypeFilter, startDate, endDate, '', true)
if (feedbackTypeFilters) {
try {
const feedbackTypeFilterArray = JSON.parse(JSON.stringify(feedbackTypeFilters))
if (
feedbackTypeFilterArray.includes(ChatMessageRatingType.THUMBS_UP) &&
feedbackTypeFilterArray.includes(ChatMessageRatingType.THUMBS_DOWN)
) {
feedbackTypeFilters = [ChatMessageRatingType.THUMBS_UP, ChatMessageRatingType.THUMBS_DOWN]
} else if (feedbackTypeFilterArray.includes(ChatMessageRatingType.THUMBS_UP)) {
feedbackTypeFilters = [ChatMessageRatingType.THUMBS_UP]
} else if (feedbackTypeFilterArray.includes(ChatMessageRatingType.THUMBS_DOWN)) {
feedbackTypeFilters = [ChatMessageRatingType.THUMBS_DOWN]
} else {
feedbackTypeFilters = undefined
}
} catch (e) {
return res.status(500).send(e)
}
}
const apiResponse = await statsService.getChatflowStats(
chatflowid,
chatTypeFilter,
startDate,
endDate,
'',
true,
feedbackTypeFilters
)
return res.json(apiResponse)
} catch (error) {
next(error)
@@ -1,6 +1,6 @@
import { DeleteResult, FindOptionsWhere } from 'typeorm'
import { StatusCodes } from 'http-status-codes'
import { chatType, IChatMessage } from '../../Interface'
import { ChatMessageRatingType, chatType, IChatMessage } from '../../Interface'
import { utilGetChatMessage } from '../../utils/getChatMessage'
import { utilAddChatMessage } from '../../utils/addChatMesage'
import { getRunningExpressApp } from '../../utils/getRunningExpressApp'
@@ -35,7 +35,8 @@ const getAllChatMessages = async (
startDate?: string,
endDate?: string,
messageId?: string,
feedback?: boolean
feedback?: boolean,
feedbackTypes?: ChatMessageRatingType[]
): Promise<ChatMessage[]> => {
try {
const dbResponse = await utilGetChatMessage(
@@ -48,7 +49,8 @@ const getAllChatMessages = async (
startDate,
endDate,
messageId,
feedback
feedback,
feedbackTypes
)
return dbResponse
} catch (error) {
@@ -70,7 +72,8 @@ const getAllInternalChatMessages = async (
startDate?: string,
endDate?: string,
messageId?: string,
feedback?: boolean
feedback?: boolean,
feedbackTypes?: ChatMessageRatingType[]
): Promise<ChatMessage[]> => {
try {
const dbResponse = await utilGetChatMessage(
@@ -83,7 +86,8 @@ const getAllInternalChatMessages = async (
startDate,
endDate,
messageId,
feedback
feedback,
feedbackTypes
)
return dbResponse
} catch (error) {
+5 -3
View File
@@ -1,5 +1,5 @@
import { StatusCodes } from 'http-status-codes'
import { chatType } from '../../Interface'
import { ChatMessageRatingType, chatType } from '../../Interface'
import { ChatMessage } from '../../database/entities/ChatMessage'
import { utilGetChatMessage } from '../../utils/getChatMessage'
import { ChatMessageFeedback } from '../../database/entities/ChatMessageFeedback'
@@ -13,7 +13,8 @@ const getChatflowStats = async (
startDate?: string,
endDate?: string,
messageId?: string,
feedback?: boolean
feedback?: boolean,
feedbackTypes?: ChatMessageRatingType[]
): Promise<any> => {
try {
const chatmessages = (await utilGetChatMessage(
@@ -26,7 +27,8 @@ const getChatflowStats = async (
startDate,
endDate,
messageId,
feedback
feedback,
feedbackTypes
)) as Array<ChatMessage & { feedback?: ChatMessageFeedback }>
const totalMessages = chatmessages.length
const totalFeedback = chatmessages.filter((message) => message?.feedback).length
+22 -3
View File
@@ -1,8 +1,9 @@
import { MoreThanOrEqual, LessThanOrEqual } from 'typeorm'
import { chatType } from '../Interface'
import { ChatMessageRatingType, chatType } from '../Interface'
import { ChatMessage } from '../database/entities/ChatMessage'
import { ChatMessageFeedback } from '../database/entities/ChatMessageFeedback'
import { getRunningExpressApp } from '../utils/getRunningExpressApp'
/**
* Method that get chat messages.
* @param {string} chatflowid
@@ -14,6 +15,7 @@ import { getRunningExpressApp } from '../utils/getRunningExpressApp'
* @param {string} startDate
* @param {string} endDate
* @param {boolean} feedback
* @param {ChatMessageRatingType[]} feedbackTypes
*/
export const utilGetChatMessage = async (
chatflowid: string,
@@ -25,7 +27,8 @@ export const utilGetChatMessage = async (
startDate?: string,
endDate?: string,
messageId?: string,
feedback?: boolean
feedback?: boolean,
feedbackTypes?: ChatMessageRatingType[]
): Promise<ChatMessage[]> => {
const appServer = getRunningExpressApp()
const setDateToStartOrEndOfDay = (dateTimeStr: string, setHours: 'start' | 'end') => {
@@ -79,7 +82,23 @@ export const utilGetChatMessage = async (
// sort
query.orderBy('chat_message.createdDate', sortOrder === 'DESC' ? 'DESC' : 'ASC')
const messages = await query.getMany()
const messages = (await query.getMany()) as Array<ChatMessage & { feedback: ChatMessageFeedback }>
if (feedbackTypes && feedbackTypes.length > 0) {
// just applying a filter to the messages array will only return the messages that have feedback,
// but we also want the message before the feedback message which is the user message.
const indicesToKeep = new Set()
messages.forEach((message, index) => {
if (message.role === 'apiMessage' && message.feedback && feedbackTypes.includes(message.feedback.rating)) {
if (index > 0) indicesToKeep.add(index - 1)
indicesToKeep.add(index)
}
})
return messages.filter((_, index) => indicesToKeep.has(index))
}
return messages
}
@@ -103,6 +103,7 @@ const ViewMessagesDialog = ({ show, dialogProps, onCancel }) => {
const [sourceDialogOpen, setSourceDialogOpen] = useState(false)
const [sourceDialogProps, setSourceDialogProps] = useState({})
const [chatTypeFilter, setChatTypeFilter] = useState([])
const [feedbackTypeFilter, setFeedbackTypeFilter] = useState([])
const [startDate, setStartDate] = useState(new Date().setMonth(new Date().getMonth() - 1))
const [endDate, setEndDate] = useState(new Date())
const [leadEmail, setLeadEmail] = useState('')
@@ -155,6 +156,24 @@ const ViewMessagesDialog = ({ show, dialogProps, onCancel }) => {
})
}
const onFeedbackTypeSelected = (feedbackTypes) => {
setFeedbackTypeFilter(feedbackTypes)
getChatmessageApi.request(dialogProps.chatflow.id, {
chatType: chatTypeFilter.length ? chatTypeFilter : undefined,
feedbackType: feedbackTypes.length ? feedbackTypes : undefined,
startDate: startDate,
endDate: endDate,
order: 'ASC'
})
getStatsApi.request(dialogProps.chatflow.id, {
chatType: chatTypeFilter.length ? chatTypeFilter : undefined,
feedbackType: feedbackTypes.length ? feedbackTypes : undefined,
startDate: startDate,
endDate: endDate
})
}
const exportMessages = async () => {
if (!storagePath && getStoragePathFromServer.data) {
storagePath = getStoragePathFromServer.data.storagePath
@@ -382,8 +401,15 @@ const ViewMessagesDialog = ({ show, dialogProps, onCancel }) => {
const handleItemClick = (idx, chatmsg) => {
setSelectedMessageIndex(idx)
if (feedbackTypeFilter.length > 0) {
getChatmessageFromPKApi.request(dialogProps.chatflow.id, {
...transformChatPKToParams(getChatPK(chatmsg)),
feedbackType: feedbackTypeFilter
})
} else {
getChatmessageFromPKApi.request(dialogProps.chatflow.id, transformChatPKToParams(getChatPK(chatmsg)))
}
}
const onURLClick = (data) => {
window.open(data, '_blank')
@@ -436,7 +462,16 @@ const ViewMessagesDialog = ({ show, dialogProps, onCancel }) => {
setAllChatLogs(getChatmessageApi.data)
const chatPK = processChatLogs(getChatmessageApi.data)
setSelectedMessageIndex(0)
if (chatPK) getChatmessageFromPKApi.request(dialogProps.chatflow.id, transformChatPKToParams(chatPK))
if (chatPK) {
if (feedbackTypeFilter.length > 0) {
getChatmessageFromPKApi.request(dialogProps.chatflow.id, {
...transformChatPKToParams(chatPK),
feedbackType: feedbackTypeFilter
})
} else {
getChatmessageFromPKApi.request(dialogProps.chatflow.id, transformChatPKToParams(chatPK))
}
}
}
// eslint-disable-next-line react-hooks/exhaustive-deps
@@ -459,6 +494,7 @@ const ViewMessagesDialog = ({ show, dialogProps, onCancel }) => {
setAllChatLogs([])
setChatMessages([])
setChatTypeFilter([])
setFeedbackTypeFilter([])
setSelectedMessageIndex(0)
setSelectedChatId('')
setStartDate(new Date().setMonth(new Date().getMonth() - 1))
@@ -476,6 +512,17 @@ const ViewMessagesDialog = ({ show, dialogProps, onCancel }) => {
return () => dispatch({ type: HIDE_CANVAS_DIALOG })
}, [show, dispatch])
useEffect(() => {
if (dialogProps.chatflow) {
// when the filter is cleared fetch all messages
if (feedbackTypeFilter.length === 0) {
getChatmessageApi.request(dialogProps.chatflow.id)
getStatsApi.request(dialogProps.chatflow.id)
}
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [feedbackTypeFilter])
const component = show ? (
<Dialog
onClose={onCancel}
@@ -530,7 +577,15 @@ const ViewMessagesDialog = ({ show, dialogProps, onCancel }) => {
customInput={<DatePickerCustomInput />}
/>
</div>
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', minWidth: '200px', marginRight: 10 }}>
<div
style={{
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
minWidth: '200px',
marginRight: 10
}}
>
<b style={{ marginRight: 10 }}>Source</b>
<MultiDropdown
key={JSON.stringify(chatTypeFilter)}
@@ -550,6 +605,34 @@ const ViewMessagesDialog = ({ show, dialogProps, onCancel }) => {
formControlSx={{ mt: 0 }}
/>
</div>
<div
style={{
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
minWidth: '200px',
marginRight: 10
}}
>
<b style={{ marginRight: 10 }}>Feedback</b>
<MultiDropdown
key={JSON.stringify(feedbackTypeFilter)}
name='chatType'
options={[
{
label: 'Positive',
name: 'THUMBS_UP'
},
{
label: 'Negative',
name: 'THUMBS_DOWN'
}
]}
onSelect={(newValue) => onFeedbackTypeSelected(newValue)}
value={feedbackTypeFilter}
formControlSx={{ mt: 0 }}
/>
</div>
<div style={{ flex: 1 }}></div>
</div>
<div