import 'package:flutter/material.dart';
import 'package:kmobile/data/models/beneficiary.dart';
import 'package:kmobile/features/beneficiaries/screens/add_beneficiary_screen.dart';
import 'package:kmobile/features/beneficiaries/screens/beneficiary_details_screen.dart';
import '../../../l10n/app_localizations.dart';
import '../../../di/injection.dart';
import 'package:kmobile/api/services/beneficiary_service.dart';
import 'package:shimmer/shimmer.dart';
import 'package:kmobile/widgets/bank_logos.dart';

class ManageBeneficiariesScreen extends StatefulWidget {
  final String customerName;
  const ManageBeneficiariesScreen({super.key, required this.customerName});

  @override
  State<ManageBeneficiariesScreen> createState() =>
      _ManageBeneficiariesScreen();
}

class _ManageBeneficiariesScreen extends State<ManageBeneficiariesScreen> {
  var service = getIt<BeneficiaryService>();
  bool _isLoading = true;
  List<Beneficiary> _beneficiaries = [];
  List<Beneficiary> _filteredBeneficiaries = [];
  final TextEditingController _searchController = TextEditingController();

  @override
  void initState() {
    super.initState();
    _loadBeneficiaries();
    _searchController.addListener(() {
      _filterBeneficiaries(_searchController.text);
    });
  }

  @override
  void dispose() {
    _searchController.dispose();
    super.dispose();
  }

  Future<void> _loadBeneficiaries() async {
    final data = await service.fetchBeneficiaryList();
    setState(() {
      _beneficiaries = data;
      _filteredBeneficiaries = data;
      _isLoading = false;
    });
  }

  void _filterBeneficiaries(String query) {
    setState(() {
      if (query.isEmpty) {
        _filteredBeneficiaries = _beneficiaries;
      } else {
        _filteredBeneficiaries = _beneficiaries.where((beneficiary) {
          final lowerQuery = query.toLowerCase();
          return beneficiary.name.toLowerCase().contains(lowerQuery) ||
              beneficiary.accountNo.toLowerCase().contains(lowerQuery);
        }).toList();
      }
    });
  }

  Widget _buildShimmerList() {
    return ListView.builder(
      itemCount: 6,
      itemBuilder: (context, index) => Shimmer.fromColors(
        baseColor: Colors.grey.shade300,
        highlightColor: Colors.grey.shade100,
        child: ListTile(
          leading: const CircleAvatar(
            radius: 24,
            backgroundColor: Colors.white,
          ),
          title: Container(
            height: 16,
            color: Colors.white,
            margin: const EdgeInsets.symmetric(vertical: 4),
          ),
          subtitle: Container(
            height: 14,
            color: Colors.white,
            margin: const EdgeInsets.symmetric(vertical: 4),
          ),
        ),
      ),
    );
  }

  Widget _buildBeneficiaryList() {
    if (_filteredBeneficiaries.isEmpty) {
      return Center(
          child: Text(AppLocalizations.of(context).noBeneficiaryFound));
    }
    return ListView.builder(
      itemCount: _filteredBeneficiaries.length,
      itemBuilder: (context, index) {
        final item = _filteredBeneficiaries[index];
        return ListTile(
          leading: CircleAvatar(
            radius: 24,
            backgroundColor: Colors.transparent,
            child: getBankLogo(item.bankName, context),
          ),
          title: Text(item.name),
          subtitle: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(item.accountNo),
              if (item.bankName != null && item.bankName!.isNotEmpty)
                Text(
                  item.bankName!,
                  style: TextStyle(fontSize: 12, color: Colors.grey[600]),
                ),
            ],
          ),
          onTap: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (_) => BeneficiaryDetailsScreen(beneficiary: item),
              ),
            );
          },
        );
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    String customerName = widget.customerName;
    return Scaffold(
      appBar: AppBar(
        title: Text(AppLocalizations.of(context).beneficiaries),
      ),
      body: Stack(
        children: [
          Column(
            children: [
              Padding(
                padding: const EdgeInsets.all(12.0),
                child: TextField(
                  controller: _searchController,
                  decoration: InputDecoration(
                    hintText: "Search by name or account number",
                    prefixIcon: const Icon(Icons.search),
                    border: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(12),
                    ),
                  ),
                ),
              ),
              Expanded(
                child:
                    _isLoading ? _buildShimmerList() : _buildBeneficiaryList(),
              ),
            ],
          ),
          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
                  ),
                ),
              ),
            ),
          ),
        ],
      ),
      floatingActionButton: Padding(
        padding: const EdgeInsets.only(bottom: 8.0),
        child: FloatingActionButton(
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) =>
                    AddBeneficiaryScreen(customerName: customerName),
              ),
            );
          },
          elevation: 5,
          child: const Icon(Icons.add),
        ),
      ),
    );
  }
}