diff --git a/src/components/navigator/views/search/NavigatorSearchResultItemInfoView.tsx b/src/components/navigator/views/search/NavigatorSearchResultItemInfoView.tsx index 6d434a5c..432fce48 100644 --- a/src/components/navigator/views/search/NavigatorSearchResultItemInfoView.tsx +++ b/src/components/navigator/views/search/NavigatorSearchResultItemInfoView.tsx @@ -1,6 +1,6 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { RoomDataParser } from '@nitrots/nitro-renderer'; -import { FC, MouseEvent, useEffect, useState } from 'react'; +import { FC, useRef, useState } from 'react'; import { Overlay, Popover } from 'react-bootstrap'; import { LocalizeText } from '../../../../api'; import { Base, Column, Flex, LayoutBadgeImageView, LayoutRoomThumbnailView, NitroCardContentView, Text, UserProfileIconView } from '../../../../common'; @@ -13,8 +13,8 @@ interface NavigatorSearchResultItemInfoViewProps export const NavigatorSearchResultItemInfoView: FC = props => { const { roomData = null } = props; - const [ target, setTarget ] = useState<(EventTarget & HTMLElement)>(null); const [ isVisible, setIsVisible ] = useState(false); + const elementRef = useRef(); const getUserCounterColor = () => { @@ -38,33 +38,10 @@ export const NavigatorSearchResultItemInfoView: FC) => - { - event.stopPropagation(); - - let visible = false; - - setIsVisible(prevValue => - { - visible = !prevValue; - - return visible; - }); - - if(visible) setTarget((event.target as (EventTarget & HTMLElement))); - } - - useEffect(() => - { - if(isVisible) return; - - setTarget(null); - }, [ isVisible ]); - return ( <> - - + setIsVisible(true) } onMouseLeave={ event => setIsVisible(false) } /> + @@ -78,14 +55,14 @@ export const NavigatorSearchResultItemInfoView: FC { roomData.roomName } - + { LocalizeText('navigator.roomownercaption') } - - { roomData.ownerName } + + + { roomData.ownerName } + { roomData.description } @@ -99,7 +76,6 @@ export const NavigatorSearchResultItemInfoView: FC - ); }