import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:go_router/go_router.dart';

import '../../core/theme/app_theme.dart';
import '../../core/widgets/game_ui.dart';
import 'auth_cubit.dart';

/// صفحه‌ی ورود کد یک‌بارمصرف (۵ رقمی).
class OtpScreen extends StatefulWidget {
  const OtpScreen({super.key});

  @override
  State<OtpScreen> createState() => _OtpScreenState();
}

class _OtpScreenState extends State<OtpScreen> {
  final _controller = TextEditingController();

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

  bool get _valid => _controller.text.trim().length == 5;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: GameBackground(
        child: BlocConsumer<AuthCubit, AuthState>(
          listener: (context, state) {
            if (state.status == AuthStatus.authenticated) {
              context.go('/lobby');
            } else if (state.status == AuthStatus.error) {
              ScaffoldMessenger.of(context).showSnackBar(
                SnackBar(content: Text(state.error ?? 'خطا')),
              );
              context.read<AuthCubit>().resetError(onOtpScreen: true);
            }
          },
          builder: (context, state) {
            final loading = state.status == AuthStatus.loading;
            return Center(
              child: SingleChildScrollView(
                padding: const EdgeInsets.all(24),
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    const GlowText('تأیید کد', size: 32),
                    const SizedBox(height: 24),
                    GamePanel(
                      padding: const EdgeInsets.all(22),
                      child: Column(
                        mainAxisSize: MainAxisSize.min,
                        children: [
                          Text('کد پیامک‌شده به ${state.mobile} را وارد کنید',
                              textAlign: TextAlign.center,
                              style: const TextStyle(color: Colors.white70)),
                          const SizedBox(height: 20),
                          TextField(
                            controller: _controller,
                            keyboardType: TextInputType.number,
                            textAlign: TextAlign.center,
                            style: const TextStyle(fontSize: 28, letterSpacing: 12),
                            inputFormatters: [
                              FilteringTextInputFormatter.digitsOnly,
                              LengthLimitingTextInputFormatter(5),
                            ],
                            decoration: const InputDecoration(hintText: '- - - - -'),
                            onChanged: (_) => setState(() {}),
                          ),
                          const SizedBox(height: 20),
                          GameButton(
                            label: 'ورود',
                            width: double.infinity,
                            colors: const [Color(0xFF3FA34D), Color(0xFF1B5E20)],
                            onTap: (!_valid || loading)
                                ? null
                                : () => context
                                    .read<AuthCubit>()
                                    .verifyOtp(_controller.text.trim()),
                          ),
                          TextButton(
                            onPressed: loading ? null : () => context.pop(),
                            child: const Text('تغییر شماره',
                                style: TextStyle(color: AppColors.gold)),
                          ),
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            );
          },
        ),
      ),
    );
  }
}