Merge pull request #184 from duckietm/Dev

🆙 Small fix toolbar
This commit is contained in:
DuckieTM
2026-06-01 14:44:51 +02:00
committed by GitHub
2 changed files with 14 additions and 5 deletions
+13 -4
View File
@@ -1,4 +1,4 @@
import { CreateLinkEvent, GetRoomEngine, GetSessionDataManager, MouseEventType, RoomObjectCategory } from '@nitrots/nitro-renderer'; import { CreateLinkEvent, GetRoomEngine, GetSessionDataManager, RoomObjectCategory } from '@nitrots/nitro-renderer';
import { Dispatch, FC, PropsWithChildren, SetStateAction, useEffect, useRef } from 'react'; import { Dispatch, FC, PropsWithChildren, SetStateAction, useEffect, useRef } from 'react';
import { DispatchUiEvent, GetConfigurationValue, GetRoomSession, GetUserProfile, LocalizeText } from '../../api'; import { DispatchUiEvent, GetConfigurationValue, GetRoomSession, GetUserProfile, LocalizeText } from '../../api';
import { Flex, LayoutItemCountView } from '../../common'; import { Flex, LayoutItemCountView } from '../../common';
@@ -24,11 +24,20 @@ export const ToolbarMeView: FC<PropsWithChildren<{
useEffect(() => useEffect(() =>
{ {
const onClick = (event: MouseEvent) => setMeExpanded(false); const onClick = (event: MouseEvent) =>
{
if(elementRef.current && elementRef.current.contains(event.target as Node)) return;
document.addEventListener('click', onClick); setMeExpanded(false);
};
return () => document.removeEventListener(MouseEventType.MOUSE_CLICK, onClick); const timeout = window.setTimeout(() => document.addEventListener('click', onClick), 0);
return () =>
{
window.clearTimeout(timeout);
document.removeEventListener('click', onClick);
};
}, [ setMeExpanded ]); }, [ setMeExpanded ]);
return ( return (
+1 -1
View File
@@ -372,7 +372,7 @@ export const ToolbarView: FC<{ isInRoom: boolean }> = props =>
animate={ { opacity: 1, y: 0, scale: 1 } } animate={ { opacity: 1, y: 0, scale: 1 } }
exit={ { opacity: 0, y: 6, scale: 0.97 } } exit={ { opacity: 0, y: 6, scale: 0.97 } }
transition={ ME_POPOVER_TRANSITION } transition={ ME_POPOVER_TRANSITION }
className="pointer-events-auto absolute bottom-[calc(100%+10px)] left-1/2 z-[70] -translate-x-1/2"> className="pointer-events-auto fixed bottom-[calc(100%+10px)] left-1/2 z-[70] -translate-x-1/2">
<ToolbarMeView setMeExpanded={ setMeExpanded } unseenAchievementCount={ getTotalUnseen } useGuideTool={ useGuideTool } /> <ToolbarMeView setMeExpanded={ setMeExpanded } unseenAchievementCount={ getTotalUnseen } useGuideTool={ useGuideTool } />
</motion.div> } </motion.div> }
</AnimatePresence> </AnimatePresence>