import 'package:flutter/material.dart';

import 'package:flutter_bloc/flutter_bloc.dart';

import '../../../core/design/tokens.dart';

import '../../../core/design/tripz_colors.dart';

import '../../../core/l10n/l10n.dart';

import '../../../core/ui/failure_text.dart';

import '../../../core/ui/tripz_button.dart';

import '../../../core/ui/tripz_otp_field.dart';

import '../../../core/ui/tripz_scaffold.dart';

import '../cubit/login_cubit.dart';

import '../cubit/login_state.dart';

import '../../../core/ui/form_header.dart';

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

  @override
  State<OtpView> createState() => _OtpViewState();
}

class _OtpViewState extends State<OtpView> {
  final _code = TextEditingController();

  @override
  void dispose() {
    _code.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    final l10n = context.l10n;
    return BlocBuilder<LoginCubit, LoginState>(
      builder: (context, state) {
        final cubit = context.read<LoginCubit>();
        return TripzScaffold(
          showAppBar: false,
          bottomAction: TripzButton.primary(
            label: l10n.otpVerify,
            loading: state.isSubmitting,
            onPressed: () => cubit.submitOtp(_code.text),
          ),
          child: ListView(
            children: [
              const SizedBox(height: Space.xl),
              FormHeader(
                icon: Icons.mark_email_read_outlined,
                title: l10n.otpTitle,
                lead: l10n.otpLead(state.phone),
              ),
              const SizedBox(height: Space.lg),
              TripzOtpField(
                controller: _code,
                enabled: !state.isSubmitting,
                hasError: state.failure != null,
                onCompleted: cubit.submitOtp,
              ),
              if (state.failure != null)
                ApiFailureText(failure: state.failure!),
              const SizedBox(height: Space.md),
              // العدّاد التنازلي ليس تجميلاً: بلا حارس تُحظر ثلاث ضغطات
              // المستخدمَ خمس دقائق (docs/38 §2).
              Center(
                child: state.canResend
                    ? TripzButton.text(
                        label: l10n.otpResend,
                        onPressed: cubit.resendOtp,
                      )
                    : Text(
                        l10n.otpResendIn(state.resendIn),
                        style: context.texts.bodySmall?.copyWith(
                          color: context.colors.onSurfaceVariant,
                        ),
                      ),
              ),
              Center(
                child: TripzButton.text(
                  label: l10n.otpChangeNumber,
                  onPressed: cubit.editPhone,
                ),
              ),
            ],
          ),
        );
      },
    );
  }
}