fix: Add useTenantInitializer to App.tsx to ensure tenantId is populated

CRITICAL FIX: This resolves the root cause of dashboard loading state issue.

Problem:
- Dashboard components stayed in loading state even with API 200 OK responses
- React Query hooks had `enabled: !!tenantId` flag (from previous fix)
- But tenantId was always empty string because useTenantInitializer was never called

Root Cause:
The useTenantInitializer hook was only called in UnifiedOnboardingWizard,
not at the app level. This hook is responsible for:
1. Loading user tenants when authenticated (loadUserTenants)
2. Automatically setting first tenant as current if none is set
3. Creating mock tenant for demo mode with proper tenantId

Fix:
Added useTenantInitializer() call to AppContent component in App.tsx.
Now it runs on every app load, ensuring:
- Authenticated users: tenants loaded from API, first one set as current
- Demo mode: mock tenant created with valid demo-tenant-id
- tenantId is available before dashboard queries execute

Flow after fix:
1. App loads → useTenantInitializer runs
2. Tenant loaded/created → tenantId populated
3. Dashboard loads → React Query hooks enabled (tenantId exists)
4. Queries execute → Data fetched → Components render

Related files:
- frontend/src/stores/useTenantInitializer.ts (hook definition)
- frontend/src/stores/tenant.store.ts (tenant state management)
- frontend/src/pages/app/DashboardPage.tsx (uses currentTenant.id)
This commit is contained in:
Claude
2025-11-07 22:40:08 +00:00
parent ef0a08e64a
commit f58885911f

View File

@@ -13,6 +13,7 @@ import { SSEProvider } from './contexts/SSEContext';
import { SubscriptionEventsProvider } from './contexts/SubscriptionEventsContext';
import GlobalSubscriptionHandler from './components/auth/GlobalSubscriptionHandler';
import { CookieBanner } from './components/ui/CookieConsent';
import { useTenantInitializer } from './stores/useTenantInitializer';
import i18n from './i18n';
const queryClient = new QueryClient({
@@ -29,6 +30,9 @@ const queryClient = new QueryClient({
function AppContent() {
const navigate = useNavigate();
// Initialize tenant data when user is authenticated or in demo mode
useTenantInitializer();
return (
<>
<Suspense fallback={<LoadingSpinner overlay />}>