mirror of
https://github.com/duckietm/Nitro-V3.git
synced 2026-06-20 23:46:19 +00:00
simoleo89
a39aa37231
React 19 dropped the no-arg useRef overload — the type-only useRef<T>() form (no initial value) is gone, every call must pass an initial value. The codebase had 15 occurrences of useRef<HTMLDivElement>() (DOM ref pattern) all flagged by tsgo as 'Expected 1 arguments, but got 0'. Mechanical sweep to useRef<HTMLDivElement>(null) — no behavior change, React still hands out a ref object with .current set to null at mount. Net tsgo error count: 57 -> 42.
52 lines
3.2 KiB
TypeScript
52 lines
3.2 KiB
TypeScript
import { CreateLinkEvent, GetRoomEngine, GetSessionDataManager, MouseEventType, RoomObjectCategory } from '@nitrots/nitro-renderer';
|
|
import { Dispatch, FC, PropsWithChildren, SetStateAction, useEffect, useRef } from 'react';
|
|
import { DispatchUiEvent, GetConfigurationValue, GetRoomSession, GetUserProfile, LocalizeText } from '../../api';
|
|
import { Flex, LayoutItemCountView } from '../../common';
|
|
import { GuideToolEvent } from '../../events';
|
|
|
|
export const ToolbarMeView: FC<PropsWithChildren<{
|
|
useGuideTool: boolean;
|
|
unseenAchievementCount: number;
|
|
setMeExpanded: Dispatch<SetStateAction<boolean>>;
|
|
}>> = props =>
|
|
{
|
|
const { useGuideTool = false, unseenAchievementCount = 0, setMeExpanded = null, children = null, ...rest } = props;
|
|
const elementRef = useRef<HTMLDivElement>(null);
|
|
|
|
useEffect(() =>
|
|
{
|
|
const roomSession = GetRoomSession();
|
|
|
|
if(!roomSession) return;
|
|
|
|
GetRoomEngine().selectRoomObject(roomSession.roomId, roomSession.ownRoomIndex, RoomObjectCategory.UNIT);
|
|
}, []);
|
|
|
|
useEffect(() =>
|
|
{
|
|
const onClick = (event: MouseEvent) => setMeExpanded(false);
|
|
|
|
document.addEventListener('click', onClick);
|
|
|
|
return () => document.removeEventListener(MouseEventType.MOUSE_CLICK, onClick);
|
|
}, [ setMeExpanded ]);
|
|
|
|
return (
|
|
<Flex alignItems="center" className="bg-[rgba(20,20,20,.95)] border border-[solid] border-[#101010] [box-shadow:inset_2px_2px_rgba(255,255,255,.1),inset_-2px_-2px_rgba(255,255,255,.1)] rounded-[$border-radius] p-2" gap={ 2 } innerRef={ elementRef }>
|
|
{ (GetConfigurationValue('guides.enabled') && useGuideTool) &&
|
|
<div className="navigation-item relative nitro-icon icon-me-helper-tool cursor-pointer" onClick={ event => DispatchUiEvent(new GuideToolEvent(GuideToolEvent.TOGGLE_GUIDE_TOOL)) } /> }
|
|
<div className="navigation-item relative nitro-icon icon-me-achievements cursor-pointer" onClick={ event => CreateLinkEvent('achievements/toggle') }>
|
|
{ (unseenAchievementCount > 0) &&
|
|
<LayoutItemCountView count={ unseenAchievementCount } /> }
|
|
</div>
|
|
<div className="navigation-item relative nitro-icon icon-me-profile cursor-pointer" onClick={ event => GetUserProfile(GetSessionDataManager().userId) } />
|
|
<div className="navigation-item relative nitro-icon icon-me-rooms cursor-pointer" onClick={ event => CreateLinkEvent('navigator/search/myworld_view') } />
|
|
<div className="navigation-item relative nitro-icon icon-me-clothing cursor-pointer" onClick={ event => CreateLinkEvent('avatar-editor/toggle') } />
|
|
<div className="navigation-item relative nitro-icon icon-me-badge-creator cursor-pointer" onClick={ event => CreateLinkEvent('badge-creator/toggle') } title={ LocalizeText('toolbar.icon.label.badge_creator') } />
|
|
<div className="navigation-item relative nitro-icon icon-me-settings cursor-pointer" onClick={ event => CreateLinkEvent('user-settings/toggle') } />
|
|
<div className="navigation-item relative nitro-icon icon-me-forums cursor-pointer" onClick={ event => CreateLinkEvent('groupforum/toggle') } title={ LocalizeText('toolbar.icon.label.forums') } />
|
|
{ children }
|
|
</Flex>
|
|
);
|
|
};
|