import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.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 precachePages = ref.watch(precachePagesNotifierProvider);

    return Scaffold(
      appBar: const WorldhopperAppBar(
        title: Text('Pre-cache Pages'),
      ),
      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 _precachePagesOptions.entries) ...[
                    if (entry.key != _precachePagesOptions.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(
              'Controls how many upcoming pages are pre-loaded in the background '
              'while reading. Higher values make swiping feel more seamless but '
              'use more bandwidth and memory.',
              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,
  });
}

const _precachePagesOptions = <int, _PrecachePagesOption>{
  0: _PrecachePagesOption(
    label: 'Off',
    description: 'Pages load on demand',
    icon: Icons.block,
  ),
  1: _PrecachePagesOption(
    label: '1 page',
    description: 'Minimal pre-loading',
    icon: Icons.looks_one,
  ),
  2: _PrecachePagesOption(
    label: '2 pages',
    description: 'Light pre-loading',
    icon: Icons.looks_two,
  ),
  3: _PrecachePagesOption(
    label: '3 pages',
    description: 'Balanced, recommended',
    icon: Icons.looks_3,
  ),
  4: _PrecachePagesOption(
    label: '4 pages',
    description: 'Aggressive pre-loading',
    icon: Icons.looks_4,
  ),
  5: _PrecachePagesOption(
    label: '5 pages',
    description: 'Maximum pre-loading, uses more bandwidth',
    icon: Icons.looks_5,
  ),
};