diff --git a/src/modules/market/views/MarketPage.vue b/src/modules/market/views/MarketPage.vue index 12381fd..95b1d36 100644 --- a/src/modules/market/views/MarketPage.vue +++ b/src/modules/market/views/MarketPage.vue @@ -3,7 +3,7 @@ { // Check if market data is ready (either preloaded or loaded) const isMarketReady = computed(() => { const isLoading = marketStore.isLoading ?? false + const hasError = !!(marketStore.error || marketPreloader.preloadError.value) + + // Market is ready if: + // 1. Successfully preloaded, OR + // 2. Has products, not loading, and no current errors const ready = marketPreloader.isPreloaded.value || - (marketStore.products.length > 0 && !isLoading) + (marketStore.products.length > 0 && !isLoading && !hasError) return ready }) @@ -240,6 +245,57 @@ const handleCategoryFilter = (category: string) => { toggleCategory(category) } +// DEBUG: Temporary methods to test loading states (will be removed) +const simulateLoading = () => { + console.log('🔄 Simulating loading state...') + marketStore.setError(null) + marketStore.setLoading(true) + marketPreloader.resetPreload() + + setTimeout(() => { + console.log('✅ Simulating successful load') + marketStore.setLoading(false) + retryLoadMarket() + }, 3000) +} + +const simulateError = () => { + console.log('❌ Simulating error state...') + marketStore.setLoading(false) + marketStore.setError('Simulated error for testing') + marketPreloader.resetPreload() +} + +const debugLoadingState = () => { + const isLoading = marketStore.isLoading ?? false + const hasError = !!(marketStore.error || marketPreloader.preloadError.value) + + console.log('🔍 Loading State Debug:', { + isMarketReady: isMarketReady.value, + 'marketStore.isLoading': marketStore.isLoading, + 'marketStore.error': marketStore.error, + 'marketStore.products.length': marketStore.products.length, + 'marketPreloader.isPreloading': marketPreloader.isPreloading.value, + 'marketPreloader.preloadError': marketPreloader.preloadError.value, + 'marketPreloader.isPreloaded': marketPreloader.isPreloaded.value, + hasError, + '--- UI State ---': '---', + 'LoadingErrorState.isLoading': !isMarketReady.value && (isLoading || marketPreloader.isPreloading.value), + 'LoadingErrorState.hasError': hasError && !isMarketReady.value, + 'ShowMarketContent': isMarketReady.value + }) +} + +// Make debug methods available globally for testing +if (typeof window !== 'undefined') { + ;(window as any).debugMarketLoading = { + simulateLoading, + simulateError, + debugLoadingState, + retryLoadMarket + } +} + onMounted(() => { // Only load market if it hasn't been preloaded if (needsToLoadMarket.value) {