import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

import '../../../../application/auth/auth_bloc.dart';
import '../../../../application/auth/login_form/login_form_bloc.dart';
import '../../../../injection.dart';
import '../../../components/button/button.dart';
import '../../../components/field/field.dart';
import '../../../components/toast/flushbar.dart';
import '../../../router/app_router.gr.dart';

@RoutePage()
class PasswordPage extends StatelessWidget implements AutoRouteWrapper {
  final String phoneNumber;
  const PasswordPage({super.key, required this.phoneNumber});

  @override
  Widget build(BuildContext context) {
    return BlocListener<LoginFormBloc, LoginFormState>(
      listenWhen: (p, c) => p.failureOrLoginOption != c.failureOrLoginOption,
      listener: (context, state) {
        state.failureOrLoginOption.fold(
          () => null,
          (either) => either.fold(
            (f) => AppFlushbar.showAuthFailureToast(context, f),
            (data) {
              AppFlushbar.showSuccess(context, data.message);
              Future.delayed(Duration(milliseconds: 1000), () {
                context.read<AuthBloc>().add(AuthEvent.fetchCurrentUser());
                context.router.replaceAll([MainRoute()]);
              });
            },
          ),
        );
      },
      child: Scaffold(
        appBar: AppBar(title: const Text('Kata Sandi')),
        body: BlocBuilder<LoginFormBloc, LoginFormState>(
          builder: (context, state) {
            return Padding(
              padding: const EdgeInsets.symmetric(horizontal: 24.0),
              child: Form(
                autovalidateMode: state.showErrorMessages
                    ? AutovalidateMode.always
                    : AutovalidateMode.disabled,
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const SizedBox(height: 40),

                    // Title
                    AppPasswordTextFormField(
                      title: 'Masukkan kata sandi',
                      hintText: '********',
                      onChanged: (value) => context.read<LoginFormBloc>().add(
                        LoginFormEvent.passwordChanged(value),
                      ),
                      validator: (value) {
                        if (context
                            .read<LoginFormBloc>()
                            .state
                            .password
                            .isEmpty) {
                          return 'Masukkan kata sandi';
                        }

                        return null;
                      },
                    ),

                    const SizedBox(height: 50),

                    Spacer(),

                    // Continue Button
                    AppElevatedButton(
                      onPressed: state.isSubmitting
                          ? null
                          : () => context.read<LoginFormBloc>().add(
                              LoginFormEvent.submitted(),
                            ),
                      title: 'Konfirmasi',
                      isLoading: state.isSubmitting,
                    ),

                    const SizedBox(height: 24),
                  ],
                ),
              ),
            );
          },
        ),
      ),
    );
  }

  @override
  Widget wrappedRoute(BuildContext context) => BlocProvider(
    create: (context) =>
        getIt<LoginFormBloc>()
          ..add(LoginFormEvent.phoneNumberChanged(phoneNumber)),
    child: this,
  );
}