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

More friend updates

Browse Source
This commit is contained in:
Bill 2021-11-17 05:03:29 -05:00
parent 7aafbfba4c
commit f489bacd31
2 changed files with 13 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/views/friends/views/friend-bar-item/FriendBarItemView.tsx
View File

@ -27,6 +27,8 @@ export const FriendBarItemView: FC<FriendBarItemViewProps> = props =>
{ {
const element = elementRef.current; const element = elementRef.current;
if(!element) return;
if((event.target !== element) && !element.contains((event.target as Node))) if((event.target !== element) && !element.contains((event.target as Node)))
{ {
setVisible(false); setVisible(false);

19
src/views/friends/views/messenger/FriendsMessengerView.tsx
View File

@ -3,7 +3,7 @@ import { FC, KeyboardEvent, useCallback, useEffect, useMemo, useRef, useState }
import { AddEventLinkTracker, GetUserProfile, LocalizeText, RemoveLinkEventTracker } from '../../../../api'; import { AddEventLinkTracker, GetUserProfile, LocalizeText, RemoveLinkEventTracker } from '../../../../api';
import { FriendsMessengerIconEvent } from '../../../../events'; import { FriendsMessengerIconEvent } from '../../../../events';
import { BatchUpdates, CreateMessageHook, dispatchUiEvent, SendMessageHook } from '../../../../hooks'; import { BatchUpdates, CreateMessageHook, dispatchUiEvent, SendMessageHook } from '../../../../hooks';
import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../layout'; import { NitroCardContentView, NitroCardHeaderView, NitroCardView, NitroLayoutFlex } from '../../../../layout';
import { AvatarImageView } from '../../../shared/avatar-image/AvatarImageView'; import { AvatarImageView } from '../../../shared/avatar-image/AvatarImageView';
import { MessengerThread } from '../../common/MessengerThread'; import { MessengerThread } from '../../common/MessengerThread';
import { MessengerThreadChat } from '../../common/MessengerThreadChat'; import { MessengerThreadChat } from '../../common/MessengerThreadChat';
@ -17,9 +17,9 @@ export const FriendsMessengerView: FC<{}> = props =>
const [ activeThreadIndex, setActiveThreadIndex ] = useState(-1); const [ activeThreadIndex, setActiveThreadIndex ] = useState(-1);
const [ hiddenThreadIndexes, setHiddenThreadIndexes ] = useState<number[]>([]); const [ hiddenThreadIndexes, setHiddenThreadIndexes ] = useState<number[]>([]);
const [ messageText, setMessageText ] = useState(''); const [ messageText, setMessageText ] = useState('');
const messagesBox = useRef<HTMLDivElement>();
const [ updateValue, setUpdateValue ] = useState({}); const [ updateValue, setUpdateValue ] = useState({});
const { friends = [] } = useFriendsContext(); const { friends = [] } = useFriendsContext();
const messagesBox = useRef<HTMLDivElement>();
const followFriend = useCallback(() => const followFriend = useCallback(() =>
{ {
@ -235,7 +235,7 @@ export const FriendsMessengerView: FC<{}> = props =>
<NitroCardView className="nitro-friends-messenger" simple={ true }> <NitroCardView className="nitro-friends-messenger" simple={ true }>
<NitroCardHeaderView headerText={ LocalizeText('messenger.window.title', [ 'OPEN_CHAT_COUNT' ], [ visibleThreads.length.toString() ]) } onCloseClick={ event => setIsVisible(false) } /> <NitroCardHeaderView headerText={ LocalizeText('messenger.window.title', [ 'OPEN_CHAT_COUNT' ], [ visibleThreads.length.toString() ]) } onCloseClick={ event => setIsVisible(false) } />
<NitroCardContentView> <NitroCardContentView>
<div className="d-flex gap-2 overflow-auto pb-1"> <NitroLayoutFlex gap={ 2 } overflow="auto">
{ visibleThreads && (visibleThreads.length > 0) && visibleThreads.map((thread, index) => { visibleThreads && (visibleThreads.length > 0) && visibleThreads.map((thread, index) =>
{ {
const messageThreadIndex = messageThreads.indexOf(thread); const messageThreadIndex = messageThreads.indexOf(thread);
@ -247,13 +247,16 @@ export const FriendsMessengerView: FC<{}> = props =>
</div> </div>
); );
}) } }) }
</div> </NitroLayoutFlex>
<hr className="bg-dark mt-3 mb-2" /> <NitroLayoutFlex className="align-items-center my-1" position="relative">
{ (activeThreadIndex >= 0) &&
<div className="text-black bg-light pe-2 flex-none">
{ LocalizeText('messenger.window.separator', [ 'FRIEND_NAME' ], [ messageThreads[activeThreadIndex].participant.name ]) }
</div> }
<hr className="bg-dark m-0 w-100" />
</NitroLayoutFlex>
{ (activeThreadIndex >= 0) && { (activeThreadIndex >= 0) &&
<> <>
<div className="text-black chat-title bg-light pe-2 position-absolute">
{ LocalizeText('messenger.window.separator', [ 'FRIEND_NAME' ], [ messageThreads[activeThreadIndex].participant.name ]) }
</div>
<div className="d-flex gap-2 mb-2"> <div className="d-flex gap-2 mb-2">
<div className="btn-group"> <div className="btn-group">
<button className="d-flex justify-content-center align-items-center btn btn-sm btn-primary" onClick={ followFriend }> <button className="d-flex justify-content-center align-items-center btn btn-sm btn-primary" onClick={ followFriend }>