import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';

import '../providers/scanner_provider.dart';
import '../widgets/barcode_scanner_widget.dart';
import '../widgets/scan_result_display.dart';
import '../widgets/scan_history_list.dart';

/// Home page with barcode scanner, result display, and history list
class HomePage extends ConsumerWidget {
  const HomePage({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final scannerState = ref.watch(scannerProvider);

    return Scaffold(
      appBar: AppBar(
        title: const Text('Barcode Scanner'),
        elevation: 0,
        actions: [
          IconButton(
            icon: const Icon(Icons.refresh),
            onPressed: () {
              ref.read(scannerProvider.notifier).refreshHistory();
            },
            tooltip: 'Refresh History',
          ),
        ],
      ),
      body: Column(
        children: [
          // Barcode Scanner Section (Top Half)
          Expanded(
            flex: 1,
            child: Container(
              width: double.infinity,
              decoration: BoxDecoration(
                color: Theme.of(context).colorScheme.surface,
                boxShadow: [
                  BoxShadow(
                    color: Colors.black.withOpacity(0.1),
                    blurRadius: 4,
                    offset: const Offset(0, 2),
                  ),
                ],
              ),
              child: const BarcodeScannerWidget(),
            ),
          ),

          // Scan Result Display
          ScanResultDisplay(
            barcode: scannerState.currentBarcode,
            onTap: scannerState.currentBarcode != null
                ? () => _navigateToDetail(context, scannerState.currentBarcode!)
                : null,
          ),

          // Divider
          const Divider(height: 1),

          // History Section (Bottom Half)
          Expanded(
            flex: 1,
            child: Container(
              padding: const EdgeInsets.all(16),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  // History Header
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Text(
                        'Scan History',
                        style: Theme.of(context).textTheme.titleLarge?.copyWith(
                              fontWeight: FontWeight.bold,
                            ),
                      ),
                      if (scannerState.history.isNotEmpty)
                        Text(
                          '${scannerState.history.length} items',
                          style: Theme.of(context).textTheme.bodySmall?.copyWith(
                                color: Theme.of(context).colorScheme.onSurfaceVariant,
                              ),
                        ),
                    ],
                  ),
                  const SizedBox(height: 12),

                  // History List
                  Expanded(
                    child: _buildHistorySection(context, ref, scannerState),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  /// Build history section based on current state
  Widget _buildHistorySection(
    BuildContext context,
    WidgetRef ref,
    ScannerState scannerState,
  ) {
    if (scannerState.isLoading) {
      return const Center(
        child: CircularProgressIndicator(),
      );
    }

    if (scannerState.error != null) {
      return Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Icon(
              Icons.error_outline,
              size: 64,
              color: Theme.of(context).colorScheme.error,
            ),
            const SizedBox(height: 16),
            Text(
              'Error loading history',
              style: Theme.of(context).textTheme.titleMedium,
            ),
            const SizedBox(height: 8),
            Text(
              scannerState.error!,
              style: Theme.of(context).textTheme.bodyMedium?.copyWith(
                    color: Theme.of(context).colorScheme.error,
                  ),
              textAlign: TextAlign.center,
            ),
            const SizedBox(height: 16),
            ElevatedButton(
              onPressed: () {
                ref.read(scannerProvider.notifier).refreshHistory();
              },
              child: const Text('Retry'),
            ),
          ],
        ),
      );
    }

    if (scannerState.history.isEmpty) {
      return Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Icon(
              Icons.qr_code_scanner,
              size: 64,
              color: Theme.of(context).colorScheme.onSurfaceVariant,
            ),
            const SizedBox(height: 16),
            Text(
              'No scans yet',
              style: Theme.of(context).textTheme.titleMedium?.copyWith(
                    color: Theme.of(context).colorScheme.onSurfaceVariant,
                  ),
            ),
            const SizedBox(height: 8),
            Text(
              'Start scanning barcodes to see your history here',
              style: Theme.of(context).textTheme.bodyMedium?.copyWith(
                    color: Theme.of(context).colorScheme.onSurfaceVariant,
                  ),
              textAlign: TextAlign.center,
            ),
          ],
        ),
      );
    }

    return ScanHistoryList(
      history: scannerState.history,
      onItemTap: (scanItem) => _navigateToDetail(context, scanItem.barcode),
    );
  }

  /// Navigate to detail page with barcode
  void _navigateToDetail(BuildContext context, String barcode) {
    context.push('/detail/$barcode');
  }
}