Update friend request widget

This commit is contained in:
Bill 2022-03-01 03:44:32 -05:00
parent 0dfb3649b8
commit 526d50d9dc
3 changed files with 23 additions and 37 deletions

View File

@ -1,47 +1,40 @@
import { FC, useCallback } from 'react'; import { FC } from 'react';
import { LocalizeText, RoomWidgetFriendRequestMessage } from '../../../../api'; import { LocalizeText, RoomWidgetFriendRequestMessage } from '../../../../api';
import { NitroLayoutButton, NitroLayoutFlex, NitroLayoutFlexColumn } from '../../../../layout'; import { Base, Button, Column, Flex, Text } from '../../../../common';
import { NitroLayoutBase } from '../../../../layout/base';
import { useRoomContext } from '../../context/RoomContext'; import { useRoomContext } from '../../context/RoomContext';
import { UserLocationView } from '../user-location/UserLocationView'; import { UserLocationView } from '../user-location/UserLocationView';
import { FriendRequestDialogViewProps } from './FriendRequestDialogView.types';
interface FriendRequestDialogViewProps
{
requestId: number;
userId: number;
userName: string;
close: () => void;
}
export const FriendRequestDialogView: FC<FriendRequestDialogViewProps> = props => export const FriendRequestDialogView: FC<FriendRequestDialogViewProps> = props =>
{ {
const { requestId = -1, userId = -1, userName = null, close = null } = props; const { requestId = -1, userId = -1, userName = null, close = null } = props;
const { widgetHandler = null } = useRoomContext(); const { widgetHandler = null } = useRoomContext();
const accept = useCallback(() => const respond = (flag: boolean) =>
{ {
widgetHandler.processWidgetMessage(new RoomWidgetFriendRequestMessage(RoomWidgetFriendRequestMessage.ACCEPT, requestId)); widgetHandler.processWidgetMessage(new RoomWidgetFriendRequestMessage((flag ? RoomWidgetFriendRequestMessage.ACCEPT : RoomWidgetFriendRequestMessage.DECLINE), requestId));
close(); close();
}, [ requestId, widgetHandler, close ]); }
const decline = useCallback(() =>
{
widgetHandler.processWidgetMessage(new RoomWidgetFriendRequestMessage(RoomWidgetFriendRequestMessage.ACCEPT, requestId));
close();
}, [ requestId, widgetHandler, close ]);
return ( return (
<UserLocationView userId={ userId }> <UserLocationView userId={ userId }>
<NitroLayoutBase className="nitro-friend-request-dialog nitro-context-menu p-2"> <Base className="nitro-friend-request-dialog nitro-context-menu p-2">
<NitroLayoutFlexColumn> <Column>
<NitroLayoutBase className="h6"> <Text variant="white" fontSize={ 6 }>{ LocalizeText('widget.friendrequest.from', [ 'username' ], [ userName ]) }</Text>
{ LocalizeText('widget.friendrequest.from', [ 'username' ], [ userName ]) } <Flex justifyContent="end" gap={ 1 }>
</NitroLayoutBase> <Button variant="danger" onClick={ event => respond(false) }>{ LocalizeText('widget.friendrequest.decline') }</Button>
<NitroLayoutFlex className="justify-content-end align-items-center" gap={ 2 }> <Button variant="success" onClick={ event => respond(true) }>{ LocalizeText('widget.friendrequest.accept') }</Button>
<NitroLayoutButton variant="danger" size="sm" onClick={ decline }> </Flex>
{ LocalizeText('widget.friendrequest.decline') } </Column>
</NitroLayoutButton> </Base>
<NitroLayoutButton variant="success" size="sm" onClick={ accept }>
{ LocalizeText('widget.friendrequest.accept') }
</NitroLayoutButton>
</NitroLayoutFlex>
</NitroLayoutFlexColumn>
</NitroLayoutBase>
</UserLocationView> </UserLocationView>
); );
} }

View File

@ -1,7 +0,0 @@
export interface FriendRequestDialogViewProps
{
requestId: number;
userId: number;
userName: string;
close: () => void;
}

View File

@ -38,7 +38,7 @@ export const FriendRequestWidgetView: FC<{}> = props =>
newValue.splice(index, 1); newValue.splice(index, 1);
return newValue; return newValue;
}) });
}, [ friendRequests ]); }, [ friendRequests ]);
const onRoomWidgetUpdateFriendRequestEvent = useCallback((event: RoomWidgetUpdateFriendRequestEvent) => const onRoomWidgetUpdateFriendRequestEvent = useCallback((event: RoomWidgetUpdateFriendRequestEvent) =>