Update main.js

main.js

@@ -4,43 +4,74 @@ import { refreshUI } from './ui.js';
 import { attachOneTimeListeners } from './events.js';
 import { supabase } from './supabaseClient.js';
 
+// UI Elements
 const loginScreen = document.getElementById('login-screen');
 const mainContent = document.getElementById('main-content');
+const loader = document.getElementById('loader');
 const userInfo = document.getElementById('user-info');
 const userEmailSpan = document.getElementById('user-email');
 const logoutBtn = document.getElementById('logout-btn');
 const reportsBtn = document.getElementById('show-reports-modal-btn');
+const footer = document.getElementById('footer');
 
-// This function will run whenever the user's login state changes
+// --- MODIFICATION: Robust Auth State Change Handler ---
 supabase.auth.onAuthStateChange(async (event, session) => {
+    // This handles both manual sign-in and automatic session restoration
     if (event === 'SIGNED_IN' || (event === 'INITIAL_SESSION' && session)) {
         appState.user = session.user;
+
+        // 1. Show loader, hide login screen
         loginScreen.classList.add('hidden');
-        mainContent.classList.remove('hidden');
-        userInfo.classList.remove('hidden');
-        logoutBtn.classList.remove('hidden');
-        reportsBtn.classList.remove('hidden');
-        userEmailSpan.textContent = session.user.email;
+        loader.classList.remove('hidden');
+        loader.classList.add('flex'); // Use flex to center content
+
+        // 2. Load all data from the database
+        const loadedSuccessfully = await loadInitialAppState();
+        
+        // 3. Once data is loaded, update the UI
+        if (loadedSuccessfully) {
+            refreshUI();
+            
+            // 4. Show the main content and hide the loader
+            mainContent.classList.remove('hidden');
+            mainContent.classList.remove('opacity-0');
+            footer.classList.remove('hidden');
+            userInfo.classList.remove('hidden');
+            logoutBtn.classList.remove('hidden');
+            reportsBtn.classList.remove('hidden');
+            userEmailSpan.textContent = session.user.email;
+        } else {
+            // Handle case where data loading fails
+            // Maybe show an error and a retry button, or force logout
+            alert('Failed to load factory data. Please try again.');
+            await supabase.auth.signOut();
+        }
+        
+        loader.classList.add('hidden');
+        loader.classList.remove('flex');
 
-        await loadInitialAppState();
-        refreshUI();
     } else if (event === 'SIGNED_OUT') {
         appState.user = null;
         appState.materials = [];
         appState.productionLog = [];
-        loginScreen.classList.remove('hidden');
+        
+        // Ensure a clean UI state on logout
         mainContent.classList.add('hidden');
+        mainContent.classList.add('opacity-0');
+        footer.classList.add('hidden');
         userInfo.classList.add('hidden');
         logoutBtn.classList.add('hidden');
         reportsBtn.classList.add('hidden');
-        refreshUI(); // Re-render to clear out old data from the UI
+        loader.classList.add('hidden');
+        loader.classList.remove('flex');
+        loginScreen.classList.remove('hidden');
     }
 });
 
 // Initializes the application when the page content is loaded.
 function init() {
     attachOneTimeListeners();
-    mainContent.classList.remove('opacity-0');
+    // The opacity transition is now handled by the auth listener
 }
 
 document.addEventListener('DOMContentLoaded', init);