import 'package:cims_apps/application/component/button/button_view.dart';
import 'package:cims_apps/application/component/text_form/text_form_view.dart';
import 'package:cims_apps/application/component/text_title/text_title.dart';
import 'package:cims_apps/application/theme/color_palette.dart';
import 'package:cims_apps/core/utils/size_config.dart';
import 'package:cims_apps/features/auth/login/view_model/login_view_model.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class PasswordView extends StatelessWidget {
  final void Function() nextStep;
  final TextEditingController controller;
  const PasswordView(
      {super.key, required this.nextStep, required this.controller});

  @override
  Widget build(BuildContext context) {
    return Consumer<LoginViewModel>(builder: (context, provider, child) {
      return Container(
        width: SizeConfig.width,
        height: SizeConfig.height,
        padding: const EdgeInsets.all(24),
        child: Form(
          key: provider.formKey,
          child: SingleChildScrollView(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                const TextTitle(title: 'Enter your password', fontSize: 24),
                SizedBox(
                  height: 24,
                ),
                TextFormView(
                  name: 'Password',
                  ctrl: controller,
                  obscureText: !provider.showPassword,
                  contentPadding: EdgeInsets.all(12),
                  validator: (value) {
                    if (value!.isEmpty) {
                      return 'Password must filled';
                    } else if (value.length < 8) {
                      return 'Minimum password 8 Character';
                    } else {
                      return null;
                    }
                  },
                  suffixIcon: GestureDetector(
                    onTap: () {
                      provider.changeShowPassword();
                    },
                    child: Icon(
                      provider.showPassword
                          ? Icons.visibility_outlined
                          : Icons.visibility_off_outlined,
                      color: ColorPalette.greyDarker,
                    ),
                  ),
                ),
                TextButton(
                    style: TextButton.styleFrom(padding: EdgeInsets.all(0)),
                    onPressed: () {},
                    child: Text(
                      'Forget the password?',
                      style: TextStyle(
                        color: ColorPalette.primary,
                      ),
                    )),
                SizedBox(
                  height: 16,
                ),
                ButtonView(
                  name: 'Confirm',
                  heightWrapContent: true,
                  width: SizeConfig.width,
                  textSize: 18,
                  marginVertical: 0,
                  contentPadding:
                      EdgeInsets.symmetric(horizontal: 16, vertical: 12),
                  onPressed: () {
                    if (provider.formKey.currentState!.validate()) {
                      nextStep();
                    }
                  },
                )
              ],
            ),
          ),
        ),
      );
    });
  }
}