nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2024-11-22 22:30:52 +01:00
Code Issues Packages Projects Releases Wiki Activity

Fix issue #11 - Report user photos

Browse Source
This commit is contained in:
oobjectt 2022-12-08 16:07:20 +01:00
parent b479210aca
commit eb0c8a48ec
5 changed files with 70 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/common/card/NitroCardHeaderView.tsx
View File

@ -5,13 +5,15 @@ import { Base, Column, ColumnProps, Flex } from '..';
interface NitroCardHeaderViewProps extends ColumnProps
{
headerText: string;
isGalleryPhoto?: boolean;
noCloseButton?: boolean;
onReportPhoto?: (event: MouseEvent) => void;
onCloseClick: (event: MouseEvent) => void;
}
export const NitroCardHeaderView: FC<NitroCardHeaderViewProps> = props =>
{
const { headerText = null, noCloseButton = false, onCloseClick = null, justifyContent = 'center', alignItems = 'center', classNames = [], children = null, ...rest } = props;
const { headerText = null, isGalleryPhoto = false, noCloseButton = false, onReportPhoto = null, onCloseClick = null, justifyContent = 'center', alignItems = 'center', classNames = [], children = null, ...rest } = props;
const getClassNames = useMemo(() =>
{
@ -32,6 +34,11 @@ export const NitroCardHeaderView: FC<NitroCardHeaderViewProps> = props =>
<Column center position="relative" classNames={ getClassNames } { ...rest }>
<Flex fullWidth center>
<span className="nitro-card-header-text">{ headerText }</span>
{ isGalleryPhoto &&
<Base position="absolute" className="end-4 nitro-card-header-report-camera" onClick={ onReportPhoto }>
<FontAwesomeIcon icon="flag" />
</Base>
}
<Base position="absolute" className="end-2 nitro-card-header-close" onMouseDownCapture={ onMouseDown } onClick={ onCloseClick }>
<FontAwesomeIcon icon="times" />
</Base>

56
src/common/card/NitroCardView.scss
View File

@ -36,11 +36,34 @@ $nitro-card-tabs-height: 33px;
rgba(194, 48, 39, 1) 50%,
rgba(194, 48, 39, 1) 100%
);
&:hover {
filter: brightness(1.2);
}
&:active {
filter: brightness(0.8);
}
}
.nitro-card-header-report-camera {
cursor: pointer;
padding: 1px 3px;
line-height: 1;
border-radius: $border-radius;
box-shadow: 0 0 0 1.6px $white;
border: 2px solid #921911;
background: repeating-linear-gradient(
rgba(245, 80, 65, 1),
rgba(245, 80, 65, 1) 50%,
rgba(194, 48, 39, 1) 50%,
rgba(194, 48, 39, 1) 100%
);
&:hover {
filter: brightness(1.2);
}
&:active {
filter: brightness(0.8);
}
@ -101,7 +124,7 @@ $nitro-card-tabs-height: 33px;
width: 100%;
margin: 0;
padding-top:2px;
&:before {
position: absolute;
content: " ";
@ -137,7 +160,32 @@ $nitro-card-tabs-height: 33px;
&:hover {
filter: brightness(1.2);
}
&:active {
filter: brightness(0.8);
}
}
.nitro-card-header-report-camera {
cursor: pointer;
padding: 0px 2px;
margin-right: 4px;
line-height: 1;
@include font-size($h7-font-size);
border-radius: $border-radius;
box-shadow: 0 0 0 1.6px $white;
border: 2px solid #921911;
background: repeating-linear-gradient(
rgba(245, 80, 65, 1),
rgba(245, 80, 65, 1) 50%,
rgba(194, 48, 39, 1) 50%,
rgba(194, 48, 39, 1) 100%
);
&:hover {
filter: brightness(1.2);
}
&:active {
filter: brightness(0.8);
}

10
src/components/help/views/ReportSummaryView.tsx
View File

@ -1,6 +1,6 @@
import { CallForHelpFromForumMessageMessageComposer, CallForHelpFromForumThreadMessageComposer, CallForHelpFromIMMessageComposer, CallForHelpFromPhotoMessageComposer, CallForHelpMessageComposer } from '@nitrots/nitro-renderer';
import { CallForHelpFromForumMessageMessageComposer, CallForHelpFromForumThreadMessageComposer, CallForHelpFromIMMessageComposer, CallForHelpMessageComposer } from '@nitrots/nitro-renderer';
import { FC } from 'react';
import { GetSessionDataManager, LocalizeText, ReportType, SendMessageComposer } from '../../../api';
import { LocalizeText, ReportType, SendMessageComposer } from '../../../api';
import { Button, Column, Text } from '../../../common';
import { useHelp } from '../../../hooks';
@ -16,7 +16,8 @@ export const ReportSummaryView: FC<{}> = props =>
{
case ReportType.BULLY:
case ReportType.EMERGENCY:
case ReportType.ROOM: {
case ReportType.ROOM:
case ReportType.PHOTO: {
const reportedRoomId = ((activeReport.roomId <= 0) ? activeReport.reportedChats[0].roomId : activeReport.roomId);
activeReport.reportedChats.forEach(entry => chats.push(entry.webId, entry.message));
@ -35,9 +36,6 @@ export const ReportSummaryView: FC<{}> = props =>
case ReportType.MESSAGE:
SendMessageComposer(new CallForHelpFromForumMessageMessageComposer(activeReport.groupId, activeReport.threadId, activeReport.messageId, activeReport.cfhTopic, activeReport.message));
break;
case ReportType.PHOTO:
SendMessageComposer(new CallForHelpFromPhotoMessageComposer(activeReport.extraData, activeReport.cfhTopic, activeReport.roomId, GetSessionDataManager().userId, activeReport.roomObjectId));
break;
}
setActiveReport(null);

7
src/components/room/widgets/furniture/FurnitureExternalImageView.tsx
View File

@ -1,17 +1,20 @@
import { GetSessionDataManager, ReportType } from 'api';
import { FC } from 'react';
import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../common';
import { useFurnitureExternalImageWidget } from '../../../../hooks';
import { useFurnitureExternalImageWidget, useHelp, useNavigator } from '../../../../hooks';
import { CameraWidgetShowPhotoView } from '../../../camera/views/CameraWidgetShowPhotoView';
export const FurnitureExternalImageView: FC<{}> = props =>
{
const { objectId = -1, currentPhotoIndex = -1, currentPhotos = null, onClose = null } = useFurnitureExternalImageWidget();
const { navigatorData = null } = useNavigator();
const { report = null } = useHelp();
if((objectId === -1) || (currentPhotoIndex === -1)) return null;
return (
<NitroCardView className="nitro-external-image-widget" theme="primary-slim">
<NitroCardHeaderView headerText="" onCloseClick={ onClose } />
<NitroCardHeaderView headerText="" isGalleryPhoto={ true } onReportPhoto={ () => report(ReportType.PHOTO, { reportedUserId: GetSessionDataManager().userId, roomId: navigatorData.enteredGuestRoom.roomId, roomName: navigatorData.enteredGuestRoom.roomName }) } onCloseClick={ onClose } />
<NitroCardContentView>
<CameraWidgetShowPhotoView currentIndex={ currentPhotoIndex } currentPhotos={ currentPhotos } />
</NitroCardContentView>

3
src/hooks/help/useHelp.ts
View File

@ -39,6 +39,7 @@ const useHelpState = () =>
newReport.currentStep = ReportState.SELECT_CHATS;
break;
case ReportType.ROOM:
case ReportType.PHOTO:
newReport.roomId = options.roomId;
newReport.roomName = options.roomName;
newReport.currentStep = ReportState.SELECT_TOPICS;
@ -54,8 +55,6 @@ const useHelpState = () =>
newReport.messageId = options.messageId;
newReport.currentStep = ReportState.SELECT_TOPICS;
break;
case ReportType.PHOTO:
break;
case ReportType.GUIDE:
break;
}