import 'package:flutter/material.dart';
import 'package:hive_flutter/hive_flutter.dart';
import 'package:lucide_icons/lucide_icons.dart';
import '../../../app/theme/app_colors.dart';
import '../../../core/widgets/arabic_text.dart';
import '../../../core/widgets/bottom_sheet_content_padding.dart';
import '../../../data/local/hive_boxes.dart';
import '../../../data/local/models/app_settings.dart';
import '../../../data/services/muslim_api_service.dart';

class HaditsScreen extends StatefulWidget {
  final bool isSimpleModeTab;
  const HaditsScreen({super.key, this.isSimpleModeTab = false});

  @override
  State<HaditsScreen> createState() => _HaditsScreenState();
}

class _HaditsScreenState extends State<HaditsScreen> {
  final TextEditingController _searchController = TextEditingController();
  List<Map<String, dynamic>> _allHadits = [];
  List<Map<String, dynamic>> _filteredHadits = [];
  bool _loading = true;
  String? _error;

  @override
  void initState() {
    super.initState();
    _loadHadits();
  }

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

  Future<void> _loadHadits() async {
    setState(() {
      _loading = true;
      _error = null;
    });

    try {
      final data = await MuslimApiService.instance.getHaditsList(strict: true);
      if (!mounted) return;
      data.sort((a, b) {
        final aa = (a['no'] as num?)?.toInt() ?? 0;
        final bb = (b['no'] as num?)?.toInt() ?? 0;
        return aa.compareTo(bb);
      });
      setState(() {
        _allHadits = data;
        _filteredHadits = data;
        _loading = false;
      });
    } catch (_) {
      if (!mounted) return;
      setState(() {
        _allHadits = [];
        _filteredHadits = [];
        _loading = false;
        _error = 'Gagal memuat hadits dari server';
      });
    }
  }

  void _onSearchChanged(String value) {
    final q = value.trim().toLowerCase();
    if (q.isEmpty) {
      setState(() => _filteredHadits = _allHadits);
      return;
    }
    setState(() {
      _filteredHadits = _allHadits.where((item) {
        final title = item['judul']?.toString().toLowerCase() ?? '';
        final indo = item['indo']?.toString().toLowerCase() ?? '';
        return title.contains(q) || indo.contains(q);
      }).toList();
    });
  }

  void _showArabicFontSettings() {
    final settingsBox = Hive.box<AppSettings>(HiveBoxes.settings);
    final settings = settingsBox.get('default') ?? AppSettings();
    if (!settings.isInBox) {
      settingsBox.put('default', settings);
    }
    double arabicFontSize = settings.arabicFontSize;

    showModalBottomSheet(
      context: context,
      isScrollControlled: true,
      useSafeArea: true,
      shape: const RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
      ),
      builder: (ctx) => StatefulBuilder(
        builder: (context, setModalState) {
          return Padding(
            padding: bottomSheetContentPadding(context),
            child: Column(
              mainAxisSize: MainAxisSize.min,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                const Text(
                  'Pengaturan Tampilan',
                  style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
                ),
                const SizedBox(height: 16),
                const Text('Ukuran Font Arab'),
                Slider(
                  value: arabicFontSize,
                  min: 16,
                  max: 40,
                  divisions: 12,
                  label: '${arabicFontSize.round()}pt',
                  activeColor: AppColors.primary,
                  onChanged: (value) {
                    setModalState(() => arabicFontSize = value);
                    settings.arabicFontSize = value;
                    if (settings.isInBox) {
                      settings.save();
                    } else {
                      settingsBox.put('default', settings);
                    }
                  },
                ),
                const SizedBox(height: 8),
              ],
            ),
          );
        },
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    final isDark = Theme.of(context).brightness == Brightness.dark;

    return Scaffold(
      appBar: AppBar(
        automaticallyImplyLeading: !widget.isSimpleModeTab,
        title: const Text("Hadits Arba'in"),
        actionsPadding: const EdgeInsets.only(right: 8),
        actions: [
          IconButton(
            onPressed: _loadHadits,
            icon: const Icon(LucideIcons.refreshCw),
            tooltip: 'Muat ulang',
          ),
          IconButton(
            onPressed: _showArabicFontSettings,
            icon: const Icon(LucideIcons.settings2),
            tooltip: 'Pengaturan tampilan',
          ),
        ],
      ),
      body: SafeArea(
        top: false,
        bottom: !widget.isSimpleModeTab,
        child: Column(
          children: [
            Padding(
              padding: const EdgeInsets.fromLTRB(16, 8, 16, 12),
              child: TextField(
                controller: _searchController,
                onChanged: _onSearchChanged,
                decoration: InputDecoration(
                  hintText: 'Cari judul atau isi hadits...',
                  prefixIcon: const Icon(LucideIcons.search),
                  border: OutlineInputBorder(
                    borderRadius: BorderRadius.circular(12),
                  ),
                ),
              ),
            ),
            Expanded(
              child: _loading
                  ? const Center(child: CircularProgressIndicator())
                  : _error != null
                      ? Center(
                          child: Text(
                            _error!,
                            style: TextStyle(
                              color: isDark
                                  ? AppColors.textSecondaryDark
                                  : AppColors.textSecondaryLight,
                            ),
                          ),
                        )
                      : _filteredHadits.isEmpty
                          ? Center(
                              child: Text(
                                'Hadits tidak ditemukan',
                                style: TextStyle(
                                  color: isDark
                                      ? AppColors.textSecondaryDark
                                      : AppColors.textSecondaryLight,
                                ),
                              ),
                            )
                          : ListView.builder(
                              padding: const EdgeInsets.fromLTRB(16, 0, 16, 16),
                              itemCount: _filteredHadits.length,
                              itemBuilder: (context, index) {
                                final item = _filteredHadits[index];
                                return Container(
                                  margin: const EdgeInsets.only(bottom: 12),
                                  padding: const EdgeInsets.all(14),
                                  decoration: BoxDecoration(
                                    color: isDark
                                        ? AppColors.surfaceDark
                                        : AppColors.surfaceLight,
                                    borderRadius: BorderRadius.circular(14),
                                    border: Border.all(
                                      color: isDark
                                          ? AppColors.primary
                                              .withValues(alpha: 0.1)
                                          : AppColors.cream,
                                    ),
                                  ),
                                  child: Column(
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    children: [
                                      Row(
                                        children: [
                                          Container(
                                            width: 34,
                                            height: 34,
                                            alignment: Alignment.center,
                                            decoration: BoxDecoration(
                                              color: AppColors.primary
                                                  .withValues(alpha: 0.12),
                                              borderRadius:
                                                  BorderRadius.circular(10),
                                            ),
                                            child: Text(
                                              '${item['no'] ?? '-'}',
                                              style: const TextStyle(
                                                fontWeight: FontWeight.w700,
                                                color: AppColors.primary,
                                              ),
                                            ),
                                          ),
                                          const SizedBox(width: 10),
                                          Expanded(
                                            child: Text(
                                              item['judul']?.toString() ?? '-',
                                              style: const TextStyle(
                                                fontSize: 15,
                                                fontWeight: FontWeight.w700,
                                                color: AppColors.primary,
                                              ),
                                            ),
                                          ),
                                        ],
                                      ),
                                      const SizedBox(height: 10),
                                      Align(
                                        alignment: Alignment.centerRight,
                                        child: ArabicText(
                                          item['arab']?.toString() ?? '',
                                          textAlign: TextAlign.right,
                                          baseFontSize: 24,
                                          fontWeight: FontWeight.w400,
                                          height: 1.8,
                                        ),
                                      ),
                                      const SizedBox(height: 8),
                                      Text(
                                        item['indo']?.toString() ?? '',
                                        style: TextStyle(
                                          height: 1.5,
                                          color: isDark
                                              ? AppColors.textSecondaryDark
                                              : AppColors.textSecondaryLight,
                                        ),
                                      ),
                                    ],
                                  ),
                                );
                              },
                            ),
            ),
          ],
        ),
      ),
    );
  }
}