import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../auth/controllers/auth_cubit.dart';
import '../../auth/controllers/auth_state.dart';
import '../widgets/account_card.dart';
import '../widgets/transaction_list_item.dart';
import '../../accounts/models/account.dart';
import '../../transactions/models/transaction.dart';

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

  @override
  State<DashboardScreen> createState() => _DashboardScreenState();
}

class _DashboardScreenState extends State<DashboardScreen> {
  // Mock data for demonstration
  final List<Account> _accounts = [
    Account(
      id: '1',
      accountNumber: '**** 4589',
      accountType: 'Savings',
      balance: 12450.75,
      currency: 'USD',
    ),
    Account(
      id: '2',
      accountNumber: '**** 7823',
      accountType: 'Checking',
      balance: 3840.50,
      currency: 'USD',
    ),
  ];

  final List<Transaction> _recentTransactions = [
    Transaction(
      id: 't1',
      description: 'Coffee Shop',
      amount: -4.50,
      date: DateTime.now().subtract(const Duration(hours: 3)),
      category: 'Food & Drink',
    ),
    Transaction(
      id: 't2',
      description: 'Salary Deposit',
      amount: 2500.00,
      date: DateTime.now().subtract(const Duration(days: 2)),
      category: 'Income',
    ),
    Transaction(
      id: 't3',
      description: 'Electric Bill',
      amount: -85.75,
      date: DateTime.now().subtract(const Duration(days: 3)),
      category: 'Utilities',
    ),
    Transaction(
      id: 't4',
      description: 'Amazon Purchase',
      amount: -32.50,
      date: DateTime.now().subtract(const Duration(days: 5)),
      category: 'Shopping',
    ),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Dashboard'),
        actions: [
          IconButton(
            icon: const Icon(Icons.notifications_outlined),
            onPressed: () {
              // Navigate to notifications
            },
          ),
          IconButton(
            icon: const Icon(Icons.logout),
            onPressed: () {
              _showLogoutConfirmation(context);
            },
          ),
        ],
      ),
      body: RefreshIndicator(
        onRefresh: () async {
          // Implement refresh logic to fetch updated data
          await Future.delayed(const Duration(seconds: 1));
        },
        child: SingleChildScrollView(
          physics: const AlwaysScrollableScrollPhysics(),
          child: Padding(
            padding: const EdgeInsets.all(16.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                // Greeting section
                BlocBuilder<AuthCubit, AuthState>(
                  builder: (context, state) {
                    if (state is Authenticated) {
                      return Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            'Hello, ${state.user.username}',
                            style: Theme.of(context).textTheme.headlineSmall,
                          ),
                          const SizedBox(height: 4),
                          Text(
                            'Welcome back to your banking app',
                            style: Theme.of(context).textTheme.bodyMedium?.copyWith(
                                  color: Colors.grey[600],
                                ),
                          ),
                        ],
                      );
                    }
                    return Container();
                  },
                ),
                
                const SizedBox(height: 24),
                
                // Account cards section
                const Text(
                  'Your Accounts',
                  style: TextStyle(
                    fontSize: 18,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                const SizedBox(height: 12),
                SizedBox(
                  height: 180,
                  child: ListView.builder(
                    scrollDirection: Axis.horizontal,
                    itemCount: _accounts.length + 1, // +1 for the "Add Account" card
                    itemBuilder: (context, index) {
                      if (index < _accounts.length) {
                        return Padding(
                          padding: const EdgeInsets.only(right: 16.0),
                          child: AccountCard(account: _accounts[index]),
                        );
                      } else {
                        // "Add Account" card
                        return Container(
                          width: 300,
                          margin: const EdgeInsets.only(right: 16.0),
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(12),
                            border: Border.all(color: Colors.grey[300]!),
                          ),
                          child: Center(
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: [
                                Icon(
                                  Icons.add_circle_outline,
                                  size: 40,
                                  color: Theme.of(context).primaryColor,
                                ),
                                const SizedBox(height: 8),
                                Text(
                                  'Add New Account',
                                  style: TextStyle(
                                    color: Theme.of(context).primaryColor,
                                    fontWeight: FontWeight.bold,
                                  ),
                                ),
                              ],
                            ),
                          ),
                        );
                      }
                    },
                  ),
                ),
                
                const SizedBox(height: 32),
                
                // Quick Actions section
                const Text(
                  'Quick Actions',
                  style: TextStyle(
                    fontSize: 18,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                const SizedBox(height: 16),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                  children: [
                    _buildQuickActionButton(
                      icon: Icons.swap_horiz,
                      label: 'Transfer',
                      onTap: () {
                        // Navigate to transfer screen
                      },
                    ),
                    _buildQuickActionButton(
                      icon: Icons.payment,
                      label: 'Pay Bills',
                      onTap: () {
                        // Navigate to bill payment screen
                      },
                    ),
                    _buildQuickActionButton(
                      icon: Icons.qr_code_scanner,
                      label: 'Scan & Pay',
                      onTap: () {
                        // Navigate to QR code scanner
                      },
                    ),
                    _buildQuickActionButton(
                      icon: Icons.more_horiz,
                      label: 'More',
                      onTap: () {
                        // Show more options
                      },
                    ),
                  ],
                ),
                
                const SizedBox(height: 32),
                
                // Recent Transactions section
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    const Text(
                      'Recent Transactions',
                      style: TextStyle(
                        fontSize: 18,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    TextButton(
                      onPressed: () {
                        // Navigate to all transactions
                      },
                      child: const Text('See All'),
                    ),
                  ],
                ),
                const SizedBox(height: 8),
                ListView.builder(
                  physics: const NeverScrollableScrollPhysics(),
                  shrinkWrap: true,
                  itemCount: _recentTransactions.length,
                  itemBuilder: (context, index) {
                    return TransactionListItem(
                      transaction: _recentTransactions[index],
                    );
                  },
                ),
              ],
            ),
          ),
        ),
      ),
      bottomNavigationBar: BottomNavigationBar(
        currentIndex: 0,
        type: BottomNavigationBarType.fixed,
        items: const [
          BottomNavigationBarItem(
            icon: Icon(Icons.dashboard),
            label: 'Home',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.account_balance_wallet),
            label: 'Accounts',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.show_chart),
            label: 'Insights',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.person),
            label: 'Profile',
          ),
        ],
        onTap: (index) {
          // Handle navigation
        },
      ),
    );
  }

  Widget _buildQuickActionButton({
    required IconData icon,
    required String label,
    required VoidCallback onTap,
  }) {
    return GestureDetector(
      onTap: onTap,
      child: Column(
        children: [
          Container(
            padding: const EdgeInsets.all(12),
            decoration: BoxDecoration(
              color: Theme.of(context).primaryColor.withAlpha((0.1 * 255).toInt()),
              borderRadius: BorderRadius.circular(12),
            ),
            child: Icon(
              icon,
              color: Theme.of(context).primaryColor,
              size: 28,
            ),
          ),
          const SizedBox(height: 8),
          Text(
            label,
            style: const TextStyle(
              fontSize: 12,
              fontWeight: FontWeight.w500,
            ),
          ),
        ],
      ),
    );
  }

  void _showLogoutConfirmation(BuildContext context) {
    showDialog(
      context: context,
      builder: (context) => AlertDialog(
        title: const Text('Logout'),
        content: const Text('Are you sure you want to logout?'),
        actions: [
          TextButton(
            onPressed: () => Navigator.pop(context),
            child: const Text('CANCEL'),
          ),
          TextButton(
            onPressed: () {
              Navigator.pop(context);
              context.read<AuthCubit>().logout();
            },
            child: const Text('LOGOUT'),
          ),
        ],
      ),
    );
  }
}