Fix issue #11 - Report user guide

src/components/guide-tool/views/GuideToolOngoingView.tsx

@@ -1,8 +1,8 @@
 import { GuideSessionGetRequesterRoomMessageComposer, GuideSessionInviteRequesterMessageComposer, GuideSessionMessageMessageComposer, GuideSessionRequesterRoomMessageEvent, GuideSessionResolvedMessageComposer } from '@nitrots/nitro-renderer';
 import { FC, KeyboardEvent, useCallback, useEffect, useRef, useState } from 'react';
-import { GetSessionDataManager, GuideToolMessageGroup, LocalizeText, SendMessageComposer, TryVisitRoom } from '../../../api';
+import { GetSessionDataManager, GuideToolMessageGroup, LocalizeText, ReportType, SendMessageComposer, TryVisitRoom } from '../../../api';
 import { Base, Button, ButtonGroup, Column, Flex, LayoutAvatarImageView, Text } from '../../../common';
-import { useMessageEvent } from '../../../hooks';
+import { useHelp, useMessageEvent } from '../../../hooks';
 
 interface GuideToolOngoingViewProps
 {
@@ -21,6 +21,7 @@ export const GuideToolOngoingView: FC<GuideToolOngoingViewProps> = props =>
     const { isGuide = false, userId = 0, userName = null, userFigure = null, isTyping = false, messageGroups = [] } = props;
 
     const [ messageText, setMessageText ] = useState<string>('');
+    const { report = null } = useHelp();
 
     useEffect(() =>
     {
@@ -83,7 +84,7 @@ export const GuideToolOngoingView: FC<GuideToolOngoingViewProps> = props =>
                         <Text bold>{ userName }</Text>
                         <Text>{ LocalizeText('guide.help.request.user.ongoing.guide.desc') }</Text>
                     </Column> }
-                <Button variant="danger" disabled>{ LocalizeText('guide.help.common.report.link') }</Button>
+                <Button variant="danger" disabled={ messageGroups.length === 0 } onClick={ () => report(ReportType.GUIDE, { reportedUserId: userId }) }>{ LocalizeText('guide.help.common.report.link') }</Button>
             </Flex>
             <Column overflow="hidden" gap={ 1 } className="bg-muted rounded chat-messages p-2">
                 <Column overflow="auto">

src/components/guide-tool/views/GuideToolUserFeedbackView.tsx

@@ -16,13 +16,15 @@ export const GuideToolUserFeedbackView: FC<GuideToolUserFeedbackViewProps> = pro
 
     return (
         <Column>
-            <Flex justifyContent="between" gap={ 1 } className="bg-muted p-2 rounded">
-                <Column gap={ 0 }>
-                    <Text bold>{ userName }</Text>
-                    <Text>{ LocalizeText('guide.help.request.user.feedback.guide.desc') }</Text>
-                </Column>
-                <Button variant="danger" disabled>{ LocalizeText('guide.help.common.report.link') }</Button>
-            </Flex>
+            { userName && (userName.length > 0) &&
+                <Flex justifyContent="between" gap={ 1 } className="bg-muted p-2 rounded">
+                    <Column gap={ 0 }>
+                        <Text bold>{ userName }</Text>
+                        <Text>{ LocalizeText('guide.help.request.user.feedback.guide.desc') }</Text>
+                    </Column>
+                    <Button variant="danger" disabled>{ LocalizeText('guide.help.common.report.link') }</Button>
+                </Flex>
+            }
             <Column gap={ 1 }>
                 <Text bold>{ LocalizeText('guide.help.request.user.feedback.closed.title') }</Text>
                 <Text>{ LocalizeText('guide.help.request.user.feedback.closed.desc') }</Text>

src/components/help/views/ReportSummaryView.tsx

@@ -1,4 +1,4 @@
-import { CallForHelpFromForumMessageMessageComposer, CallForHelpFromForumThreadMessageComposer, CallForHelpFromIMMessageComposer, CallForHelpFromPhotoMessageComposer, CallForHelpMessageComposer } from '@nitrots/nitro-renderer';
+import { CallForHelpFromForumMessageMessageComposer, CallForHelpFromForumThreadMessageComposer, CallForHelpFromIMMessageComposer, CallForHelpFromPhotoMessageComposer, CallForHelpMessageComposer, GuideSessionReportMessageComposer } from '@nitrots/nitro-renderer';
 import { FC } from 'react';
 import { GetSessionDataManager, LocalizeText, ReportType, SendMessageComposer } from '../../../api';
 import { Button, Column, Text } from '../../../common';
@@ -38,6 +38,9 @@ export const ReportSummaryView: FC<{}> = props =>
             case ReportType.PHOTO:
                 SendMessageComposer(new CallForHelpFromPhotoMessageComposer(activeReport.extraData, activeReport.cfhTopic, activeReport.roomId, GetSessionDataManager().userId, activeReport.roomObjectId));
                 break;
+            case ReportType.GUIDE:
+                SendMessageComposer(new GuideSessionReportMessageComposer(''));
+                break;
         }
 
         setActiveReport(null);

src/hooks/chat-history/useChatHistory.ts

@@ -97,7 +97,7 @@ 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 };
 }
 

src/hooks/help/useHelp.ts

@@ -57,6 +57,8 @@ const useHelpState = () =>
             case ReportType.PHOTO:
                 break;
             case ReportType.GUIDE:
+                newReport.reportedUserId = options.reportedUserId;
+                newReport.currentStep = ReportState.REPORT_SUMMARY;
                 break;
         }