feat(01-11): implement auth-aware router and splash screen

- Created AppRouter with GoRouter for declarative navigation - Added protected routes that redirect to login if not authenticated - Implemented splash screen with loading state and auth checking - Set up route definitions for login, signup, home, and splash - Added error handling for navigation failures - Includes authentication state-based redirects Files modified: - lib/core/router/app_router.dart - lib/features/authentication/presentation/pages/splash_page.dart
2026-01-28 11:05:02 -05:00
parent be4607e0eb
commit 1410e32005
2 changed files with 299 additions and 0 deletions
--- a/lib/features/authentication/presentation/pages/splash_page.dart
+++ b/lib/features/authentication/presentation/pages/splash_page.dart
@@ -0,0 +1,140 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:supabase_flutter/supabase_flutter.dart';
+
+/// Splash page for initial loading and authentication state checking
+/// 
+/// Shows loading indicator while checking authentication state
+/// and redirects to appropriate screen based on auth status
+class SplashPage extends ConsumerStatefulWidget {
+  const SplashPage({super.key});
+
+  @override
+  ConsumerState<SplashPage> createState() => _SplashPageState();
+}
+
+class _SplashPageState extends ConsumerState<SplashPage> {
+  @override
+  void initState() {
+    super.initState();
+    _checkAuthState();
+  }
+
+  /// Check authentication state and navigate accordingly
+  Future<void> _checkAuthState() async {
+    try {
+      // Add small delay for better UX - shows splash screen
+      await Future.delayed(const Duration(milliseconds: 1500));
+      
+      if (!mounted) return;
+      
+      // Check current authentication state
+      final currentUser = Supabase.instance.client.auth.currentUser;
+      
+      if (currentUser != null) {
+        // User is authenticated, navigate to home
+        // TODO: Use GoRouter when integrated
+        // Navigator.of(context).pushReplacementNamed('/home');
+        
+        // For now, we'll use a simple navigation
+        Navigator.of(context).pushReplacementNamed('/home');
+      } else {
+        // User is not authenticated, navigate to login
+        // TODO: Use GoRouter when integrated
+        // Navigator.of(context).pushReplacementNamed('/login');
+        
+        // For now, we'll use a simple navigation
+        Navigator.of(context).pushReplacementNamed('/login');
+      }
+    } catch (e) {
+      // Handle authentication state check errors
+      debugPrint('Error checking auth state: $e');
+      
+      if (!mounted) return;
+      
+      // On error, navigate to login for safety
+      Navigator.of(context).pushReplacementNamed('/login');
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      backgroundColor: Theme.of(context).colorScheme.primaryContainer,
+      body: Center(
+        child: Column(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: [
+            // App logo/icon
+            Container(
+              width: 120,
+              height: 120,
+              decoration: BoxDecoration(
+                color: Theme.of(context).colorScheme.primary,
+                borderRadius: BorderRadius.circular(24),
+                boxShadow: [
+                  BoxShadow(
+                    color: Theme.of(context).colorScheme.primary.withOpacity(0.3),
+                    blurRadius: 20,
+                    offset: const Offset(0, 8),
+                  ),
+                ],
+              ),
+              child: const Icon(
+                Icons.inventory_2_outlined,
+                size: 60,
+                color: Colors.white,
+              ),
+            ),
+            
+            const SizedBox(height: 32),
+            
+            // App name
+            Text(
+              'Sage',
+              style: Theme.of(context).textTheme.headlineMedium?.copyWith(
+                fontWeight: FontWeight.bold,
+                color: Theme.of(context).colorScheme.primary,
+              ),
+            ),
+            
+            const SizedBox(height: 8),
+            
+            // Tagline
+            Text(
+              'Your Food Inventory Tracker',
+              style: Theme.of(context).textTheme.bodyLarge?.copyWith(
+                color: Theme.of(context).colorScheme.onSurface.withOpacity(0.7),
+              ),
+            ),
+            
+            const SizedBox(height: 48),
+            
+            // Loading indicator
+            Column(
+              children: [
+                SizedBox(
+                  width: 24,
+                  height: 24,
+                  child: CircularProgressIndicator(
+                    strokeWidth: 2,
+                    valueColor: AlwaysStoppedAnimation<Color>(
+                      Theme.of(context).colorScheme.primary,
+                    ),
+                  ),
+                ),
+                const SizedBox(height: 16),
+                Text(
+                  'Loading...',
+                  style: Theme.of(context).textTheme.bodyMedium?.copyWith(
+                    color: Theme.of(context).colorScheme.onSurface.withOpacity(0.6),
+                  ),
+                ),
+              ],
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}