import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:google_fonts/google_fonts.dart';
import '../../theme/app_theme.dart';
import '../../providers/user_provider.dart';
import '../../services/notification_service.dart';
import '../../widgets/pad_settings_dialog.dart'; // We can reuse the logic, but maybe embed it directly or just link it.
// Actually, let's rebuild the UI here properly as a screen instead of a dialog,
// or for now, since we already have the dialog logic working well, let's just 
// have this screen trigger the dialog or embed the same widgets. 
// However, the user asked to "make a new setting page", so a full screen is better.
// I'll copy the logic from the dialog into this screen for a seamless experience.

class SuppliesSettingsScreen extends ConsumerStatefulWidget {
  const SuppliesSettingsScreen({super.key});

  @override
  ConsumerState<SuppliesSettingsScreen> createState() => _SuppliesSettingsScreenState();
}

class _SuppliesSettingsScreenState extends ConsumerState<SuppliesSettingsScreen> {
  // Logic from PadSettingsDialog
  bool _isTrackingEnabled = false;
  int _typicalFlow = 2; 
  int _padAbsorbency = 3;
  int _padInventoryCount = 0;
  int _lowInventoryThreshold = 5;
  bool _isAutoInventoryEnabled = true;
  final TextEditingController _brandController = TextEditingController();

  @override
  void initState() {
    super.initState();
    final user = ref.read(userProfileProvider);
    if (user != null) {
      _isTrackingEnabled = user.isPadTrackingEnabled;
      _typicalFlow = user.typicalFlowIntensity ?? 2;
      _padAbsorbency = user.padAbsorbency ?? 3;
      _padInventoryCount = user.padInventoryCount;
      _lowInventoryThreshold = user.lowInventoryThreshold;
      _isAutoInventoryEnabled = user.isAutoInventoryEnabled;
      _brandController.text = user.padBrand ?? '';
    }
  }

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

  Future<void> _saveSettings() async {
    final user = ref.read(userProfileProvider);
    if (user != null) {
      final updatedProfile = user.copyWith(
        isPadTrackingEnabled: _isTrackingEnabled,
        typicalFlowIntensity: _typicalFlow,
        isAutoInventoryEnabled: _isAutoInventoryEnabled,
        padBrand: _brandController.text.trim().isEmpty ? null : _brandController.text.trim(),
      );
      
      await ref.read(userProfileProvider.notifier).updateProfile(updatedProfile);

      // Check for Low Supply Alert
      if (updatedProfile.notifyLowSupply && 
          updatedProfile.padInventoryCount <= updatedProfile.lowInventoryThreshold) {
          NotificationService().showLocalNotification(
            id: 2001,
            title: 'Low Pad Supply',
            body: 'Your inventory is low (${updatedProfile.padInventoryCount} left). Time to restock!',
          );
      }
      
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          const SnackBar(content: Text('Preferences saved')),
        );
      }
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Period Supplies'),
        actions: [
          IconButton(
            icon: const Icon(Icons.save),
            onPressed: _saveSettings,
          )
        ],
      ),
      body: SingleChildScrollView(
        padding: const EdgeInsets.all(24),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
             // Toggle
            Row(
              children: [
                Expanded(
                  child: Text(
                    'Enable Pad Tracking',
                    style: GoogleFonts.outfit(
                      fontSize: 18,
                      fontWeight: FontWeight.w600,
                      color: AppColors.charcoal,
                    ),
                  ),
                ),
                Switch(
                  value: _isTrackingEnabled,
                  onChanged: (val) => setState(() => _isTrackingEnabled = val),
                  activeColor: AppColors.menstrualPhase,
                ),
              ],
            ),
            
            if (_isTrackingEnabled) ...[
              const Divider(height: 32),
              
              // Typical Flow
              Text(
                'Typical Flow Intensity',
                style: GoogleFonts.outfit(
                  fontSize: 16,
                  fontWeight: FontWeight.w500,
                  color: AppColors.warmGray,
                ),
              ),
              const SizedBox(height: 8),
              Row(
                children: [
                  Text('Light', style: GoogleFonts.outfit(fontSize: 12, color: AppColors.warmGray)),
                  Expanded(
                    child: Slider(
                      value: _typicalFlow.toDouble(),
                      min: 1,
                      max: 5,
                      divisions: 4,
                      activeColor: AppColors.menstrualPhase,
                      onChanged: (val) => setState(() => _typicalFlow = val.round()),
                    ),
                  ),
                  Text('Heavy', style: GoogleFonts.outfit(fontSize: 12, color: AppColors.warmGray)),
                ],
              ),
              Center(
                child: Text(
                  '$_typicalFlow/5', 
                  style: GoogleFonts.outfit(
                    fontWeight: FontWeight.bold,
                    color: AppColors.menstrualPhase
                  )
                ),
              ),
              
              const SizedBox(height: 24),
              
              // Auto Deduct Toggle
              SwitchListTile(
                 contentPadding: EdgeInsets.zero,
                 title: Text(
                   'Auto-deduct on Log',
                   style: GoogleFonts.outfit(fontWeight: FontWeight.w500, color: AppColors.charcoal),
                 ),
                 subtitle: Text(
                   'Reduce count when you log a pad',
                   style: GoogleFonts.outfit(fontSize: 12, color: AppColors.warmGray),
                 ),
                 value: _isAutoInventoryEnabled,
                 onChanged: (val) => setState(() => _isAutoInventoryEnabled = val),
                 activeColor: AppColors.menstrualPhase,
              ),
            ],
          ],
        ),
      ),
    );
  }
}