import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../data/models/contact_model.dart';
import '../cubit/dashboard_cubit.dart';
import '../screens/add_contact_screen.dart';

class ContactsView extends StatelessWidget {
  final List<ContactModel> contacts;

  const ContactsView({
    super.key,
    required this.contacts,
  });

  // English: Show alert confirmation dialog before navigating.
  // Arabic: عرض مربع حوار تأكيدي قبل الانتقال إلى الشاشة التالية.
  void _showNavigationDialog(BuildContext context) {
    showDialog(
      context: context,
      builder: (dialogContext) {
        return AlertDialog(
          backgroundColor: const Color(0xFF15102A),
          title: const Text('إضافة جهة اتصال جديدة', style: TextStyle(color: Colors.white)),
          content: const Text(
            'هل تريد الانتقال لصفحة إضافة جهة اتصال جديدة لتعبئة البيانات؟',
            style: TextStyle(color: Colors.white70),
          ),
          actions: [
            TextButton(
              onPressed: () => Navigator.pop(dialogContext),
              child: const Text('إلغاء', style: TextStyle(color: Colors.white60)),
            ),
            TextButton(
              onPressed: () {
                // English: Pop dialog window first.
                // Arabic: إغلاق مربع الحوار أولاً.
                Navigator.pop(dialogContext);

                // English: Push AddContactScreen, sharing the existing Cubit instance.
                // Arabic: الانتقال إلى شاشة إضافة جهة اتصال ومشاركة نفس الكيوبيت الحالي.
                Navigator.push(
                  context,
                  MaterialPageRoute(
                    builder: (_) => BlocProvider.value(
                      value: context.read<DashboardCubit>(),
                      child: const AddContactScreen(),
                    ),
                  ),
                );
              },
              child: const Text('نعم، انتقل', style: TextStyle(color: Colors.purpleAccent)),
            ),
          ],
        );
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(20.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              const Text(
                '👥 دليل جهات الاتصال',
                style: TextStyle(color: Colors.white, fontSize: 20, fontWeight: FontWeight.bold),
              ),
              ElevatedButton.icon(
                style: ElevatedButton.styleFrom(
                  backgroundColor: Colors.purpleAccent,
                  shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
                ),
                icon: const Icon(Icons.add, color: Colors.white, size: 16),
                label: const Text(
                  'إضافة جهة',
                  style: TextStyle(color: Colors.white, fontSize: 12),
                ),
                onPressed: () => _showNavigationDialog(context),
              ),
            ],
          ),
          const SizedBox(height: 8),
          const Text(
            'عرض وإدارة دليل العملاء والجهات التي تواصلت مع النظام الآلي.',
            style: TextStyle(color: Colors.white60, fontSize: 13),
          ),
          const SizedBox(height: 24),

          // English: Render list of parsed contacts in custom list view.
          // Arabic: عرض قائمة بجهات الاتصال المحللة في طريقة عرض القائمة المخصصة.
          if (contacts.isEmpty)
            const Center(
              child: Padding(
                padding: EdgeInsets.symmetric(vertical: 40.0),
                child: Text(
                  'دليل جهات الاتصال فارغ حالياً.',
                  style: TextStyle(color: Colors.white70),
                ),
              ),
            )
          else
            ListView.builder(
              shrinkWrap: true,
              physics: const NeverScrollableScrollPhysics(),
              itemCount: contacts.length,
              itemBuilder: (context, index) {
                final contact = contacts[index];
                return Container(
                  margin: const EdgeInsets.only(bottom: 12),
                  padding: const EdgeInsets.all(16),
                  decoration: BoxDecoration(
                    color: const Color(0xFF15102A),
                    borderRadius: BorderRadius.circular(12),
                    border: Border.all(color: Colors.white.withOpacity(0.05)),
                  ),
                  child: Row(
                    children: [
                      Container(
                        padding: const EdgeInsets.all(10),
                        decoration: BoxDecoration(
                          shape: BoxShape.circle,
                          color: Colors.purpleAccent.withOpacity(0.1),
                        ),
                        child: const Icon(Icons.person, color: Colors.purpleAccent),
                      ),
                      const SizedBox(width: 16),
                      Expanded(
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text(
                              contact.name,
                              style: const TextStyle(
                                color: Colors.white,
                                fontSize: 16,
                                fontWeight: FontWeight.bold,
                              ),
                            ),
                            const SizedBox(height: 4),
                            Text(
                              contact.phone,
                              style: const TextStyle(color: Colors.purpleAccent, fontSize: 13),
                            ),
                            if (contact.notes != null && contact.notes!.isNotEmpty) ...[
                              const SizedBox(height: 6),
                              Text(
                                contact.notes!,
                                style: TextStyle(color: Colors.white.withOpacity(0.5), fontSize: 12),
                              ),
                            ],
                          ],
                        ),
                      ),
                    ],
                  ),
                );
              },
            ),
        ],
      ),
    );
  }
}