import 'package:flutter/material.dart';
import 'package:krow/core/presentation/gen/assets.gen.dart';
import 'package:krow/core/presentation/styles/kw_text_styles.dart';
import 'package:krow/core/presentation/styles/theme.dart';

class ShiftPaymentStepWidget extends StatelessWidget {
  final int currentIndex;

  const ShiftPaymentStepWidget({required this.currentIndex, super.key});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.only(top: 12, left: 20, right: 20),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          _buildPaymentStep('Payment sent', 0, currentIndex),
          _divider(),
          _buildPaymentStep('Pending Payment', 1, currentIndex),
          _divider(),
          _buildPaymentStep('Payment received', 2, currentIndex),
        ],
      ),
    );
  }

  Widget _buildPaymentStep(String title, int index, int currentIndex) {
    return Container(
      width: 60,
      margin: const EdgeInsets.symmetric(horizontal: 10),
      child: Column(
        children: [
          Container(
            height: 28,
            width: 28,
            decoration: BoxDecoration(
              color: index == currentIndex
                  ? AppColors.blackBlack
                  : AppColors.grayWhite,
              border: Border.all(
                color: index == currentIndex
                    ? Colors.transparent
                    : AppColors.grayTintStroke,
              ),
              shape: BoxShape.circle,
            ),
            child: Center(
              child: index < currentIndex
                  ? Assets.images.icons.check.svg()
                  : Text(
                      (index + 1).toString(),
                      style: index == currentIndex
                          ? AppTextStyles.bodyMediumSmb
                              .copyWith(color: AppColors.grayWhite)
                          : AppTextStyles.bodyMediumReg
                              .copyWith(color: AppColors.grayDisable),
                    ),
            ),
          ),
          SizedBox(
            height: 24,
            child: Text(
              title,
              textAlign: TextAlign.center,
              style: index <= currentIndex
                  ? AppTextStyles.bodyTinyMed
                  : AppTextStyles.bodyTinyReg
                      .copyWith(color: AppColors.grayDisable),
            ),
          ),
        ],
      ),
    );
  }

  Widget _divider() {
    return Expanded(
      child: Container(
        height: 1,
        color: AppColors.grayTintStroke,
      ),
    );
  }
}
