diff --git a/src/components/chat-history/ChatHistoryView.scss b/src/components/chat-history/ChatHistoryView.scss index f18f91b5d..73acbc5f5 100644 --- a/src/components/chat-history/ChatHistoryView.scss +++ b/src/components/chat-history/ChatHistoryView.scss @@ -2,3 +2,7 @@ width: $chat-history-width; height: $chat-history-height; } + +.cursor-pointer { + cursor: pointer; +} diff --git a/src/components/chat-history/ChatHistoryView.tsx b/src/components/chat-history/ChatHistoryView.tsx index 64892aabb..21d0632a1 100644 --- a/src/components/chat-history/ChatHistoryView.tsx +++ b/src/components/chat-history/ChatHistoryView.tsx @@ -1,16 +1,18 @@ +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { ILinkEventTracker } from '@nitrots/nitro-renderer'; import { FC, useEffect, useMemo, useState } from 'react'; -import { AddEventLinkTracker, ChatEntryType, LocalizeText, RemoveLinkEventTracker } from '../../api'; +import { AddEventLinkTracker, ChatEntryType, GetSessionDataManager, GetUserProfile, LocalizeText, RemoveLinkEventTracker, ReportType } from '../../api'; import { Flex, InfiniteScroll, NitroCardContentView, NitroCardHeaderView, NitroCardView, Text } from '../../common'; -import { useChatHistory } from '../../hooks'; +import { useChatHistory, useHelp } from '../../hooks'; export const ChatHistoryView: FC<{}> = props => { const [ isVisible, setIsVisible ] = useState(false); const [ searchText, setSearchText ] = useState(''); - const { chatHistory = [] } = useChatHistory(); + const { chatHistory = [], setMessengerHistory = null } = useChatHistory(); + const { report = null } = useHelp(); - const filteredChatHistory = useMemo(() => + const filteredChatHistory = useMemo(() => { if (searchText.length === 0) return chatHistory; @@ -19,6 +21,20 @@ export const ChatHistoryView: FC<{}> = props => return chatHistory.filter(entry => ((entry.message && entry.message.toLowerCase().includes(text))) || (entry.name && entry.name.toLowerCase().includes(text))); }, [ chatHistory, searchText ]); + const reportMessage = (message: any) => + { + setMessengerHistory(prevValue => + { + const newValue = [ ...prevValue ]; + + newValue.push({ id: message.id, webId: message.webId, entityId: message.entityId, name: '', message: message.message, roomId: message.roomId, timestamp: message.timestamp, type: ChatEntryType.TYPE_IM }); + + return newValue; + }); + + report(ReportType.IM, { reportedUserId: message.webId }); + } + /* useEffect(() => { if(elementRef && elementRef.current && isVisible) elementRef.current.scrollTop = elementRef.current.scrollHeight; @@ -30,9 +46,9 @@ export const ChatHistoryView: FC<{}> = props => linkReceived: (url: string) => { const parts = url.split('/'); - + if(parts.length < 2) return; - + switch(parts[1]) { case 'show': @@ -66,12 +82,15 @@ export const ChatHistoryView: FC<{}> = props => return ( { row.timestamp } + { (row.type === ChatEntryType.TYPE_CHAT && GetSessionDataManager().userId !== row.webId ) && + reportMessage(row) } /> + } { (row.type === ChatEntryType.TYPE_CHAT) &&
{ (row.style === 0) &&
}
-
+
GetUserProfile(row.webId) }> { row.imageUrl && (row.imageUrl.length > 0) &&
}
diff --git a/src/hooks/chat-history/useChatHistory.ts b/src/hooks/chat-history/useChatHistory.ts index a2f3c3464..ec7df0e18 100644 --- a/src/hooks/chat-history/useChatHistory.ts +++ b/src/hooks/chat-history/useChatHistory.ts @@ -97,8 +97,8 @@ const useChatHistoryState = () => addMessengerEntry({ id: -1, webId: parser.senderId, entityId: -1, name: '', message: parser.messageText, roomId: -1, timestamp: MessengerHistoryCurrentDate(), type: ChatEntryType.TYPE_IM }); }); - - return { addChatEntry, chatHistory, roomHistory, messengerHistory }; + + return { addChatEntry, chatHistory, roomHistory, messengerHistory, setMessengerHistory }; } export const useChatHistory = () => useBetween(useChatHistoryState);