From 59dfb8d9b4d58918c2fa1d7ae0521c74e7580689 Mon Sep 17 00:00:00 2001 From: dank074 Date: Tue, 19 Oct 2021 21:48:43 -0500 Subject: [PATCH] added user room visits view --- src/views/mod-tools/ModToolsView.scss | 1 + src/views/mod-tools/ModToolsView.tsx | 19 +++++- .../mod-tools/reducers/ModToolsReducer.tsx | 10 +++ .../user/user-info/ModToolsUserView.scss | 2 +- .../views/user/user-info/ModToolsUserView.tsx | 17 ++++- .../ModToolsUserModActionView.tsx | 17 +++++ .../ModToolsUserModActionView.types.ts | 7 ++ .../ModToolsUserRoomVisitsView.scss | 14 ++++ .../ModToolsUserRoomVisitsView.tsx | 66 +++++++++++++++++++ .../ModToolsUserRoomVisitsView.types.ts | 5 ++ .../ModToolsSendUserMessage.types.ts | 7 ++ .../ModToolsSendUserMessageView.tsx | 37 +++++++++++ 12 files changed, 197 insertions(+), 5 deletions(-) create mode 100644 src/views/mod-tools/views/user/user-mod-action/ModToolsUserModActionView.tsx create mode 100644 src/views/mod-tools/views/user/user-mod-action/ModToolsUserModActionView.types.ts create mode 100644 src/views/mod-tools/views/user/user-room-visits/ModToolsUserRoomVisitsView.scss create mode 100644 src/views/mod-tools/views/user/user-room-visits/ModToolsUserRoomVisitsView.tsx create mode 100644 src/views/mod-tools/views/user/user-room-visits/ModToolsUserRoomVisitsView.types.ts create mode 100644 src/views/mod-tools/views/user/user-sendmessage/ModToolsSendUserMessage.types.ts create mode 100644 src/views/mod-tools/views/user/user-sendmessage/ModToolsSendUserMessageView.tsx diff --git a/src/views/mod-tools/ModToolsView.scss b/src/views/mod-tools/ModToolsView.scss index c340a20f..be84aaef 100644 --- a/src/views/mod-tools/ModToolsView.scss +++ b/src/views/mod-tools/ModToolsView.scss @@ -5,3 +5,4 @@ @import './views/room/room-tools/ModToolsRoomView'; @import './views/chatlog/ChatlogView'; @import './views/user/user-info/ModToolsUserView'; +@import './views/user/user-room-visits/ModToolsUserRoomVisitsView'; diff --git a/src/views/mod-tools/ModToolsView.tsx b/src/views/mod-tools/ModToolsView.tsx index 71964dc0..9df029de 100644 --- a/src/views/mod-tools/ModToolsView.tsx +++ b/src/views/mod-tools/ModToolsView.tsx @@ -1,4 +1,4 @@ -import { RoomEngineEvent, RoomEngineObjectEvent, RoomObjectCategory } from '@nitrots/nitro-renderer'; +import { ModeratorInitMessageEvent, RoomEngineEvent, RoomEngineObjectEvent, RoomObjectCategory } from '@nitrots/nitro-renderer'; import { FC, useCallback, useReducer, useState } from 'react'; import { GetRoomSession } from '../../api'; import { ModToolsEvent } from '../../events/mod-tools/ModToolsEvent'; @@ -6,6 +6,7 @@ import { ModToolsOpenRoomChatlogEvent } from '../../events/mod-tools/ModToolsOpe import { ModToolsOpenRoomInfoEvent } from '../../events/mod-tools/ModToolsOpenRoomInfoEvent'; import { ModToolsOpenUserChatlogEvent } from '../../events/mod-tools/ModToolsOpenUserChatlogEvent'; import { ModToolsOpenUserInfoEvent } from '../../events/mod-tools/ModToolsOpenUserInfoEvent'; +import { CreateMessageHook } from '../../hooks'; import { useRoomEngineEvent } from '../../hooks/events'; import { dispatchUiEvent, useUiEvent } from '../../hooks/events/ui/ui-event'; import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../layout'; @@ -154,6 +155,22 @@ export const ModToolsView: FC = props => useRoomEngineEvent(RoomEngineObjectEvent.SELECTED, onRoomEngineObjectEvent); + const onModeratorInitMessageEvent = useCallback((event: ModeratorInitMessageEvent) => + { + const parser = event.getParser(); + + if(!parser) return; + + dispatchModToolsState({ + type: ModToolsActions.SET_INIT_DATA, + payload: { + settings: parser.data + } + }); + }, []); + + CreateMessageHook(ModeratorInitMessageEvent, onModeratorInitMessageEvent); + const handleClick = useCallback((action: string, value?: string) => { if(!action) return; diff --git a/src/views/mod-tools/reducers/ModToolsReducer.tsx b/src/views/mod-tools/reducers/ModToolsReducer.tsx index 9301e941..c2c9df87 100644 --- a/src/views/mod-tools/reducers/ModToolsReducer.tsx +++ b/src/views/mod-tools/reducers/ModToolsReducer.tsx @@ -1,7 +1,9 @@ +import { ModeratorInitData } from '@nitrots/nitro-renderer'; import { Reducer } from 'react'; export interface IModToolsState { + settings: ModeratorInitData; currentRoomId: number; openRooms: number[]; openRoomChatlogs: number[]; @@ -13,6 +15,7 @@ export interface IModToolsAction { type: string; payload: { + settings?: ModeratorInitData; currentRoomId?: number; openRooms?: number[]; openRoomChatlogs?: number[]; @@ -23,6 +26,7 @@ export interface IModToolsAction export class ModToolsActions { + public static SET_INIT_DATA: string = 'MTA_SET_INIT_DATA'; public static SET_CURRENT_ROOM_ID: string = 'MTA_SET_CURRENT_ROOM_ID'; public static SET_OPEN_ROOMS: string = 'MTA_SET_OPEN_ROOMS'; public static SET_OPEN_USERINFO: string = 'MTA_SET_OPEN_USERINFO'; @@ -32,6 +36,7 @@ export class ModToolsActions } export const initialModTools: IModToolsState = { + settings: null, currentRoomId: null, openRooms: null, openRoomChatlogs: null, @@ -43,6 +48,11 @@ export const ModToolsReducer: Reducer = (state, { switch(action.type) { + case ModToolsActions.SET_INIT_DATA: { + const data = (action.payload.settings || state.settings || null); + + return { ...state, data }; + } case ModToolsActions.SET_CURRENT_ROOM_ID: { const currentRoomId = (action.payload.currentRoomId || state.currentRoomId || null); diff --git a/src/views/mod-tools/views/user/user-info/ModToolsUserView.scss b/src/views/mod-tools/views/user/user-info/ModToolsUserView.scss index 202b92fa..cb138384 100644 --- a/src/views/mod-tools/views/user/user-info/ModToolsUserView.scss +++ b/src/views/mod-tools/views/user/user-info/ModToolsUserView.scss @@ -1,6 +1,6 @@ .nitro-mod-tools-user { width: 350px; - height: 400px; + height: 370px; .username { color: #1E7295; diff --git a/src/views/mod-tools/views/user/user-info/ModToolsUserView.tsx b/src/views/mod-tools/views/user/user-info/ModToolsUserView.tsx index 762dcc3d..b056553b 100644 --- a/src/views/mod-tools/views/user/user-info/ModToolsUserView.tsx +++ b/src/views/mod-tools/views/user/user-info/ModToolsUserView.tsx @@ -5,6 +5,9 @@ import { CreateMessageHook, dispatchUiEvent, SendMessageHook } from '../../../.. import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../../layout'; import { AvatarImageView } from '../../../../shared/avatar-image/AvatarImageView'; import { IUserInfo } from '../../../utils/IUserInfo'; +import { ModToolsUserModActionView } from '../user-mod-action/ModToolsUserModActionView'; +import { ModToolsUserRoomVisitsView } from '../user-room-visits/ModToolsUserRoomVisitsView'; +import { ModToolsSendUserMessageView } from '../user-sendmessage/ModToolsSendUserMessageView'; import { ModToolsUserViewProps } from './ModToolsUserView.types'; @@ -12,6 +15,9 @@ export const ModToolsUserView: FC = props => { const { onCloseClick = null, userId = null, simple = true } = props; const [userInfo, setUserInfo] = useState(null); + const [sendMessageVisible, setSendMessageVisible] = useState(false); + const [modActionVisible, setModActionVisible] = useState(false); + const [roomVisitsVisible, setRoomVisitsVisible] = useState(false); useEffect(() => { @@ -120,6 +126,7 @@ export const ModToolsUserView: FC = props => }, [userInfo]); return ( + <> onCloseClick()} /> @@ -149,13 +156,17 @@ export const ModToolsUserView: FC = props =>
- - - + + +
}
+ {(sendMessageVisible && userInfo) && setSendMessageVisible(false)}/>} + {(userInfo && modActionVisible) && setModActionVisible(false)}/>} + {(userInfo && roomVisitsVisible) && setRoomVisitsVisible(false)}/>} + ); } diff --git a/src/views/mod-tools/views/user/user-mod-action/ModToolsUserModActionView.tsx b/src/views/mod-tools/views/user/user-mod-action/ModToolsUserModActionView.tsx new file mode 100644 index 00000000..c78f12f6 --- /dev/null +++ b/src/views/mod-tools/views/user/user-mod-action/ModToolsUserModActionView.tsx @@ -0,0 +1,17 @@ +import { FC } from 'react'; +import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../../layout'; +import { ModToolsUserModActionViewProps } from './ModToolsUserModActionView.types'; + +export const ModToolsUserModActionView: FC = props => +{ + const { user = null, onCloseClick = null } = props; + + return ( + + onCloseClick()} /> + + {user &&
} +
+
+ ); +} diff --git a/src/views/mod-tools/views/user/user-mod-action/ModToolsUserModActionView.types.ts b/src/views/mod-tools/views/user/user-mod-action/ModToolsUserModActionView.types.ts new file mode 100644 index 00000000..2025d10d --- /dev/null +++ b/src/views/mod-tools/views/user/user-mod-action/ModToolsUserModActionView.types.ts @@ -0,0 +1,7 @@ +import { ISelectedUser } from '../../../utils/ISelectedUser'; + +export interface ModToolsUserModActionViewProps +{ + user: ISelectedUser; + onCloseClick: () => void; +} diff --git a/src/views/mod-tools/views/user/user-room-visits/ModToolsUserRoomVisitsView.scss b/src/views/mod-tools/views/user/user-room-visits/ModToolsUserRoomVisitsView.scss new file mode 100644 index 00000000..46efbaa5 --- /dev/null +++ b/src/views/mod-tools/views/user/user-room-visits/ModToolsUserRoomVisitsView.scss @@ -0,0 +1,14 @@ +.nitro-mod-tools-user-visits { + min-width: 300px; + + .user-visits { + min-height: 200px; + + .roomvisits-container { + div.room-visit { + border-bottom: 1px solid rgba(0, 0, 0, 0.2); + } + } + + } +} diff --git a/src/views/mod-tools/views/user/user-room-visits/ModToolsUserRoomVisitsView.tsx b/src/views/mod-tools/views/user/user-room-visits/ModToolsUserRoomVisitsView.tsx new file mode 100644 index 00000000..8d1a709e --- /dev/null +++ b/src/views/mod-tools/views/user/user-room-visits/ModToolsUserRoomVisitsView.tsx @@ -0,0 +1,66 @@ +import { ModtoolReceivedRoomsUserEvent, ModtoolRequestUserRoomsComposer, ModtoolRoomVisitedData } from '@nitrots/nitro-renderer'; +import { FC, useCallback, useEffect, useState } from 'react'; +import { AutoSizer, List, ListRowProps, ListRowRenderer } from 'react-virtualized'; +import { CreateMessageHook, SendMessageHook } from '../../../../../hooks'; +import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../../layout'; +import { ModToolsUserRoomVisitsViewProps } from './ModToolsUserRoomVisitsView.types'; + +export const ModToolsUserRoomVisitsView: FC = props => +{ + const { userId = null, onCloseClick = null } = props; + + const [roomVisitData, setRoomVisitData] = useState(null); + + useEffect(() => + { + SendMessageHook(new ModtoolRequestUserRoomsComposer(userId)); + }, [userId]); + + const onModtoolReceivedRoomsUserEvent = useCallback((event: ModtoolReceivedRoomsUserEvent) => + { + const parser = event.getParser(); + + if(!parser || parser.data.userId !== userId) return; + + setRoomVisitData(parser.data); + }, [userId]); + + CreateMessageHook(ModtoolReceivedRoomsUserEvent, onModtoolReceivedRoomsUserEvent); + + const RowRenderer: ListRowRenderer = (props: ListRowProps) => + { + const item = roomVisitData.rooms[props.index]; + + return ( +
+ {item.enterHour}:{item.enterMinute} Room: {item.roomName} +
); + } + + return ( + + onCloseClick()} /> + + {roomVisitData && +
+ + {({ height, width }) => + { + return ( + + ) + }} + +
+ } +
+
+ ); +} diff --git a/src/views/mod-tools/views/user/user-room-visits/ModToolsUserRoomVisitsView.types.ts b/src/views/mod-tools/views/user/user-room-visits/ModToolsUserRoomVisitsView.types.ts new file mode 100644 index 00000000..8aaebec5 --- /dev/null +++ b/src/views/mod-tools/views/user/user-room-visits/ModToolsUserRoomVisitsView.types.ts @@ -0,0 +1,5 @@ +export interface ModToolsUserRoomVisitsViewProps +{ + userId: number; + onCloseClick: () => void; +} diff --git a/src/views/mod-tools/views/user/user-sendmessage/ModToolsSendUserMessage.types.ts b/src/views/mod-tools/views/user/user-sendmessage/ModToolsSendUserMessage.types.ts new file mode 100644 index 00000000..617945f0 --- /dev/null +++ b/src/views/mod-tools/views/user/user-sendmessage/ModToolsSendUserMessage.types.ts @@ -0,0 +1,7 @@ +import { ISelectedUser } from '../../../utils/ISelectedUser'; + +export interface ModToolsSendUserMessageViewProps +{ + user: ISelectedUser; + onCloseClick: () => void; +} diff --git a/src/views/mod-tools/views/user/user-sendmessage/ModToolsSendUserMessageView.tsx b/src/views/mod-tools/views/user/user-sendmessage/ModToolsSendUserMessageView.tsx new file mode 100644 index 00000000..7305bf93 --- /dev/null +++ b/src/views/mod-tools/views/user/user-sendmessage/ModToolsSendUserMessageView.tsx @@ -0,0 +1,37 @@ +import { ModMessageMessageComposer } from '@nitrots/nitro-renderer'; +import { FC, useCallback, useState } from 'react'; +import { SendMessageHook } from '../../../../../hooks'; +import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../../layout'; +import { ModToolsSendUserMessageViewProps } from './ModToolsSendUserMessage.types'; + +export const ModToolsSendUserMessageView: FC = props => +{ + const { user = null, onCloseClick = null } = props; + const [message, setMessage] = useState(''); + + + const sendMessage = useCallback(() => + { + if(message.trim().length === 0) return; + + SendMessageHook(new ModMessageMessageComposer(user.userId, message, -999)); + }, [message, user.userId]); + + return ( + + onCloseClick()} /> + + {user && <> +
Message To: {user.username}
+
+ +
+ +
+ +
+ } +
+
+ ); +}