mirror of
https://github.com/billsonnn/nitro-react.git
synced 2025-01-18 13:26:27 +01:00
Feature - Find friends
This commit is contained in:
parent
aba4ddf2db
commit
04ba7e47b8
@ -146,6 +146,49 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.friend-bar-item-search {
|
||||||
|
width: 130px;
|
||||||
|
margin: 0 3px;
|
||||||
|
z-index: 0;
|
||||||
|
position: relative;
|
||||||
|
text-align: left;
|
||||||
|
|
||||||
|
.left-text {
|
||||||
|
margin-left: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search-content {
|
||||||
|
margin-bottom: 105px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.friend-bar-item-active {
|
||||||
|
margin-bottom:21px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.friend-bar-item-head {
|
||||||
|
&.avatar {
|
||||||
|
top: -30px;
|
||||||
|
left: -30px;
|
||||||
|
}
|
||||||
|
&.group {
|
||||||
|
top: -5px;
|
||||||
|
left: -5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.friend-bar-search {
|
||||||
|
.friend-bar-item-head {
|
||||||
|
top: -3px;
|
||||||
|
left: 5px;
|
||||||
|
width: 31px;
|
||||||
|
height: 34px;
|
||||||
|
background-image: url('@/assets/images/toolbar/friend-search.png');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.nitro-friends-messenger {
|
.nitro-friends-messenger {
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import { MouseEventType } from '@nitrots/nitro-renderer';
|
import { FindNewFriendsMessageComposer, MouseEventType } from '@nitrots/nitro-renderer';
|
||||||
import { FC, useEffect, useRef, useState } from 'react';
|
import { FC, useEffect, useRef, useState } from 'react';
|
||||||
import { GetUserProfile, LocalizeText, MessengerFriend, OpenMessengerChat } from '../../../../api';
|
import { GetUserProfile, LocalizeText, MessengerFriend, OpenMessengerChat, SendMessageComposer } from '../../../../api';
|
||||||
import { Base, LayoutAvatarImageView, LayoutBadgeImageView } from '../../../../common';
|
import { Base, Button, LayoutAvatarImageView, LayoutBadgeImageView } from '../../../../common';
|
||||||
import { useFriends } from '../../../../hooks';
|
import { useFriends } from '../../../../hooks';
|
||||||
|
|
||||||
export const FriendBarItemView: FC<{ friend: MessengerFriend }> = props =>
|
export const FriendBarItemView: FC<{ friend: MessengerFriend }> = props =>
|
||||||
@ -33,9 +33,17 @@ export const FriendBarItemView: FC<{ friend: MessengerFriend }> = props =>
|
|||||||
if(!friend)
|
if(!friend)
|
||||||
{
|
{
|
||||||
return (
|
return (
|
||||||
<div ref={ elementRef } className="btn btn-primary friend-bar-item friend-bar-search">
|
<div ref={ elementRef } className="btn btn-primary friend-bar-item-search friend-bar-search" onClick={ event => setVisible(prevValue => !prevValue) }>
|
||||||
<div className="friend-bar-item-head position-absolute"/>
|
<div className="friend-bar-item-head position-absolute"/>
|
||||||
<div className="text-truncate">{ LocalizeText('friend.bar.find.title') }</div>
|
<div className="text-truncate left-text">{ LocalizeText('friend.bar.find.title') }</div>
|
||||||
|
{ isVisible &&
|
||||||
|
<>
|
||||||
|
<div className="search-content">
|
||||||
|
<div className="bg-white text-black mt-2 mb-2 px-1 py-1">{ LocalizeText('friend.bar.find.text') }</div>
|
||||||
|
<Button variant="white" onClick={ () => SendMessageComposer(new FindNewFriendsMessageComposer()) }>{ LocalizeText('friend.bar.find.button') }</Button>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@ -48,12 +56,12 @@ export const FriendBarItemView: FC<{ friend: MessengerFriend }> = props =>
|
|||||||
</div>
|
</div>
|
||||||
<div className="text-truncate">{ friend.name }</div>
|
<div className="text-truncate">{ friend.name }</div>
|
||||||
{ isVisible &&
|
{ isVisible &&
|
||||||
<div className="d-flex justify-content-between">
|
<div className="d-flex justify-content-between">
|
||||||
<Base className="nitro-friends-spritesheet icon-friendbar-chat cursor-pointer" onClick={ event => OpenMessengerChat(friend.id) } />
|
<Base className="nitro-friends-spritesheet icon-friendbar-chat cursor-pointer" onClick={ event => OpenMessengerChat(friend.id) } />
|
||||||
{ friend.followingAllowed &&
|
{ friend.followingAllowed &&
|
||||||
<Base className="nitro-friends-spritesheet icon-friendbar-visit cursor-pointer" onClick={ event => followFriend(friend) } /> }
|
<Base className="nitro-friends-spritesheet icon-friendbar-visit cursor-pointer" onClick={ event => followFriend(friend) } /> }
|
||||||
<Base className="nitro-friends-spritesheet icon-profile cursor-pointer" onClick={ event => GetUserProfile(friend.id) } />
|
<Base className="nitro-friends-spritesheet icon-profile cursor-pointer" onClick={ event => GetUserProfile(friend.id) } />
|
||||||
</div> }
|
</div> }
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -1,8 +1,9 @@
|
|||||||
import { AcceptFriendMessageComposer, DeclineFriendMessageComposer, FollowFriendMessageComposer, FriendListFragmentEvent, FriendListUpdateComposer, FriendListUpdateEvent, FriendParser, FriendRequestsEvent, GetFriendRequestsComposer, MessengerInitComposer, MessengerInitEvent, NewFriendRequestEvent, RequestFriendComposer, SetRelationshipStatusComposer } from '@nitrots/nitro-renderer';
|
import { AcceptFriendMessageComposer, DeclineFriendMessageComposer, FindFriendsProcessResultEvent, FollowFriendMessageComposer, FriendListFragmentEvent, FriendListUpdateComposer, FriendListUpdateEvent, FriendParser, FriendRequestsEvent, GetFriendRequestsComposer, MessengerInitComposer, MessengerInitEvent, NewFriendRequestEvent, RequestFriendComposer, SetRelationshipStatusComposer } from '@nitrots/nitro-renderer';
|
||||||
import { useEffect, useMemo, useState } from 'react';
|
import { useEffect, useMemo, useState } from 'react';
|
||||||
import { useBetween } from 'use-between';
|
import { useBetween } from 'use-between';
|
||||||
import { CloneObject, GetSessionDataManager, MessengerFriend, MessengerRequest, MessengerSettings, SendMessageComposer } from '../../api';
|
import { CloneObject, GetSessionDataManager, LocalizeText, MessengerFriend, MessengerRequest, MessengerSettings, SendMessageComposer } from '../../api';
|
||||||
import { useMessageEvent } from '../events';
|
import { useMessageEvent } from '../events';
|
||||||
|
import { useNotification } from '../notification';
|
||||||
|
|
||||||
const useFriendsState = () =>
|
const useFriendsState = () =>
|
||||||
{
|
{
|
||||||
@ -11,6 +12,7 @@ const useFriendsState = () =>
|
|||||||
const [ sentRequests, setSentRequests ] = useState<number[]>([]);
|
const [ sentRequests, setSentRequests ] = useState<number[]>([]);
|
||||||
const [ dismissedRequestIds, setDismissedRequestIds ] = useState<number[]>([]);
|
const [ dismissedRequestIds, setDismissedRequestIds ] = useState<number[]>([]);
|
||||||
const [ settings, setSettings ] = useState<MessengerSettings>(null);
|
const [ settings, setSettings ] = useState<MessengerSettings>(null);
|
||||||
|
const { simpleAlert } = useNotification();
|
||||||
|
|
||||||
const onlineFriends = useMemo(() =>
|
const onlineFriends = useMemo(() =>
|
||||||
{
|
{
|
||||||
@ -248,6 +250,15 @@ const useFriendsState = () =>
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
useMessageEvent<FindFriendsProcessResultEvent>(FindFriendsProcessResultEvent, event =>
|
||||||
|
{
|
||||||
|
const parser = event.getParser();
|
||||||
|
|
||||||
|
if (!parser) return;
|
||||||
|
|
||||||
|
simpleAlert(LocalizeText(!parser.success ? 'friendbar.find.error.text' : 'friendbar.find.success.text'), '', '', '', LocalizeText(!parser.success ? 'friendbar.find.error.title' : 'friendbar.find.success.title'));
|
||||||
|
});
|
||||||
|
|
||||||
useEffect(() =>
|
useEffect(() =>
|
||||||
{
|
{
|
||||||
SendMessageComposer(new MessengerInitComposer());
|
SendMessageComposer(new MessengerInitComposer());
|
||||||
|
Loading…
Reference in New Issue
Block a user