mirror of
https://github.com/Dvorinka/1356.git
synced 2026-06-03 19:42:57 +00:00
Tomas Dvorak
420 lines
19 KiB
Dart
420 lines
19 KiB
Dart
// 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<SignUpScreen> createState() => _SignUpScreenState();
|
|
}
|
|
|
|
class _SignUpScreenState extends ConsumerState<SignUpScreen> {
|
|
final _formKey = GlobalKey<FormState>();
|
|
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<void> _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<Gender>(
|
|
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',
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|