import 'package:auth/src/widgets/form_error_banner.dart';
import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';

class SignUpLayout extends StatelessWidget {
  final ThemePort theme;
  final String title;
  final String subtitle;
  final String supertitle;
  final int currentStep;
  final int numSteps;

  final Widget body;

  final VoidCallback onBackPressed;
  final VoidCallback onNextPressed;

  final String errorMessage;

  const SignUpLayout({
    super.key,
    required this.theme,
    required this.title,
    required this.subtitle,
    required this.supertitle,
    required this.currentStep,
    required this.numSteps,
    required this.body,
    required this.onBackPressed,
    required this.onNextPressed,
    this.errorMessage = '',
  });

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: theme.getColorFor(ThemeCode.backgroundPrimary),
      body: SafeArea(
        child: Container(
          color: theme.getColorFor(ThemeCode.backgroundPrimary),
          padding: const EdgeInsets.only(left: 24, right: 24),
          child: Column(
            children: [
              Padding(
                padding: const EdgeInsets.symmetric(vertical: 16),
                child: StepIndicator(
                  total: numSteps,
                  current: currentStep,
                  color: theme.getColorFor(ThemeCode.buttonPrimary),
                ),
              ),
              const SizedBox(height: 8),
              Text(
                supertitle,
                textAlign: TextAlign.center,
                style: const TextStyle(fontSize: 18),
              ),
              const SizedBox(height: 10),
              Text(
                title,
                textAlign: TextAlign.center,
                style: const TextStyle(
                  fontSize: 30,
                  fontWeight: FontWeight.bold,
                ),
              ),
              const SizedBox(height: 16),
              Text(
                subtitle,
                textAlign: TextAlign.center,
                style: const TextStyle(fontSize: 18),
              ),
              const SizedBox(height: 16),

              Expanded(
                child: SingleChildScrollView(
                  padding: const EdgeInsets.only(bottom: 16),
                  child: Column(
                    children: [
                      FormErrorBanner(message: errorMessage),
                      body,
                    ],
                  ),
                ),
              ),

              Row(
                spacing: 16,
                children: [
                  Expanded(
                    child: SecondaryButton(
                      onPressed: onBackPressed,
                      text: "Atrás",
                      size: 16,
                    ),
                  ),
                  Expanded(
                    child: PrimaryButton(
                      onPressed: onNextPressed,
                      text: "Siguiente",
                      size: 16,
                      color: theme.getColorFor(ThemeCode.buttonSecondary),
                    ),
                  ),
                ],
              ),
              const SizedBox(height: 12),
            ],
          ),
        ),
      ),
    );
  }
}
