import 'package:auth/src/widgets/layouts/form_step_layout.dart';
import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';
import 'package:auth/src/sign_up/signup_address_screen.dart';
import 'package:auth/src/sign_up/signup_personal_screen.dart';
import 'package:auth/src/sign_up/signup_user_screen.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:get_it/get_it.dart';
import 'package:navigation/navigation.dart';

import 'account_created_screen.dart';

class SignupScreen extends ConsumerStatefulWidget {
  NavigationContract navigationContract;

  SignupScreen({
    super.key,
    required this.navigationContract
  });
  @override
  ConsumerState<SignupScreen> createState() => _SignupScreenState();
}

class _SignupScreenState extends ConsumerState<SignupScreen> {
  int currentStep = 0;
  bool acceptTerms = false;

  @override
  Widget build(BuildContext context) {
    return getSteps()[currentStep];
  }

  List<Widget> getSteps() {
    final theme = ref.watch(themePortProvider);

    return [
      FormStepLayout(
        title: "Crea tu usuario",
        subtitle: "Con tu email y tu número podremos mantenerte siempre informado",
          supertitle: "Usuario y contacto",
        currentStep: 1,
        numSteps: 3,
        body: [SignupPersonalScreen()],
        footer: [
          Row(
            spacing: 16,
            children: [
              Expanded(child: SecondaryButton(
                onPressed: ()=>{},
                text: "Atrás",
                size: 16,
              )),
              Expanded(child: PrimaryButton(
                onPressed: ()=>{setState(() {
                  currentStep++;
                })},
                text: "Siguiente",
                size: 16,
                color: theme.getColorFor(ThemeCode.buttonSecondary)
              ))
            ]
          ),
          CheckboxListTile(
            value: acceptTerms,
            onChanged: (_) => setState(() {
              acceptTerms = !acceptTerms;
            }),
            title: Text(
              "Acepto los términos y condiciones",
              style: TextStyle(fontSize: 16, letterSpacing: 0),
            ),
            checkboxScaleFactor: 1.5,
            contentPadding: EdgeInsets.zero,
            activeColor: theme.getColorFor(ThemeCode.buttonPrimary),
            controlAffinity: ListTileControlAffinity.leading,
          )
        ],
        nextStep: ()=>{setState(() {
          currentStep++;
        })},
        previousStep: ()=>{},
      ),
      FormStepLayout(
        title: "Tu dirección",
        subtitle: "Tu dirección nos ayudará a verificar y mantener la seguridad de tu cuenta",
        supertitle: "Domicilio",
        currentStep: 2,
        numSteps: 3,
        body: [SignupAddressScreen()],
        nextStep: ()=>{setState(() {
          currentStep++;
        })},
        previousStep: ()=>{setState(() {
          currentStep--;
        })},
      ),
      FormStepLayout(
        title: "Identifícate",
        subtitle: "Contraseña mínima de 8 caracteres, con una mayúscula, un número y un carácter especial",
        supertitle: "Usuario y contacto",
        currentStep: 3,
        numSteps: 3,
        body: [SignupUserScreen()],
        nextStep: ()=>{setState(() {
          currentStep++;
        })},
        previousStep: ()=>{setState(() {
          currentStep--;
        })},
      ),
      AccountCreatedScreen(navigationContract: widget.navigationContract, kidAccount: false)
    ];
  }
}
