import 'package:auth/src/sign_up/account_created_screen.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';

class SignupScreen extends ConsumerWidget {
  SignupScreen({super.key});

  int currentStep = 0;

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final theme = ref.watch(themePortProvider);

    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: Container(
            color: theme.getColorFor(ThemeCode.backgroundPrimary),
            padding: const EdgeInsets.all(20),
            child: SizedBox(
              child: Stepper(
                controlsBuilder:
                    (BuildContext context, ControlsDetails controls) {
                      return Row(
                        children: <Widget>[
                          Expanded(
                            child: OutlinedButton(
                              onPressed: controls.onStepCancel,
                              child: const Text('Atrás'),
                            ),
                          ),
                          Expanded(
                            child: FilledButton(
                              style: ButtonStyle(
                                backgroundColor: WidgetStatePropertyAll<Color>(
                                  theme.getColorFor(ThemeCode.buttonSecondary),
                                ),
                              ),
                              onPressed: controls.onStepContinue,
                              child: const Text('Siguiente'),
                            ),
                          ),
                        ],
                      );
                    },
                type: StepperType.horizontal,
                currentStep: currentStep,
                onStepCancel: () => currentStep == 0,
                // ? null
                // : setState(() {
                //     currentStep -= 1;
                //   }),
                onStepContinue: () {
                  bool isLastStep = (currentStep == getSteps().length - 1);
                  if (isLastStep) {
                    Navigator.pushReplacement(
                      context,
                      MaterialPageRoute(builder: (_) => AccountCreatedScreen()),
                    );
                  } else {
                    // setState(() {
                    //   currentStep += 1;
                    // });
                  }
                },
                steps: getSteps(),
              ),
            ),
          ),
        ),
      ),
    );
  }

  List<Step> getSteps() {
    return <Step>[
      Step(
        state: currentStep > 0 ? StepState.complete : StepState.indexed,
        isActive: currentStep >= 0,
        stepStyle: currentStep >= 0
            ? StepStyle(
                connectorThickness: 0,
                color: Color(0xFF329e95),
                indexStyle: TextStyle(color: Colors.transparent),
              )
            : StepStyle(
                connectorThickness: 0,
                color: Colors.transparent,
                boxShadow: BoxShadow(spreadRadius: 5),
                indexStyle: TextStyle(color: Colors.transparent),
              ),
        title: const Text(""),
        content: SignupPersonalScreen(),
      ),
      Step(
        state: currentStep > 1 ? StepState.complete : StepState.indexed,
        isActive: currentStep >= 1,
        stepStyle: currentStep >= 1
            ? StepStyle(
                connectorThickness: 0,
                color: Color(0xFF329e95),
                indexStyle: TextStyle(color: Colors.transparent),
              )
            : StepStyle(
                connectorThickness: 0,
                color: Colors.white,
                boxShadow: BoxShadow(spreadRadius: 1),
                indexStyle: TextStyle(color: Colors.transparent),
              ),
        title: const Text(""),
        content: SignupAddressScreen(),
      ),
      Step(
        state: currentStep > 2 ? StepState.complete : StepState.indexed,
        isActive: currentStep >= 2,
        stepStyle: currentStep >= 2
            ? StepStyle(
                connectorThickness: 0,
                color: Color(0xFF329e95),
                indexStyle: TextStyle(color: Colors.transparent),
              )
            : StepStyle(
                connectorThickness: 0,
                color: Colors.white,
                boxShadow: BoxShadow(spreadRadius: 1),
                indexStyle: TextStyle(color: Colors.transparent),
              ),
        title: const Text(""),
        content: SignupUserScreen(),
      ),
    ];
  }
}
