RegisterPageFixEmail

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_svg/svg.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:module_auth/presentation/bloc/register_access_email_bloc/register_access_email_bloc.dart';
import 'package:module_auth/presentation/pages/register/send_register_otp_page.dart';
import 'package:module_core/common/state_enum.dart';
import 'package:module_core/custom_widgets/custom_button/custom_button.dart';
import 'package:module_core/custom_widgets/custom_dialog_register/custom_dialog_register.dart';
import 'package:module_core/custom_widgets/custom_textfield/custom_textfield.dart';
import 'package:module_core/utils/app_colors.dart';
import 'package:module_core/utils/app_image.dart';

class RegisterPage extends StatelessWidget {
  RegisterPage({Key? key}) : super(key: key);

  final TextEditingController _fieldController =
      TextEditingController(text: '');

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: BlocListener<RegisterAccessEmailBloc, RegisterAccessEmailState>(
            listener: (context, state) {
              if (state.state == RequestState.Loaded) {
                Navigator.of(context).push(MaterialPageRoute(
                  builder: (context) => SendRegisterOtpPage(data: state.data),
                ));
              } else if (state.state == RequestState.Error) {
                Center(child: Text(state.errorMessage));
              }
            },
            listenWhen: (previousState, currentState) =>
                currentState.state == RequestState.Loaded ||
                currentState.state == RequestState.Error,
            child: BlocConsumer<RegisterAccessEmailBloc,
                    RegisterAccessEmailState>(
                listener: (context, state) {
                  if (state.errorMessage.isNotEmpty) {
                    ScaffoldMessenger.of(context).showSnackBar(SnackBar(
                      content: Text(state.errorMessage),
                    ));
                  }
                },
                listenWhen: (previousState, currentState) =>
                    previousState.errorMessage != currentState.errorMessage &&
                    currentState.errorMessage != '',
                builder: (context, state) {
                  return SafeArea(
                    child: ListView(children: [
                      Padding(
                        padding: const EdgeInsets.only(left: 30, top: 30),
                        child: Row(
                          children: [
                            GestureDetector(
                              onTap: () => print('Back'),
                              child: Container(
                                width: 32,
                                height: 32,
                                decoration: BoxDecoration(
                                  color: AppColors.greyLight,
                                  borderRadius: BorderRadius.circular(18),
                                ),
                                child: SvgPicture.asset(AppImage.back_button,
                                    height: 24,
                                    width: 24,
                                    fit: BoxFit.scaleDown),
                              ),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(height: 8),
                      Padding(
                        padding: const EdgeInsets.symmetric(horizontal: 30),
                        child: AspectRatio(
                          aspectRatio: 3 / 2,
                          child: Container(
                            height: 196,
                            decoration: BoxDecoration(
                              image: DecorationImage(
                                image: AssetImage(AppImage.register_image),
                                fit: BoxFit.cover,
                              ),
                            ),
                          ),
                        ),
                      ),
                      SizedBox(height: 16),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Text(
                            'Buat Akunmu Sekarang',
                            style: GoogleFonts.poppins(
                              fontSize: 16,
                              fontWeight: FontWeight.w600,
                              color: Color(0xff2D2F2E),
                            ),
                          ),
                        ],
                      ),
                      SizedBox(height: 6),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Text(
                            'Sudah Punya Akun?',
                            style: GoogleFonts.roboto(
                              fontSize: 12,
                              fontWeight: FontWeight.w400,
                              color: Color(0xff2D2F2E),
                            ),
                          ),
                          SizedBox(width: 2),
                          GestureDetector(
                            onTap: () => print('Masuk'),
                            child: Text(
                              'Masuk',
                              style: GoogleFonts.roboto(
                                fontSize: 12,
                                fontWeight: FontWeight.w500,
                                color: Color(0xff2D2F2E),
                              ),
                            ),
                          ),
                        ],
                      ),
                      SizedBox(height: 18),
                      Divider(
                        color: Color(0xffC4C4C4),
                        thickness: 1,
                      ),
                      Padding(
                        padding: const EdgeInsets.fromLTRB(30, 18, 30, 0),
                        child: CustomTextField(
                          title: 'Full Name',
                          hintText: 'Your full name',
                          controller: _fieldController,
                        ),
                      ),
                      Padding(
                        padding: const EdgeInsets.only(left: 42),
                        child: Text('Contoh: account@email.com',
                            style: GoogleFonts.roboto(
                                fontSize: 12,
                                fontWeight: FontWeight.w400,
                                color: Color(0xff505050))),
                      ),
                      Padding(
                          padding: const EdgeInsets.fromLTRB(30, 18, 30, 0),
                          child: CustomButton(
                              title: 'Daftar',
                              onPressed: () {
                                showDialog(
                                    context: context,
                                    builder: (BuildContext context) {
                                      return CustomDialogRegister(
                                        title: 'email@email.com',
                                        descriptions:
                                            'Apakah email yang anda masukkan sudah benar?',
                                        textYes: 'Ya, benar',
                                        textNo: "Ubah",
                                        onPressedYes: () {
                                          BlocProvider.of<
                                                      RegisterAccessEmailBloc>(
                                                  context)
                                              .add(OnClickRegisterAccess(
                                                  _fieldController.text));
                                        },
                                        onPressedNo: () {
                                          Navigator.pop(context);
                                        },
                                        image: AppImage.register_email,
                                      );
                                    });
                              })),
                      Padding(
                        padding: const EdgeInsets.symmetric(
                            horizontal: 40, vertical: 10),
                        child: RichText(
                          textAlign: TextAlign.center,
                          text: TextSpan(
                            text: 'Dengan mendaftar, saya menyetujui ',
                            style: GoogleFonts.roboto(
                              fontSize: 12,
                              fontWeight: FontWeight.w400,
                              color: Color(0xff2D2F2E),
                            ),
                            children: <TextSpan>[
                              TextSpan(
                                  text: 'Syarat dan ketentuan ',
                                  style: GoogleFonts.roboto(
                                    fontSize: 12,
                                    fontWeight: FontWeight.w500,
                                    color: Color(0xff2D2F2E),
                                  )),
                              TextSpan(
                                text: ' yang berlaku di sistem kami',
                                style: GoogleFonts.roboto(
                                  fontSize: 12,
                                  fontWeight: FontWeight.w400,
                                  color: Color(0xff2D2F2E),
                                ),
                              ),
                            ],
                          ),
                        ),
                      ),
                      Padding(
                        padding: const EdgeInsets.fromLTRB(30, 10, 30, 20),
                        child: IntrinsicHeight(
                          child: Row(
                            children: [
                              Expanded(
                                child: Container(
                                  margin: EdgeInsets.only(right: 10),
                                  height: 1,
                                  color: Color(0xffC4C4C4),
                                ),
                              ),
                              Text(
                                'atau daftar dengan metode lain',
                                style: GoogleFonts.roboto(
                                  fontSize: 10,
                                  fontWeight: FontWeight.w400,
                                  color: Color(0xff2D2F2E),
                                ),
                              ),
                              Expanded(
                                child: Container(
                                  height: 1,
                                  margin: EdgeInsets.only(left: 10),
                                  color: Color(0xffC4C4C4),
                                ),
                              ),
                            ],
                          ),
                        ),
                      ),
                      Padding(
                        padding: EdgeInsets.symmetric(horizontal: 30),
                        child: Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              Container(
                                height: 40,
                                width:
                                    MediaQuery.of(context).size.width / 2 - 40,
                                decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(8),
                                    color: Color(0xffFEFEFE),
                                    boxShadow: [
                                      BoxShadow(
                                          color: Colors.black12,
                                          blurRadius: 4,
                                          spreadRadius: 1,
                                          offset: Offset(4, 4)) // Shadow ),
                                    ]),
                                child: Padding(
                                  padding: const EdgeInsets.symmetric(
                                      horizontal: 24, vertical: 12),
                                  child: Row(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    children: [
                                      SvgPicture.asset(AppImage.google,
                                          height: 24,
                                          width: 24,
                                          fit: BoxFit.scaleDown),
                                      SizedBox(width: 8),
                                      Text(
                                        'Google',
                                        style: GoogleFonts.roboto(
                                          fontSize: 14,
                                          fontWeight: FontWeight.w500,
                                          color: Color(0xff2D2F2E),
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                              ),
                              Container(
                                height: 40,
                                width:
                                    MediaQuery.of(context).size.width / 2 - 40,
                                decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(8),
                                    color: Color(0xff395185),
                                    boxShadow: [
                                      BoxShadow(
                                          color: Colors.black12,
                                          blurRadius: 4,
                                          spreadRadius: 1,
                                          offset: Offset(4, 4)) // Shadow ),
                                    ]),
                                child: Padding(
                                  padding: const EdgeInsets.symmetric(
                                      horizontal: 24, vertical: 12),
                                  child: Row(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    children: [
                                      SvgPicture.asset(AppImage.facebook,
                                          height: 30,
                                          width: 30,
                                          fit: BoxFit.scaleDown),
                                      SizedBox(width: 8),
                                      Text(
                                        'Facebook',
                                        style: GoogleFonts.roboto(
                                          fontSize: 14,
                                          fontWeight: FontWeight.w500,
                                          color: Color(0xffFEFEFE),
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                              )
                            ]),
                      )
                    ]),
                  );
                })));
  }
}