social-buddy-mobile-app/lib/features/auth/screens/forgot_password_screen.dart

188 lines
6.7 KiB
Dart

import 'dart:ui';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:socialbuddy_mobile/core/constants/colors.dart';
class ForgotPasswordScreen extends StatefulWidget {
const ForgotPasswordScreen({super.key});
@override
State<ForgotPasswordScreen> createState() => _ForgotPasswordScreenState();
}
class _ForgotPasswordScreenState extends State<ForgotPasswordScreen> {
final _emailController = TextEditingController();
bool _isLoading = false;
@override
void dispose() {
_emailController.dispose();
super.dispose();
}
Future<void> _handleResetPassword() async {
if (_emailController.text.isEmpty) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text("Please enter your email")),
);
return;
}
setState(() => _isLoading = true);
// Mimic API call logic as in web
await Future.delayed(const Duration(seconds: 2));
if (mounted) {
setState(() => _isLoading = false);
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text("Password reset link sent to your email!")),
);
Navigator.pop(context);
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: const Color(0xFF0A0B17),
appBar: AppBar(
backgroundColor: Colors.transparent,
elevation: 0,
leading: IconButton(
icon: const Icon(Icons.arrow_back, color: Colors.white),
onPressed: () => Navigator.pop(context),
),
),
body: Stack(
children: [
// Background Glows
Positioned(
top: 100,
right: 50,
child: _buildGlowBlob(const Color(0xFF1D8BE0), 120),
),
Positioned(
bottom: 100,
left: 50,
child: _buildGlowBlob(const Color(0xFFDB21D9), 120),
),
Center(
child: SingleChildScrollView(
padding: const EdgeInsets.all(24),
child: ClipRRect(
borderRadius: BorderRadius.circular(24),
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
child: Container(
padding: const EdgeInsets.all(32),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.05),
borderRadius: BorderRadius.circular(24),
border: Border.all(color: Colors.white.withOpacity(0.2)),
),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(Icons.lock_reset, size: 80, color: Colors.blueAccent),
const SizedBox(height: 24),
Text(
"Forgot Password?",
style: GoogleFonts.nunito(
color: Colors.white,
fontSize: 24,
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 12),
Text(
"No worries! Enter your email and we'll send you a link to reset your password.",
textAlign: TextAlign.center,
style: GoogleFonts.nunito(
color: Colors.white.withOpacity(0.6),
fontSize: 14,
),
),
const SizedBox(height: 32),
TextField(
controller: _emailController,
style: const TextStyle(color: Colors.white),
decoration: _inputDecoration("Email Address", Icons.email_outlined),
),
const SizedBox(height: 32),
SizedBox(
width: double.infinity,
height: 50,
child: Container(
decoration: BoxDecoration(
gradient: const LinearGradient(
colors: [Color(0xFF2563EB), Color(0xFFEC4899)],
),
borderRadius: BorderRadius.circular(12),
),
child: ElevatedButton(
onPressed: _isLoading ? null : _handleResetPassword,
style: ElevatedButton.styleFrom(
backgroundColor: Colors.transparent,
shadowColor: Colors.transparent,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
),
child: _isLoading
? const CircularProgressIndicator(color: Colors.white)
: const Text("SEND RESET LINK", style: TextStyle(fontWeight: FontWeight.bold, color: Colors.white)),
),
),
),
],
),
),
),
),
),
),
],
),
);
}
Widget _buildGlowBlob(Color color, double size) {
return Container(
width: size,
height: size,
decoration: BoxDecoration(
color: color.withOpacity(0.3),
shape: BoxShape.circle,
boxShadow: [
BoxShadow(color: color.withOpacity(0.5), blurRadius: 100, spreadRadius: 20),
],
),
);
}
InputDecoration _inputDecoration(String label, IconData icon) {
return InputDecoration(
hintText: label,
hintStyle: TextStyle(color: Colors.white.withOpacity(0.5)),
prefixIcon: Icon(icon, color: Colors.white70),
filled: true,
fillColor: const Color(0xFF070D1E).withOpacity(0.7),
contentPadding: const EdgeInsets.symmetric(vertical: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(color: Colors.white.withOpacity(0.15)),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(color: Colors.white.withOpacity(0.15)),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(color: Colors.white.withOpacity(0.3)),
),
);
}
}