import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:kmobile/features/customer_info/screens/customer_info_screen.dart';
import 'config/themes.dart';
import 'config/routes.dart';
import 'di/injection.dart';
import 'features/auth/controllers/auth_cubit.dart';
import 'features/auth/controllers/auth_state.dart';
import 'features/card/screens/card_management_screen.dart';
import 'features/auth/screens/login_screen.dart';
import 'features/service/screens/service_screen.dart';
import 'features/dashboard/screens/dashboard_screen.dart';
import 'package:material_symbols_icons/material_symbols_icons.dart';

class KMobile extends StatelessWidget {
  const KMobile({super.key});

  @override
  Widget build(BuildContext context) {
    // Set status bar color
    SystemChrome.setSystemUIOverlayStyle(
      const SystemUiOverlayStyle(
        statusBarColor: Colors.transparent,
        statusBarIconBrightness: Brightness.dark,
      ),
    );

    return MultiBlocProvider(
      providers: [
        BlocProvider<AuthCubit>(
          create: (_) => getIt<AuthCubit>(),
        ),
        // Add other Bloc/Cubit providers here
      ],
      child: MaterialApp(
        title: 'Banking App',
        debugShowCheckedModeBanner: false,
        theme: AppThemes.lightTheme,
        darkTheme: AppThemes.darkTheme,
        themeMode: ThemeMode.system, // Use system theme by default
        onGenerateRoute: AppRoutes.generateRoute,
        initialRoute: AppRoutes.splash,
        builder: (context, child) {
          return MediaQuery(
            // Prevent font scaling to maintain design consistency
            data: MediaQuery.of(context)
                .copyWith(textScaler: const TextScaler.linear(1.0)),
            child: child!,
          );
        },
        home: BlocBuilder<AuthCubit, AuthState>(
          builder: (context, state) {
            // Handle different authentication states
            if (state is AuthInitial || state is AuthLoading) {
              return const SplashScreen();
            }

            if(state is ShowBiometricPermission){
              return const BiometricPermissionScreen();
            }

            if (state is Authenticated) {
              return const NavigationScaffold();
            }

            return const LoginScreen();
          },
        ),
      ),
    );
  }
}

// Simple splash screens component
class SplashScreen extends StatelessWidget {
  const SplashScreen();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // Replace with your bank logo
            Image.asset(
              'assets/images/logo.png',
              width: 150,
              height: 150,
              errorBuilder: (context, error, stackTrace) {
                return const Icon(
                  Icons.account_balance,
                  size: 100,
                  color: Colors.blue,
                );
              },
            ),
            const SizedBox(height: 24),
            const Text(
              'SecureBank',
              style: TextStyle(
                fontSize: 28,
                fontWeight: FontWeight.bold,
              ),
            ),
            const SizedBox(height: 16),
            const CircularProgressIndicator(),
          ],
        ),
      ),
    );
  }
}

class NavigationScaffold extends StatefulWidget {
  const NavigationScaffold({super.key});

  @override
  State<NavigationScaffold> createState() => _NavigationScaffoldState();
}

class _NavigationScaffoldState extends State<NavigationScaffold> {
  final PageController _pageController = PageController();
  int _selectedIndex = 0;

  final List<Widget> _pages = [
    DashboardScreen(),
    CardManagementScreen(),
    ServiceScreen(),
    CustomerInfoScreen()
  ];

  void _onItemTapped(int index) {
    setState(() {
      _selectedIndex = index;
    });
    _pageController.jumpToPage(index);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: PageView(
        controller: _pageController,
        physics: const NeverScrollableScrollPhysics(),
        children: _pages,
      ),
      bottomNavigationBar: BottomNavigationBar(
        currentIndex: _selectedIndex,
        type: BottomNavigationBarType.fixed,
        items: const [
          BottomNavigationBarItem(
            icon: Icon(Icons.home_filled),
            label: 'Home',
          ),
          BottomNavigationBarItem(
            icon: Icon(Symbols.credit_card),
            label: 'Card',
          ),
          BottomNavigationBarItem(
            icon: Icon(Symbols.concierge),
            label: 'Services',
          ),
        ],
        onTap: _onItemTapped,
        backgroundColor: const Color(0xFFE0F7FA), // Light blue background
        selectedItemColor: Colors.blue[800],
        unselectedItemColor: Colors.black54,
      ),
    );
  }
}

class BiometricPermissionScreen extends StatelessWidget {
  const BiometricPermissionScreen({super.key});

  @override
  Widget build(BuildContext context) {
    final cubit = context.read<AuthCubit>();

    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            const Text('Would you like to enable biometric authentication?'),
            ElevatedButton(
              onPressed: () => cubit.handleBiometricChoice(true),
              child: const Text('Yes'),
            ),
            TextButton(
              onPressed: () => cubit.handleBiometricChoice(false),
              child: const Text('No, thanks'),
            ),
          ],
        ),
      ),
    );
  }
}