diff --git a/client/src/App.tsx b/client/src/App.tsx index 3dd68dcd9..ad945072a 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -1,6 +1,7 @@ import "./index.css"; import { Toaster } from "./ui/components/Toaster"; import { TransactionNotification } from "./ui/components/TxEmit"; +import { WorldLoading } from "./ui/components/WorldLoading"; import { World } from "./ui/layouts/World"; function App({ backgroundImage }: { backgroundImage: string }) { @@ -9,6 +10,7 @@ function App({ backgroundImage }: { backgroundImage: string }) { + ); } diff --git a/client/src/dojo/debouncedQueries.ts b/client/src/dojo/debouncedQueries.ts index 8717ddddc..d86981a79 100644 --- a/client/src/dojo/debouncedQueries.ts +++ b/client/src/dojo/debouncedQueries.ts @@ -55,8 +55,14 @@ const marketQueue = new RequestQueue(); // Debounced functions that add to queues export const debouncedSyncPosition = debounce( - async (client: ToriiClient, components: Component[], entityID: string) => { + async ( + client: ToriiClient, + components: Component[], + entityID: string, + onComplete?: () => void, + ) => { await positionQueue.add(() => syncPosition(client, components, entityID)); + onComplete?.(); }, 100, { leading: true }, // Add leading: true to execute immediately on first call @@ -67,8 +73,10 @@ export const debouncedAddToSubscriptionTwoKey = debounce( client: ToriiClient, components: Component[], entityID: string[], + onComplete?: () => void, ) => { await subscriptionQueue.add(() => addToSubscriptionTwoKeyModelbyRealmEntityId(client, components, entityID)); + onComplete?.(); }, 250, { leading: true }, @@ -79,8 +87,10 @@ export const debouncedAddToSubscriptionOneKey = debounce( client: ToriiClient, components: Component[], entityID: string[], + onComplete?: () => void, ) => { await subscriptionQueue.add(() => addToSubscriptionOneKeyModelbyRealmEntityId(client, components, entityID)); + onComplete?.(); }, 250, { leading: true }, @@ -91,8 +101,10 @@ export const debounceAddResourceArrivals = debounce( client: ToriiClient, components: Component[], entityID: number[], + onComplete?: () => void, ) => { await subscriptionQueue.add(() => addArrivalsSubscription(client, components, entityID)); + onComplete?.(); }, 250, { leading: true }, @@ -104,16 +116,23 @@ export const debouncedAddToSubscription = debounce( components: Component[], entityID: string[], position?: { x: number; y: number }[], + onComplete?: () => void, ) => { await subscriptionQueue.add(() => addToSubscription(client, components, entityID, position)); + onComplete?.(); }, 250, { leading: true }, ); export const debouncedAddMarketSubscription = debounce( - async (client: ToriiClient, components: Component[]) => { + async ( + client: ToriiClient, + components: Component[], + onComplete?: () => void, + ) => { await marketQueue.add(() => addMarketSubscription(client, components)); + onComplete?.(); }, 500, { leading: true }, diff --git a/client/src/dojo/setup.ts b/client/src/dojo/setup.ts index a54febeaf..2134406b2 100644 --- a/client/src/dojo/setup.ts +++ b/client/src/dojo/setup.ts @@ -1,3 +1,4 @@ +import { AppStore } from "@/hooks/store/useUIStore"; import { BUILDING_CATEGORY_POPULATION_CONFIG_ID, HYPERSTRUCTURE_CONFIG_ID, @@ -71,10 +72,12 @@ export const syncEntitiesDebounced = async ( }; }; -export async function setup({ ...config }: DojoConfig) { +export async function setup(config: DojoConfig & { state: AppStore }) { const network = await setupNetwork(config); const components = createClientComponents(network); const systemCalls = createSystemCalls(network); + const setConfigLoading = config.state.setConfigLoading; + const setSingleKeyLoading = config.state.setSingleKeyLoading; const configClauses: Clause[] = [ { @@ -114,13 +117,37 @@ export async function setup({ ...config }: DojoConfig) { }, ]; - await getEntities( - network.toriiClient, - { Composite: { operator: "Or", clauses: configClauses } }, - network.contractComponents as any, - ); + setConfigLoading(true); + await Promise.all([ + getEntities( + network.toriiClient, + { Composite: { operator: "Or", clauses: configClauses } }, + network.contractComponents as any, + ).finally(() => { + setConfigLoading(false); + }), + getEntities( + network.toriiClient, + { + Keys: { + keys: [undefined, undefined], + pattern_matching: "FixedLen", + models: ["s0_eternum-CapacityConfigCategory", "s0_eternum-ResourceCost"], + }, + }, + network.contractComponents as any, + [], + [], + 40_000, + false, + ), + ]).finally(() => { + setConfigLoading(false); + }); // fetch all existing entities from torii + + setSingleKeyLoading(true); await getEntities( network.toriiClient, { @@ -151,23 +178,9 @@ export async function setup({ ...config }: DojoConfig) { [], 40_000, false, - ); - - await getEntities( - network.toriiClient, - { - Keys: { - keys: [undefined, undefined], - pattern_matching: "FixedLen", - models: ["s0_eternum-CapacityConfigCategory", "s0_eternum-ResourceCost"], - }, - }, - network.contractComponents as any, - [], - [], - 40_000, - false, - ); + ).finally(() => { + setSingleKeyLoading(false); + }); const sync = await syncEntitiesDebounced(network.toriiClient, network.contractComponents as any, [], false); diff --git a/client/src/hooks/store/useUIStore.tsx b/client/src/hooks/store/useUIStore.tsx index ff9f5878a..307f1e4bc 100644 --- a/client/src/hooks/store/useUIStore.tsx +++ b/client/src/hooks/store/useUIStore.tsx @@ -10,6 +10,7 @@ import { ThreeStore, createThreeStoreSlice } from "./_threeStore"; import { BattleViewInfo } from "./types"; import { BlockchainStore, createBlockchainStore } from "./useBlockchainStore"; import { RealmStore, createRealmStoreSlice } from "./useRealmStore"; +import { WorldStore, createWorldStoreSlice } from "./useWorldLoading"; type TooltipType = { content: React.ReactNode; @@ -70,7 +71,7 @@ interface UIStore { setShowToS: (show: boolean) => void; } -export type AppStore = UIStore & PopupsStore & ThreeStore & BuildModeStore & RealmStore & BlockchainStore; +export type AppStore = UIStore & PopupsStore & ThreeStore & BuildModeStore & RealmStore & BlockchainStore & WorldStore; const useUIStore = create( subscribeWithSelector((set, get) => ({ @@ -139,6 +140,7 @@ const useUIStore = create( ...createBuildModeStoreSlice(set), ...createRealmStoreSlice(set), ...createBlockchainStore(set), + ...createWorldStoreSlice(set), })), ); diff --git a/client/src/hooks/store/useWorldLoading.tsx b/client/src/hooks/store/useWorldLoading.tsx index f46ace82c..b0a078fcf 100644 --- a/client/src/hooks/store/useWorldLoading.tsx +++ b/client/src/hooks/store/useWorldLoading.tsx @@ -1,20 +1,45 @@ -// World loading state -import { create } from "zustand"; - -interface WorldState { - isWorldLoading: boolean; +export interface WorldStore { + isSelectedStructureLoading: boolean; isMarketLoading: boolean; - isStructuresLoading: boolean; - setWorldLoading: (loading: boolean) => void; + isPlayerStructuresLoading: boolean; + isArrivalsLoading: boolean; + isMapLoading: boolean; + isBankLoading: boolean; + isWorldLoading: boolean; + isHyperstructureLoading: boolean; + isSingleKeyLoading: boolean; + isConfigLoading: boolean; + setSelectedStructureLoading: (loading: boolean) => void; setMarketLoading: (loading: boolean) => void; - setStructuresLoading: (loading: boolean) => void; + setPlayerStructuresLoading: (loading: boolean) => void; + setArrivalsLoading: (loading: boolean) => void; + setMapLoading: (loading: boolean) => void; + setBankLoading: (loading: boolean) => void; + setWorldLoading: (loading: boolean) => void; + setHyperstructureLoading: (loading: boolean) => void; + setSingleKeyLoading: (loading: boolean) => void; + setConfigLoading: (loading: boolean) => void; } -export const useWorldStore = create((set) => ({ - isWorldLoading: true, - isMarketLoading: true, - isStructuresLoading: true, - setWorldLoading: (loading: boolean) => set({ isWorldLoading: loading }), +export const createWorldStoreSlice = (set: any) => ({ + isSelectedStructureLoading: false, + isMarketLoading: false, + isPlayerStructuresLoading: false, + isArrivalsLoading: false, + isMapLoading: false, + isBankLoading: false, + isWorldLoading: false, + isHyperstructureLoading: false, + isSingleKeyLoading: false, + isConfigLoading: false, + setSelectedStructureLoading: (loading: boolean) => set({ isSelectedStructureLoading: loading }), setMarketLoading: (loading: boolean) => set({ isMarketLoading: loading }), - setStructuresLoading: (loading: boolean) => set({ isStructuresLoading: loading }), -})); + setPlayerStructuresLoading: (loading: boolean) => set({ isPlayerStructuresLoading: loading }), + setArrivalsLoading: (loading: boolean) => set({ isArrivalsLoading: loading }), + setMapLoading: (loading: boolean) => set({ isMapLoading: loading }), + setBankLoading: (loading: boolean) => set({ isBankLoading: loading }), + setWorldLoading: (loading: boolean) => set({ isWorldLoading: loading }), + setHyperstructureLoading: (loading: boolean) => set({ isHyperstructureLoading: loading }), + setSingleKeyLoading: (loading: boolean) => set({ isSingleKeyLoading: loading }), + setConfigLoading: (loading: boolean) => set({ isConfigLoading: loading }), +}); diff --git a/client/src/main.tsx b/client/src/main.tsx index 4d97dc4ce..89f685c96 100644 --- a/client/src/main.tsx +++ b/client/src/main.tsx @@ -13,6 +13,7 @@ import App from "./App"; import { setup } from "./dojo/setup"; import { DojoProvider } from "./hooks/context/DojoContext"; import { StarknetProvider } from "./hooks/context/starknet-provider"; +import useUIStore from "./hooks/store/useUIStore"; import "./index.css"; import GameRenderer from "./three/GameRenderer"; import { PWAUpdatePopup } from "./ui/components/pwa-update-popup"; @@ -62,8 +63,10 @@ async function init() { root.render(); + const state = useUIStore.getState(); + const setupStart = performance.now(); - const setupResult = await setup(dojoConfig); + const setupResult = await setup({ state, ...dojoConfig }); const setupEnd = performance.now(); console.log("SetupEnd", setupEnd - setupStart); diff --git a/client/src/three/scenes/Worldmap.ts b/client/src/three/scenes/Worldmap.ts index 14ef28b67..69c6022e0 100644 --- a/client/src/three/scenes/Worldmap.ts +++ b/client/src/three/scenes/Worldmap.ts @@ -686,6 +686,8 @@ export default class WorldmapScene extends HexagonScene { this.fetchedChunks.add(chunkKey); console.log(startCol, startRow, range); + this.state.setMapLoading(true); + try { const promiseTiles = getEntities( this.dojo.network.toriiClient, @@ -789,7 +791,7 @@ export default class WorldmapScene extends HexagonScene { false, ); Promise.all([promiseTiles, promisePositions]).then(([tiles, positions]) => { - // Promise.all([promiseTiles]).then(([tiles]) => { + this.state.setMapLoading(false); }); } catch (error) { // If there's an error, remove the chunk from cached set so it can be retried diff --git a/client/src/ui/components/WorldLoading.tsx b/client/src/ui/components/WorldLoading.tsx new file mode 100644 index 000000000..14270cce7 --- /dev/null +++ b/client/src/ui/components/WorldLoading.tsx @@ -0,0 +1,64 @@ +import useUIStore from "@/hooks/store/useUIStore"; + +export const WorldLoading = () => { + const isSelectedStructureLoading = useUIStore((state) => state.isSelectedStructureLoading); + const isMarketLoading = useUIStore((state) => state.isMarketLoading); + const isPlayerStructuresLoading = useUIStore((state) => state.isPlayerStructuresLoading); + const isArrivalsLoading = useUIStore((state) => state.isArrivalsLoading); + const isMapLoading = useUIStore((state) => state.isMapLoading); + const isBankLoading = useUIStore((state) => state.isBankLoading); + const isWorldLoading = useUIStore((state) => state.isWorldLoading); + const isHyperstructureLoading = useUIStore((state) => state.isHyperstructureLoading); + const isSingleKeyLoading = useUIStore((state) => state.isSingleKeyLoading); + const isConfigLoading = useUIStore((state) => state.isConfigLoading); + + const anyLoading = + isSelectedStructureLoading || + isMarketLoading || + isPlayerStructuresLoading || + isArrivalsLoading || + isMapLoading || + isBankLoading || + isWorldLoading || + isHyperstructureLoading || + isSingleKeyLoading || + isConfigLoading; + + console.log({ isArrivalsLoading }); + + const getLoadingItems = () => { + const items = []; + if (isSelectedStructureLoading) items.push("Structure"); + if (isMarketLoading) items.push("Market"); + if (isPlayerStructuresLoading) items.push("Player Structures"); + if (isArrivalsLoading) items.push("Arrivals"); + if (isMapLoading) items.push("Map"); + if (isBankLoading) items.push("Bank"); + if (isWorldLoading) items.push("World"); + if (isHyperstructureLoading) items.push("Hyperstructure"); + if (isSingleKeyLoading) items.push("Single Key"); + if (isConfigLoading) items.push("Config"); + return items.join(", "); + }; + + return ( +
+ {anyLoading && ( +
+ +
Loading: {getLoadingItems()}
+
+ )} +
+ ); +}; diff --git a/client/src/ui/components/trading/MarketModal.tsx b/client/src/ui/components/trading/MarketModal.tsx index b46a2e1ca..b34d67a8e 100644 --- a/client/src/ui/components/trading/MarketModal.tsx +++ b/client/src/ui/components/trading/MarketModal.tsx @@ -15,7 +15,6 @@ import { useSetMarket } from "@/hooks/helpers/useTrade"; import useMarketStore from "@/hooks/store/useMarketStore"; import { useModalStore } from "@/hooks/store/useModalStore"; import useUIStore from "@/hooks/store/useUIStore"; -import { useWorldStore } from "@/hooks/store/useWorldLoading"; import { BuildingThumbs } from "@/ui/config"; import CircleButton from "@/ui/elements/CircleButton"; import { LoadingAnimation } from "@/ui/elements/LoadingAnimation"; @@ -61,7 +60,7 @@ export const MarketModal = () => { const bank = banks.length === 1 ? banks[0] : null; const battles = useBattlesByPosition(bank?.position || { x: 0, y: 0 }); - const isMarketLoading = useWorldStore((state) => state.isMarketLoading); + const isMarketLoading = useUIStore((state) => state.isMarketLoading); const currentBlockTimestamp = useUIStore.getState().nextBlockTimestamp || 0; diff --git a/client/src/ui/components/worldmap/armies/SelectedArmy.tsx b/client/src/ui/components/worldmap/armies/SelectedArmy.tsx index 4897a64fe..bfb023583 100644 --- a/client/src/ui/components/worldmap/armies/SelectedArmy.tsx +++ b/client/src/ui/components/worldmap/armies/SelectedArmy.tsx @@ -2,7 +2,6 @@ import { useOwnArmiesByPosition } from "@/hooks/helpers/useArmies"; import { useEntities } from "@/hooks/helpers/useEntities"; import { useQuery } from "@/hooks/helpers/useQuery"; import useUIStore from "@/hooks/store/useUIStore"; -import { useWorldStore } from "@/hooks/store/useWorldLoading"; import { Position } from "@/types/Position"; import { ArmyChip } from "@/ui/components/military/ArmyChip"; import { InventoryResources } from "@/ui/components/resources/InventoryResources"; @@ -15,8 +14,6 @@ export const SelectedArmy = () => { const updateSelectedEntityId = useUIStore((state) => state.updateSelectedEntityId); const { isMapView } = useQuery(); - const isWorldLoading = useWorldStore((state) => state.isWorldLoading); - const [selectedArmyIndex, setSelectedArmyIndex] = useState(0); useEffect(() => { @@ -66,52 +63,34 @@ export const SelectedArmy = () => { const showTooltip = selectedHex && ownArmy && isMapView; return ( - <> -
- {isWorldLoading && ( -
- -
World state is loading...
-
- )} -
-
- {showTooltip && ( -
- {userArmies.length > 1 && ( -
-
Press Tab to cycle through armies
-
- Army {selectedArmyIndex + 1}/{userArmies.length} -
+ > + {showTooltip && ( +
+ {userArmies.length > 1 && ( +
+
Press Tab to cycle through armies
+
+ Army {selectedArmyIndex + 1}/{userArmies.length}
- )} - - - -
- )} -
- +
+ )} + + + +
+ )} +
); }; diff --git a/client/src/ui/layouts/World.tsx b/client/src/ui/layouts/World.tsx index 55d1d0182..047153695 100644 --- a/client/src/ui/layouts/World.tsx +++ b/client/src/ui/layouts/World.tsx @@ -13,7 +13,6 @@ import { useDojo } from "@/hooks/context/DojoContext"; import { PlayerStructure, useEntities } from "@/hooks/helpers/useEntities"; import { useStructureEntityId } from "@/hooks/helpers/useStructureEntityId"; import { useFetchBlockchainData } from "@/hooks/store/useBlockchainStore"; -import { useWorldStore } from "@/hooks/store/useWorldLoading"; import { ADMIN_BANK_ENTITY_ID } from "@bibliothecadao/eternum"; import { getComponentValue } from "@dojoengine/recs"; import { getEntityIdFromKeys } from "@dojoengine/utils"; @@ -105,8 +104,11 @@ export const World = ({ backgroundImage }: { backgroundImage: string }) => { useStructureEntityId(); // We could optimise this deeper.... - const setWorldLoading = useWorldStore((state) => state.setWorldLoading); - const setMarketLoading = useWorldStore((state) => state.setMarketLoading); + const setMarketLoading = useUIStore((state) => state.setMarketLoading); + const setArrivalsLoading = useUIStore((state) => state.setArrivalsLoading); + const setPlayerStructuresLoading = useUIStore((state) => state.setPlayerStructuresLoading); + const setSelectedStructureLoading = useUIStore((state) => state.setSelectedStructureLoading); + const setBankLoading = useUIStore((state) => state.setBankLoading); const dojo = useDojo(); const structureEntityId = useUIStore((state) => state.structureEntityId); @@ -134,7 +136,6 @@ export const World = ({ backgroundImage }: { backgroundImage: string }) => { getEntityIdFromKeys([BigInt(structureEntityId)]), ); - setWorldLoading(true); setSubscriptions((prev) => ({ ...prev, [structureEntityId.toString()]: true, @@ -142,6 +143,7 @@ export const World = ({ backgroundImage }: { backgroundImage: string }) => { ...Object.fromEntries(filteredStructures.map((structure) => [structure.entity_id.toString(), true])), })); + setSelectedStructureLoading(true); const fetch = async () => { console.log("AddToSubscriptionStart - 1"); try { @@ -152,11 +154,11 @@ export const World = ({ backgroundImage }: { backgroundImage: string }) => { [structureEntityId.toString()], [{ x: position?.x || 0, y: position?.y || 0 }], ), - ]); + ]).finally(() => { + setSelectedStructureLoading(false); + }); } catch (error) { console.error("Fetch failed", error); - } finally { - setWorldLoading(false); } }; @@ -164,40 +166,56 @@ export const World = ({ backgroundImage }: { backgroundImage: string }) => { }, [structureEntityId]); useEffect(() => { - try { - setWorldLoading(true); - console.log("AddToSubscriptionStart - 2"); - debouncedAddToSubscription( - dojo.network.toriiClient, - dojo.network.contractComponents as any, - [...filteredStructures.map((structure) => structure.entity_id.toString())], - [...filteredStructures.map((structure) => ({ x: structure.position.x, y: structure.position.y }))], - ); - debouncedAddToSubscriptionOneKey(dojo.network.toriiClient, dojo.network.contractComponents as any, [ - ...filteredStructures.map((structure) => structure.entity_id.toString()), - ]); - debounceAddResourceArrivals(dojo.network.toriiClient, dojo.network.contractComponents as any, [ - ...structures.map((structure) => structure.entity_id), - ]); - } catch (error) { - console.error("Fetch failed", error); - } finally { - setWorldLoading(false); - } + const fetch = async () => { + setPlayerStructuresLoading(true); + setArrivalsLoading(true); + try { + console.log("AddToSubscriptionStart - 2"); + await Promise.all([ + debouncedAddToSubscription( + dojo.network.toriiClient, + dojo.network.contractComponents as any, + [...filteredStructures.map((structure) => structure.entity_id.toString())], + [...filteredStructures.map((structure) => ({ x: structure.position.x, y: structure.position.y }))], + ), + debouncedAddToSubscriptionOneKey(dojo.network.toriiClient, dojo.network.contractComponents as any, [ + ...filteredStructures.map((structure) => structure.entity_id.toString()), + ]), + ]).finally(() => { + // setPlayerStructuresLoading(false); + }); + + await debounceAddResourceArrivals( + dojo.network.toriiClient, + dojo.network.contractComponents as any, + [...structures.map((structure) => structure.entity_id)], + () => setArrivalsLoading(false), + ).finally(() => { + // setArrivalsLoading(false); + }); + } catch (error) { + console.error("Fetch failed", error); + } + }; + + fetch(); }, [structures.length]); useEffect(() => { try { setMarketLoading(true); + setBankLoading(true); console.log("AddToSubscriptionStart - 3"); debouncedAddToSubscription(dojo.network.toriiClient, dojo.network.contractComponents as any, [ ADMIN_BANK_ENTITY_ID.toString(), - ]); - debouncedAddMarketSubscription(dojo.network.toriiClient, dojo.network.contractComponents as any); + ]).finally(() => { + setBankLoading(false); + }); + debouncedAddMarketSubscription(dojo.network.toriiClient, dojo.network.contractComponents as any).finally(() => { + setMarketLoading(false); + }); } catch (error) { console.error("Fetch failed", error); - } finally { - setMarketLoading(false); } }, []); diff --git a/client/src/ui/modules/navigation/QuestMenu.tsx b/client/src/ui/modules/navigation/QuestMenu.tsx index 2b86307ff..eaf24a866 100644 --- a/client/src/ui/modules/navigation/QuestMenu.tsx +++ b/client/src/ui/modules/navigation/QuestMenu.tsx @@ -2,7 +2,6 @@ import { useDojo } from "@/hooks/context/DojoContext"; import { Prize, QuestStatus, useQuests, useUnclaimedQuestsCount } from "@/hooks/helpers/useQuests"; import { useRealm } from "@/hooks/helpers/useRealm"; import useUIStore from "@/hooks/store/useUIStore"; -import { useWorldStore } from "@/hooks/store/useWorldLoading"; import { useStartingTutorial } from "@/hooks/use-starting-tutorial"; import { questSteps, useTutorial } from "@/hooks/use-tutorial"; import Button from "@/ui/elements/Button"; @@ -19,7 +18,7 @@ export const QuestsMenu = memo(() => { }, } = useDojo(); - const worldLoading = useWorldStore((state) => state.isWorldLoading); + const worldLoading = useUIStore((state) => state.isWorldLoading); useStartingTutorial(); @@ -34,7 +33,7 @@ export const QuestsMenu = memo(() => { const { handleStart } = useTutorial(questSteps.get(currentQuest?.id || QuestType.Settle)); - const isWorldLoading = useWorldStore((state) => state.isWorldLoading); + const isWorldLoading = useUIStore((state) => state.isWorldLoading); const { unclaimedQuestsCount } = useUnclaimedQuestsCount(); const [isLoading, setIsLoading] = useState(false); diff --git a/client/src/ui/modules/world-structures/WorldStructuresMenu.tsx b/client/src/ui/modules/world-structures/WorldStructuresMenu.tsx index 7473c53e0..dbf7c1ad0 100644 --- a/client/src/ui/modules/world-structures/WorldStructuresMenu.tsx +++ b/client/src/ui/modules/world-structures/WorldStructuresMenu.tsx @@ -7,7 +7,7 @@ import { useFragmentMines } from "@/hooks/helpers/useFragmentMines"; import { useGuilds } from "@/hooks/helpers/useGuilds"; import { useHyperstructureProgress, useHyperstructures } from "@/hooks/helpers/useHyperstructures"; import { useResourceBalance } from "@/hooks/helpers/useResources"; -import { useWorldStore } from "@/hooks/store/useWorldLoading"; +import useUIStore from "@/hooks/store/useUIStore"; import { FragmentMinePanel } from "@/ui/components/fragmentMines/FragmentMinePanel"; import { HintSection } from "@/ui/components/hints/HintModal"; import { DisplayedAccess, HyperstructurePanel } from "@/ui/components/hyperstructures/HyperstructurePanel"; @@ -33,8 +33,8 @@ export const WorldStructuresMenu = ({ className }: { className?: string }) => { network: { toriiClient, contractComponents }, } = useDojo(); - const isStructuresLoading = useWorldStore((state) => state.isStructuresLoading); - const setStructuresLoading = useWorldStore((state) => state.setStructuresLoading); + const isHyperstructureLoading = useUIStore((state) => state.isHyperstructureLoading); + const setHyperstructureLoading = useUIStore((state) => state.setHyperstructureLoading); useEffect(() => { const fetchData = async () => { @@ -42,8 +42,8 @@ export const WorldStructuresMenu = ({ className }: { className?: string }) => { await fetchHyperstructureData( toriiClient, contractComponents as any, - isStructuresLoading, - setStructuresLoading, + isHyperstructureLoading, + setHyperstructureLoading, ); } catch (error) { console.error("Failed to fetch hyperstructure data:", error); @@ -142,7 +142,7 @@ export const WorldStructuresMenu = ({ className }: { className?: string }) => { [selectedTab, hyperstructures, fragmentMines, showOnlyMine, account.address, myHyperstructures], ); - if (isStructuresLoading) { + if (isHyperstructureLoading) { return (
Loading structures...