2021-08-06 05:38:57 +02:00
|
|
|
import { MessengerInitComposer, RoomEngineObjectEvent, RoomObjectCategory, RoomObjectUserType } from '@nitrots/nitro-renderer';
|
2021-09-08 06:03:48 +02:00
|
|
|
import { FC, useCallback, useEffect, useMemo, useReducer, useState } from 'react';
|
2021-06-23 05:22:32 +02:00
|
|
|
import { createPortal } from 'react-dom';
|
2021-09-16 06:37:17 +02:00
|
|
|
import { GetRoomSession } from '../../api';
|
|
|
|
import { FriendEnteredRoomEvent, FriendListContentEvent, FriendsEvent } from '../../events';
|
|
|
|
import { FriendsSendFriendRequestEvent } from '../../events/friends/FriendsSendFriendRequestEvent';
|
2021-07-07 09:56:11 +02:00
|
|
|
import { useRoomEngineEvent } from '../../hooks/events';
|
|
|
|
import { dispatchUiEvent, useUiEvent } from '../../hooks/events/ui/ui-event';
|
2021-04-22 09:11:27 +02:00
|
|
|
import { SendMessageHook } from '../../hooks/messages/message-event';
|
2021-09-16 06:37:17 +02:00
|
|
|
import { FriendsContextProvider } from './context/FriendsContext';
|
|
|
|
import { FriendsMessageHandler } from './FriendsMessageHandler';
|
|
|
|
import { FriendsReducer, initialFriends } from './reducers/FriendsReducer';
|
2021-06-23 05:22:32 +02:00
|
|
|
import { FriendBarView } from './views/friend-bar/FriendBarView';
|
2021-09-16 06:37:17 +02:00
|
|
|
import { FriendsListView } from './views/friends-list/FriendsListView';
|
|
|
|
import { FriendsMessengerView } from './views/messenger/FriendsMessengerView';
|
2021-04-22 08:54:49 +02:00
|
|
|
|
2021-09-15 18:26:51 +02:00
|
|
|
export const FriendsView: FC<{}> = props =>
|
2021-04-22 08:54:49 +02:00
|
|
|
{
|
2021-09-16 06:37:17 +02:00
|
|
|
const [ friendsState, dispatchFriendsState ] = useReducer(FriendsReducer, initialFriends);
|
|
|
|
const { friends = [], requests = [], settings = null } = friendsState;
|
2021-09-08 06:03:48 +02:00
|
|
|
|
2021-06-23 05:22:32 +02:00
|
|
|
const [ isReady, setIsReady ] = useState(false);
|
2021-09-16 06:37:17 +02:00
|
|
|
const [ isListVisible, setIsListVisible ] = useState(false);
|
|
|
|
|
|
|
|
useEffect(() =>
|
|
|
|
{
|
|
|
|
SendMessageHook(new MessengerInitComposer());
|
|
|
|
}, []);
|
2021-04-22 08:54:49 +02:00
|
|
|
|
2021-09-16 06:37:17 +02:00
|
|
|
useEffect(() =>
|
|
|
|
{
|
|
|
|
if(!settings) return;
|
|
|
|
|
|
|
|
setIsReady(true);
|
|
|
|
}, [ settings ]);
|
|
|
|
|
|
|
|
const onFriendsEvent = useCallback((event: FriendsEvent) =>
|
2021-04-22 08:54:49 +02:00
|
|
|
{
|
|
|
|
switch(event.type)
|
|
|
|
{
|
2021-09-16 06:37:17 +02:00
|
|
|
case FriendsEvent.SHOW_FRIEND_LIST:
|
|
|
|
setIsListVisible(true);
|
|
|
|
return;
|
|
|
|
case FriendsEvent.TOGGLE_FRIEND_LIST:
|
|
|
|
setIsListVisible(value => !value);
|
|
|
|
return;
|
|
|
|
case FriendsSendFriendRequestEvent.SEND_FRIEND_REQUEST:
|
|
|
|
const requestEvent = (event as FriendsSendFriendRequestEvent);
|
2021-07-08 10:25:57 +02:00
|
|
|
return;
|
2021-09-16 06:37:17 +02:00
|
|
|
case FriendsEvent.REQUEST_FRIEND_LIST:
|
|
|
|
dispatchUiEvent(new FriendListContentEvent(friendsState.friends));
|
2021-08-18 22:50:15 +02:00
|
|
|
return;
|
2021-04-22 08:54:49 +02:00
|
|
|
}
|
2021-09-16 06:37:17 +02:00
|
|
|
}, [ friendsState.friends ]);
|
2021-04-22 08:54:49 +02:00
|
|
|
|
2021-09-16 06:37:17 +02:00
|
|
|
useUiEvent(FriendsEvent.SHOW_FRIEND_LIST, onFriendsEvent);
|
|
|
|
useUiEvent(FriendsEvent.TOGGLE_FRIEND_LIST, onFriendsEvent);
|
|
|
|
useUiEvent(FriendsSendFriendRequestEvent.SEND_FRIEND_REQUEST, onFriendsEvent);
|
|
|
|
useUiEvent(FriendsEvent.REQUEST_FRIEND_LIST, onFriendsEvent);
|
2021-04-22 08:54:49 +02:00
|
|
|
|
2021-07-07 09:56:11 +02:00
|
|
|
const onRoomEngineObjectEvent = useCallback((event: RoomEngineObjectEvent) =>
|
|
|
|
{
|
|
|
|
const roomSession = GetRoomSession();
|
|
|
|
|
|
|
|
if(!roomSession) return;
|
|
|
|
|
|
|
|
if(event.category !== RoomObjectCategory.UNIT) return;
|
|
|
|
|
|
|
|
const userData = roomSession.userDataManager.getUserDataByIndex(event.objectId);
|
|
|
|
|
2021-07-08 10:25:57 +02:00
|
|
|
if(!userData || (userData.type !== RoomObjectUserType.getTypeNumber(RoomObjectUserType.USER))) return;
|
2021-07-07 09:56:11 +02:00
|
|
|
|
2021-09-16 06:37:17 +02:00
|
|
|
const friend = friendsState.friends.find(friend =>
|
2021-07-07 09:56:11 +02:00
|
|
|
{
|
|
|
|
return (friend.id === userData.webID);
|
|
|
|
});
|
|
|
|
|
|
|
|
if(!friend) return;
|
|
|
|
|
|
|
|
dispatchUiEvent(new FriendEnteredRoomEvent(userData.roomIndex, RoomObjectCategory.UNIT, userData.webID, userData.name, userData.type));
|
2021-09-16 06:37:17 +02:00
|
|
|
}, [ friendsState.friends ]);
|
2021-07-07 09:56:11 +02:00
|
|
|
|
|
|
|
useRoomEngineEvent(RoomEngineObjectEvent.ADDED, onRoomEngineObjectEvent);
|
|
|
|
|
2021-09-08 06:03:48 +02:00
|
|
|
const onlineFriends = useMemo(() =>
|
|
|
|
{
|
|
|
|
return friends.filter(f => f.online);
|
|
|
|
}, [ friends ]);
|
|
|
|
|
|
|
|
const offlineFriends = useMemo(() =>
|
|
|
|
{
|
|
|
|
return friends.filter(f => !f.online);
|
|
|
|
}, [ friends ]);
|
|
|
|
|
2021-04-22 08:54:49 +02:00
|
|
|
return (
|
2021-09-16 06:37:17 +02:00
|
|
|
<FriendsContextProvider value={ { friendsState, dispatchFriendsState } }>
|
|
|
|
<FriendsMessageHandler />
|
2021-09-18 08:04:50 +02:00
|
|
|
{ isReady && createPortal(<FriendBarView onlineFriends={ onlineFriends } />, document.getElementById('toolbar-friend-bar-container')) }
|
2021-09-16 06:37:17 +02:00
|
|
|
{ isListVisible && <FriendsListView onlineFriends={ onlineFriends } offlineFriends={ offlineFriends } friendRequests={ requests } onCloseClick={ () => setIsListVisible(false) } /> }
|
2021-09-17 13:15:53 +02:00
|
|
|
<FriendsMessengerView />
|
2021-09-16 06:37:17 +02:00
|
|
|
</FriendsContextProvider>
|
2021-04-22 08:54:49 +02:00
|
|
|
);
|
|
|
|
}
|