From 388fb8ed34b18f8150ee3c8077763644042e0a1c Mon Sep 17 00:00:00 2001
From: simoleo89 <simoleo89@users.noreply.github.com>
Date: Mon, 11 May 2026 16:40:43 +0000
Subject: [PATCH] Migrate CatalogLayoutRoomAdsView's room-ad fetch to
 useNitroQuery
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Second concrete adoption of proposal #2 (first was OfferView).

Before
- A useState<RoomEntryData[]>([]) for availableRooms.
- A useMessageEvent<RoomAdPurchaseInfoEvent> handler that
  set the state on each parser event.
- A useEffect on mount that dispatched two composers, one of which
  was GetRoomAdPurchaseInfoComposer paired with the parser above.

After
- A single useNitroQuery call wires the request and parser as one
  read-only query. The select extracts parser.rooms with a default
  empty array.
- staleTime is 60s — opening the same panel within a minute reuses
  the cached value; the composer is not re-dispatched. Useful here
  because the user navigates between catalog tabs.
- The mount-only useEffect no longer dispatches the room-ad composer;
  the second composer (GetUserEventCatsMessageComposer) stays where
  it was — that one feeds useNavigator state and isn't a
  request-response pair this component owns.

Why this file
- It was the cleanest pattern in the catalog tree: no correlation
  keys, no conditional filter on the parser, no other writes to
  availableRooms. The pure derive-from-event case useNitroQuery is
  built for.
- The big god-hook useCatalog (1100 LOC) still owns most of the
  catalog data layer; migrating that needs the data/uiState/actions
  split first.

Verification
- yarn test: 49/49 still passing.
- yarn eslint on the touched file: 1 error (the pre-existing
  set-state-in-effect on line 36, unchanged — baseline matches).
- The previous useMessageEvent import was removed cleanly.
---
 .../page/layout/CatalogLayoutRoomAdsView.tsx  | 22 +++++++++----------
 1 file changed, 10 insertions(+), 12 deletions(-)

diff --git a/src/components/catalog/views/page/layout/CatalogLayoutRoomAdsView.tsx b/src/components/catalog/views/page/layout/CatalogLayoutRoomAdsView.tsx
index 1722db8..d9c6c87 100644
--- a/src/components/catalog/views/page/layout/CatalogLayoutRoomAdsView.tsx
+++ b/src/components/catalog/views/page/layout/CatalogLayoutRoomAdsView.tsx
@@ -1,8 +1,9 @@
 import { GetRoomAdPurchaseInfoComposer, GetUserEventCatsMessageComposer, PurchaseRoomAdMessageComposer, RoomAdPurchaseInfoEvent, RoomEntryData } from '@nitrots/nitro-renderer';
 import { FC, useEffect, useState } from 'react';
 import { LocalizeText, SendMessageComposer } from '../../../../../api';
+import { useNitroQuery } from '../../../../../api/nitro-query';
 import { Button, Column, Text } from '../../../../../common';
-import { useCatalog, useMessageEvent, useNavigator, useRoomPromote } from '../../../../../hooks';
+import { useCatalog, useNavigator, useRoomPromote } from '../../../../../hooks';
 import { NitroInput } from '../../../../../layout';
 import { CatalogLayoutProps } from './CatalogLayout.types';
 
@@ -14,13 +15,20 @@ export const CatalogLayoutRoomAdsView: FC<CatalogLayoutProps> = props =>
     const [ eventName, setEventName ] = useState<string>('');
     const [ eventDesc, setEventDesc ] = useState<string>('');
     const [ roomId, setRoomId ] = useState<number>(-1);
-    const [ availableRooms, setAvailableRooms ] = useState<RoomEntryData[]>([]);
     const [ extended, setExtended ] = useState<boolean>(false);
     const [ categoryId, setCategoryId ] = useState<number>(1);
     const { categories = null } = useNavigator();
     const { setIsVisible = null } = useCatalog();
     const { promoteInformation, isExtended, setIsExtended } = useRoomPromote();
 
+    const { data: availableRooms = [] } = useNitroQuery<RoomAdPurchaseInfoEvent, RoomEntryData[]>({
+        key: [ 'nitro', 'catalog', 'room-ad-purchase-info' ],
+        request: () => new GetRoomAdPurchaseInfoComposer(),
+        parser: RoomAdPurchaseInfoEvent,
+        select: e => e.getParser()?.rooms ?? [],
+        staleTime: 60_000
+    });
+
     useEffect(() =>
     {
         if(isExtended)
@@ -62,18 +70,8 @@ export const CatalogLayoutRoomAdsView: FC<CatalogLayoutProps> = props =>
         resetData();
     };
 
-    useMessageEvent<RoomAdPurchaseInfoEvent>(RoomAdPurchaseInfoEvent, event =>
-    {
-        const parser = event.getParser();
-
-        if(!parser) return;
-
-        setAvailableRooms(parser.rooms);
-    });
-
     useEffect(() =>
     {
-        SendMessageComposer(new GetRoomAdPurchaseInfoComposer());
         // TODO: someone needs to fix this for morningstar
         SendMessageComposer(new GetUserEventCatsMessageComposer());
     }, []);