finger_print_app/lib/presentation/widgets/change_password_modal.dart

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../core/di/injection_container.dart';
import '../../domain/models/change_password_request.dart';
import '../blocs/change_password/change_password_bloc.dart';
import '../blocs/change_password/change_password_event.dart';
import '../blocs/change_password/change_password_state.dart';
import 'onboarding_button.dart';

class ChangePasswordModal extends StatefulWidget {
  const ChangePasswordModal({super.key});

  @override
  State<ChangePasswordModal> createState() => _ChangePasswordModalState();
}

class _ChangePasswordModalState extends State<ChangePasswordModal> {
  bool _oldObscure = true;
  bool _newObscure = true;

  final TextEditingController _oldPasswordController = TextEditingController();
  final TextEditingController _newPasswordController = TextEditingController();

  @override
  void dispose() {
    _oldPasswordController.dispose();
    _newPasswordController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    final screenSize = MediaQuery.of(context).size;
    final screenWidth = screenSize.width;
    final screenHeight = screenSize.height;

    final formWidth =
        screenWidth > 600 ? screenWidth * 0.5 : screenWidth * 0.88;
    final labelFontSize = screenWidth > 600 ? 18.0 : 16.0;
    final fieldFontSize = screenWidth > 600 ? 18.0 : 16.0;
    final verticalPadding = screenHeight > 800 ? 38.0 : 28.0;
    final fieldSpacing = screenHeight > 800 ? 30.0 : 20.0;
    final buttonSpacing = screenHeight > 800 ? 80.0 : 60.0;

    return Material(
      color: Colors.transparent,
      child: Stack(
        children: [
          /// ✅ DARK TRANSPARENT OVERLAY (NO BLUR)
          Positioned.fill(child: Container(color: const Color(0x80000000))),

          /// ---------- MODAL ----------
          Center(
            child: Directionality(
              textDirection: TextDirection.rtl,
              child: Container(
                width: formWidth,
                padding: EdgeInsets.symmetric(
                  horizontal: 25,
                  vertical: verticalPadding,
                ),
                decoration: BoxDecoration(
                  color: const Color(0xFFEEFFFA),
                  borderRadius: BorderRadius.circular(10),
                  boxShadow: const [
                    BoxShadow(
                      color: Colors.black26,
                      blurRadius: 10,
                      offset: Offset(0, 5),
                    ),
                  ],
                ),
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                  children: [
                    /// ---------- OLD PASSWORD ----------
                    Align(
                      alignment: Alignment.centerRight,
                      child: Text(
                        "كلمة المرور السابقة",
                        style: TextStyle(
                          fontSize: labelFontSize,
                          fontWeight: FontWeight.w600,
                          color: Colors.black87,
                        ),
                      ),
                    ),
                    const SizedBox(height: 8),

                    _buildField(
                      controller: _oldPasswordController,
                      hint: "أدخل كلمة المرور",
                      obscure: _oldObscure,
                      fontSize: fieldFontSize,
                      hasEye: true,
                      onEyeTap:
                          () => setState(() => _oldObscure = !_oldObscure),
                    ),

                    SizedBox(height: fieldSpacing),

                    /// ---------- NEW PASSWORD ----------
                    Align(
                      alignment: Alignment.centerRight,
                      child: Text(
                        "كلمة المرور الجديدة",
                        style: TextStyle(
                          fontSize: labelFontSize,
                          fontWeight: FontWeight.w600,
                          color: Colors.black87,
                        ),
                      ),
                    ),
                    const SizedBox(height: 8),

                    _buildField(
                      controller: _newPasswordController,
                      hint: "كلمة المرور",
                      obscure: _newObscure,
                      fontSize: fieldFontSize,
                      hasEye: true,
                      onEyeTap:
                          () => setState(() => _newObscure = !_newObscure),
                    ),

                    SizedBox(height: buttonSpacing),

                    BlocProvider(
                      create: (context) => sl<ChangePasswordBloc>(),
                      child: BlocConsumer<
                        ChangePasswordBloc,
                        ChangePasswordState
                      >(
                        listener: (context, state) {
                          if (state is ChangePasswordSuccess) {
                            ScaffoldMessenger.of(context).showSnackBar(
                              SnackBar(
                                content: Text(state.message),
                                backgroundColor: Colors.green,
                              ),
                            );
                            Navigator.pop(context);
                          } else if (state is ChangePasswordError) {
                            ScaffoldMessenger.of(context).showSnackBar(
                              SnackBar(
                                content: Text(state.message),
                                backgroundColor: Colors.red,
                              ),
                            );
                          }
                        },
                        builder: (context, state) {
                          if (state is ChangePasswordLoading) {
                            return const Center(
                              child: CircularProgressIndicator(),
                            );
                          }

                          return Center(
                            child: OnboardingButton(
                              text: "حفظ التغيير",
                              backgroundColor: const Color(0xEE23574A),
                              onPressed: () {
                                if (_oldPasswordController.text.isEmpty ||
                                    _newPasswordController.text.isEmpty) {
                                  ScaffoldMessenger.of(context).showSnackBar(
                                    const SnackBar(
                                      content: Text("يرجى ملء جميع الحقول"),
                                      backgroundColor: Colors.orange,
                                    ),
                                  );
                                  return;
                                }

                                context.read<ChangePasswordBloc>().add(
                                  ChangePasswordSubmitted(
                                    ChangePasswordRequest(
                                      oldPassword: _oldPasswordController.text,
                                      newPassword: _newPasswordController.text,
                                    ),
                                  ),
                                );
                              },
                            ),
                          );
                        },
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildField({
    required TextEditingController controller,
    required String hint,
    required bool obscure,
    required double fontSize,
    required bool hasEye,
    required VoidCallback onEyeTap,
  }) {
    return Container(
      decoration: BoxDecoration(
        color: const Color(0xDEDEDEDE),
        borderRadius: BorderRadius.circular(7),
        boxShadow: const [
          BoxShadow(color: Colors.black26, blurRadius: 6, offset: Offset(0, 2)),
        ],
      ),
      child: TextField(
        controller: controller,
        obscureText: obscure,
        textAlign: TextAlign.right,
        style: TextStyle(fontSize: fontSize),
        decoration: InputDecoration(
          hintText: hint,
          hintStyle: const TextStyle(color: Colors.black54),
          border: InputBorder.none,
          contentPadding: const EdgeInsets.symmetric(
            vertical: 16,
            horizontal: 16,
          ),
          suffixIcon:
              hasEye
                  ? IconButton(
                    icon: Icon(
                      obscure ? Icons.visibility_off : Icons.visibility,
                      color: Colors.black54,
                    ),
                    onPressed: onEyeTap,
                  )
                  : null,
        ),
      ),
    );
  }
}