🆙 Init V3

src/hooks/rooms/widgets/furniture/index.ts

@@ -0,0 +1,20 @@
+export * from './useFurnitureAreaHideWidget';
+export * from './useFurnitureBackgroundColorWidget';
+export * from './useFurnitureBadgeDisplayWidget';
+export * from './useFurnitureContextMenuWidget';
+export * from './useFurnitureCraftingWidget';
+export * from './useFurnitureDimmerWidget';
+export * from './useFurnitureExchangeWidget';
+export * from './useFurnitureExternalImageWidget';
+export * from './useFurnitureFriendFurniWidget';
+export * from './useFurnitureHighScoreWidget';
+export * from './useFurnitureInternalLinkWidget';
+export * from './useFurnitureMannequinWidget';
+export * from './useFurniturePlaylistEditorWidget';
+export * from './useFurniturePresentWidget';
+export * from './useFurnitureRoomLinkWidget';
+export * from './useFurnitureSpamWallPostItWidget';
+export * from './useFurnitureStackHeightWidget';
+export * from './useFurnitureStickieWidget';
+export * from './useFurnitureTrophyWidget';
+export * from './useFurnitureYoutubeWidget';

src/hooks/rooms/widgets/furniture/useFurnitureAreaHideWidget.ts

@@ -0,0 +1,93 @@
+import { GetRoomEngine, RoomAreaSelectionManager, RoomEngineAreaHideStateEvent, RoomEngineTriggerWidgetEvent, RoomObjectVariable } from '@nitrots/nitro-renderer';
+import { useEffect, useState } from 'react';
+import { CanManipulateFurniture } from '../../../../api';
+import { useNitroEvent } from '../../../events';
+import { useRoom } from '../../useRoom';
+
+const useFurnitureAreaHideWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState<number>(-1);
+    const [ category, setCategory ] = useState<number>(-1);
+    const [ isOn, setIsOn ] = useState<boolean>(false);
+    const [ rootX, setRootX ] = useState<number>(0);
+    const [ rootY, setRootY ] = useState<number>(0);
+    const [ width, setWidth ] = useState<number>(0);
+    const [ length, setLength ] = useState<number>(0);
+    const [ invisibility, setInvisibility ] = useState<boolean>(false);
+    const [ wallItems, setWallItems ] = useState<boolean>(false);
+    const [ inverted, setInverted ] = useState<boolean>(false);
+    const { roomSession = null } = useRoom();
+
+    const onClose = () =>
+    {
+        setObjectId(-1);
+        setCategory(-1);
+        setIsOn(false);
+        setRootX(0);
+        setRootY(0);
+        setWidth(0);
+        setLength(0);
+        setInvisibility(false);
+        setWallItems(false);
+        setInverted(false);
+
+        GetRoomEngine().areaSelectionManager.deactivate();
+    };
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_AREA_HIDE, event =>
+    {
+        if(!CanManipulateFurniture(roomSession, event.objectId, event.category)) return;
+
+        setObjectId(event.objectId);
+        setCategory(event.category);
+
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        const model = roomObject.model;
+
+        setIsOn(roomObject.getState(0) === 1);
+        setRootX(model.getValue<number>(RoomObjectVariable.FURNITURE_AREA_HIDE_ROOT_X) ?? 0);
+        setRootY(model.getValue<number>(RoomObjectVariable.FURNITURE_AREA_HIDE_ROOT_Y) ?? 0);
+        setWidth(model.getValue<number>(RoomObjectVariable.FURNITURE_AREA_HIDE_WIDTH) ?? 0);
+        setLength(model.getValue<number>(RoomObjectVariable.FURNITURE_AREA_HIDE_LENGTH) ?? 0);
+        setInvisibility(model.getValue<number>(RoomObjectVariable.FURNITURE_AREA_HIDE_INVISIBILITY) === 1);
+        setWallItems(model.getValue<number>(RoomObjectVariable.FURNITURE_AREA_HIDE_WALL_ITEMS) === 1);
+        setInverted(model.getValue<number>(RoomObjectVariable.FURNITURE_AREA_HIDE_INVERT) === 1);
+    });
+
+    useNitroEvent<RoomEngineAreaHideStateEvent>(RoomEngineAreaHideStateEvent.UPDATE_STATE_AREA_HIDE, event =>
+    {
+        setObjectId(event.objectId);
+        setCategory(event.category);
+        setIsOn(event.isOn);
+    });
+
+    useEffect(() =>
+    {
+        if(objectId === -1) return;
+
+        if(!isOn)
+        {
+            const callback = (rootX: number, rootY: number, width: number, height: number) =>
+            {
+                setRootX(rootX);
+                setRootY(rootY);
+                setWidth(width);
+                setLength(height);
+            };
+
+            if(GetRoomEngine().areaSelectionManager.activate(callback, RoomAreaSelectionManager.HIGHLIGHT_DARKEN))
+            {
+                GetRoomEngine().areaSelectionManager.setHighlight(rootX, rootY, width, length);
+            }
+        }
+        else
+        {
+            GetRoomEngine().areaSelectionManager.deactivate();
+        }
+    }, [ objectId, isOn, rootX, rootY, width, length ]);
+
+    return { objectId, category, isOn, setIsOn, rootX, setRootX, rootY, setRootY, width, setWidth, length, setLength, invisibility, setInvisibility, wallItems, setWallItems, inverted, setInverted, onClose };
+};
+
+export const useFurnitureAreaHideWidget = useFurnitureAreaHideWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureBackgroundColorWidget.ts

@@ -0,0 +1,71 @@
+import { ApplyTonerComposer, ColorConverter, GetRoomEngine, RoomEngineTriggerWidgetEvent, RoomObjectVariable } from '@nitrots/nitro-renderer';
+import { useEffect, useState } from 'react';
+import { CanManipulateFurniture, ColorUtils, DispatchUiEvent, RoomWidgetUpdateBackgroundColorPreviewEvent, SendMessageComposer } from '../../../../api';
+import { useNitroEvent } from '../../../events';
+import { useFurniRemovedEvent } from '../../engine';
+import { useRoom } from '../../useRoom';
+
+const useFurnitureBackgroundColorWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ category, setCategory ] = useState(-1);
+    const [ color, setColor ] = useState(0);
+    const { roomSession = null } = useRoom();
+
+    const applyToner = () =>
+    {
+        const hsl = ColorConverter.rgbToHSL(color);
+        const [ _, hue, saturation, lightness ] = ColorUtils.int_to_8BitVals(hsl);
+        SendMessageComposer(new ApplyTonerComposer(objectId, hue, saturation, lightness));
+    };
+
+    const toggleToner = () => roomSession.useMultistateItem(objectId);
+
+    const onClose = () =>
+    {
+        DispatchUiEvent(new RoomWidgetUpdateBackgroundColorPreviewEvent(RoomWidgetUpdateBackgroundColorPreviewEvent.CLEAR_PREVIEW));
+
+        setObjectId(-1);
+        setCategory(-1);
+        setColor(0);
+    };
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_BACKGROUND_COLOR, event =>
+    {
+        if(!CanManipulateFurniture(roomSession, event.objectId, event.category)) return;
+
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+        const model = roomObject.model;
+
+        setObjectId(event.objectId);
+        setCategory(event.category);
+        const hue = parseInt(model.getValue<string>(RoomObjectVariable.FURNITURE_ROOM_BACKGROUND_COLOR_HUE));
+        const saturation = parseInt(model.getValue<string>(RoomObjectVariable.FURNITURE_ROOM_BACKGROUND_COLOR_SATURATION));
+        const light = parseInt(model.getValue<string>(RoomObjectVariable.FURNITURE_ROOM_BACKGROUND_COLOR_LIGHTNESS));
+
+        const hsl = ColorUtils.eight_bitVals_to_int(0, hue,saturation,light);
+
+        const rgbColor = ColorConverter.hslToRGB(hsl);
+        setColor(rgbColor);
+    });
+
+    useFurniRemovedEvent(((objectId !== -1) && (category !== -1)), event =>
+    {
+        if((event.id !== objectId) || (event.category !== category)) return;
+
+        onClose();
+    });
+
+    useEffect(() =>
+    {
+        if((objectId === -1) || (category === -1)) return;
+
+        const hls = ColorConverter.rgbToHSL(color);
+        const [ _, hue, saturation, lightness ] = ColorUtils.int_to_8BitVals(hls);
+        DispatchUiEvent(new RoomWidgetUpdateBackgroundColorPreviewEvent(RoomWidgetUpdateBackgroundColorPreviewEvent.PREVIEW, hue, saturation, lightness));
+    }, [ objectId, category, color ]);
+
+    return { objectId, color, setColor, applyToner, toggleToner, onClose };
+};
+
+export const useFurnitureBackgroundColorWidget = useFurnitureBackgroundColorWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureBadgeDisplayWidget.ts

@@ -0,0 +1,75 @@
+import { GetRoomEngine, GetSessionDataManager, RoomEngineTriggerWidgetEvent, RoomObjectVariable, StringDataType } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { LocalizeBadgeDescription, LocalizeBadgeName, LocalizeText } from '../../../../api';
+import { useNitroEvent } from '../../../events';
+import { useNotification } from '../../../notification';
+import { useFurniRemovedEvent } from '../../engine';
+
+const useFurnitureBadgeDisplayWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ category, setCategory ] = useState(-1);
+    const [ color, setColor ] = useState('1');
+    const [ badgeName, setBadgeName ] = useState('');
+    const [ badgeDesc, setBadgeDesc ] = useState('');
+    const [ date, setDate ] = useState('');
+    const [ senderName, setSenderName ] = useState('');
+    const { simpleAlert = null } = useNotification();
+
+    const onClose = () =>
+    {
+        setObjectId(-1);
+        setCategory(-1);
+        setColor('1');
+        setBadgeName('');
+        setBadgeDesc('');
+        setDate('');
+        setSenderName('');
+    };
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>([
+        RoomEngineTriggerWidgetEvent.REQUEST_BADGE_DISPLAY_ENGRAVING,
+        RoomEngineTriggerWidgetEvent.REQUEST_ACHIEVEMENT_RESOLUTION_ENGRAVING
+    ], event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        if(!roomObject) return;
+
+        const stringStuff = new StringDataType();
+
+        stringStuff.initializeFromRoomObjectModel(roomObject.model);
+
+        setObjectId(event.objectId);
+        setCategory(event.category);
+        setColor('1');
+        setBadgeName(LocalizeBadgeName(stringStuff.getValue(1)));
+        setBadgeDesc(LocalizeBadgeDescription(stringStuff.getValue(1)));
+        setDate(stringStuff.getValue(2));
+        setSenderName(stringStuff.getValue(3));
+    });
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_ACHIEVEMENT_RESOLUTION_FAILED, event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        if(!roomObject) return;
+
+        const ownerId = roomObject.model.getValue<number>(RoomObjectVariable.FURNITURE_OWNER_ID);
+
+        if(ownerId !== GetSessionDataManager().userId) return;
+
+        simpleAlert(`${ LocalizeText('resolution.failed.subtitle') } ${ LocalizeText('resolution.failed.text') }`, null, null, null, LocalizeText('resolution.failed.title'));
+    });
+
+    useFurniRemovedEvent(((objectId !== -1) && (category !== -1)), event =>
+    {
+        if((event.id !== objectId) || (event.category !== category)) return;
+
+        onClose();
+    });
+
+    return { objectId, category, color, badgeName, badgeDesc, date, senderName, onClose };
+};
+
+export const useFurnitureBadgeDisplayWidget = useFurnitureBadgeDisplayWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureContextMenuWidget.ts

@@ -0,0 +1,179 @@
+import { ContextMenuEnum, GetRoomEngine, GroupFurniContextMenuInfoMessageEvent, GroupFurniContextMenuInfoMessageParser, RoomEngineTriggerWidgetEvent, RoomObjectCategory, RoomObjectVariable } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { IsOwnerOfFurniture, TryJoinGroup, TryVisitRoom } from '../../../../api';
+import { useMessageEvent, useNitroEvent } from '../../../events';
+import { useRoom } from '../../useRoom';
+
+export const MONSTERPLANT_SEED_CONFIRMATION: string = 'MONSTERPLANT_SEED_CONFIRMATION';
+export const PURCHASABLE_CLOTHING_CONFIRMATION: string = 'PURCHASABLE_CLOTHING_CONFIRMATION';
+export const GROUP_FURNITURE: string = 'GROUP_FURNITURE';
+export const EFFECTBOX_OPEN: string = 'EFFECTBOX_OPEN';
+export const MYSTERYTROPHY_OPEN_DIALOG: string = 'MYSTERYTROPHY_OPEN_DIALOG';
+
+const useFurnitureContextMenuWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ mode, setMode ] = useState<string>(null);
+    const [ confirmMode, setConfirmMode ] = useState<string>(null);
+    const [ confirmingObjectId, setConfirmingObjectId ] = useState(-1);
+    const [ groupData, setGroupData ] = useState<GroupFurniContextMenuInfoMessageParser>(null);
+    const [ isGroupMember, setIsGroupMember ] = useState(false);
+    const [ objectOwnerId, setObjectOwnerId ] = useState(-1);
+    const { roomSession = null } = useRoom();
+
+    const onClose = () =>
+    {
+        setObjectId(-1);
+        setGroupData(null);
+        setIsGroupMember(false);
+        setMode(null);
+    };
+
+    const closeConfirm = () =>
+    {
+        setConfirmMode(null);
+        setConfirmingObjectId(-1);
+    };
+
+    const processAction = (name: string) =>
+    {
+        if(name)
+        {
+            switch(name)
+            {
+                case 'use_friend_furni':
+                    roomSession.useMultistateItem(objectId);
+                    break;
+                case 'use_monsterplant_seed':
+                    setConfirmMode(MONSTERPLANT_SEED_CONFIRMATION);
+                    setConfirmingObjectId(objectId);
+                    break;
+                case 'use_random_teleport':
+                    GetRoomEngine().useRoomObject(objectId, RoomObjectCategory.FLOOR);
+                    break;
+                case 'use_purchaseable_clothing':
+                    setConfirmMode(PURCHASABLE_CLOTHING_CONFIRMATION);
+                    setConfirmingObjectId(objectId);
+                    break;
+                case 'use_mystery_box':
+                    roomSession.useMultistateItem(objectId);
+                    break;
+                case 'use_mystery_trophy':
+                    setConfirmMode(MYSTERYTROPHY_OPEN_DIALOG);
+                    setConfirmingObjectId(objectId);
+                    break;
+                case 'join_group':
+                    TryJoinGroup(groupData.guildId);
+                    setIsGroupMember(true);
+                    return;
+                case 'go_to_group_homeroom':
+                    if(groupData) TryVisitRoom(groupData.guildHomeRoomId);
+                    break;
+            }
+        }
+
+        onClose();
+    };
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>([
+        RoomEngineTriggerWidgetEvent.OPEN_FURNI_CONTEXT_MENU,
+        RoomEngineTriggerWidgetEvent.CLOSE_FURNI_CONTEXT_MENU,
+        RoomEngineTriggerWidgetEvent.REQUEST_MONSTERPLANT_SEED_PLANT_CONFIRMATION_DIALOG,
+        RoomEngineTriggerWidgetEvent.REQUEST_PURCHASABLE_CLOTHING_CONFIRMATION_DIALOG,
+        RoomEngineTriggerWidgetEvent.REQUEST_EFFECTBOX_OPEN_DIALOG,
+        RoomEngineTriggerWidgetEvent.REQUEST_MYSTERYBOX_OPEN_DIALOG,
+        RoomEngineTriggerWidgetEvent.REQUEST_MYSTERYTROPHY_OPEN_DIALOG
+    ], event =>
+    {
+        const object = GetRoomEngine().getRoomObject(roomSession.roomId, event.objectId, event.category);
+
+        if(!object) return;
+
+        setObjectOwnerId(object.model.getValue<number>(RoomObjectVariable.FURNITURE_OWNER_ID));
+
+        switch(event.type)
+        {
+            case RoomEngineTriggerWidgetEvent.REQUEST_MONSTERPLANT_SEED_PLANT_CONFIRMATION_DIALOG:
+                if(!IsOwnerOfFurniture(object)) return;
+
+                setConfirmingObjectId(object.id);
+                setConfirmMode(MONSTERPLANT_SEED_CONFIRMATION);
+
+                onClose();
+                return;
+            case RoomEngineTriggerWidgetEvent.REQUEST_EFFECTBOX_OPEN_DIALOG:
+                if(!IsOwnerOfFurniture(object)) return;
+
+                setConfirmingObjectId(object.id);
+                setConfirmMode(EFFECTBOX_OPEN);
+
+                onClose();
+                return;
+            case RoomEngineTriggerWidgetEvent.REQUEST_PURCHASABLE_CLOTHING_CONFIRMATION_DIALOG:
+                if(!IsOwnerOfFurniture(object)) return;
+
+                setConfirmingObjectId(object.id);
+                setConfirmMode(PURCHASABLE_CLOTHING_CONFIRMATION);
+
+                onClose();
+                return;
+            case RoomEngineTriggerWidgetEvent.REQUEST_MYSTERYBOX_OPEN_DIALOG:
+                roomSession.useMultistateItem(object.id);
+
+                onClose();
+                return;
+            case RoomEngineTriggerWidgetEvent.REQUEST_MYSTERYTROPHY_OPEN_DIALOG:
+                if(!IsOwnerOfFurniture(object)) return;
+
+                setConfirmingObjectId(object.id);
+                setConfirmMode(MYSTERYTROPHY_OPEN_DIALOG);
+
+                onClose();
+                return;
+            case RoomEngineTriggerWidgetEvent.OPEN_FURNI_CONTEXT_MENU:
+
+                setObjectId(object.id);
+
+                switch(event.contextMenu)
+                {
+                    case ContextMenuEnum.FRIEND_FURNITURE:
+                        setMode(ContextMenuEnum.FRIEND_FURNITURE);
+                        return;
+                    case ContextMenuEnum.MONSTERPLANT_SEED:
+                        if(IsOwnerOfFurniture(object)) setMode(ContextMenuEnum.MONSTERPLANT_SEED);
+                        return;
+                    case ContextMenuEnum.MYSTERY_BOX:
+                        setMode(ContextMenuEnum.MYSTERY_BOX);
+                        return;
+                    case ContextMenuEnum.MYSTERY_TROPHY:
+                        if(IsOwnerOfFurniture(object)) setMode(ContextMenuEnum.MYSTERY_TROPHY);
+                        return;
+                    case ContextMenuEnum.RANDOM_TELEPORT:
+                        setMode(ContextMenuEnum.RANDOM_TELEPORT);
+                        return;
+                    case ContextMenuEnum.PURCHASABLE_CLOTHING:
+                        if(IsOwnerOfFurniture(object)) setMode(ContextMenuEnum.PURCHASABLE_CLOTHING);
+                        return;
+                }
+
+                return;
+            case RoomEngineTriggerWidgetEvent.CLOSE_FURNI_CONTEXT_MENU:
+                if(object.id === objectId) onClose();
+                return;
+        }
+    });
+
+    useMessageEvent<GroupFurniContextMenuInfoMessageEvent>(GroupFurniContextMenuInfoMessageEvent, event =>
+    {
+        const parser = event.getParser();
+
+        setObjectId(parser.objectId);
+        setGroupData(parser);
+        setIsGroupMember(parser.userIsMember);
+        setMode(GROUP_FURNITURE);
+    });
+
+    return { objectId, mode, confirmMode, confirmingObjectId, groupData, isGroupMember, objectOwnerId, closeConfirm, processAction, onClose };
+};
+
+export const useFurnitureContextMenuWidget = useFurnitureContextMenuWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureCraftingWidget.ts

@@ -0,0 +1,166 @@
+import { CraftableProductsEvent, CraftComposer, CraftingRecipeEvent, CraftingRecipeIngredientParser, CraftingRecipesAvailableEvent, CraftingResultEvent, GetCraftableProductsComposer, GetCraftingRecipeComposer, GetRoomContentLoader, GetRoomEngine, RoomEngineTriggerWidgetEvent, RoomWidgetEnum } from '@nitrots/nitro-renderer';
+import { useEffect, useState } from 'react';
+import { ICraftingIngredient, ICraftingRecipe, LocalizeText, SendMessageComposer } from '../../../../api';
+import { useMessageEvent, useNitroEvent } from '../../../events';
+import { useInventoryFurni } from '../../../inventory';
+import { useNotification } from './../../../notification';
+
+const useFurnitureCraftingWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ recipes, setRecipes ] = useState<ICraftingRecipe[]>([]);
+    const [ selectedRecipe, setSelectedRecipe ] = useState<ICraftingRecipe>(null);
+    const [ ingredients, setIngredients ] = useState<ICraftingIngredient[]>([]);
+    const [ ingredientNames, setIngredientNames ] = useState<string[]>(null);
+    const [ cachedIngredients, setCachedIngredients ] = useState<Map<string, CraftingRecipeIngredientParser[]>>(new Map());
+    const [ isCrafting, setIsCrafting ] = useState(false);
+    const { groupItems = [], getItemsByType = null, activate = null, deactivate = null } = useInventoryFurni();
+    const { simpleAlert = null } = useNotification();
+
+    const requiredIngredients = ((selectedRecipe && cachedIngredients.get(selectedRecipe.name) || null));
+
+    const resetData = () =>
+    {
+        setRecipes([]);
+        setSelectedRecipe(null);
+        setIngredients([]);
+        setCachedIngredients(new Map());
+    };
+
+    const onClose = () =>
+    {
+        setObjectId(-1);
+        resetData();
+    };
+
+    const craft = () =>
+    {
+        setIsCrafting(true);
+
+        SendMessageComposer(new CraftComposer(objectId, selectedRecipe.name));
+    };
+
+    const selectRecipe = (recipe: ICraftingRecipe) =>
+    {
+        setSelectedRecipe(recipe);
+
+        const cache = cachedIngredients.get(recipe.name);
+
+        if(!cache) SendMessageComposer(new GetCraftingRecipeComposer(recipe.name));
+    };
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.OPEN_WIDGET, event =>
+    {
+        if(event.widget !== RoomWidgetEnum.CRAFTING) return;
+
+        setObjectId(event.objectId);
+        resetData();
+        SendMessageComposer(new GetCraftableProductsComposer(event.objectId));
+    });
+
+    useMessageEvent<CraftableProductsEvent>(CraftableProductsEvent, event =>
+    {
+        const parser = event.getParser();
+
+        if(!parser.isActive())
+        {
+            setObjectId(-1);
+
+            return;
+        }
+
+        setRecipes(prevValue =>
+        {
+            const newValue: ICraftingRecipe[] = [];
+
+            for(const recipe of parser.recipes)
+            {
+                //@ts-ignore
+                const itemId = GetRoomContentLoader()._activeObjectTypeIds.get(recipe.itemName);
+                const iconUrl = GetRoomEngine().getFurnitureFloorIconUrl(itemId);
+
+                newValue.push({
+                    name: recipe.recipeName,
+                    localizedName: LocalizeText('roomItem.name.' + itemId),
+                    iconUrl
+                });
+            }
+
+            return newValue;
+        });
+
+        setIngredientNames(parser.ingredients);
+    });
+
+    useMessageEvent<CraftingRecipeEvent>(CraftingRecipeEvent, event =>
+    {
+        const parser = event.getParser();
+
+        setCachedIngredients(prevValue =>
+        {
+            const newValue = new Map(prevValue);
+
+            newValue.set(selectedRecipe.name, parser.ingredients);
+
+            return newValue;
+        });
+    });
+
+    useMessageEvent<CraftingResultEvent>(CraftingResultEvent, event =>
+    {
+        setSelectedRecipe(null);
+        setIsCrafting(false);
+
+        const parser = event.getParser();
+
+        if(parser.result) simpleAlert(LocalizeText('crafting.info.result.ok'));
+    });
+
+    useMessageEvent<CraftingRecipesAvailableEvent>(CraftingRecipesAvailableEvent, event =>
+    {
+    });
+
+    useEffect(() =>
+    {
+        if(!ingredientNames || !ingredientNames.length) return;
+
+        setIngredients(prevValue =>
+        {
+            const newValue: ICraftingIngredient[] = [];
+
+            for(const name of ingredientNames)
+            {
+                //@ts-ignore
+                const itemId = GetRoomContentLoader()._activeObjectTypeIds.get(name);
+                const iconUrl = GetRoomEngine().getFurnitureFloorIconUrl(itemId);
+
+                const inventoryItems = getItemsByType(itemId);
+
+                let amountAvailable = 0;
+
+                if(inventoryItems) for(const inventoryItem of inventoryItems) amountAvailable += inventoryItem.items.length;
+
+                newValue.push({
+                    name: name,
+                    iconUrl,
+                    count: amountAvailable
+                });
+            }
+
+            return newValue;
+        });
+    }, [ groupItems, ingredientNames, getItemsByType ]);
+
+    useEffect(() =>
+    {
+        if((objectId === -1)) return;
+
+        const id = activate();
+
+        return () => deactivate(id);
+    }, [ objectId, activate, deactivate ]);
+
+    return { objectId, recipes, ingredients, selectedRecipe, requiredIngredients, isCrafting, selectRecipe, craft, onClose };
+};
+
+export const useFurnitureCraftingWidget = useFurnitureCraftingWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureDimmerWidget.ts

@@ -0,0 +1,110 @@
+import { GetSessionDataManager, RoomControllerLevel, RoomEngineDimmerStateEvent, RoomEngineTriggerWidgetEvent, RoomId, RoomSessionDimmerPresetsEvent } from '@nitrots/nitro-renderer';
+import { useEffect, useState } from 'react';
+import { DimmerFurnitureWidgetPresetItem, FurnitureDimmerUtilities } from '../../../../api';
+import { useNitroEvent } from '../../../events';
+import { useRoom } from '../../useRoom';
+
+const useFurnitureDimmerWidgetState = () =>
+{
+    const [ presets, setPresets ] = useState<DimmerFurnitureWidgetPresetItem[]>([]);
+    const [ selectedPresetId, setSelectedPresetId ] = useState(0);
+    const [ dimmerState, setDimmerState ] = useState(0);
+    const [ lastDimmerState, setLastDimmerState ] = useState(0);
+    const [ effectId, setEffectId ] = useState(0);
+    const [ color, setColor ] = useState(0xFFFFFF);
+    const [ brightness, setBrightness ] = useState(0xFF);
+    const [ selectedEffectId, setSelectedEffectId ] = useState(0);
+    const [ selectedColor, setSelectedColor ] = useState(0);
+    const [ selectedBrightness, setSelectedBrightness ] = useState(0);
+    const { roomSession = null } = useRoom();
+
+    const canOpenWidget = () => (roomSession.isRoomOwner || (roomSession.controllerLevel >= RoomControllerLevel.GUEST) || GetSessionDataManager().isModerator);
+
+    const selectPresetId = (id: number) =>
+    {
+        const preset = presets[(id - 1)];
+
+        if(!preset) return;
+
+        setSelectedPresetId(preset.id);
+        setSelectedEffectId(preset.type);
+        setSelectedColor(preset.color);
+        setSelectedBrightness(preset.light);
+    };
+
+    const applyChanges = () =>
+    {
+        if(dimmerState === 0) return;
+
+        const selectedPresetIndex = (selectedPresetId - 1);
+
+        if((selectedPresetId < 1) || (selectedPresetId > presets.length)) return;
+
+        const preset = presets[selectedPresetIndex];
+
+        if(!preset || ((selectedEffectId === preset.type) && (selectedColor === preset.color) && (selectedBrightness === preset.light))) return;
+
+        setPresets(prevValue =>
+        {
+            const newValue = [ ...prevValue ];
+
+            newValue[selectedPresetIndex] = new DimmerFurnitureWidgetPresetItem(preset.id, selectedEffectId, selectedColor, selectedBrightness);
+
+            return newValue;
+        });
+
+        FurnitureDimmerUtilities.savePreset(preset.id, selectedEffectId, selectedColor, selectedBrightness, true);
+    };
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_DIMMER, event =>
+    {
+        if(!canOpenWidget()) return;
+
+        roomSession.requestMoodlightSettings();
+    });
+
+    useNitroEvent<RoomSessionDimmerPresetsEvent>(RoomSessionDimmerPresetsEvent.ROOM_DIMMER_PRESETS, event =>
+    {
+        const presets: DimmerFurnitureWidgetPresetItem[] = [];
+
+        let i = 0;
+
+        while(i < event.presetCount)
+        {
+            const preset = event.getPreset(i);
+
+            if(preset) presets.push(new DimmerFurnitureWidgetPresetItem(preset.id, preset.type, preset.color, preset.brightness));
+
+            i++;
+        }
+
+        setPresets(presets);
+        setSelectedPresetId(event.selectedPresetId);
+    });
+
+    useNitroEvent<RoomEngineDimmerStateEvent>(RoomEngineDimmerStateEvent.ROOM_COLOR, event =>
+    {
+        if(RoomId.isRoomPreviewerId(event.roomId)) return;
+
+        setLastDimmerState(dimmerState);
+        setDimmerState(event.state);
+        setSelectedPresetId(event.presetId);
+        setEffectId(event.effectId);
+        setSelectedEffectId(event.effectId);
+        setColor(event.color);
+        setSelectedColor(event.color);
+        setBrightness(event.brightness);
+        setSelectedBrightness(event.brightness);
+    });
+
+    useEffect(() =>
+    {
+        if((dimmerState === 0) && (lastDimmerState === 0)) return;
+
+        FurnitureDimmerUtilities.previewDimmer(selectedColor, selectedBrightness, (selectedEffectId === 2));
+    }, [ dimmerState, lastDimmerState, selectedColor, selectedBrightness, selectedEffectId ]);
+
+    return { presets, selectedPresetId, dimmerState, lastDimmerState, effectId, color, brightness, selectedEffectId, setSelectedEffectId, selectedColor, setSelectedColor, selectedBrightness, setSelectedBrightness, selectPresetId, applyChanges };
+};
+
+export const useFurnitureDimmerWidget = useFurnitureDimmerWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureExchangeWidget.ts

@@ -0,0 +1,48 @@
+import { FurnitureExchangeComposer, GetRoomEngine, RoomEngineTriggerWidgetEvent, RoomObjectVariable } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { IsOwnerOfFurniture, SendMessageComposer } from '../../../../api';
+import { useNitroEvent } from '../../../events';
+import { useFurniRemovedEvent } from '../../engine';
+
+const useFurnitureExchangeWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ category, setCategory ] = useState(-1);
+    const [ value, setValue ] = useState(0);
+
+    const onClose = () =>
+    {
+        setObjectId(-1);
+        setCategory(-1);
+        setValue(0);
+    };
+
+    const redeem = () =>
+    {
+        SendMessageComposer(new FurnitureExchangeComposer(objectId));
+
+        onClose();
+    };
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_CREDITFURNI, event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        if(!roomObject || !IsOwnerOfFurniture(roomObject)) return;
+
+        setObjectId(event.objectId);
+        setCategory(event.category);
+        setValue(roomObject.model.getValue<number>(RoomObjectVariable.FURNITURE_CREDIT_VALUE) || 0);
+    });
+
+    useFurniRemovedEvent(((objectId !== -1) && (category !== -1)), event =>
+    {
+        if((event.id !== objectId) || (event.category !== category)) return;
+
+        onClose();
+    });
+
+    return { objectId, value, redeem, onClose };
+};
+
+export const useFurnitureExchangeWidget = useFurnitureExchangeWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureExternalImageWidget.ts

@@ -0,0 +1,74 @@
+import { GetRoomEngine, RoomEngineTriggerWidgetEvent, RoomObjectCategory, RoomObjectVariable } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { IPhotoData } from '../../../../api';
+import { useNitroEvent } from '../../../events';
+import { useFurniRemovedEvent } from '../../engine';
+import { useRoom } from '../../useRoom';
+
+const useFurnitureExternalImageWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ category, setCategory ] = useState(-1);
+    const [ currentPhotoIndex, setCurrentPhotoIndex ] = useState(-1);
+    const [ currentPhotos, setCurrentPhotos ] = useState<IPhotoData[]>([]);
+    const { roomSession = null } = useRoom();
+
+    const onClose = () =>
+    {
+        setObjectId(-1);
+        setCategory(-1);
+        setCurrentPhotoIndex(-1);
+        setCurrentPhotos([]);
+    };
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_EXTERNAL_IMAGE, event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+        const roomTotalImages = GetRoomEngine().getRoomObjects(roomSession?.roomId, RoomObjectCategory.WALL);
+
+        if(!roomObject) return;
+
+        const datas: IPhotoData[] = [];
+
+        roomTotalImages.forEach(object =>
+        {
+            if(object.type !== 'external_image_wallitem_poster_small') return null;
+
+            const data = object.model.getValue<string>(RoomObjectVariable.FURNITURE_DATA);
+            const jsonData: IPhotoData = JSON.parse(data);
+
+            datas.push(jsonData);
+        });
+
+        setObjectId(event.objectId);
+        setCategory(event.category);
+        setCurrentPhotos(datas);
+
+        const roomObjectPhotoData = (JSON.parse(roomObject.model.getValue<string>(RoomObjectVariable.FURNITURE_DATA)) as IPhotoData);
+
+        setCurrentPhotoIndex(prevValue =>
+        {
+            let index = 0;
+
+            if(roomObjectPhotoData)
+            {
+                index = datas.findIndex(data => (data.u === roomObjectPhotoData.u));
+            }
+
+            if(index < 0) index = 0;
+
+            return index;
+        });
+    });
+
+    useFurniRemovedEvent(((objectId !== -1) && (category !== -1)), event =>
+    {
+        if((event.id !== objectId) || (event.category !== category)) return;
+
+        onClose();
+    });
+
+    return { objectId, currentPhotoIndex, currentPhotos, onClose };
+};
+
+export const useFurnitureExternalImageWidget = useFurnitureExternalImageWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureFriendFurniWidget.ts

@@ -0,0 +1,75 @@
+import { FriendFurniConfirmLockMessageComposer, GetRoomEngine, LoveLockFurniFinishedEvent, LoveLockFurniFriendConfirmedEvent, LoveLockFurniStartEvent, RoomEngineTriggerWidgetEvent, RoomObjectVariable } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { SendMessageComposer } from '../../../../api';
+import { useMessageEvent, useNitroEvent } from '../../../events';
+import { useFurniRemovedEvent } from '../../engine';
+
+const useFurnitureFriendFurniWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ category, setCategory ] = useState(-1);
+    const [ type, setType ] = useState(0);
+    const [ usernames, setUsernames ] = useState<string[]>([]);
+    const [ figures, setFigures ] = useState<string[]>([]);
+    const [ date, setDate ] = useState<string>(null);
+    const [ stage, setStage ] = useState(0);
+
+    const onClose = () =>
+    {
+        setObjectId(-1);
+        setCategory(-1);
+        setType(0);
+        setUsernames([]);
+        setFigures([]);
+        setDate(null);
+    };
+
+    const respond = (flag: boolean) =>
+    {
+        SendMessageComposer(new FriendFurniConfirmLockMessageComposer(objectId, flag));
+
+        onClose();
+    };
+
+    useMessageEvent<LoveLockFurniStartEvent>(LoveLockFurniStartEvent, event =>
+    {
+        const parser = event.getParser();
+
+        setObjectId(parser.furniId);
+        setStage(parser.start ? 1 : 2);
+    });
+
+    useMessageEvent<LoveLockFurniFinishedEvent>(LoveLockFurniFinishedEvent, event => onClose());
+    useMessageEvent<LoveLockFurniFriendConfirmedEvent>(LoveLockFurniFriendConfirmedEvent, event => onClose());
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_FRIEND_FURNITURE_ENGRAVING, event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        if(!roomObject) return;
+
+        const data = roomObject.model.getValue<string[]>(RoomObjectVariable.FURNITURE_DATA);
+        const type = roomObject.model.getValue<number>(RoomObjectVariable.FURNITURE_FRIENDFURNI_ENGRAVING);
+
+        if((data[0] !== '1') || (data.length !== 6)) return;
+
+        setObjectId(event.objectId);
+        setCategory(event.category);
+        setType(type);
+        setUsernames([ data[1], data[2] ]);
+        setFigures([ data[3], data[4] ]);
+        setDate(data[5]);
+        setStage(0);
+    });
+
+    useFurniRemovedEvent(((objectId !== -1) && (category !== -1)), event =>
+    {
+        if((event.id !== objectId) || (event.category !== category)) return;
+
+        onClose();
+    });
+
+    return { objectId, type, usernames, figures, date, stage, onClose, respond };
+};
+
+export const useFurnitureFriendFurniWidget = useFurnitureFriendFurniWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureHighScoreWidget.ts

@@ -0,0 +1,55 @@
+import { GetRoomEngine, HighScoreDataType, ObjectDataFactory, RoomEngineTriggerWidgetEvent, RoomObjectVariable } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { useNitroEvent } from '../../../events';
+import { useRoom } from '../../useRoom';
+
+const SCORE_TYPES = [ 'perteam', 'mostwins', 'classic' ];
+const CLEAR_TYPES = [ 'alltime', 'daily', 'weekly', 'monthly' ];
+
+const useFurnitureHighScoreWidgetState = () =>
+{
+    const [ stuffDatas, setStuffDatas ] = useState<Map<number, HighScoreDataType>>(new Map());
+    const { roomSession = null } = useRoom();
+
+    const getScoreType = (type: number) => SCORE_TYPES[type];
+    const getClearType = (type: number) => CLEAR_TYPES[type];
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_HIGH_SCORE_DISPLAY, event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        if(!roomObject) return;
+
+        const formatKey = roomObject.model.getValue<number>(RoomObjectVariable.FURNITURE_DATA_FORMAT);
+        const stuffData = (ObjectDataFactory.getData(formatKey) as HighScoreDataType);
+
+        stuffData.initializeFromRoomObjectModel(roomObject.model);
+
+        setStuffDatas(prevValue =>
+        {
+            const newValue = new Map(prevValue);
+
+            newValue.set(roomObject.id, stuffData);
+
+            return newValue;
+        });
+    });
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_HIDE_HIGH_SCORE_DISPLAY, event =>
+    {
+        if(event.roomId !== roomSession.roomId) return;
+
+        setStuffDatas(prevValue =>
+        {
+            const newValue = new Map(prevValue);
+
+            newValue.delete(event.objectId);
+
+            return newValue;
+        });
+    });
+
+    return { stuffDatas, getScoreType, getClearType };
+};
+
+export const useFurnitureHighScoreWidget = useFurnitureHighScoreWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureInternalLinkWidget.ts

@@ -0,0 +1,26 @@
+import { CreateLinkEvent, GetRoomEngine, RoomEngineTriggerWidgetEvent, RoomObjectVariable } from '@nitrots/nitro-renderer';
+import { useNitroEvent } from '../../../events';
+
+const INTERNALLINK = 'internalLink';
+
+const useFurnitureInternalLinkWidgetState = () =>
+{
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_INTERNAL_LINK, event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        if(!roomObject) return;
+
+        const data = roomObject.model.getValue<any>(RoomObjectVariable.FURNITURE_DATA);
+
+        let link = data[INTERNALLINK];
+
+        if(!link || !link.length) link = roomObject.model.getValue<string>(RoomObjectVariable.FURNITURE_INTERNAL_LINK);
+
+        if(link && link.length) CreateLinkEvent(link);
+    });
+
+    return {};
+};
+
+export const useFurnitureInternalLinkWidget = useFurnitureInternalLinkWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureMannequinWidget.ts

@@ -0,0 +1,80 @@
+import { FurnitureMannequinSaveLookComposer, FurnitureMannequinSaveNameComposer, FurnitureMultiStateComposer, GetAvatarRenderManager, GetRoomEngine, HabboClubLevelEnum, RoomEngineTriggerWidgetEvent, RoomObjectVariable } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { MannequinUtilities, SendMessageComposer } from '../../../../api';
+import { useNitroEvent } from '../../../events';
+import { useFurniRemovedEvent } from '../../engine';
+
+const useFurnitureMannequinWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ category, setCategory ] = useState(-1);
+    const [ figure, setFigure ] = useState(null);
+    const [ gender, setGender ] = useState(null);
+    const [ clubLevel, setClubLevel ] = useState(HabboClubLevelEnum.NO_CLUB);
+    const [ name, setName ] = useState(null);
+
+    const onClose = () =>
+    {
+        setObjectId(-1);
+        setCategory(-1);
+        setFigure(null);
+        setGender(null);
+        setName(null);
+    };
+
+    const saveFigure = () =>
+    {
+        if(objectId === -1) return;
+
+        SendMessageComposer(new FurnitureMannequinSaveLookComposer(objectId));
+
+        onClose();
+    };
+
+    const wearFigure = () =>
+    {
+        if(objectId === -1) return;
+
+        SendMessageComposer(new FurnitureMultiStateComposer(objectId));
+
+        onClose();
+    };
+
+    const saveName = () =>
+    {
+        if(objectId === -1) return;
+
+        SendMessageComposer(new FurnitureMannequinSaveNameComposer(objectId, name));
+    };
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_MANNEQUIN, event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        if(!roomObject) return;
+
+        const model = roomObject.model;
+        const figure = (model.getValue<string>(RoomObjectVariable.FURNITURE_MANNEQUIN_FIGURE) || null);
+        const gender = (model.getValue<string>(RoomObjectVariable.FURNITURE_MANNEQUIN_GENDER) || null);
+        const figureContainer = GetAvatarRenderManager().createFigureContainer(figure);
+        const figureClubLevel = GetAvatarRenderManager().getFigureClubLevel(figureContainer, gender, MannequinUtilities.MANNEQUIN_CLOTHING_PART_TYPES);
+
+        setObjectId(event.objectId);
+        setCategory(event.category);
+        setFigure(figure);
+        setGender(gender);
+        setClubLevel(figureClubLevel);
+        setName(model.getValue<string>(RoomObjectVariable.FURNITURE_MANNEQUIN_NAME) || null);
+    });
+
+    useFurniRemovedEvent(((objectId !== -1) && (category !== -1)), event =>
+    {
+        if((event.id !== objectId) || (event.category !== category)) return;
+
+        onClose();
+    });
+
+    return { objectId, figure, gender, clubLevel, name, setName, saveFigure, wearFigure, saveName, onClose };
+};
+
+export const useFurnitureMannequinWidget = useFurnitureMannequinWidgetState;

src/hooks/rooms/widgets/furniture/useFurniturePlaylistEditorWidget.ts

@@ -0,0 +1,108 @@
+import { AddJukeboxDiskComposer, AdvancedMap, FurnitureListAddOrUpdateEvent, FurnitureListEvent, FurnitureListRemovedEvent, FurnitureMultiStateComposer, GetRoomEngine, GetSessionDataManager, GetSoundManager, IAdvancedMap, IMessageEvent, ISongInfo, NotifyPlayedSongEvent, NowPlayingEvent, PlayListStatusEvent, RemoveJukeboxDiskComposer, RoomControllerLevel, RoomEngineTriggerWidgetEvent, SongDiskInventoryReceivedEvent } from '@nitrots/nitro-renderer';
+import { useCallback, useState } from 'react';
+import { IsOwnerOfFurniture, LocalizeText, NotificationAlertType, NotificationBubbleType, SendMessageComposer } from '../../../../api';
+import { useMessageEvent, useNitroEvent } from '../../../events';
+import { useNotification } from '../../../notification';
+import { useFurniRemovedEvent } from '../../engine';
+import { useRoom } from '../../useRoom';
+
+const useFurniturePlaylistEditorWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ category, setCategory ] = useState(-1);
+    const [ currentPlayingIndex, setCurrentPlayingIndex ] = useState(-1);
+    const [ diskInventory, setDiskInventory ] = useState<IAdvancedMap<number, number>>(new AdvancedMap());
+    const [ playlist, setPlaylist ] = useState<ISongInfo[]>([]);
+    const { roomSession = null } = useRoom();
+    const { showSingleBubble = null, simpleAlert = null } = useNotification();
+
+    const onClose = () =>
+    {
+        setObjectId(-1);
+        setCategory(-1);
+    };
+
+    const addToPlaylist = useCallback((diskId: number, slotNumber: number) => SendMessageComposer(new AddJukeboxDiskComposer(diskId, slotNumber)), []);
+
+    const removeFromPlaylist = useCallback((slotNumber: number) => SendMessageComposer(new RemoveJukeboxDiskComposer(slotNumber)), []);
+
+    const togglePlayPause = useCallback((furniId: number, position: number) => SendMessageComposer(new FurnitureMultiStateComposer(furniId, position)), []);
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_PLAYLIST_EDITOR, event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        if(!roomObject) return;
+
+        if(IsOwnerOfFurniture(roomObject))
+        {
+            // show the editor
+            setObjectId(event.objectId);
+            setCategory(event.category);
+
+            GetSoundManager().musicController?.requestUserSongDisks();
+            GetSoundManager().musicController?.getRoomItemPlaylist()?.requestPlayList();
+
+            return;
+        }
+
+        if(roomSession.isRoomOwner || (roomSession.controllerLevel >= RoomControllerLevel.GUEST) || GetSessionDataManager().isModerator) SendMessageComposer(new FurnitureMultiStateComposer(event.objectId, -2));
+    });
+
+    useFurniRemovedEvent(((objectId !== -1) && (category !== -1)), event =>
+    {
+        if((event.id !== objectId) || (event.category !== category)) return;
+
+        onClose();
+    });
+
+    useNitroEvent<NowPlayingEvent>(NowPlayingEvent.NPE_SONG_CHANGED, event =>
+    {
+        setCurrentPlayingIndex(event.position);
+    });
+
+    useNitroEvent<NotifyPlayedSongEvent>(NotifyPlayedSongEvent.NOTIFY_PLAYED_SONG, event =>
+    {
+        showSingleBubble(LocalizeText('soundmachine.notification.playing', [ 'songname', 'songauthor' ], [ event.name, event.creator ]), NotificationBubbleType.SOUNDMACHINE);
+    });
+
+    useNitroEvent<SongDiskInventoryReceivedEvent>(SongDiskInventoryReceivedEvent.SDIR_SONG_DISK_INVENTORY_RECEIVENT_EVENT, event =>
+    {
+        setDiskInventory(GetSoundManager().musicController?.songDiskInventory.clone());
+    });
+
+    useNitroEvent<PlayListStatusEvent>(PlayListStatusEvent.PLUE_PLAY_LIST_UPDATED, event =>
+    {
+        setPlaylist(GetSoundManager().musicController?.getRoomItemPlaylist()?.entries.concat());
+    });
+
+    useNitroEvent<PlayListStatusEvent>(PlayListStatusEvent.PLUE_PLAY_LIST_FULL, event =>
+    {
+        simpleAlert(LocalizeText('playlist.editor.alert.playlist.full'), NotificationAlertType.ALERT, '', '', LocalizeText('playlist.editor.alert.playlist.full.title'));
+    });
+
+    const onFurniListUpdated = (event : IMessageEvent) =>
+    {
+        if(objectId === -1) return;
+
+        if(event instanceof FurnitureListEvent)
+        {
+            if(event.getParser().fragmentNumber === 0)
+            {
+                GetSoundManager().musicController?.requestUserSongDisks();
+            }
+        }
+        else
+        {
+            GetSoundManager().musicController?.requestUserSongDisks();
+        }
+    };
+
+    useMessageEvent(FurnitureListEvent, onFurniListUpdated);
+    useMessageEvent(FurnitureListRemovedEvent, onFurniListUpdated);
+    useMessageEvent(FurnitureListAddOrUpdateEvent, onFurniListUpdated);
+
+    return { objectId, diskInventory, playlist, currentPlayingIndex, onClose, addToPlaylist, removeFromPlaylist, togglePlayPause };
+};
+
+export const useFurniturePlaylistEditorWidget = useFurniturePlaylistEditorWidgetState;

src/hooks/rooms/widgets/furniture/useFurniturePresentWidget.ts

@@ -0,0 +1,235 @@
+import { GetRoomEngine, GetSessionDataManager, IFurnitureData, IGetImageListener, PetFigureData, RoomEngineTriggerWidgetEvent, RoomObjectCategory, RoomObjectVariable, RoomSessionPresentEvent, TextureUtils, Vector3d } from '@nitrots/nitro-renderer';
+import { useMemo, useState } from 'react';
+import { IsOwnerOfFurniture, LocalizeText, ProductTypeEnum } from '../../../../api';
+import { useNitroEvent } from '../../../events';
+import { useFurniRemovedEvent } from '../../engine';
+import { useRoom } from '../../useRoom';
+
+const FLOOR: string = 'floor';
+const WALLPAPER: string = 'wallpaper';
+const LANDSCAPE: string = 'landscape';
+const POSTER: string = 'poster';
+
+const useFurniturePresentWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ classId, setClassId ] = useState(-1);
+    const [ itemType, setItemType ] = useState<string>(null);
+    const [ text, setText ] = useState<string>(null);
+    const [ isOwnerOfFurniture, setIsOwnerOfFurniture ] = useState(false);
+    const [ senderName, setSenderName ] = useState<string>(null);
+    const [ senderFigure, setSenderFigure ] = useState<string>(null);
+    const [ placedItemId, setPlacedItemId ] = useState(-1);
+    const [ placedItemType, setPlacedItemType ] = useState<string>(null);
+    const [ placedInRoom, setPlacedInRoom ] = useState(false);
+    const [ imageUrl, setImageUrl ] = useState<string>(null);
+    const { roomSession = null } = useRoom();
+
+    const onClose = () =>
+    {
+        setObjectId(-1);
+        setClassId(-1);
+        setItemType(null);
+        setText(null);
+        setIsOwnerOfFurniture(false);
+        setSenderName(null);
+        setSenderFigure(null);
+        setPlacedItemId(-1);
+        setPlacedItemType(null);
+        setPlacedInRoom(false);
+        setImageUrl(null);
+    };
+
+    const openPresent = () =>
+    {
+        if(objectId === -1) return;
+
+        roomSession.openGift(objectId);
+
+        GetRoomEngine().changeObjectModelData(GetRoomEngine().activeRoomId, objectId, RoomObjectCategory.FLOOR, RoomObjectVariable.FURNITURE_DISABLE_PICKING_ANIMATION, 1);
+    };
+
+    const imageListener: IGetImageListener = useMemo(() =>
+    {
+        // async fix image
+        return {
+            imageReady: (id, texture, image) =>
+            {
+                (async () =>
+                {
+                    if(!image && texture)
+                    {
+                        image = await TextureUtils.generateImage(texture);
+                    }
+
+                    setImageUrl(image.src);
+                })();
+            },
+            imageFailed: null
+        };
+    }, []);
+
+    useNitroEvent<RoomSessionPresentEvent>(RoomSessionPresentEvent.RSPE_PRESENT_OPENED, event =>
+    {
+        let furniData: IFurnitureData = null;
+
+        if(event.itemType === ProductTypeEnum.FLOOR)
+        {
+            furniData = GetSessionDataManager().getFloorItemData(event.classId);
+        }
+        else if(event.itemType === ProductTypeEnum.WALL)
+        {
+            furniData = GetSessionDataManager().getWallItemData(event.classId);
+        }
+
+        let isOwnerOfFurni = false;
+
+        if(event.placedInRoom)
+        {
+            const roomObject = GetRoomEngine().getRoomObject(roomSession.roomId, event.placedItemId, RoomObjectCategory.FLOOR);
+
+            if(roomObject) isOwnerOfFurni = IsOwnerOfFurniture(roomObject);
+        }
+
+        let giftImage: string = null;
+
+        switch(event.itemType)
+        {
+            case ProductTypeEnum.WALL: {
+                if(furniData)
+                {
+                    switch(furniData.className)
+                    {
+                        case FLOOR:
+                        case LANDSCAPE:
+                        case WALLPAPER:
+                            let imageType = null;
+                            let message = null;
+
+                            if(furniData.className === FLOOR)
+                            {
+                                imageType = 'packagecard_icon_floor';
+                                message = LocalizeText('inventory.furni.item.floor.name');
+                            }
+
+                            else if(furniData.className === LANDSCAPE)
+                            {
+                                imageType = 'packagecard_icon_landscape';
+                                message = LocalizeText('inventory.furni.item.landscape.name');
+                            }
+
+                            else
+                            {
+                                imageType = 'packagecard_icon_wallpaper';
+                                message = LocalizeText('inventory.furni.item.wallpaper.name');
+                            }
+
+                            setText(message);
+                            //setImageUrl(getGiftImageUrl(imageType));
+                            break;
+                        case POSTER: {
+                            const productCode = event.productCode;
+
+                            let extras: string = null;
+
+                            if(productCode.indexOf('poster') === 0) extras = productCode.replace('poster', '');
+
+                            const productData = GetSessionDataManager().getProductData(productCode);
+
+                            let name: string = null;
+
+                            if(productData) name = productData.name;
+                            else if(furniData) name = furniData.name;
+
+                            setText(name);
+                            setImageUrl(GetRoomEngine().getFurnitureWallIconUrl(event.classId, extras));
+
+                            break;
+                        }
+                        default: {
+                            setText(furniData.name || null);
+                            setImageUrl(GetRoomEngine().getFurnitureWallIconUrl(event.classId));
+                            break;
+                        }
+                    }
+                }
+
+                break;
+            }
+            case ProductTypeEnum.HABBO_CLUB:
+                setText(LocalizeText('widget.furni.present.hc'));
+                //setImageUrl(getGiftImageUrl('packagecard_icon_hc'));
+                break;
+            default: {
+                if(event.placedItemType === ProductTypeEnum.PET)
+                {
+                    const petfigureString = event.petFigureString;
+
+                    if(petfigureString && petfigureString.length)
+                    {
+                        const petFigureData = new PetFigureData(petfigureString);
+
+                        (async () =>
+                        {
+                            const petImage = GetRoomEngine().getRoomObjectPetImage(petFigureData.typeId, petFigureData.paletteId, petFigureData.color, new Vector3d(90), 64, imageListener, true, 0, petFigureData.customParts);
+
+                            if(petImage) setImageUrl((await petImage.getImage()).src);
+                        })();
+                    }
+                }
+                else
+                {
+                    (async () =>
+                    {
+                        const furniImage = GetRoomEngine().getFurnitureFloorImage(event.classId, new Vector3d(90), 64, imageListener);
+
+                        if(furniImage) setImageUrl((await furniImage.getImage()).src);
+                    })();
+                }
+
+                const productData = GetSessionDataManager().getProductData(event.productCode);
+
+                setText((productData && productData.name) || furniData.name);
+                break;
+            }
+        }
+
+        setObjectId(0);
+        setClassId(event.classId);
+        setItemType(event.itemType);
+        setIsOwnerOfFurniture(isOwnerOfFurni);
+        setPlacedItemId(event.placedItemId);
+        setPlacedItemType(event.placedItemType);
+        setPlacedInRoom(event.placedInRoom);
+    });
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_PRESENT, event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        if(!roomObject) return null;
+
+        onClose();
+
+        setObjectId(event.objectId);
+        setClassId(-1);
+        setText((roomObject.model.getValue<string>(RoomObjectVariable.FURNITURE_DATA) || ''));
+        setIsOwnerOfFurniture(IsOwnerOfFurniture(roomObject));
+        setSenderName((roomObject.model.getValue<string>(RoomObjectVariable.FURNITURE_PURCHASER_NAME) || null));
+        setSenderFigure((roomObject.model.getValue<string>(RoomObjectVariable.FURNITURE_PURCHASER_FIGURE) || null));
+    });
+
+    useFurniRemovedEvent((objectId !== -1), event =>
+    {
+        if(event.id === objectId) onClose();
+
+        if(event.id === placedItemId)
+        {
+            if(placedInRoom) setPlacedInRoom(false);
+        }
+    });
+
+    return { objectId, classId, itemType, text, isOwnerOfFurniture, senderName, senderFigure, placedItemId, placedItemType, placedInRoom, imageUrl, openPresent, onClose };
+};
+
+export const useFurniturePresentWidget = useFurniturePresentWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureRoomLinkWidget.ts

@@ -0,0 +1,49 @@
+import { GetGuestRoomMessageComposer, GetGuestRoomResultEvent, GetRoomEngine, RoomEngineTriggerWidgetEvent, RoomObjectVariable } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { SendMessageComposer } from '../../../../api';
+import { useMessageEvent, useNitroEvent } from '../../../events';
+
+const INTERNALLINK = 'internalLink';
+
+const useFurnitureRoomLinkWidgetState = () =>
+{
+    const [ roomIdToEnter, setRoomIdToEnter ] = useState(0);
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_ROOM_LINK, event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        if(!roomObject) return;
+
+        const data = roomObject.model.getValue<any>(RoomObjectVariable.FURNITURE_DATA);
+
+        let roomId = data[INTERNALLINK];
+
+        if(!roomId || !roomId.length) roomId = roomObject.model.getValue<string>(RoomObjectVariable.FURNITURE_INTERNAL_LINK);
+
+        if(!roomId || !roomId.length) return;
+
+        roomId = parseInt(roomId, 10);
+
+        if(isNaN(roomId)) return;
+
+        setRoomIdToEnter(roomId);
+
+        SendMessageComposer(new GetGuestRoomMessageComposer(roomId, false, false));
+    });
+
+    useMessageEvent<GetGuestRoomResultEvent>(GetGuestRoomResultEvent, event =>
+    {
+        if(!roomIdToEnter) return;
+
+        const parser = event.getParser();
+
+        if(parser.data.roomId !== roomIdToEnter) return;
+
+        setRoomIdToEnter(0);
+    });
+
+    return {};
+};
+
+export const useFurnitureRoomLinkWidget = useFurnitureRoomLinkWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureSpamWallPostItWidget.ts

@@ -0,0 +1,59 @@
+import { AddSpamWallPostItMessageComposer, GetRoomEngine, RequestSpamWallPostItMessageEvent, RoomObjectCategory } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { SendMessageComposer } from '../../../../api';
+import { useMessageEvent } from '../../../events';
+import { useInventoryFurni } from '../../../inventory';
+
+const useFurnitureSpamWallPostItWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ category, setCategory ] = useState(-1);
+    const [ itemType, setItemType ] = useState('');
+    const [ location, setLocation ] = useState('');
+    const [ color, setColor ] = useState('0');
+    const [ text, setText ] = useState('');
+    const [ canModify, setCanModify ] = useState(false);
+    const { getWallItemById = null } = useInventoryFurni();
+
+    const onClose = () =>
+    {
+        SendMessageComposer(new AddSpamWallPostItMessageComposer(objectId, location, color, text));
+
+        setObjectId(-1);
+        setCategory(-1);
+        setItemType('');
+        setLocation('');
+        setColor('0');
+        setText('');
+        setCanModify(false);
+    };
+
+    useMessageEvent<RequestSpamWallPostItMessageEvent>(RequestSpamWallPostItMessageEvent, event =>
+    {
+        const parser = event.getParser();
+
+        setObjectId(parser.itemId);
+        setCategory(RoomObjectCategory.WALL);
+
+        const inventoryItem = getWallItemById(parser.itemId);
+
+        let itemType = 'post_it';
+
+        if(inventoryItem)
+        {
+            const wallItemType = GetRoomEngine().getFurnitureWallName(inventoryItem.type);
+
+            if(wallItemType.match('post_it_')) itemType = wallItemType;
+        }
+
+        setItemType(itemType);
+        setLocation(parser.location);
+        setColor('FFFF33');
+        setText('');
+        setCanModify(true);
+    });
+
+    return { objectId, color, setColor, text, setText, canModify, onClose };
+};
+
+export const useFurnitureSpamWallPostItWidget = useFurnitureSpamWallPostItWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureStackHeightWidget.ts

@@ -0,0 +1,79 @@
+import { FurnitureStackHeightComposer, FurnitureStackHeightEvent, GetRoomEngine, RoomEngineTriggerWidgetEvent } from '@nitrots/nitro-renderer';
+import { useEffect, useState } from 'react';
+import { CanManipulateFurniture, GetRoomSession, SendMessageComposer } from '../../../../api';
+import { useMessageEvent, useNitroEvent } from '../../../events';
+import { useFurniRemovedEvent } from '../../engine';
+
+const MAX_HEIGHT: number = 40;
+
+const useFurnitureStackHeightWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ category, setCategory ] = useState(-1);
+    const [ height, setHeight ] = useState(0);
+    const [ pendingHeight, setPendingHeight ] = useState(-1);
+
+    const onClose = () =>
+    {
+        setObjectId(-1);
+        setCategory(-1);
+        setHeight(0);
+        setPendingHeight(-1);
+    };
+
+    const updateHeight = (height: number, server: boolean = false) =>
+    {
+        if(!height) height = 0;
+
+        height = Math.abs(height);
+
+        if(!server) ((height > MAX_HEIGHT) && (height = MAX_HEIGHT));
+
+        setHeight(parseFloat(height.toFixed(2)));
+
+        if(!server) setPendingHeight(height * 100);
+    };
+
+    useMessageEvent<FurnitureStackHeightEvent>(FurnitureStackHeightEvent, event =>
+    {
+        const parser = event.getParser();
+
+        if(objectId !== parser.furniId) return;
+
+        updateHeight(parser.height, true);
+    });
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_STACK_HEIGHT, event =>
+    {
+        if(!CanManipulateFurniture(GetRoomSession(), event.objectId, event.category)) return;
+
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        if(!roomObject) return;
+
+        setObjectId(event.objectId);
+        setCategory(event.category);
+        setHeight(roomObject.getLocation().z);
+        setPendingHeight(-1);
+    });
+
+    useFurniRemovedEvent(((objectId !== -1) && (category !== -1)), event =>
+    {
+        if((event.id !== objectId) || (event.category !== category)) return;
+
+        onClose();
+    });
+
+    useEffect(() =>
+    {
+        if((objectId === -1) || (pendingHeight === -1)) return;
+
+        const timeout = setTimeout(() => SendMessageComposer(new FurnitureStackHeightComposer(objectId, ~~(pendingHeight))), 10);
+
+        return () => clearTimeout(timeout);
+    }, [ objectId, pendingHeight ]);
+
+    return { objectId, height, maxHeight: MAX_HEIGHT, onClose, updateHeight };
+};
+
+export const useFurnitureStackHeightWidget = useFurnitureStackHeightWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureStickieWidget.ts

@@ -0,0 +1,85 @@
+import { GetRoomEngine, GetSessionDataManager, RoomEngineTriggerWidgetEvent, RoomObjectVariable } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { GetRoomSession, IsOwnerOfFurniture } from '../../../../api';
+import { useNitroEvent } from '../../../events';
+import { useFurniRemovedEvent } from '../../engine';
+
+const useFurnitureStickieWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ category, setCategory ] = useState(-1);
+    const [ color, setColor ] = useState('0');
+    const [ text, setText ] = useState('');
+    const [ type, setType ] = useState('');
+    const [ canModify, setCanModify ] = useState(false);
+
+    const onClose = () =>
+    {
+        setObjectId(-1);
+        setCategory(-1);
+        setColor('0');
+        setText('');
+        setType('');
+        setCanModify(false);
+    };
+
+    const updateColor = (newColor: string) =>
+    {
+        if(newColor === color) return;
+
+        setColor(newColor);
+
+        GetRoomEngine().modifyRoomObjectData(objectId, category, newColor, text);
+    };
+
+    const updateText = (newText: string) =>
+    {
+        setText(newText);
+
+        GetRoomEngine().modifyRoomObjectData(objectId, category, color, newText);
+    };
+
+    const trash = () => GetRoomEngine().deleteRoomObject(objectId, category);
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_STICKIE, event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        if(!roomObject) return;
+
+        const data = roomObject.model.getValue<string>(RoomObjectVariable.FURNITURE_ITEMDATA);
+
+        if(data.length < 6) return;
+
+        let color: string = null;
+        let text: string = null;
+
+        if(data.indexOf(' ') > 0)
+        {
+            color = data.slice(0, data.indexOf(' '));
+            text = data.slice((data.indexOf(' ') + 1), data.length);
+        }
+        else
+        {
+            color = data;
+        }
+
+        setObjectId(event.objectId);
+        setCategory(event.category);
+        setColor(color || '0');
+        setText(text || '');
+        setType(roomObject.type || 'post_it');
+        setCanModify(GetRoomSession().isRoomOwner || GetSessionDataManager().isModerator || IsOwnerOfFurniture(roomObject));
+    });
+
+    useFurniRemovedEvent(((objectId !== -1) && (category !== -1)), event =>
+    {
+        if((event.id !== objectId) || (event.category !== category)) return;
+
+        onClose();
+    });
+
+    return { objectId, color, text, type, canModify, updateColor, updateText, trash, onClose };
+};
+
+export const useFurnitureStickieWidget = useFurnitureStickieWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureTrophyWidget.ts

@@ -0,0 +1,62 @@
+import { GetRoomEngine, RoomEngineTriggerWidgetEvent, RoomObjectVariable } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { useNitroEvent } from '../../../events';
+import { useFurniRemovedEvent } from '../../engine';
+
+const useFurnitureTrophyWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ category, setCategory ] = useState(-1);
+    const [ color, setColor ] = useState('1');
+    const [ senderName, setSenderName ] = useState('');
+    const [ date, setDate ] = useState('');
+    const [ message, setMessage ] = useState('');
+
+    const onClose = () =>
+    {
+        setObjectId(-1);
+        setCategory(-1);
+        setColor('1');
+        setSenderName('');
+        setDate('');
+        setMessage('');
+    };
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_TROPHY, event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        if(!roomObject) return;
+
+        let data = roomObject.model.getValue<string>(RoomObjectVariable.FURNITURE_DATA);
+        let extra = roomObject.model.getValue<string>(RoomObjectVariable.FURNITURE_EXTRAS);
+
+        if(!extra) extra = '0';
+
+        setObjectId(event.objectId);
+        setCategory(event.category);
+        setColor(roomObject.model.getValue<string>(RoomObjectVariable.FURNITURE_COLOR) || '1');
+
+        const senderName = data.substring(0, data.indexOf('\t'));
+
+        data = data.substring((senderName.length + 1), data.length);
+
+        const trophyDate = data.substring(0, data.indexOf('\t'));
+        const trophyText = data.substr((trophyDate.length + 1), data.length);
+
+        setSenderName(senderName);
+        setDate(trophyDate);
+        setMessage(trophyText);
+    });
+
+    useFurniRemovedEvent(((objectId !== -1) && (category !== -1)), event =>
+    {
+        if((event.id !== objectId) || (event.category !== category)) return;
+
+        onClose();
+    });
+
+    return { objectId, color, senderName, date, message, onClose };
+};
+
+export const useFurnitureTrophyWidget = useFurnitureTrophyWidgetState;

src/hooks/rooms/widgets/furniture/useFurnitureYoutubeWidget.ts

@@ -0,0 +1,127 @@
+import { ControlYoutubeDisplayPlaybackMessageComposer, GetRoomEngine, GetSessionDataManager, GetYoutubeDisplayStatusMessageComposer, RoomEngineTriggerWidgetEvent, RoomId, SecurityLevel, SetYoutubeDisplayPlaylistMessageComposer, YoutubeControlVideoMessageEvent, YoutubeDisplayPlaylist, YoutubeDisplayPlaylistsEvent, YoutubeDisplayVideoMessageEvent } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { IsOwnerOfFurniture, SendMessageComposer, YoutubeVideoPlaybackStateEnum } from '../../../../api';
+import { useMessageEvent, useNitroEvent } from '../../../events';
+import { useFurniRemovedEvent } from '../../engine';
+
+const CONTROL_COMMAND_PREVIOUS_VIDEO = 0;
+const CONTROL_COMMAND_NEXT_VIDEO = 1;
+const CONTROL_COMMAND_PAUSE_VIDEO = 2;
+const CONTROL_COMMAND_CONTINUE_VIDEO = 3;
+
+const useFurnitureYoutubeWidgetState = () =>
+{
+    const [ objectId, setObjectId ] = useState(-1);
+    const [ category, setCategory ] = useState(-1);
+    const [ videoId, setVideoId ] = useState<string>(null);
+    const [ videoStart, setVideoStart ] = useState<number>(null);
+    const [ videoEnd, setVideoEnd ] = useState<number>(null);
+    const [ currentVideoState, setCurrentVideoState ] = useState(-1);
+    const [ selectedVideo, setSelectedVideo ] = useState<string>(null);
+    const [ playlists, setPlaylists ] = useState<YoutubeDisplayPlaylist[]>(null);
+    const [ hasControl, setHasControl ] = useState(false);
+
+    const onClose = () =>
+    {
+        setObjectId(-1);
+        setCategory(-1);
+        setVideoId(null);
+        setVideoStart(null);
+        setVideoEnd(null);
+        setCurrentVideoState(-1);
+        setSelectedVideo(null);
+        setPlaylists(null);
+        setHasControl(false);
+    };
+
+    const previous = () => SendMessageComposer(new ControlYoutubeDisplayPlaybackMessageComposer(objectId, CONTROL_COMMAND_PREVIOUS_VIDEO));
+
+    const next = () => SendMessageComposer(new ControlYoutubeDisplayPlaybackMessageComposer(objectId, CONTROL_COMMAND_NEXT_VIDEO));
+
+    const pause = () => (hasControl && videoId && videoId.length) && SendMessageComposer(new ControlYoutubeDisplayPlaybackMessageComposer(objectId, CONTROL_COMMAND_PAUSE_VIDEO));
+
+    const play = () => (hasControl && videoId && videoId.length) && SendMessageComposer(new ControlYoutubeDisplayPlaybackMessageComposer(objectId, CONTROL_COMMAND_CONTINUE_VIDEO));
+
+    const selectVideo = (video: string) =>
+    {
+        if(selectedVideo === video)
+        {
+            setSelectedVideo(null);
+            SendMessageComposer(new SetYoutubeDisplayPlaylistMessageComposer(objectId, ''));
+
+            return;
+        }
+
+        setSelectedVideo(video);
+        SendMessageComposer(new SetYoutubeDisplayPlaylistMessageComposer(objectId, video));
+    };
+
+    useNitroEvent<RoomEngineTriggerWidgetEvent>(RoomEngineTriggerWidgetEvent.REQUEST_YOUTUBE, event =>
+    {
+        if(RoomId.isRoomPreviewerId(event.roomId)) return;
+
+        const roomObject = GetRoomEngine().getRoomObject(event.roomId, event.objectId, event.category);
+
+        if(!roomObject) return;
+
+        setObjectId(event.objectId);
+        setCategory(event.category);
+        setHasControl(GetSessionDataManager().hasSecurity(SecurityLevel.EMPLOYEE) || IsOwnerOfFurniture(roomObject));
+
+        SendMessageComposer(new GetYoutubeDisplayStatusMessageComposer(event.objectId));
+    });
+
+    useMessageEvent<YoutubeDisplayVideoMessageEvent>(YoutubeDisplayVideoMessageEvent, event =>
+    {
+        const parser = event.getParser();
+
+        if((objectId === -1) || (objectId !== parser.furniId)) return;
+
+        setVideoId(parser.videoId);
+        setVideoStart(parser.startAtSeconds);
+        setVideoEnd(parser.endAtSeconds);
+        setCurrentVideoState(parser.state);
+    });
+
+    useMessageEvent<YoutubeDisplayPlaylistsEvent>(YoutubeDisplayPlaylistsEvent, event =>
+    {
+        const parser = event.getParser();
+
+        if((objectId === -1) || (objectId !== parser.furniId)) return;
+
+        setPlaylists(parser.playlists);
+        setSelectedVideo(parser.selectedPlaylistId);
+        setVideoId(null);
+        setCurrentVideoState(-1);
+        setVideoEnd(null);
+        setVideoStart(null);
+    });
+
+    useMessageEvent<YoutubeControlVideoMessageEvent>(YoutubeControlVideoMessageEvent, event =>
+    {
+        const parser = event.getParser();
+
+        if((objectId === -1) || (objectId !== parser.furniId)) return;
+
+        switch(parser.commandId)
+        {
+            case 1:
+                setCurrentVideoState(YoutubeVideoPlaybackStateEnum.PLAYING);
+                break;
+            case 2:
+                setCurrentVideoState(YoutubeVideoPlaybackStateEnum.PAUSED);
+                break;
+        }
+    });
+
+    useFurniRemovedEvent(((objectId !== -1) && (category !== -1)), event =>
+    {
+        if((event.id !== objectId) || (event.category !== category)) return;
+
+        onClose();
+    });
+
+    return { objectId, videoId, videoStart, videoEnd, currentVideoState, selectedVideo, playlists, onClose, previous, next, pause, play, selectVideo };
+};
+
+export const useFurnitureYoutubeWidget = useFurnitureYoutubeWidgetState;

src/hooks/rooms/widgets/index.ts

@@ -0,0 +1,12 @@
+export * from './furniture';
+export * from './useAvatarInfoWidget';
+export * from './useChatInputWidget';
+export * from './useChatWidget';
+export * from './useDoorbellWidget';
+export * from './useFilterWordsWidget';
+export * from './useFriendRequestWidget';
+export * from './useFurniChooserWidget';
+export * from './usePetPackageWidget';
+export * from './usePollWidget';
+export * from './useUserChooserWidget';
+export * from './useWordQuizWidget';

src/hooks/rooms/widgets/useAvatarInfoWidget.ts

@@ -0,0 +1,357 @@
+import { GetRoomEngine, GetSessionDataManager, RoomEngineObjectEvent, RoomEngineUseProductEvent, RoomObjectCategory, RoomObjectType, RoomObjectVariable, RoomSessionPetInfoUpdateEvent, RoomSessionPetStatusUpdateEvent, RoomSessionUserDataUpdateEvent } from '@nitrots/nitro-renderer';
+import { useEffect, useState } from 'react';
+import { AvatarInfoFurni, AvatarInfoName, AvatarInfoPet, AvatarInfoRentableBot, AvatarInfoUser, AvatarInfoUtilities, CanManipulateFurniture, FurniCategory, IAvatarInfo, IsOwnerOfFurniture, RoomWidgetUpdateRoomObjectEvent, UseProductItem } from '../../../api';
+import { useNitroEvent, useUiEvent } from '../../events';
+import { useFriends } from '../../friends';
+import { useWired } from '../../wired';
+import { useObjectDeselectedEvent, useObjectRollOutEvent, useObjectRollOverEvent, useObjectSelectedEvent } from '../engine';
+import { useRoom } from '../useRoom';
+
+const useAvatarInfoWidgetState = () =>
+{
+    const [ avatarInfo, setAvatarInfo ] = useState<IAvatarInfo>(null);
+    const [ activeNameBubble, setActiveNameBubble ] = useState<AvatarInfoName>(null);
+    const [ nameBubbles, setNameBubbles ] = useState<AvatarInfoName[]>([]);
+    const [ productBubbles, setProductBubbles ] = useState<UseProductItem[]>([]);
+    const [ confirmingProduct, setConfirmingProduct ] = useState<UseProductItem>(null);
+    const [ pendingPetId, setPendingPetId ] = useState<number>(-1);
+    const [ isDecorating, setIsDecorating ] = useState(false);
+    const { friends = [] } = useFriends();
+    const { selectObjectForWired = null } = useWired();
+    const { roomSession = null } = useRoom();
+
+    const removeNameBubble = (index: number) =>
+    {
+        setNameBubbles(prevValue =>
+        {
+            const newValue = [ ...prevValue ];
+
+            newValue.splice(index, 1);
+
+            return newValue;
+        });
+    };
+
+    const removeProductBubble = (index: number) =>
+    {
+        setProductBubbles(prevValue =>
+        {
+            const newValue = [ ...prevValue ];
+            const item = newValue.splice(index, 1)[0];
+
+            if(confirmingProduct === item) setConfirmingProduct(null);
+
+            return newValue;
+        });
+    };
+
+    const updateConfirmingProduct = (product: UseProductItem) =>
+    {
+        setConfirmingProduct(product);
+        setProductBubbles([]);
+    };
+
+    const getObjectName = (objectId: number, category: number) =>
+    {
+        const name = AvatarInfoUtilities.getObjectName(objectId, category);
+
+        if(!name) return;
+
+        setActiveNameBubble(name);
+
+        if(category !== RoomObjectCategory.UNIT) setProductBubbles([]);
+    };
+
+    const getObjectInfo = (objectId: number, category: number) =>
+    {
+        let info: IAvatarInfo = null;
+
+        switch(category)
+        {
+            case RoomObjectCategory.FLOOR:
+            case RoomObjectCategory.WALL:
+                info = AvatarInfoUtilities.getFurniInfo(objectId, category);
+
+                if(info) selectObjectForWired(objectId, category);
+                break;
+            case RoomObjectCategory.UNIT: {
+                const userData = roomSession.userDataManager.getUserDataByIndex(objectId);
+
+                if(!userData) break;
+
+                switch(userData.type)
+                {
+                    case RoomObjectType.PET:
+                        roomSession.userDataManager.requestPetInfo(userData.webID);
+                        setPendingPetId(userData.webID);
+                        break;
+                    case RoomObjectType.USER:
+                        info = AvatarInfoUtilities.getUserInfo(category, userData);
+                        break;
+                    case RoomObjectType.BOT:
+                        info = AvatarInfoUtilities.getBotInfo(category, userData);
+                        break;
+                    case RoomObjectType.RENTABLE_BOT:
+                        info = AvatarInfoUtilities.getRentableBotInfo(category, userData);
+                        break;
+                }
+            }
+
+        }
+
+        if(!info) return;
+
+        setAvatarInfo(info);
+    };
+
+    const processUsableRoomObject = (objectId: number) =>
+    {
+    };
+
+    const refreshPetInfo = () =>
+    {
+        // roomSession.userDataManager.requestPetInfo(petData.id);
+    };
+
+    useNitroEvent<RoomSessionUserDataUpdateEvent>(RoomSessionUserDataUpdateEvent.USER_DATA_UPDATED, event =>
+    {
+        if(!event.addedUsers.length) return;
+
+        let addedNameBubbles: AvatarInfoName[] = [];
+
+        event.addedUsers.forEach(user =>
+        {
+            if(user.webID === GetSessionDataManager().userId || user.type !== RoomObjectType.USER) return;
+
+            if(friends.find(friend => (friend.id === user.webID)))
+            {
+                addedNameBubbles.push(new AvatarInfoName(user.roomIndex, RoomObjectCategory.UNIT, user.webID, user.name, user.type, true));
+            }
+        });
+
+        if(!addedNameBubbles.length) return;
+
+        setNameBubbles(prevValue =>
+        {
+            const newValue = [ ...prevValue ];
+
+            addedNameBubbles.forEach(bubble =>
+            {
+                const oldIndex = newValue.findIndex(oldBubble => (oldBubble.id === bubble.id));
+
+                if(oldIndex > -1) newValue.splice(oldIndex, 1);
+
+                newValue.push(bubble);
+            });
+
+            return newValue;
+        });
+    });
+
+    useNitroEvent<RoomSessionPetInfoUpdateEvent>(RoomSessionPetInfoUpdateEvent.PET_INFO, event =>
+    {
+        const petData = event.petInfo;
+
+        if(!petData) return;
+
+        if(petData.id !== pendingPetId) return;
+
+        const petInfo = AvatarInfoUtilities.getPetInfo(petData);
+
+        if(!petInfo) return;
+
+        setAvatarInfo(petInfo);
+        setPendingPetId(-1);
+    });
+
+    useNitroEvent<RoomSessionPetStatusUpdateEvent>(RoomSessionPetStatusUpdateEvent.PET_STATUS_UPDATE, event =>
+    {
+    /*     var _local_2:Boolean;
+        var _local_3:Boolean;
+        var _local_4:Boolean;
+        var _local_5:Boolean;
+        var _local_6:RoomUserData;
+        var _local_7:_Str_4828;
+        if (((!(this._container == null)) && (!(this._container.events == null))))
+        {
+            _local_2 = k.canBreed;
+            _local_3 = k.canHarvest;
+            _local_4 = k.canRevive;
+            _local_5 = k.hasBreedingPermission;
+            _local_6 = this._Str_19958(k.petId);
+            if (_local_6 == null)
+            {
+                Logger.log((("Could not find pet with the id: " + k.petId) + " given by petStatusUpdate"));
+                return;
+            }
+            _local_7 = new _Str_4828(_local_6.roomObjectId, _local_2, _local_3, _local_4, _local_5);
+            this._container.events.dispatchEvent(_local_7); */
+    });
+
+    useNitroEvent<RoomEngineUseProductEvent>(RoomEngineUseProductEvent.USE_PRODUCT_FROM_INVENTORY, event =>
+    {
+        // this._Str_23199((k as RoomEngineUseProductEvent).inventoryStripId, (k as RoomEngineUseProductEvent).furnitureTypeId);
+    });
+
+    useNitroEvent<RoomEngineUseProductEvent>(RoomEngineUseProductEvent.USE_PRODUCT_FROM_ROOM, event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(roomSession.roomId, event.objectId, RoomObjectCategory.FLOOR);
+
+        if(!roomObject || !IsOwnerOfFurniture(roomObject)) return;
+
+        const ownerId = roomObject.model.getValue<number>(RoomObjectVariable.FURNITURE_OWNER_ID);
+        const typeId = roomObject.model.getValue<number>(RoomObjectVariable.FURNITURE_TYPE_ID);
+        const furniData = GetSessionDataManager().getFloorItemData(typeId);
+        const parts = furniData.customParams.split(' ');
+        const part = (parts.length ? parseInt(parts[0]) : -1);
+
+        if(part === -1) return;
+
+        const useProductBubbles: UseProductItem[] = [];
+        const roomObjects = GetRoomEngine().getRoomObjects(roomSession.roomId, RoomObjectCategory.UNIT);
+
+        for(const roomObject of roomObjects)
+        {
+            const userData = roomSession.userDataManager.getUserDataByIndex(roomObject.id);
+
+            let replace = false;
+
+            if(!userData || (userData.type !== RoomObjectType.PET))
+            {
+
+            }
+            else
+            {
+                if(userData.ownerId === ownerId)
+                {
+                    if(userData.hasSaddle && (furniData.specialType === FurniCategory.PET_SADDLE)) replace = true;
+
+                    const figureParts = userData.figure.split(' ');
+                    const figurePart = (figureParts.length ? parseInt(figureParts[0]) : -1);
+
+                    if(figurePart === part)
+                    {
+                        if(furniData.specialType === FurniCategory.MONSTERPLANT_REVIVAL)
+                        {
+                            if(!userData.canRevive) continue;
+                        }
+
+                        if(furniData.specialType === FurniCategory.MONSTERPLANT_REBREED)
+                        {
+                            if((userData.petLevel < 7) || userData.canRevive || userData.canBreed) continue;
+                        }
+
+                        if(furniData.specialType === FurniCategory.MONSTERPLANT_FERTILIZE)
+                        {
+                            if((userData.petLevel >= 7) || userData.canRevive) continue;
+                        }
+
+                        useProductBubbles.push(new UseProductItem(userData.roomIndex, RoomObjectCategory.UNIT, userData.name, event.objectId, roomObject.id, -1, replace));
+                    }
+                }
+            }
+        }
+
+        setConfirmingProduct(null);
+
+        if(useProductBubbles.length) setProductBubbles(useProductBubbles);
+    });
+
+    useNitroEvent<RoomEngineObjectEvent>(RoomEngineObjectEvent.REQUEST_MANIPULATION, event =>
+    {
+        if(!CanManipulateFurniture(roomSession, event.objectId, event.category)) return;
+
+        setIsDecorating(true);
+    });
+
+    useObjectSelectedEvent(event =>
+    {
+        getObjectInfo(event.id, event.category);
+    });
+
+    useObjectDeselectedEvent(event =>
+    {
+        setAvatarInfo(null);
+        setProductBubbles([]);
+    });
+
+    useObjectRollOverEvent(event =>
+    {
+        if(avatarInfo || (event.category !== RoomObjectCategory.UNIT)) return;
+
+        getObjectName(event.id, event.category);
+    });
+
+    useObjectRollOutEvent(event =>
+    {
+        if(!activeNameBubble || (event.category !== RoomObjectCategory.UNIT) || (activeNameBubble.roomIndex !== event.id)) return;
+
+        setActiveNameBubble(null);
+    });
+
+    useUiEvent<RoomWidgetUpdateRoomObjectEvent>([
+        RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED,
+        RoomWidgetUpdateRoomObjectEvent.USER_REMOVED
+    ], event =>
+    {
+        if(activeNameBubble && (activeNameBubble.category === event.category) && (activeNameBubble.roomIndex === event.id)) setActiveNameBubble(null);
+
+        if(event.category === RoomObjectCategory.UNIT)
+        {
+            let index = nameBubbles.findIndex(bubble => (bubble.roomIndex === event.id));
+
+            if(index > -1) setNameBubbles(prevValue => prevValue.filter(bubble => (bubble.roomIndex === event.id)));
+
+            index = productBubbles.findIndex(bubble => (bubble.id === event.id));
+
+            if(index > -1) setProductBubbles(prevValue => prevValue.filter(bubble => (bubble.id !== event.id)));
+        }
+
+        else if(event.category === RoomObjectCategory.FLOOR)
+        {
+            const index = productBubbles.findIndex(bubble => (bubble.id === event.id));
+
+            if(index > -1) setProductBubbles(prevValue => prevValue.filter(bubble => (bubble.requestRoomObjectId !== event.id)));
+        }
+
+        if(avatarInfo)
+        {
+            if(avatarInfo instanceof AvatarInfoFurni)
+            {
+                if(avatarInfo.id === event.id) setAvatarInfo(null);
+            }
+
+            else if((avatarInfo instanceof AvatarInfoUser) || (avatarInfo instanceof AvatarInfoRentableBot) || (avatarInfo instanceof AvatarInfoPet))
+            {
+                if(avatarInfo.roomIndex === event.id) setAvatarInfo(null);
+            }
+        }
+    });
+
+    useEffect(() =>
+    {
+        if(!avatarInfo) return;
+
+        setActiveNameBubble(null);
+        setNameBubbles([]);
+        setProductBubbles([]);
+    }, [ avatarInfo ]);
+
+    useEffect(() =>
+    {
+        if(!activeNameBubble) return;
+
+        setNameBubbles([]);
+    }, [ activeNameBubble ]);
+
+    useEffect(() =>
+    {
+		if(!roomSession) return;
+		
+        roomSession.isDecorating = isDecorating;
+    }, [ roomSession, isDecorating ]);
+
+    return { avatarInfo, setAvatarInfo, activeNameBubble, setActiveNameBubble, nameBubbles, productBubbles, confirmingProduct, isDecorating, setIsDecorating, removeNameBubble, removeProductBubble, updateConfirmingProduct, getObjectName };
+};
+
+export const useAvatarInfoWidget = useAvatarInfoWidgetState;

src/hooks/rooms/widgets/useChatInputWidget.ts

@@ -0,0 +1,282 @@
+import { AvatarExpressionEnum, CreateLinkEvent, GetEventDispatcher, GetRoomEngine, GetSessionDataManager, GetTicker, HabboClubLevelEnum, RoomControllerLevel, RoomEngineObjectEvent, RoomObjectCategory, RoomRotatingEffect, RoomSessionChatEvent, RoomSettingsComposer, RoomShakingEffect, RoomZoomEvent, TextureUtils } from '@nitrots/nitro-renderer';
+import { useEffect, useState } from 'react';
+import { ChatMessageTypeEnum, GetClubMemberLevel, GetConfigurationValue, LocalizeText, SendMessageComposer } from '../../../api';
+import { useNitroEvent } from '../../events';
+import { useNotification } from '../../notification';
+import { useObjectSelectedEvent } from '../engine';
+import { useRoom } from '../useRoom';
+
+const useChatInputWidgetState = () =>
+{
+    const [ selectedUsername, setSelectedUsername ] = useState('');
+    const [ isTyping, setIsTyping ] = useState<boolean>(false);
+    const [ typingStartedSent, setTypingStartedSent ] = useState(false);
+    const [ isIdle, setIsIdle ] = useState(false);
+    const [ floodBlocked, setFloodBlocked ] = useState(false);
+    const [ floodBlockedSeconds, setFloodBlockedSeconds ] = useState(0);
+    const { showNitroAlert = null, showConfirm = null } = useNotification();
+    const { roomSession = null } = useRoom();
+
+    const sendChat = (text: string, chatType: number, recipientName: string = '', styleId: number = 0) =>
+    {
+        if(text === '') return null;
+
+        const parts = text.split(' ');
+
+        if(parts.length > 0)
+        {
+            const firstPart = parts[0];
+            let secondPart = '';
+
+            if(parts.length > 1) secondPart = parts[1];
+
+            if((firstPart.charAt(0) === ':') && (secondPart === 'x'))
+            {
+                const selectedAvatarId = GetRoomEngine().selectedAvatarId;
+
+                if(selectedAvatarId > -1)
+                {
+                    const userData = roomSession.userDataManager.getUserDataByIndex(selectedAvatarId);
+
+                    if(userData)
+                    {
+                        secondPart = userData.name;
+                        text = text.replace(' x', (' ' + userData.name));
+                    }
+                }
+            }
+
+            switch(firstPart.toLowerCase())
+            {
+                case ':shake':
+                    RoomShakingEffect.init(2500, 5000);
+                    RoomShakingEffect.turnVisualizationOn();
+
+                    return null;
+
+                case ':rotate':
+                    RoomRotatingEffect.init(2500, 5000);
+                    RoomRotatingEffect.turnVisualizationOn();
+
+                    return null;
+                case ':d':
+                case ';d':
+                    if(GetClubMemberLevel() === HabboClubLevelEnum.VIP)
+                    {
+                        roomSession.sendExpressionMessage(AvatarExpressionEnum.LAUGH.ordinal);
+                    }
+
+                    break;
+                case 'o/':
+                case '_o/':
+                    roomSession.sendExpressionMessage(AvatarExpressionEnum.WAVE.ordinal);
+
+                    return null;
+                case ':kiss':
+                    if(GetClubMemberLevel() === HabboClubLevelEnum.VIP)
+                    {
+                        roomSession.sendExpressionMessage(AvatarExpressionEnum.BLOW.ordinal);
+
+                        return null;
+                    }
+
+                    break;
+                case ':jump':
+                    if(GetClubMemberLevel() === HabboClubLevelEnum.VIP)
+                    {
+                        roomSession.sendExpressionMessage(AvatarExpressionEnum.JUMP.ordinal);
+
+                        return null;
+                    }
+
+                    break;
+                case ':idle':
+                    roomSession.sendExpressionMessage(AvatarExpressionEnum.IDLE.ordinal);
+
+                    return null;
+                case '_b':
+                    roomSession.sendExpressionMessage(AvatarExpressionEnum.RESPECT.ordinal);
+
+                    return null;
+                case ':sign':
+                    roomSession.sendSignMessage(parseInt(secondPart));
+
+                    return null;
+                case ':iddqd':
+                case ':flip':
+                    GetEventDispatcher().dispatchEvent(new RoomZoomEvent(roomSession.roomId, -1, true));
+
+                    return null;
+                case ':zoom':
+                    GetEventDispatcher().dispatchEvent(new RoomZoomEvent(roomSession.roomId, parseInt(secondPart)));
+
+                    return null;
+                case ':screenshot':
+                    const texture = GetRoomEngine().createTextureFromRoom(roomSession.roomId, 1);
+
+                    (async () =>
+                    {
+                        const image = new Image();
+
+                        image.src = await TextureUtils.generateImageUrl(texture);
+
+                        const newWindow = window.open('');
+                        newWindow.document.write(image.outerHTML);
+                    })();
+                    return null;
+                case ':pickall':
+                    if(roomSession.isRoomOwner || GetSessionDataManager().isModerator)
+                    {
+                        showConfirm(LocalizeText('room.confirm.pick_all'), () =>
+                        {
+                            GetSessionDataManager().sendSpecialCommandMessage(':pickall');
+                        },
+                        null, null, null, LocalizeText('generic.alert.title'));
+                    }
+
+                    return null;
+                case ':ejectall':
+                    if(roomSession.isRoomOwner || GetSessionDataManager().isModerator || roomSession.controllerLevel >= RoomControllerLevel.GUEST)
+                    {
+                        showConfirm(LocalizeText('room.confirm.eject_all'), () =>
+                        {
+                            GetSessionDataManager().sendSpecialCommandMessage(':ejectall');
+                        },
+                        null, null, null, LocalizeText('generic.alert.title'));
+                    }
+                    return null;
+                case ':furni':
+                    CreateLinkEvent('furni-chooser/');
+                    return null;
+                case ':chooser':
+                    CreateLinkEvent('user-chooser/');
+                    return null;
+                case ':floor':
+                case ':bcfloor':
+                    if(roomSession.controllerLevel >= RoomControllerLevel.ROOM_OWNER) CreateLinkEvent('floor-editor/show');
+
+                    return null;
+                case ':togglefps': {
+                    if(GetTicker().maxFPS > 0) GetTicker().maxFPS = 0;
+                    else GetTicker().maxFPS = GetConfigurationValue('system.animation.fps');
+
+                    return null;
+                }
+                case ':client':
+                case ':nitro':
+                case ':billsonnn':
+                    showNitroAlert();
+                    return null;
+                case ':settings':
+                    if(roomSession.isRoomOwner || GetSessionDataManager().isModerator)
+                    {
+                        SendMessageComposer(new RoomSettingsComposer(roomSession.roomId));
+                    }
+
+                    return null;
+            }
+        }
+
+        switch(chatType)
+        {
+            case ChatMessageTypeEnum.CHAT_DEFAULT:
+                roomSession.sendChatMessage(text, styleId);
+                break;
+            case ChatMessageTypeEnum.CHAT_SHOUT:
+                roomSession.sendShoutMessage(text, styleId);
+                break;
+            case ChatMessageTypeEnum.CHAT_WHISPER:
+                roomSession.sendWhisperMessage(recipientName, text, styleId);
+                break;
+        }
+    };
+
+    useNitroEvent<RoomSessionChatEvent>(RoomSessionChatEvent.FLOOD_EVENT, event =>
+    {
+        setFloodBlocked(true);
+        setFloodBlockedSeconds(parseFloat(event.message));
+    });
+
+    useObjectSelectedEvent(event =>
+    {
+        if(event.category !== RoomObjectCategory.UNIT) return;
+
+        const userData = roomSession.userDataManager.getUserDataByIndex(event.id);
+
+        if(!userData) return;
+
+        setSelectedUsername(userData.name);
+    });
+
+    useNitroEvent<RoomEngineObjectEvent>(RoomEngineObjectEvent.DESELECTED, event => setSelectedUsername(''));
+
+    useEffect(() =>
+    {
+        if(!floodBlocked) return;
+
+        let seconds = 0;
+
+        const interval = setInterval(() =>
+        {
+            setFloodBlockedSeconds(prevValue =>
+            {
+                seconds = ((prevValue || 0) - 1);
+
+                return seconds;
+            });
+
+            if(seconds < 0)
+            {
+                clearInterval(interval);
+
+                setFloodBlocked(false);
+            }
+        }, 1000);
+
+        return () => clearInterval(interval);
+    }, [ floodBlocked ]);
+
+    useEffect(() =>
+    {
+        if(!isIdle) return;
+
+        let timeout: ReturnType<typeof setTimeout> = null;
+
+        if(isIdle)
+        {
+            timeout = setTimeout(() =>
+            {
+                setIsIdle(false);
+                setIsTyping(false);
+            }, 10000);
+        }
+
+        return () => clearTimeout(timeout);
+    }, [ isIdle ]);
+
+    useEffect(() =>
+    {
+        if(isTyping)
+        {
+            if(!typingStartedSent)
+            {
+                setTypingStartedSent(true);
+
+                roomSession.sendChatTypingMessage(isTyping);
+            }
+        }
+        else
+        {
+            if(typingStartedSent)
+            {
+                setTypingStartedSent(false);
+
+                roomSession.sendChatTypingMessage(isTyping);
+            }
+        }
+    }, [ roomSession, isTyping, typingStartedSent ]);
+
+    return { selectedUsername, floodBlocked, floodBlockedSeconds, setIsTyping, setIsIdle, sendChat };
+};
+
+export const useChatInputWidget = useChatInputWidgetState;

src/hooks/rooms/widgets/useChatWidget.ts

@@ -0,0 +1,191 @@
+import { GetGuestRoomResultEvent, GetRoomEngine, PetFigureData, RoomChatSettings, RoomChatSettingsEvent, RoomDragEvent, RoomObjectCategory, RoomObjectType, RoomObjectVariable, RoomSessionChatEvent, RoomUserData, SystemChatStyleEnum } from '@nitrots/nitro-renderer';
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { ChatBubbleMessage, ChatBubbleUtilities, ChatEntryType, ChatHistoryCurrentDate, GetConfigurationValue, GetRoomObjectScreenLocation, IRoomChatSettings, LocalizeText, PlaySound, RoomChatFormatter } from '../../../api';
+import { useMessageEvent, useNitroEvent } from '../../events';
+import { useRoom } from '../useRoom';
+import { useChatHistory } from './../../chat-history';
+
+const useChatWidgetState = () =>
+{
+    const [chatMessages, setChatMessages] = useState<ChatBubbleMessage[]>([]);
+    const [chatSettings, setChatSettings] = useState<IRoomChatSettings>({
+        mode: RoomChatSettings.CHAT_MODE_FREE_FLOW,
+        weight: RoomChatSettings.CHAT_BUBBLE_WIDTH_NORMAL,
+        speed: RoomChatSettings.CHAT_SCROLL_SPEED_NORMAL,
+        distance: 50,
+        protection: RoomChatSettings.FLOOD_FILTER_NORMAL
+    });
+    const { roomSession = null } = useRoom();
+    const { addChatEntry } = useChatHistory();
+    const isDisposed = useRef(false);
+
+    const getScrollSpeed = useMemo(() =>
+    {
+        if(!chatSettings) return 6000;
+
+        switch(chatSettings.speed)
+        {
+            case RoomChatSettings.CHAT_SCROLL_SPEED_FAST:
+                return 3000;
+            case RoomChatSettings.CHAT_SCROLL_SPEED_NORMAL:
+                return 6000;
+            case RoomChatSettings.CHAT_SCROLL_SPEED_SLOW:
+                return 12000;
+        }
+    }, [chatSettings]);
+
+    useNitroEvent<RoomSessionChatEvent>(RoomSessionChatEvent.CHAT_EVENT, async event =>
+    {
+        const roomObject = GetRoomEngine().getRoomObject(roomSession.roomId, event.objectId, RoomObjectCategory.UNIT);
+        const bubbleLocation = roomObject ? GetRoomObjectScreenLocation(roomSession.roomId, roomObject?.id, RoomObjectCategory.UNIT) : { x: 0, y: 0 };
+        const userData = roomObject ? roomSession.userDataManager.getUserDataByIndex(event.objectId) : new RoomUserData(-1);
+
+        let username = '';
+        let avatarColor = 0;
+        let imageUrl: string = null;
+        let chatType = event.chatType;
+        let styleId = event.style;
+        let userType = 0;
+        let petType = -1;
+        let text = event.message;
+
+        if(userData)
+        {
+            userType = userData.type;
+
+            const figure = userData.figure;
+
+            switch(userType)
+            {
+                case RoomObjectType.PET:
+                    imageUrl = await ChatBubbleUtilities.getPetImage(figure, 2, true, 64, roomObject.model.getValue<string>(RoomObjectVariable.FIGURE_POSTURE));
+                    petType = new PetFigureData(figure).typeId;
+                    break;
+                case RoomObjectType.USER:
+                    imageUrl = await ChatBubbleUtilities.getUserImage(figure);
+                    break;
+                case RoomObjectType.RENTABLE_BOT:
+                case RoomObjectType.BOT:
+                    styleId = SystemChatStyleEnum.BOT;
+                    break;
+            }
+
+            avatarColor = ChatBubbleUtilities.AVATAR_COLOR_CACHE.get(figure);
+            username = userData.name;
+        }
+
+        switch(chatType)
+        {
+            case RoomSessionChatEvent.CHAT_TYPE_RESPECT:
+                text = LocalizeText('widgets.chatbubble.respect', ['username'], [username]);
+
+                if(GetConfigurationValue('respect.options')['enabled']) PlaySound(GetConfigurationValue('respect.options')['sound']);
+
+                break;
+            case RoomSessionChatEvent.CHAT_TYPE_PETREVIVE:
+            case RoomSessionChatEvent.CHAT_TYPE_PET_REBREED_FERTILIZE:
+            case RoomSessionChatEvent.CHAT_TYPE_PET_SPEED_FERTILIZE: {
+                let textKey = 'widget.chatbubble.petrevived';
+
+                if(chatType === RoomSessionChatEvent.CHAT_TYPE_PET_REBREED_FERTILIZE)
+                {
+                    textKey = 'widget.chatbubble.petrefertilized;';
+                }
+
+                else if(chatType === RoomSessionChatEvent.CHAT_TYPE_PET_SPEED_FERTILIZE)
+                {
+                    textKey = 'widget.chatbubble.petspeedfertilized';
+                }
+
+                let targetUserName: string = null;
+
+                const newRoomObject = GetRoomEngine().getRoomObject(roomSession.roomId, event.extraParam, RoomObjectCategory.UNIT);
+
+                if(newRoomObject)
+                {
+                    const newUserData = roomSession.userDataManager.getUserDataByIndex(roomObject.id);
+
+                    if(newUserData) targetUserName = newUserData.name;
+                }
+
+                text = LocalizeText(textKey, ['petName', 'userName'], [username, targetUserName]);
+                break;
+            }
+            case RoomSessionChatEvent.CHAT_TYPE_PETRESPECT:
+                text = LocalizeText('widget.chatbubble.petrespect', ['petname'], [username]);
+                break;
+            case RoomSessionChatEvent.CHAT_TYPE_PETTREAT:
+                text = LocalizeText('widget.chatbubble.pettreat', ['petname'], [username]);
+                break;
+            case RoomSessionChatEvent.CHAT_TYPE_HAND_ITEM_RECEIVED:
+                text = LocalizeText('widget.chatbubble.handitem', ['username', 'handitem'], [username, LocalizeText(('handitem' + event.extraParam))]);
+                break;
+            case RoomSessionChatEvent.CHAT_TYPE_MUTE_REMAINING: {
+                const hours = ((event.extraParam > 0) ? Math.floor((event.extraParam / 3600)) : 0).toString();
+                const minutes = ((event.extraParam > 0) ? Math.floor((event.extraParam % 3600) / 60) : 0).toString();
+                const seconds = (event.extraParam % 60).toString();
+
+                text = LocalizeText('widget.chatbubble.mutetime', ['hours', 'minutes', 'seconds'], [hours, minutes, seconds]);
+                break;
+            }
+        }
+
+        const formattedText = RoomChatFormatter(text);
+        const color = (avatarColor && (('#' + (avatarColor.toString(16).padStart(6, '0'))) || null));
+
+        const chatMessage = new ChatBubbleMessage(
+            userData.roomIndex,
+            RoomObjectCategory.UNIT,
+            roomSession.roomId,
+            text,
+            formattedText,
+            username,
+            { x: bubbleLocation.x, y: bubbleLocation.y },
+            chatType,
+            styleId,
+            imageUrl,
+            color);
+
+        setChatMessages(prevValue => [...prevValue, chatMessage]);
+        addChatEntry({ id: -1, webId: userData.webID, entityId: userData.roomIndex, name: username, imageUrl, style: styleId, chatType: chatType, entityType: userData.type, message: formattedText, timestamp: ChatHistoryCurrentDate(), type: ChatEntryType.TYPE_CHAT, roomId: roomSession.roomId, color });
+    });
+
+    useNitroEvent<RoomDragEvent>(RoomDragEvent.ROOM_DRAG, event =>
+    {
+        if(!chatMessages.length || (event.roomId !== roomSession.roomId)) return;
+
+        const offsetX = event.offsetX;
+
+        chatMessages.forEach(chat => (chat.elementRef && (chat.left += offsetX)));
+    });
+
+    useMessageEvent<GetGuestRoomResultEvent>(GetGuestRoomResultEvent, event =>
+    {
+        const parser = event.getParser();
+
+        if(!parser.roomEnter) return;
+
+        setChatSettings(parser.chat);
+    });
+
+    useMessageEvent<RoomChatSettingsEvent>(RoomChatSettingsEvent, event =>
+    {
+        const parser = event.getParser();
+
+        setChatSettings(parser.chat);
+    });
+
+    useEffect(() =>
+    {
+        isDisposed.current = false;
+
+        return () =>
+        {
+            isDisposed.current = true;
+        };
+    }, []);
+
+    return { chatMessages, setChatMessages, chatSettings, getScrollSpeed };
+};
+
+export const useChatWidget = useChatWidgetState;

src/hooks/rooms/widgets/useDoorbellWidget.ts

@@ -0,0 +1,44 @@
+import { RoomSessionDoorbellEvent } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { GetRoomSession } from '../../../api';
+import { useNitroEvent } from '../../events';
+
+const useDoorbellWidgetState = () =>
+{
+    const [ users, setUsers ] = useState<string[]>([]);
+
+    const addUser = (userName: string) =>
+    {
+        if(users.indexOf(userName) >= 0) return;
+
+        setUsers([ ...users, userName ]);
+    };
+
+    const removeUser = (userName: string) =>
+    {
+        const index = users.indexOf(userName);
+
+        if(index === -1) return;
+
+        const newUsers = [ ...users ];
+
+        newUsers.splice(index, 1);
+
+        setUsers(newUsers);
+    };
+
+    const answer = (userName: string, flag: boolean) =>
+    {
+        GetRoomSession().sendDoorbellApprovalMessage(userName, flag);
+
+        removeUser(userName);
+    };
+
+    useNitroEvent<RoomSessionDoorbellEvent>(RoomSessionDoorbellEvent.DOORBELL, event => addUser(event.userName));
+    useNitroEvent<RoomSessionDoorbellEvent>(RoomSessionDoorbellEvent.RSDE_REJECTED, event => removeUser(event.userName));
+    useNitroEvent<RoomSessionDoorbellEvent>(RoomSessionDoorbellEvent.RSDE_ACCEPTED, event => removeUser(event.userName));
+
+    return { users, addUser, removeUser, answer };
+};
+
+export const useDoorbellWidget = useDoorbellWidgetState;

src/hooks/rooms/widgets/useFilterWordsWidget.ts

@@ -0,0 +1,23 @@
+import { RoomFilterSettingsMessageEvent } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { useMessageEvent } from '../../events';
+
+const useFilterWordsWidgetState = () =>
+{
+    const [ wordsFilter, setWordsFilter ] = useState<string[]>(null);
+    const [ isVisible, setIsVisible ] = useState<boolean>(false);
+
+    const onClose = () => setIsVisible(false);
+
+    useMessageEvent<RoomFilterSettingsMessageEvent>(RoomFilterSettingsMessageEvent, event =>
+    {
+        const parser = event.getParser();
+
+        setIsVisible(true);
+        setWordsFilter(parser.words);
+    });
+
+    return { wordsFilter, isVisible, setWordsFilter, onClose };
+};
+
+export const useFilterWordsWidget = useFilterWordsWidgetState;

src/hooks/rooms/widgets/useFriendRequestWidget.ts

@@ -0,0 +1,81 @@
+import { RoomObjectCategory, RoomObjectUserType } from '@nitrots/nitro-renderer';
+import { useEffect, useMemo, useState } from 'react';
+import { GetRoomSession, MessengerRequest } from '../../../api';
+import { useFriends } from '../../friends';
+import { useUserAddedEvent, useUserRemovedEvent } from '../engine';
+
+const useFriendRequestWidgetState = () =>
+{
+    const [ activeRequests, setActiveRequests ] = useState<{ roomIndex: number, request: MessengerRequest }[]>([]);
+    const { requests = [], dismissedRequestIds = [], setDismissedRequestIds = null } = useFriends();
+
+    const displayedRequests = useMemo(() => activeRequests.filter(request => (dismissedRequestIds.indexOf(request.request.requesterUserId) === -1)), [ activeRequests, dismissedRequestIds ]);
+
+    const hideFriendRequest = (userId: number) =>
+    {
+        setDismissedRequestIds(prevValue =>
+        {
+            if(prevValue.indexOf(userId) >= 0) return prevValue;
+
+            const newValue = [ ...prevValue ];
+
+            newValue.push(userId);
+
+            return newValue;
+        });
+    };
+
+    useUserAddedEvent(true, event =>
+    {
+        if(event.category !== RoomObjectCategory.UNIT) return;
+
+        const userData = GetRoomSession().userDataManager.getUserDataByIndex(event.id);
+
+        if(!userData || (userData.type !== RoomObjectUserType.getTypeNumber(RoomObjectUserType.USER))) return;
+
+        const request = requests.find(request => (request.requesterUserId === userData.webID));
+
+        if(!request || activeRequests.find(request => (request.request.requesterUserId === userData.webID))) return;
+
+        const newValue = [ ...activeRequests ];
+
+        newValue.push({ roomIndex: userData.roomIndex, request });
+
+        setActiveRequests(newValue);
+    });
+
+    useUserRemovedEvent(true, event =>
+    {
+        if(event.category !== RoomObjectCategory.UNIT) return;
+
+        const index = activeRequests.findIndex(request => (request.roomIndex === event.id));
+
+        if(index === -1) return;
+
+        const newValue = [ ...activeRequests ];
+
+        newValue.splice(index, 1);
+
+        setActiveRequests(newValue);
+    });
+
+    useEffect(() =>
+    {
+        const newDisplayedRequests: { roomIndex: number, request: MessengerRequest }[] = [];
+
+        for(const request of requests)
+        {
+            const userData = GetRoomSession().userDataManager.getUserData(request.requesterUserId);
+
+            if(!userData) continue;
+
+            newDisplayedRequests.push({ roomIndex: userData.roomIndex, request });
+        }
+
+        setActiveRequests(newDisplayedRequests);
+    }, [ requests ]);
+
+    return { displayedRequests, hideFriendRequest };
+};
+
+export const useFriendRequestWidget = useFriendRequestWidgetState;

src/hooks/rooms/widgets/useFurniChooserWidget.ts

@@ -0,0 +1,132 @@
+import { GetRoomEngine, GetSessionDataManager, RoomObjectCategory, RoomObjectVariable } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { GetRoomSession, LocalizeText, RoomObjectItem } from '../../../api';
+import { useFurniAddedEvent, useFurniRemovedEvent } from '../engine';
+import { useRoom } from '../useRoom';
+
+const useFurniChooserWidgetState = () =>
+{
+    const [ items, setItems ] = useState<RoomObjectItem[]>(null);
+    const { roomSession = null } = useRoom();
+
+    const onClose = () => setItems(null);
+
+    const selectItem = (item: RoomObjectItem) => item && GetRoomEngine().selectRoomObject(GetRoomSession().roomId, item.id, item.category);
+
+    const populateChooser = () =>
+    {
+        const sessionDataManager = GetSessionDataManager();
+        const wallObjects = GetRoomEngine().getRoomObjects(roomSession.roomId, RoomObjectCategory.WALL);
+        const floorObjects = GetRoomEngine().getRoomObjects(roomSession.roomId, RoomObjectCategory.FLOOR);
+
+        const wallItems = wallObjects.map(roomObject =>
+        {
+            if(roomObject.id < 0) return null;
+
+            let name = roomObject.type;
+
+            if(name.startsWith('poster'))
+            {
+                name = LocalizeText(`poster_${ name.replace('poster', '') }_name`);
+            }
+            else
+            {
+                const typeId = roomObject.model.getValue<number>(RoomObjectVariable.FURNITURE_TYPE_ID);
+                const furniData = sessionDataManager.getWallItemData(typeId);
+
+                if(furniData && furniData.name.length) name = furniData.name;
+            }
+
+            return new RoomObjectItem(roomObject.id, RoomObjectCategory.WALL, name);
+        });
+
+        const floorItems = floorObjects.map(roomObject =>
+        {
+            if(roomObject.id < 0) return null;
+
+            let name = roomObject.type;
+
+            const typeId = roomObject.model.getValue<number>(RoomObjectVariable.FURNITURE_TYPE_ID);
+            const furniData = sessionDataManager.getFloorItemData(typeId);
+
+            if(furniData && furniData.name.length) name = furniData.name;
+
+            return new RoomObjectItem(roomObject.id, RoomObjectCategory.FLOOR, name);
+        });
+
+        setItems([ ...wallItems, ...floorItems ].sort((a, b) => ((a.name < b.name) ? -1 : 1)));
+    };
+
+    useFurniAddedEvent(!!items, event =>
+    {
+        if(event.id < 0) return;
+
+        const roomObject = GetRoomEngine().getRoomObject(GetRoomSession().roomId, event.id, event.category);
+
+        if(!roomObject) return;
+
+        let item: RoomObjectItem = null;
+
+        switch(event.category)
+        {
+            case RoomObjectCategory.WALL: {
+                let name = roomObject.type;
+
+                if(name.startsWith('poster'))
+                {
+                    name = LocalizeText(`poster_${ name.replace('poster', '') }_name`);
+                }
+                else
+                {
+                    const typeId = roomObject.model.getValue<number>(RoomObjectVariable.FURNITURE_TYPE_ID);
+                    const furniData = GetSessionDataManager().getWallItemData(typeId);
+
+                    if(furniData && furniData.name.length) name = furniData.name;
+                }
+
+                item = new RoomObjectItem(roomObject.id, RoomObjectCategory.WALL, name);
+
+                break;
+            }
+            case RoomObjectCategory.FLOOR: {
+                let name = roomObject.type;
+
+                const typeId = roomObject.model.getValue<number>(RoomObjectVariable.FURNITURE_TYPE_ID);
+                const furniData = GetSessionDataManager().getFloorItemData(typeId);
+
+                if(furniData && furniData.name.length) name = furniData.name;
+
+                item = new RoomObjectItem(roomObject.id, RoomObjectCategory.FLOOR, name);
+            }
+        }
+
+        setItems(prevValue => [ ...prevValue, item ].sort((a, b) => ((a.name < b.name) ? -1 : 1)));
+    });
+
+    useFurniRemovedEvent(!!items, event =>
+    {
+        if(event.id < 0) return;
+
+        setItems(prevValue =>
+        {
+            const newValue = [ ...prevValue ];
+
+            for(let i = 0; i < newValue.length; i++)
+            {
+                const existingValue = newValue[i];
+
+                if((existingValue.id !== event.id) || (existingValue.category !== event.category)) continue;
+
+                newValue.splice(i, 1);
+
+                break;
+            }
+
+            return newValue;
+        });
+    });
+
+    return { items, onClose, selectItem, populateChooser };
+};
+
+export const useFurniChooserWidget = useFurniChooserWidgetState;

src/hooks/rooms/widgets/usePetPackageWidget.ts

@@ -0,0 +1,75 @@
+import { GetRoomEngine, OpenPetPackageMessageComposer, RoomObjectCategory, RoomSessionPetPackageEvent } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { LocalizeText, SendMessageComposer } from '../../../api';
+import { useNitroEvent } from '../../events';
+
+const usePetPackageWidgetState = () =>
+{
+    const [ isVisible, setIsVisible ] = useState<boolean>(false);
+    const [ objectId, setObjectId ] = useState<number>(-1);
+    const [ objectType, setObjectType ] = useState<string>('');
+    const [ petName, setPetName ] = useState<string>('');
+    const [ errorResult, setErrorResult ] = useState<string>('');
+
+    const onClose = () =>
+    {
+        setErrorResult('');
+        setPetName('');
+        setObjectType('');
+        setObjectId(-1);
+        setIsVisible(false);
+    };
+
+    const onConfirm = () =>
+    {
+        SendMessageComposer(new OpenPetPackageMessageComposer(objectId, petName));
+    };
+
+    const onChangePetName = (petName: string) =>
+    {
+        setPetName(petName);
+        if(errorResult.length > 0) setErrorResult('');
+    };
+
+    const getErrorResultForCode = (errorCode: number) =>
+    {
+        if(!errorCode || errorCode === 0) return;
+
+        switch(errorCode)
+        {
+            case 1:
+                return LocalizeText('catalog.alert.petname.long');
+            case 2:
+                return LocalizeText('catalog.alert.petname.short');
+            case 3:
+                return LocalizeText('catalog.alert.petname.chars');
+            case 4:
+            default:
+                return LocalizeText('catalog.alert.petname.bobba');
+        }
+    };
+
+    useNitroEvent<RoomSessionPetPackageEvent>(RoomSessionPetPackageEvent.RSOPPE_OPEN_PET_PACKAGE_REQUESTED, event =>
+    {
+        if(!event) return;
+
+        const roomObject = GetRoomEngine().getRoomObject(event.session.roomId, event.objectId, RoomObjectCategory.FLOOR);
+
+        setObjectId(event.objectId);
+        setObjectType(roomObject.type);
+        setIsVisible(true);
+    });
+
+    useNitroEvent<RoomSessionPetPackageEvent>(RoomSessionPetPackageEvent.RSOPPE_OPEN_PET_PACKAGE_RESULT, event =>
+    {
+        if(!event) return;
+
+        if(event.nameValidationStatus === 0) onClose();
+
+        if(event.nameValidationStatus !== 0) setErrorResult(getErrorResultForCode(event.nameValidationStatus));
+    });
+
+    return { isVisible, errorResult, petName, objectType, onChangePetName, onConfirm, onClose };
+};
+
+export const usePetPackageWidget = usePetPackageWidgetState;

src/hooks/rooms/widgets/usePollWidget.ts

@@ -0,0 +1,52 @@
+import { RoomSessionPollEvent } from '@nitrots/nitro-renderer';
+import { DispatchUiEvent, RoomWidgetPollUpdateEvent } from '../../../api';
+import { useNitroEvent } from '../../events';
+import { useRoom } from '../useRoom';
+
+const usePollWidgetState = () =>
+{
+    const { roomSession = null } = useRoom();
+
+    const startPoll = (pollId: number) => roomSession.sendPollStartMessage(pollId);
+
+    const rejectPoll = (pollId: number) => roomSession.sendPollRejectMessage(pollId);
+
+    const answerPoll = (pollId: number, questionId: number, answers: string[]) => roomSession.sendPollAnswerMessage(pollId, questionId, answers);
+
+    useNitroEvent<RoomSessionPollEvent>(RoomSessionPollEvent.OFFER, event =>
+    {
+        const pollEvent = new RoomWidgetPollUpdateEvent(RoomWidgetPollUpdateEvent.OFFER, event.id);
+
+        pollEvent.summary = event.summary;
+        pollEvent.headline = event.headline;
+
+        DispatchUiEvent(pollEvent);
+    });
+
+    useNitroEvent<RoomSessionPollEvent>(RoomSessionPollEvent.ERROR, event =>
+    {
+        const pollEvent = new RoomWidgetPollUpdateEvent(RoomWidgetPollUpdateEvent.ERROR, event.id);
+
+        pollEvent.summary = event.summary;
+        pollEvent.headline = event.headline;
+
+        DispatchUiEvent(pollEvent);
+    });
+
+    useNitroEvent<RoomSessionPollEvent>(RoomSessionPollEvent.CONTENT, event =>
+    {
+        const pollEvent = new RoomWidgetPollUpdateEvent(RoomWidgetPollUpdateEvent.CONTENT, event.id);
+
+        pollEvent.startMessage = event.startMessage;
+        pollEvent.endMessage = event.endMessage;
+        pollEvent.numQuestions = event.numQuestions;
+        pollEvent.questionArray = event.questionArray;
+        pollEvent.npsPoll = event.npsPoll;
+
+        DispatchUiEvent(pollEvent);
+    });
+
+    return { startPoll, rejectPoll, answerPoll };
+};
+
+export const usePollWidget = usePollWidgetState;

src/hooks/rooms/widgets/useUserChooserWidget.ts

@@ -0,0 +1,80 @@
+import { GetRoomEngine, RoomObjectCategory } from '@nitrots/nitro-renderer';
+import { useState } from 'react';
+import { GetRoomSession, RoomObjectItem } from '../../../api';
+import { useUserAddedEvent, useUserRemovedEvent } from '../engine';
+import { useRoom } from '../useRoom';
+
+const useUserChooserWidgetState = () =>
+{
+    const [ items, setItems ] = useState<RoomObjectItem[]>(null);
+    const { roomSession = null } = useRoom();
+
+    const onClose = () => setItems(null);
+
+    const selectItem = (item: RoomObjectItem) => item && GetRoomEngine().selectRoomObject(GetRoomSession().roomId, item.id, item.category);
+
+    const populateChooser = () =>
+    {
+        const roomSession = GetRoomSession();
+        const roomObjects = GetRoomEngine().getRoomObjects(roomSession.roomId, RoomObjectCategory.UNIT);
+
+        setItems(roomObjects
+            .map(roomObject =>
+            {
+                if(roomObject.id < 0) return null;
+
+                const userData = roomSession.userDataManager.getUserDataByIndex(roomObject.id);
+
+                if(!userData) return null;
+
+                return new RoomObjectItem(userData.roomIndex, RoomObjectCategory.UNIT, userData.name);
+            })
+            .sort((a, b) => ((a.name < b.name) ? -1 : 1)));
+    };
+
+    useUserAddedEvent(!!items, event =>
+    {
+        if(event.id < 0) return;
+
+        const userData = GetRoomSession().userDataManager.getUserDataByIndex(event.id);
+
+        if(!userData) return;
+
+        setItems(prevValue =>
+        {
+            const newValue = [ ...prevValue ];
+
+            newValue.push(new RoomObjectItem(userData.roomIndex, RoomObjectCategory.UNIT, userData.name));
+            newValue.sort((a, b) => ((a.name < b.name) ? -1 : 1));
+
+            return newValue;
+        });
+    });
+
+    useUserRemovedEvent(!!items, event =>
+    {
+        if(event.id < 0) return;
+
+        setItems(prevValue =>
+        {
+            const newValue = [ ...prevValue ];
+
+            for(let i = 0; i < newValue.length; i++)
+            {
+                const existingValue = newValue[i];
+
+                if((existingValue.id !== event.id) || (existingValue.category !== event.category)) continue;
+
+                newValue.splice(i, 1);
+
+                break;
+            }
+
+            return newValue;
+        });
+    });
+
+    return { items, onClose, selectItem, populateChooser };
+};
+
+export const useUserChooserWidget = useUserChooserWidgetState;

src/hooks/rooms/widgets/useWordQuizWidget.ts

@@ -0,0 +1,149 @@
+import { AvatarAction, GetRoomEngine, IQuestion, RoomSessionWordQuizEvent } from '@nitrots/nitro-renderer';
+import { useEffect, useState } from 'react';
+import { VoteValue } from '../../../api';
+import { useNitroEvent } from '../../events';
+import { useRoom } from '../useRoom';
+import { usePollWidget } from './usePollWidget';
+
+const DEFAULT_DISPLAY_DELAY = 4000;
+const SIGN_FADE_DELAY = 3;
+
+const useWordQuizWidgetState = () =>
+{
+    const [ pollId, setPollId ] = useState(-1);
+    const [ question, setQuestion ] = useState<IQuestion>(null);
+    const [ answerSent, setAnswerSent ] = useState(false);
+    const [ questionClearTimeout, setQuestionClearTimeout ] = useState<ReturnType<typeof setTimeout>>(null);
+    const [ answerCounts, setAnswerCounts ] = useState<Map<string, number>>(new Map());
+    const [ userAnswers, setUserAnswers ] = useState<Map<number, VoteValue>>(new Map());
+    const { answerPoll = null } = usePollWidget();
+    const { roomSession = null } = useRoom();
+
+    const clearQuestion = () =>
+    {
+        setPollId(-1);
+        setQuestion(null);
+    };
+
+    const vote = (vote: string) =>
+    {
+        if(answerSent || !question) return;
+
+        answerPoll(pollId, question.id, [ vote ]);
+
+        setAnswerSent(true);
+    };
+
+    useNitroEvent<RoomSessionWordQuizEvent>(RoomSessionWordQuizEvent.ANSWERED, event =>
+    {
+        const userData = roomSession.userDataManager.getUserData(event.userId);
+
+        if(!userData) return;
+
+        setAnswerCounts(event.answerCounts);
+
+        setUserAnswers(prevValue =>
+        {
+            if(!prevValue.has(userData.roomIndex))
+            {
+                const newValue = new Map(userAnswers);
+
+                newValue.set(userData.roomIndex, { value: event.value, secondsLeft: SIGN_FADE_DELAY });
+
+                return newValue;
+            }
+
+            return prevValue;
+        });
+
+        GetRoomEngine().updateRoomObjectUserGesture(roomSession.roomId, userData.roomIndex, AvatarAction.getGestureId((event.value === '0') ? AvatarAction.GESTURE_SAD : AvatarAction.GESTURE_SMILE));
+    });
+
+    useNitroEvent<RoomSessionWordQuizEvent>(RoomSessionWordQuizEvent.FINISHED, event =>
+    {
+        if(question && (question.id === event.questionId))
+        {
+            setAnswerCounts(event.answerCounts);
+            setAnswerSent(true);
+
+            setQuestionClearTimeout(prevValue =>
+            {
+                if(prevValue) clearTimeout(prevValue);
+
+                return setTimeout(() => clearQuestion(), DEFAULT_DISPLAY_DELAY);
+            });
+        }
+
+        setUserAnswers(new Map());
+    });
+
+    useNitroEvent<RoomSessionWordQuizEvent>(RoomSessionWordQuizEvent.QUESTION, event =>
+    {
+        setPollId(event.id);
+        setQuestion(event.question);
+        setAnswerSent(false);
+        setAnswerCounts(new Map());
+        setUserAnswers(new Map());
+
+        setQuestionClearTimeout(prevValue =>
+        {
+            if(prevValue) clearTimeout(prevValue);
+
+            if(event.duration > 0)
+            {
+                const delay = event.duration < 1000 ? DEFAULT_DISPLAY_DELAY : event.duration;
+
+                return setTimeout(() => clearQuestion(), delay);
+            }
+
+            return null;
+        });
+    });
+
+    useEffect(() =>
+    {
+        const checkSignFade = () =>
+        {
+            setUserAnswers(prevValue =>
+            {
+                const keysToRemove: number[] = [];
+
+                prevValue.forEach((value, key) =>
+                {
+                    value.secondsLeft--;
+
+                    if(value.secondsLeft <= 0) keysToRemove.push(key);
+                });
+
+                if(keysToRemove.length === 0) return prevValue;
+
+                const copy = new Map(prevValue);
+
+                keysToRemove.forEach(key => copy.delete(key));
+
+                return copy;
+            });
+        };
+
+        const interval = setInterval(() => checkSignFade(), 1000);
+
+        return () => clearInterval(interval);
+    }, []);
+
+    useEffect(() =>
+    {
+        return () =>
+        {
+            setQuestionClearTimeout(prevValue =>
+            {
+                if(prevValue) clearTimeout(prevValue);
+
+                return null;
+            });
+        };
+    }, []);
+
+    return { question, answerSent, answerCounts, userAnswers, vote };
+};
+
+export const useWordQuizWidget = useWordQuizWidgetState;