import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:worldhopper/l10n/app_localizations.dart';
import 'package:worldhopper/providers/precache_pages_provider.dart';
import 'package:worldhopper/widgets/worldhopper_app_bar.dart';

/// Screen for selecting image reader pre-cache pages count
class PrecachePagesSettingsScreen extends ConsumerWidget {
  const PrecachePagesSettingsScreen({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final l10n = AppLocalizations.of(context);
    final precachePages = ref.watch(precachePagesNotifierProvider);

    final options = <int, _PrecachePagesOption>{
      0: _PrecachePagesOption(
        label: l10n.precachePagesOff,
        description: l10n.precachePagesOffDescription,
        icon: Icons.block,
      ),
      1: _PrecachePagesOption(
        label: l10n.precachePages1,
        description: l10n.precachePages1Description,
        icon: Icons.looks_one,
      ),
      2: _PrecachePagesOption(
        label: l10n.precachePages2,
        description: l10n.precachePages2Description,
        icon: Icons.looks_two,
      ),
      3: _PrecachePagesOption(
        label: l10n.precachePages3,
        description: l10n.precachePages3Description,
        icon: Icons.looks_3,
      ),
      4: _PrecachePagesOption(
        label: l10n.precachePages4,
        description: l10n.precachePages4Description,
        icon: Icons.looks_4,
      ),
      5: _PrecachePagesOption(
        label: l10n.precachePages5,
        description: l10n.precachePages5Description,
        icon: Icons.looks_5,
      ),
    };

    return Scaffold(
      appBar: WorldhopperAppBar(
        title: Text(l10n.precachePagesTitle),
      ),
      body: ListView(
        children: [
          const SizedBox(height: 8),
          Card(
            margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
            child: RadioGroup<int>(
              groupValue: precachePages,
              onChanged: (value) {
                if (value != null) {
                  ref
                      .read(precachePagesNotifierProvider.notifier)
                      .setPrecachePages(value);
                }
              },
              child: Column(
                children: [
                  for (final entry in options.entries) ...[
                    if (entry.key != options.keys.first)
                      const Divider(height: 1),
                    ListTile(
                      leading: Icon(entry.value.icon),
                      title: Text(entry.value.label),
                      subtitle: Text(entry.value.description),
                      trailing: Radio<int>(
                        value: entry.key,
                      ),
                      onTap: () {
                        ref
                            .read(precachePagesNotifierProvider.notifier)
                            .setPrecachePages(entry.key);
                      },
                    ),
                  ],
                ],
              ),
            ),
          ),
          Padding(
            padding: const EdgeInsets.fromLTRB(32, 16, 32, 16),
            child: Text(
              l10n.precachePagesHelp,
              style: Theme.of(context).textTheme.bodySmall?.copyWith(
                    color: Theme.of(context).colorScheme.onSurfaceVariant,
                  ),
            ),
          ),
        ],
      ),
    );
  }
}

class _PrecachePagesOption {
  final String label;
  final String description;
  final IconData icon;

  const _PrecachePagesOption({
    required this.label,
    required this.description,
    required this.icon,
  });
}