import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:sigap/src/features/auth/presentasion/controllers/signup/main/registration_form_controller.dart';
import 'package:sigap/src/features/auth/presentasion/pages/signup/step/id-card-verification/id_card_verification_step.dart';
import 'package:sigap/src/features/auth/presentasion/pages/signup/step/identity-verification/identity_verification_step.dart';
import 'package:sigap/src/features/auth/presentasion/pages/signup/step/officer-information/officer_info_step.dart';
import 'package:sigap/src/features/auth/presentasion/pages/signup/step/personal-information/personal_info_step.dart';
import 'package:sigap/src/features/auth/presentasion/pages/signup/step/selfie-verification/selfie_verification_step.dart';
import 'package:sigap/src/shared/widgets/indicators/step_indicator/step_indicator.dart';
import 'package:sigap/src/utils/constants/colors.dart';
import 'package:sigap/src/utils/constants/sizes.dart';
import 'package:sigap/src/utils/helpers/helper_functions.dart';

class FormRegistrationScreen extends StatelessWidget {
  const FormRegistrationScreen({super.key});

  @override
  Widget build(BuildContext context) {
    // Ensure all dependencies are registered

    final controller = Get.find<FormRegistrationController>();
    final dark = THelperFunctions.isDarkMode(context);

    // Set system overlay style
    SystemChrome.setSystemUIOverlayStyle(
      SystemUiOverlayStyle(
        statusBarColor: Colors.transparent,
        statusBarIconBrightness: dark ? Brightness.light : Brightness.dark,
      ),
    );

    return Scaffold(
      backgroundColor: dark ? TColors.dark : TColors.lightContainer,
      appBar: _buildAppBar(context, dark),
      body: Obx(() {
        // Show loading state while controller initializes
        if (controller.userMetadata.value.userId == null &&
            controller.userMetadata.value.roleId == null) {
          return const Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                CircularProgressIndicator(),
                SizedBox(height: 16),
                Text("Loading profile information..."),
              ],
            ),
          );
        }

        return SafeArea(
          child: Column(
            children: [
              // Step indicator
              _buildStepIndicator(controller),

              // Step content
              Expanded(
                child: SingleChildScrollView(
                  child: Padding(
                    padding: const EdgeInsets.all(TSizes.defaultSpace),
                    child: Obx(() {
                      return _buildStepContent(controller);
                    }),
                  ),
                ),
              ),
            ],
          ),
        );
      }),
    );
  }

  AppBar _buildAppBar(BuildContext context, bool dark) {
    return AppBar(
      automaticallyImplyLeading: false,

      backgroundColor: Colors.transparent,
      elevation: 0,
      title: Text(
        'Complete Your Profile',
        style: Theme.of(
          context,
        ).textTheme.headlineSmall?.copyWith(fontWeight: FontWeight.bold),
      ),
      centerTitle: true,
    );
  }

  Widget _buildStepIndicator(FormRegistrationController controller) {
    return Padding(
      padding: const EdgeInsets.all(TSizes.defaultSpace),
      child: Obx(
        () => StepIndicator(
          currentStep: controller.currentStep.value,
          totalSteps: controller.totalSteps,
          stepTitles: controller.getStepTitles(),
          onStepTapped: (index) {
            // If stepping forward, use nextStep() to validate
            if (index > controller.currentStep.value) {
              controller.nextStep();
            } else {
              // If stepping backward, just go to that step without validation
              controller.goToStep(index);
            }
          },
          style: StepIndicatorStyle.standard,
        ),
      ),
    );
  }

  // Add navigation buttons

  Widget _buildStepContent(FormRegistrationController controller) {
    final isOfficer = controller.selectedRole.value?.isOfficer ?? false;

    // Different step content for officer vs viewer
    if (isOfficer) {
      // Officer registration flow (3 steps)
      switch (controller.currentStep.value) {
        case 0:
          return const IdCardVerificationStep();
        case 1:
          return const SelfieVerificationStep();
        case 2:
          return const OfficerInfoStep();
        default:
          return const SizedBox.shrink();
      }
    } else {
      // Viewer registration flow (4 steps)
      switch (controller.currentStep.value) {
        case 0:
          return const PersonalInfoStep();
        case 1:
          return const IdCardVerificationStep();
        case 2:
          return const SelfieVerificationStep();
        case 3:
          return const IdentityVerificationStep();
        default:
          return const SizedBox.shrink();
      }
    }
  }
}
