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),
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}