// ignore_for_file: deprecated_member_use import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:go_router/go_router.dart'; import 'package:shared_preferences/shared_preferences.dart'; import '../../../core/widgets/app_scaffold.dart'; import '../../../core/widgets/primary_button.dart'; import '../../../core/widgets/unit_input_field.dart'; import '../../../core/utils/validators.dart'; import '../application/auth_controller.dart'; import '../../../core/utils/unit_conversion_utils.dart'; class SignUpScreen extends ConsumerStatefulWidget { const SignUpScreen({super.key}); @override ConsumerState createState() => _SignUpScreenState(); } class _SignUpScreenState extends ConsumerState { final _formKey = GlobalKey(); final _emailController = TextEditingController(); final _passwordController = TextEditingController(); final _confirmPasswordController = TextEditingController(); final _usernameController = TextEditingController(); final _ageController = TextEditingController(); Gender? _selectedGender; bool _isLoading = false; bool _obscurePassword = true; bool _obscureConfirmPassword = true; bool _showAdditionalInfo = false; double? _heightCm; double? _weightKg; HeightUnit _selectedHeightUnit = HeightUnit.metric; WeightUnit _selectedWeightUnit = WeightUnit.metric; Future _handleSignUp() async { if (!_formKey.currentState!.validate()) return; setState(() => _isLoading = true); try { final age = _ageController.text.trim().isNotEmpty ? int.tryParse(_ageController.text.trim()) : null; await ref.read(authControllerProvider.notifier).signUpWithEmail( _emailController.text.trim(), _passwordController.text, _usernameController.text.trim(), heightCm: _heightCm, weightKg: _weightKg, age: age, gender: _selectedGender, heightUnit: _selectedHeightUnit, weightUnit: _selectedWeightUnit, ); // Show success message and navigate to login screen if (mounted) { // Mark that registration just happened for the login screen final prefs = await SharedPreferences.getInstance(); await prefs.setBool('just_registered', true); await prefs.setInt('registration_time', DateTime.now().millisecondsSinceEpoch); if (mounted) { ScaffoldMessenger.of(context).showSnackBar( const SnackBar( content: Text('Account created successfully! Please check your email and verify it before signing in.'), backgroundColor: Colors.green, duration: Duration(seconds: 4), ), ); // Navigate to login screen after successful registration context.pushReplacement('/sign-in'); } } } catch (e) { if (mounted) { ScaffoldMessenger.of(context).showSnackBar( SnackBar(content: Text('Sign up failed: $e')), ); } } finally { if (mounted) { setState(() => _isLoading = false); } } } @override void dispose() { _emailController.dispose(); _passwordController.dispose(); _confirmPasswordController.dispose(); _usernameController.dispose(); _ageController.dispose(); super.dispose(); } @override Widget build(BuildContext context) { return AppScaffold( body: Center( child: SingleChildScrollView( padding: const EdgeInsets.all(24.0), child: Center( child: ConstrainedBox( constraints: const BoxConstraints(maxWidth: 420), child: Container( padding: const EdgeInsets.symmetric( horizontal: 24, vertical: 32, ), decoration: BoxDecoration( color: Theme.of(context).colorScheme.surface, borderRadius: BorderRadius.circular(32), boxShadow: [ BoxShadow( color: Colors.black.withOpacity(0.06), blurRadius: 40, offset: const Offset(0, 24), ), ], ), child: Form( key: _formKey, child: Column( crossAxisAlignment: CrossAxisAlignment.stretch, children: [ Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Text( '1356', style: Theme.of(context) .textTheme .titleMedium ?.copyWith( fontWeight: FontWeight.w600, ), ), Container( padding: const EdgeInsets.symmetric( horizontal: 12, vertical: 6, ), decoration: BoxDecoration( color: Theme.of(context).colorScheme.surface, borderRadius: BorderRadius.circular(999), border: Border.all( color: Theme.of(context) .colorScheme .onSurface .withOpacity(0.08), ), ), child: Text( 'Create account', style: Theme.of(context) .textTheme .labelMedium ?.copyWith( color: Theme.of(context) .colorScheme .onSurface .withOpacity(0.8), ), ), ), ], ), const SizedBox(height: 24), Text( 'Start your journey', style: Theme.of(context) .textTheme .headlineMedium ?.copyWith( fontWeight: FontWeight.bold, ), ), const SizedBox(height: 8), Text( 'Create an account to begin your 1356-day challenge', style: Theme.of(context) .textTheme .bodyLarge ?.copyWith( color: Theme.of(context) .colorScheme .onSurface .withOpacity(0.7), ), ), const SizedBox(height: 24), TextFormField( controller: _usernameController, textCapitalization: TextCapitalization.words, textInputAction: TextInputAction.next, decoration: const InputDecoration( labelText: 'Username', prefixIcon: Icon(Icons.person_outline), ), validator: Validators.validateUsername, enabled: !_isLoading, ), const SizedBox(height: 16), TextFormField( controller: _emailController, keyboardType: TextInputType.emailAddress, textInputAction: TextInputAction.next, decoration: const InputDecoration( labelText: 'Email', prefixIcon: Icon(Icons.email_outlined), ), validator: Validators.validateEmail, enabled: !_isLoading, ), const SizedBox(height: 16), TextFormField( controller: _passwordController, obscureText: _obscurePassword, textInputAction: TextInputAction.next, decoration: InputDecoration( labelText: 'Password', prefixIcon: const Icon(Icons.lock_outlined), suffixIcon: IconButton( icon: Icon( _obscurePassword ? Icons.visibility_outlined : Icons.visibility_off_outlined, ), onPressed: () { setState( () => _obscurePassword = !_obscurePassword, ); }, ), ), validator: Validators.validatePassword, enabled: !_isLoading, ), const SizedBox(height: 16), TextFormField( controller: _confirmPasswordController, obscureText: _obscureConfirmPassword, textInputAction: TextInputAction.done, decoration: InputDecoration( labelText: 'Confirm Password', prefixIcon: const Icon(Icons.lock_outline), suffixIcon: IconButton( icon: Icon( _obscureConfirmPassword ? Icons.visibility_outlined : Icons.visibility_off_outlined, ), onPressed: () { setState( () => _obscureConfirmPassword = !_obscureConfirmPassword, ); }, ), ), validator: (value) { if (value == null || value.isEmpty) { return 'Please confirm your password'; } if (value != _passwordController.text) { return 'Passwords do not match'; } return null; }, enabled: !_isLoading, onFieldSubmitted: (_) => _handleSignUp(), ), const SizedBox(height: 24), // Additional optional info section GestureDetector( onTap: () { setState(() { _showAdditionalInfo = !_showAdditionalInfo; }); }, child: Container( padding: const EdgeInsets.all(16), decoration: BoxDecoration( color: Theme.of(context).colorScheme.surface, borderRadius: BorderRadius.circular(12), border: Border.all( color: Theme.of(context).colorScheme.outline.withOpacity(0.2), ), ), child: Row( children: [ Icon( _showAdditionalInfo ? Icons.expand_less : Icons.expand_more, color: Theme.of(context).colorScheme.onSurface.withOpacity(0.7), ), const SizedBox(width: 12), Expanded( child: Text( 'Add more info for better recommendations', style: Theme.of(context).textTheme.bodyMedium?.copyWith( color: Theme.of(context).colorScheme.onSurface.withOpacity(0.8), fontWeight: FontWeight.w500, ), ), ), ], ), ), ), if (_showAdditionalInfo) ...[ const SizedBox(height: 16), UnitInputField( labelText: 'Height', prefixIcon: Icons.height_outlined, helperText: 'Optional: For personalized recommendations', enabled: !_isLoading, onValueChanged: (value) { setState(() { _heightCm = value; }); }, onUnitChanged: (unit) { setState(() { _selectedHeightUnit = unit as HeightUnit; }); }, isHeight: true, ), const SizedBox(height: 16), UnitInputField( labelText: 'Weight', prefixIcon: Icons.monitor_weight_outlined, helperText: 'Optional: For personalized recommendations', enabled: !_isLoading, onValueChanged: (value) { setState(() { _weightKg = value; }); }, onUnitChanged: (unit) { setState(() { _selectedWeightUnit = unit as WeightUnit; }); }, isHeight: false, ), const SizedBox(height: 16), TextFormField( controller: _ageController, keyboardType: TextInputType.number, textInputAction: TextInputAction.next, decoration: const InputDecoration( labelText: 'Age', prefixIcon: Icon(Icons.cake_outlined), helperText: 'Optional: For age-appropriate recommendations', ), enabled: !_isLoading, ), const SizedBox(height: 16), DropdownButtonFormField( value: _selectedGender, decoration: const InputDecoration( labelText: 'Gender', prefixIcon: Icon(Icons.person_outline), helperText: 'Optional: For personalized recommendations', ), items: const [ DropdownMenuItem( value: Gender.male, child: Text('Male'), ), DropdownMenuItem( value: Gender.female, child: Text('Female'), ), ], onChanged: _isLoading ? null : (Gender? value) { setState(() { _selectedGender = value; }); }, ), ], const SizedBox(height: 24), PrimaryButton( onPressed: _handleSignUp, text: _isLoading ? 'Creating account...' : 'Create Account', isLoading: _isLoading, ), const SizedBox(height: 16), TextButton( onPressed: _isLoading ? () {} : () => context.pop(), child: const Text( 'Already have an account? Sign in', ), ), ], ), ), ), ), ), ), ), ); } }