Fix busted stuff data update for catalog

src/events/catalog/SetRoomPreviewerStuffDataEvent.ts

@@ -0,0 +1,27 @@
+import { CatalogPageMessageOfferData, IObjectData, NitroEvent } from '@nitrots/nitro-renderer';
+
+export class SetRoomPreviewerStuffDataEvent extends NitroEvent
+{
+    public static UPDATE_STUFF_DATA: string = 'SRPSA_UPDATE_STUFF_DATA';
+
+    private _offer: CatalogPageMessageOfferData;
+    private _stuffData: IObjectData;
+
+    constructor(offer: CatalogPageMessageOfferData, stuffData: IObjectData)
+    {
+        super(SetRoomPreviewerStuffDataEvent.UPDATE_STUFF_DATA);
+
+        this._offer = offer;
+        this._stuffData = stuffData;
+    }
+
+    public get offer(): CatalogPageMessageOfferData
+    {
+        return this._offer;
+    }
+
+    public get stuffData(): IObjectData
+    {
+        return this._stuffData;
+    }
+}

src/events/catalog/index.ts

@@ -3,3 +3,4 @@ export * from './CatalogNameResultEvent';
 export * from './CatalogPurchasedEvent';
 export * from './CatalogPurchaseFailureEvent';
 export * from './CatalogPurchaseSoldOutEvent';
+export * from './SetRoomPreviewerStuffDataEvent';

src/hooks/events/event-dispatcher.base.tsx

@@ -1,9 +1,9 @@
 import { IEventDispatcher, NitroEvent } from '@nitrots/nitro-renderer';
 import { useEffect } from 'react';
 
-export function CreateEventDispatcherHook(type: string, eventDispatcher: IEventDispatcher, handler: (event: NitroEvent) => void): void
+export const CreateEventDispatcherHook = (type: string, eventDispatcher: IEventDispatcher, handler: (event: NitroEvent) => void) =>
 {
-    useEffect(() =>
+    return useEffect(() =>
     {
         eventDispatcher.addEventListener(type, handler);
 
@@ -14,7 +14,7 @@ export function CreateEventDispatcherHook(type: string, eventDispatcher: IEventD
     }, [ type, eventDispatcher, handler ]);
 }
 
-export function DispatchEventHook(eventDispatcher: IEventDispatcher, event: NitroEvent): void
+export const DispatchEventHook = (eventDispatcher: IEventDispatcher, event: NitroEvent) =>
 {
     eventDispatcher.dispatchEvent(event);
 }

src/hooks/events/ui/ui-event.tsx

@@ -3,9 +3,9 @@ import { CreateEventDispatcherHook, DispatchEventHook } from '../event-dispatche
 
 const uiEventDispatcher: IEventDispatcher = new EventDispatcher();
 
-export function useUiEvent(type: string, handler: (event: NitroEvent) => void): void
+export const useUiEvent = (type: string, handler: (event: NitroEvent) => void) =>
 {
-    CreateEventDispatcherHook(type, uiEventDispatcher, handler);
+    return CreateEventDispatcherHook(type, uiEventDispatcher, handler);
 }
 
 export function dispatchUiEvent(event: NitroEvent): void

src/views/catalog/views/page/CatalogPageView.tsx

@@ -1,6 +1,8 @@
-import { Vector3d } from '@nitrots/nitro-renderer';
+import { CatalogPageMessageOfferData, IObjectData, Vector3d } from '@nitrots/nitro-renderer';
-import { FC, useEffect } from 'react';
+import { FC, useCallback, useEffect, useState } from 'react';
 import { GetAvatarRenderManager, GetFurnitureDataForProductOffer, GetSessionDataManager } from '../../../../api';
+import { SetRoomPreviewerStuffDataEvent } from '../../../../events';
+import { useUiEvent } from '../../../../hooks';
 import { FurniCategory } from '../../common/FurniCategory';
 import { ProductTypeEnum } from '../../common/ProductTypeEnum';
 import { useCatalogContext } from '../../context/CatalogContext';
@@ -11,21 +13,15 @@ import { CatalogLayoutSearchResultView } from './search-result/CatalogLayoutSear
 export const CatalogPageView: FC<CatalogPageViewProps> = props =>
 {
     const { roomPreviewer = null } = props;
+    const [ lastOffer, setLastOffer ] = useState<CatalogPageMessageOfferData>(null);
     const { catalogState = null } = useCatalogContext();
     const { pageParser = null, activeOffer = null, searchResult = null } = catalogState;
 
-    useEffect(() =>
+    const updatePreviewerForOffer = useCallback((offer: CatalogPageMessageOfferData, stuffData: IObjectData = null) =>
     {
-        if(!roomPreviewer) return;
+        if(!offer || !roomPreviewer) return;
-
-        roomPreviewer && roomPreviewer.reset(false);
-
-        if(activeOffer && activeOffer.products.length)
-        {
-            const product = activeOffer.products[0];
-
-            if(!product) return;
 
+        const product = offer.products[0];
         const furniData = GetFurnitureDataForProductOffer(product);
 
         if(!furniData && (product.productType !== ProductTypeEnum.ROBOT)) return;
@@ -61,12 +57,11 @@ export const CatalogPageView: FC<CatalogPageViewProps> = props =>
                 }
                 else
                 {
-                        roomPreviewer.addFurnitureIntoRoom(product.furniClassId, new Vector3d(90));
+                    roomPreviewer.addFurnitureIntoRoom(product.furniClassId, new Vector3d(90), stuffData);
                 }
                 return;
             }
-                case ProductTypeEnum.WALL:
+            case ProductTypeEnum.WALL: {
-
                 switch(furniData.className)
                 {
                     case 'floor':
@@ -94,7 +89,23 @@ export const CatalogPageView: FC<CatalogPageViewProps> = props =>
                 return;
             }
         }
-    }, [ roomPreviewer, activeOffer ]);
+    }, [ roomPreviewer ]);
+
+    const onSetRoomPreviewerStuffDataEvent = useCallback((event: SetRoomPreviewerStuffDataEvent) =>
+    {
+        if(roomPreviewer) roomPreviewer.reset(false);
+
+        updatePreviewerForOffer(event.offer, event.stuffData);
+    }, [ roomPreviewer, updatePreviewerForOffer ]);
+
+    useUiEvent(SetRoomPreviewerStuffDataEvent.UPDATE_STUFF_DATA, onSetRoomPreviewerStuffDataEvent);
+
+    useEffect(() =>
+    {
+        if(!activeOffer) return;
+
+        updatePreviewerForOffer(activeOffer);
+    }, [ activeOffer, updatePreviewerForOffer ]);
 
     if(searchResult && searchResult.furniture)
     {

src/views/catalog/views/page/layout/badge-display/CatalogLayoutBadgeDisplayView.tsx

@@ -1,7 +1,7 @@
 import { StringDataType } from '@nitrots/nitro-renderer';
 import { FC, useCallback, useEffect, useMemo, useState } from 'react';
 import { LocalizeText } from '../../../../../../api';
-import { InventoryBadgesUpdatedEvent } from '../../../../../../events';
+import { InventoryBadgesUpdatedEvent, SetRoomPreviewerStuffDataEvent } from '../../../../../../events';
 import { InventoryBadgesRequestEvent } from '../../../../../../events/inventory/InventoryBadgesRequestEvent';
 import { dispatchUiEvent, useUiEvent } from '../../../../../../hooks';
 import { NitroCardGridItemView } from '../../../../../../layout/card/grid/item/NitroCardGridItemView';
@@ -53,11 +53,19 @@ export const CatalogLayoutBadgeDisplayView: FC<CatalogLayoutBadgeDisplayViewProp
     {
         if(!currentBadge || !activeOffer) return;
 
-        const stuffData = new StringDataType();
+        const productData = [];
+        productData.push('0');
+        productData.push(currentBadge);
+        productData.push('');
+        productData.push('');
+        productData.push('');
 
-        stuffData.setValue([ null, currentBadge ]);
+        const stringDataType = new StringDataType();
+        stringDataType.setValue(productData);
 
-        roomPreviewer.updateObjectStuffData(stuffData);
+        console.log(stringDataType);
+
+        dispatchUiEvent(new SetRoomPreviewerStuffDataEvent(activeOffer, stringDataType));
     }, [ currentBadge, activeOffer, roomPreviewer ]);
 
     return (

src/views/catalog/views/page/layout/guild-custom-furni/CatalogLayoutGuildCustomFurniView.tsx

@@ -1,6 +1,8 @@
 import { CatalogGroupsComposer, StringDataType } from '@nitrots/nitro-renderer';
 import { FC, useEffect, useState } from 'react';
 import { LocalizeText } from '../../../../../../api';
+import { SetRoomPreviewerStuffDataEvent } from '../../../../../../events';
+import { dispatchUiEvent } from '../../../../../../hooks';
 import { SendMessageHook } from '../../../../../../hooks/messages';
 import { BadgeImageView } from '../../../../../shared/badge-image/BadgeImageView';
 import { GetOfferName } from '../../../../common/CatalogUtilities';
@@ -13,14 +15,10 @@ import { CatalogLayoutGuildCustomFurniViewProps } from './CatalogLayoutGuildCust
 export const CatalogLayouGuildCustomFurniView: FC<CatalogLayoutGuildCustomFurniViewProps> = props =>
 {
     const { roomPreviewer = null, pageParser = null } = props;
-
+    const [ selectedGroupIndex, setSelectedGroupIndex ] = useState<number>(0);
     const { catalogState = null } = useCatalogContext();
     const { activeOffer = null, groups = null } = catalogState;
 
-    const product = ((activeOffer && activeOffer.products[0]) || null);
-
-    const [ selectedGroupIndex, setSelectedGroupIndex ] = useState<number>(0);
-
     useEffect(() =>
     {
         SendMessageHook(new CatalogGroupsComposer());
@@ -28,7 +26,7 @@ export const CatalogLayouGuildCustomFurniView: FC<CatalogLayoutGuildCustomFurniV
 
     useEffect(() =>
     {
-        if(!groups[selectedGroupIndex]) return;
+        if(!activeOffer || !groups[selectedGroupIndex]) return;
 
         const productData = [];
         productData.push('0');
@@ -40,11 +38,13 @@ export const CatalogLayouGuildCustomFurniView: FC<CatalogLayoutGuildCustomFurniV
         const stringDataType = new StringDataType();
         stringDataType.setValue(productData);
 
-        roomPreviewer.updateObjectStuffData(stringDataType);
+        dispatchUiEvent(new SetRoomPreviewerStuffDataEvent(activeOffer, stringDataType));
-    }, [ selectedGroupIndex, activeOffer ]);
+    }, [ groups, selectedGroupIndex, activeOffer ]);
 
     if(!groups) return null;
 
+    const product = ((activeOffer && activeOffer.products[0]) || null);
+    
     return (
         <div className="row h-100 nitro-catalog-layout-guild-custom-furni">
             <div className="d-flex flex-column col-7 h-100">