import 'package:flutter/material.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/extension/build_context_x.dart';

final class _AqiRange {
  const _AqiRange({required this.max, required this.color});

  final double max;
  final Color color;
}

class AqiSubValueWidget extends StatelessWidget {
  const AqiSubValueWidget({
    required this.label,
    required this.value,
    required this.unit,
    required this.range,
    super.key,
  });

  final String label;
  final String value;
  final String unit;
  final (double min, double max) range;

  double get _parsedValue => double.parse(value);

  static const List<_AqiRange> _ranges = [
    _AqiRange(max: 12, color: ColorsManager.goodGreen),
    _AqiRange(max: 35, color: ColorsManager.poorOrange),
    _AqiRange(max: 55, color: ColorsManager.poorOrange),
    _AqiRange(max: 150, color: ColorsManager.unhealthyRed),
    _AqiRange(max: 250, color: ColorsManager.severePink),
    _AqiRange(max: 500, color: ColorsManager.hazardousPurple),
  ];

  static List<_AqiRange> _getRangesForValue((double min, double max) range) {
    final (double min, double max) = range;
    final rangeSize = (max - min) / 6;
    return [
      _AqiRange(max: min + rangeSize, color: ColorsManager.goodGreen),
      _AqiRange(max: min + (rangeSize * 2), color: ColorsManager.poorOrange),
      _AqiRange(max: min + (rangeSize * 3), color: ColorsManager.poorOrange),
      _AqiRange(max: min + (rangeSize * 4), color: ColorsManager.unhealthyRed),
      _AqiRange(max: min + (rangeSize * 5), color: ColorsManager.severePink),
      _AqiRange(max: min, color: ColorsManager.hazardousPurple),
    ];
  }

  int _getActiveSegmentByRange(double value, (double min, double max) range) {
    final ranges = _getRangesForValue(range);
    for (int i = 0; i < ranges.length; i++) {
      if (value <= ranges[i].max) return i;
    }
    return ranges.length - 1;
  }

  @override
  Widget build(BuildContext context) {
    final activeSegment = _getActiveSegmentByRange(_parsedValue, range);
    return Expanded(
      child: Container(
        padding: const EdgeInsetsDirectional.all(10),
        decoration: BoxDecoration(
          color: ColorsManager.whiteColors,
          borderRadius: BorderRadius.circular(12),
        ),
        child: Row(
          spacing: MediaQuery.sizeOf(context).width * 0.0075,
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            _buildLabel(context),
            _buildSegmentedBar(activeSegment),
            _buildValueAndUnit(context),
          ],
        ),
      ),
    );
  }

  Widget _buildValueAndUnit(BuildContext context) {
    return Expanded(
      child: FittedBox(
        fit: BoxFit.scaleDown,
        alignment: AlignmentDirectional.centerEnd,
        child: Column(
          mainAxisSize: MainAxisSize.min,
          crossAxisAlignment: CrossAxisAlignment.end,
          children: [
            Text(
              value,
              style: context.textTheme.titleMedium?.copyWith(
                color: ColorsManager.blackColor,
                fontWeight: FontWeight.w400,
                fontSize: 14,
              ),
            ),
            Text(
              unit,
              style: context.textTheme.bodySmall?.copyWith(
                color: ColorsManager.blackColor,
                fontWeight: FontWeight.w400,
                fontSize: 10,
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildSegmentedBar(int activeSegment) {
    return Expanded(
      flex: 4,
      child: Padding(
        padding: const EdgeInsets.symmetric(horizontal: 12),
        child: Row(
          spacing: 4,
          mainAxisAlignment: MainAxisAlignment.center,
          children: List.generate(_ranges.length, (index) {
            final isActive = index == activeSegment;
            final color = _ranges[index].color.withValues(
                  alpha: isActive ? 1.0 : 0.25,
                );
            return Expanded(
              child: AnimatedContainer(
                duration: const Duration(milliseconds: 150),
                curve: Curves.linear,
                height: 5,
                decoration: BoxDecoration(
                  color: color,
                  borderRadius: BorderRadius.circular(4),
                ),
              ),
            );
          }),
        ),
      ),
    );
  }

  Widget _buildLabel(BuildContext context) {
    return Expanded(
      child: FittedBox(
        fit: BoxFit.scaleDown,
        alignment: AlignmentDirectional.centerStart,
        child: Text(
          label,
          style: context.textTheme.bodySmall?.copyWith(
            color: ColorsManager.blackColor,
            fontWeight: FontWeight.w400,
            fontSize: 14,
          ),
        ),
      ),
    );
  }
}
