import 'package:e_receipt_mobile/core/theme/app_colors.dart';
import 'package:e_receipt_mobile/domain/entities/login_user.dart';
import 'package:e_receipt_mobile/presentation/auth/session_controller.dart';
import 'package:e_receipt_mobile/presentation/home/home_view_model.dart';
import 'package:e_receipt_mobile/presentation/login/login_page.dart';
import 'package:e_receipt_mobile/presentation/settings/settings_screen.dart';
import 'package:e_receipt_mobile/presentation/terminal/terminal_selection_screen.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

class HomeScreen extends ConsumerWidget {
  const HomeScreen({required this.user, super.key});

  final LoginUser user;

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final merchantsAsync = ref.watch(merchantListProvider);

    return Scaffold(
      appBar: AppBar(
        title: Text("Merchants"),
        centerTitle: true,
      ),
      drawer: Drawer(
        backgroundColor: Colors.white,

          child: Column(
            children: [
              UserAccountsDrawerHeader(
                decoration: const BoxDecoration(color: AppColors.primary),
                accountName: Text(
                  user.username,
                  style: const TextStyle(
                    color: Colors.white,
                    fontWeight: FontWeight.w600,
                  ),
                ),
                accountEmail: Text(
                  'Role: ${user.role}',
                  style: const TextStyle(color: Colors.white70),
                ),
                currentAccountPicture: CircleAvatar(
                  backgroundColor: Colors.white,
                  child: Text(
                    (user.username.isNotEmpty ? user.username[0] : 'U')
                        .toUpperCase(),
                    style: const TextStyle(color: AppColors.primary),
                  ),
                ),
              ),
              ListTile(
                leading: const Icon(Icons.person_outline, color: Colors.black87),
                title: const Text(
                  'Profile',
                  style: TextStyle(
                    color: Colors.black87,
                    fontWeight: FontWeight.w500,
                  ),
                ),
                onTap: () {
                  Navigator.of(context).pop();
                  _showProfile(context);
                },
              ),
              // ListTile(
              //   leading: const Icon(Icons.storefront_outlined),
              //   title: const Text('Merchants'),
              //   onTap: () => Navigator.of(context).pop(),
              // ),
              ListTile(
                leading: const Icon(Icons.analytics_outlined, color: Colors.black87),
                title: const Text(
                  'Reports',
                  style: TextStyle(
                    color: Colors.black87,
                    fontWeight: FontWeight.w500,
                  ),
                ),
                onTap: () {
                  Navigator.of(context).pop();
                  _showComingSoon(context, 'Reports');
                },
              ),
              ListTile(
                leading: const Icon(Icons.settings_outlined, color: Colors.black87),
                title: const Text(
                  'Settings',
                  style: TextStyle(
                    color: Colors.black87,
                    fontWeight: FontWeight.w500,
                  ),
                ),
                onTap: () {
                  Navigator.of(context).pop();
                  Navigator.of(context).push(
                    MaterialPageRoute<void>(
                      builder: (_) => const SettingsScreen(),
                    ),
                  );
                },
              ),
              ListTile(
                leading: const Icon(Icons.help_outline, color: Colors.black87),
                title: const Text(
                  'Help',
                  style: TextStyle(
                    color: Colors.black87,
                    fontWeight: FontWeight.w500,
                  ),
                ),
                onTap: () {
                  Navigator.of(context).pop();
                  _showComingSoon(context, 'Help');
                },
              ),
              const Spacer(),
              const Divider(height: 1, color: Colors.black12),
              ListTile(
                contentPadding: const EdgeInsets.symmetric(
                  horizontal: 16,
                  vertical: 8,
                ),
                minTileHeight: 64,
                leading: const Icon(Icons.logout, color: Colors.black87),
                title: const Text(
                  'Logout',
                  style: TextStyle(
                    color: Colors.black87,
                    fontWeight: FontWeight.w600,
                  ),
                ),
                onTap: () async {
                  final shouldLogout = await showDialog<bool>(
                    context: context,
                    builder: (context) {
                      return AlertDialog(
                        title: const Text('Logout'),
                        content: const Text('Are you sure want to logout?'),
                        actions: [
                          TextButton(
                            onPressed: () => Navigator.of(context).pop(false),
                            child: const Text('Cancel'),
                          ),
                          TextButton(
                            onPressed: () => Navigator.of(context).pop(true),
                            child: const Text('Logout'),
                          ),
                        ],
                      );
                    },
                  );

                  if (shouldLogout != true || !context.mounted) {
                    return;
                  }

                  ref.read(sessionControllerProvider.notifier).clearUser();
                  Navigator.of(context).pushAndRemoveUntil(
                    MaterialPageRoute<void>(
                      builder: (_) => const LoginPage(),
                    ),
                    (route) => false,
                  );
                },
              ),
            ],
          ),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16),
        child: merchantsAsync.when(
          loading: () => const Center(child: CircularProgressIndicator()),
          error: (error, _) => Center(
            child: Text('Failed to load merchants: $error'),
          ),
          data: (merchants) {
            return Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  'Total (${merchants.length})',
                  style: Theme.of(context).textTheme.titleLarge,
                ),
                const SizedBox(height: 8),
                Expanded(
                  child: RefreshIndicator(
                    onRefresh: () => ref.refresh(merchantListProvider.future),
                    child: merchants.isEmpty
                        ? ListView(
                            physics: const AlwaysScrollableScrollPhysics(),
                            children: const [
                              SizedBox(height: 120),
                              Center(child: Text('No merchants found')),
                            ],
                          )
                        : ListView.separated(
                            physics: const AlwaysScrollableScrollPhysics(),
                            itemCount: merchants.length,
                            separatorBuilder: (_, __) =>
                                const SizedBox(height: 10),
                            itemBuilder: (context, index) {
                              final merchant = merchants[index];
                              return Card(
                                child: ListTile(
                                  onTap: merchant.id == null
                                      ? null
                                      : () => _openTerminalSelection(
                                          context,
                                          merchant.id!,
                                          merchant.name ?? '-',
                                        ),
                                  leading: const Icon(Icons.storefront_outlined),
                                  trailing: const Icon(Icons.chevron_right),
                                  title: Text(
                                    '${index + 1}. ${merchant.name ?? '-'}',
                                  ),
                                  subtitle: Text(merchant.address ?? '-'),
                                ),
                              );
                            },
                          ),
                  ),
                ),
              ],
            );
          },
        ),
      ),
    );
  }

  void _showComingSoon(BuildContext context, String feature) {
    ScaffoldMessenger.of(
      context,
    ).showSnackBar(SnackBar(content: Text('$feature is coming soon')));
  }

  void _showProfile(BuildContext context) {
    showDialog<void>(
      context: context,
      builder: (context) {
        return AlertDialog(
          title: const Text('Profile'),
          content: Column(
            mainAxisSize: MainAxisSize.min,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text('Username: ${user.username}'),
              const SizedBox(height: 8),
              Text('Role: ${user.role}'),
            ],
          ),
          actions: [
            TextButton(
              onPressed: () => Navigator.of(context).pop(),
              child: const Text('Close'),
            ),
          ],
        );
      },
    );
  }

  void _openTerminalSelection(
    BuildContext context,
    String merchantId,
    String merchantName,
  ) {
    Navigator.of(context).push(
      MaterialPageRoute<void>(
        builder: (_) => TerminalSelectionScreen(
          merchantId: merchantId,
          merchantName: merchantName,
        ),
      ),
    );
  }
}