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

Room Like button

Browse Source
This commit is contained in:
MyNameIsBatman 2021-06-30 14:29:07 -03:00
parent 876ef7ac1f
commit ce613166ca
2 changed files with 13 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/views/room/widgets/room-tools/RoomToolsWidgetView.scss
View File

@ -31,5 +31,9 @@
border-bottom: none; border-bottom: none;
padding-bottom: 8px; padding-bottom: 8px;
} }
&.disabled {
opacity: .5;
}
} }
} }

11
src/views/room/widgets/room-tools/RoomToolsWidgetView.tsx
View File

@ -1,5 +1,7 @@
import classNames from 'classnames'; import classNames from 'classnames';
import { RoomLikeRoomComposer } from 'nitro-renderer';
import { FC, useCallback, useState } from 'react'; import { FC, useCallback, useState } from 'react';
import { SendMessageHook } from '../../../../hooks/messages';
import { LocalizeText } from '../../../../utils/LocalizeText'; import { LocalizeText } from '../../../../utils/LocalizeText';
import { useRoomContext } from '../../context/RoomContext'; import { useRoomContext } from '../../context/RoomContext';
import { RoomWidgetZoomToggleMessage } from '../../messages'; import { RoomWidgetZoomToggleMessage } from '../../messages';
@ -11,6 +13,7 @@ export const RoomToolsWidgetView: FC<RoomToolsWidgetViewProps> = props =>
const [ isExpended, setIsExpanded ] = useState(false); const [ isExpended, setIsExpanded ] = useState(false);
const [ isZoomedIn, setIsZoomedIn ] = useState(false); const [ isZoomedIn, setIsZoomedIn ] = useState(false);
const [ liked, setLiked ] = useState(false);
const handleToolClick = useCallback((action: string) => const handleToolClick = useCallback((action: string) =>
{ {
@ -25,11 +28,15 @@ export const RoomToolsWidgetView: FC<RoomToolsWidgetViewProps> = props =>
case 'chat_history': case 'chat_history':
return; return;
case 'like_room': case 'like_room':
if(liked) return;
SendMessageHook(new RoomLikeRoomComposer(1));
setLiked(true);
return; return;
case 'room_link': case 'room_link':
return; return;
} }
}, [ isZoomedIn, widgetHandler ]); }, [ isZoomedIn, liked, widgetHandler ]);
return ( return (
<div className={'nitro-room-tools ps-3 d-flex' + classNames({' open': isExpended})}> <div className={'nitro-room-tools ps-3 d-flex' + classNames({' open': isExpended})}>
@ -43,7 +50,7 @@ export const RoomToolsWidgetView: FC<RoomToolsWidgetViewProps> = props =>
<div className="list-group-item" onClick={ () => handleToolClick('chat_history') }> <div className="list-group-item" onClick={ () => handleToolClick('chat_history') }>
<i className="fas fa-comment-alt me-2" />{ LocalizeText('room.chathistory.button.text') } <i className="fas fa-comment-alt me-2" />{ LocalizeText('room.chathistory.button.text') }
</div> </div>
<div className="list-group-item" onClick={ () => handleToolClick('like_room') }> <div className={ 'list-group-item' + classNames({' disabled': liked})} onClick={ () => handleToolClick('like_room') }>
<i className="fas fa-heart me-2" />{ LocalizeText('room.like.button.text') } <i className="fas fa-heart me-2" />{ LocalizeText('room.like.button.text') }
</div> </div>
<div className="list-group-item" onClick={ () => handleToolClick('room_link') }> <div className="list-group-item" onClick={ () => handleToolClick('room_link') }>