import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:kmobile/data/models/user.dart';
import 'package:kmobile/features/auth/controllers/auth_cubit.dart';
import 'package:kmobile/features/auth/controllers/auth_state.dart';
import 'package:kmobile/features/fund_transfer/screens/fund_transfer_beneficiary_screen.dart';
import 'package:kmobile/features/fund_transfer/screens/fund_transfer_self_accounts_screen.dart';
import 'package:material_symbols_icons/symbols.dart';
import '../../../l10n/app_localizations.dart'; // Keep localizations

class FundTransferScreen extends StatelessWidget {
  final String creditAccountNo;
  final String remitterName;
  final List<User> accounts; // Continue to accept the list of accounts

  const FundTransferScreen({
    super.key,
    required this.creditAccountNo,
    required this.remitterName,
    required this.accounts, // It is passed from the dashboard
  });

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        // Restore localization for the title
        title: Text(AppLocalizations.of(context)
            .fundTransfer
            .replaceFirst(RegExp('\n'), '')),
      ),
      // Wrap with BlocBuilder to check the authentication state
      body: BlocBuilder<AuthCubit, AuthState>(
        builder: (context, state) {
          return Stack(
            children: [
              Padding(
                padding: const EdgeInsets.symmetric(vertical: 16.0),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                  children: [
                    Expanded(
                      child: FundTransferManagementTile(
                        icon: Symbols.person,
                        label: AppLocalizations.of(context).selfPay,
                        subtitle:
                            AppLocalizations.of(context).ftselfpaysubtitle,
                        onTap: () {
                          Navigator.push(
                            context,
                            MaterialPageRoute(
                              builder: (context) =>
                                  FundTransferSelfAccountsScreen(
                                debitAccountNo: creditAccountNo,
                                remitterName: remitterName,
                                accounts: accounts,
                              ),
                            ),
                          );
                        },
                        disable: state is! Authenticated,
                      ),
                    ),
                    const SizedBox(height: 16),
                    Expanded(
                      child: FundTransferManagementTile(
                        icon: Symbols.input_circle,
                        label: AppLocalizations.of(context).ownBank,
                        subtitle: AppLocalizations.of(context).ftownsubtitle,
                        onTap: () {
                          Navigator.push(
                            context,
                            MaterialPageRoute(
                              builder: (context) =>
                                  FundTransferBeneficiaryScreen(
                                creditAccountNo: creditAccountNo,
                                remitterName: remitterName,
                                isOwnBank: true,
                              ),
                            ),
                          );
                        },
                      ),
                    ),
                    const SizedBox(height: 16),
                    Expanded(
                      child: FundTransferManagementTile(
                        icon: Symbols.output_circle,
                        label: AppLocalizations.of(context).outsideBank,
                        subtitle:
                            AppLocalizations.of(context).ftoutsidesubtitle,
                        onTap: () {
                          Navigator.push(
                            context,
                            MaterialPageRoute(
                              builder: (context) =>
                                  FundTransferBeneficiaryScreen(
                                creditAccountNo: creditAccountNo,
                                remitterName: remitterName,
                                isOwnBank: false,
                              ),
                            ),
                          );
                        },
                      ),
                    ),
                  ],
                ),
              ),
              IgnorePointer(
                child: Center(
                  child: Opacity(
                    opacity: 0.07, // Reduced opacity
                    child: ClipOval(
                      child: Image.asset(
                        'assets/images/logo.png',
                        width: 200, // Adjust size as needed
                        height: 200, // Adjust size as needed
                      ),
                    ),
                  ),
                ),
              ),
            ],
          );
        },
      ),
    );
  }
}

class FundTransferManagementTile extends StatelessWidget {
  final IconData icon;
  final String label;
  final String? subtitle;
  final VoidCallback onTap;
  final bool disable;

  const FundTransferManagementTile({
    super.key,
    required this.icon,
    required this.label,
    this.subtitle,
    required this.onTap,
    this.disable = false,
  });

  @override
  Widget build(BuildContext context) {
    final theme = Theme.of(context);
    return Card(
      margin: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(12.0),
      ),
      elevation: 4, // Add some elevation for better visual separation
      child: InkWell(
        onTap:
            disable ? null : onTap, // Disable InkWell if the tile is disabled
        borderRadius: BorderRadius.circular(12.0),
        child: Padding(
          padding: const EdgeInsets.symmetric(vertical: 24.0, horizontal: 16.0),
          child: Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Icon(
                  icon,
                  size: 48, // Make icon larger
                  color:
                      disable ? theme.disabledColor : theme.colorScheme.primary,
                ),
                const SizedBox(height: 12),
                Text(
                  label,
                  textAlign: TextAlign.center,
                  style: theme.textTheme.titleLarge?.copyWith(
                    fontWeight: FontWeight.bold,
                    color: disable
                        ? theme.disabledColor
                        : theme.colorScheme.onSurface,
                  ),
                ),
                if (subtitle != null)
                  Padding(
                    padding: const EdgeInsets.only(top: 8.0),
                    child: Text(
                      subtitle!,
                      textAlign: TextAlign.center,
                      style: theme.textTheme.bodyMedium?.copyWith(
                        color: disable
                            ? theme.disabledColor
                            : theme.colorScheme.onSurfaceVariant,
                      ),
                    ),
                  ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}
