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

class EarningsChartsWidget extends StatefulWidget {
  const EarningsChartsWidget({super.key});

  @override
  State<EarningsChartsWidget> createState() => _EarningsChartsWidgetState();
}

class _EarningsChartsWidgetState extends State<EarningsChartsWidget> {
  var touchedIndex = -1;
  var values = [300, 99, 300, 9];


  @override
  Widget build(BuildContext context) {
    var maxValue = values.reduce((value, element) => value > element ? value : element);

    return Padding(
      padding: const EdgeInsets.only(top:8.0),
      child: BarChart(
        BarChartData(
            alignment: BarChartAlignment.center,
            maxY: maxValue.toDouble(),
            minY: 0,
            groupsSpace: 12,
            barTouchData: buildBarTouchData(),
            borderData: FlBorderData(
              show: true,
              border: const Border(
                bottom: BorderSide(
                  color: AppColors.darkBgInactive,
                  width: 1,
                ),
                top: BorderSide(
                  color: AppColors.darkBgInactive,
                  width: 1,
                ),
              ),
            ),
            titlesData: _buildTiles(),
            gridData: buildFlGridData(),
            barGroups: getData()),
      ),
    );
  }

  FlGridData buildFlGridData() {
    return FlGridData(
      show: true,
      checkToShowHorizontalLine: (value) {
        return true;
      },
      getDrawingHorizontalLine: (value) => const FlLine(
        color: AppColors.darkBgInactive,
        dashArray: [4, 4],
        strokeWidth: 1,
      ),
      drawVerticalLine: false,
    );
  }

  FlTitlesData _buildTiles() {
    return FlTitlesData(
      show: true,
      bottomTitles: AxisTitles(
        sideTitles: SideTitles(
          showTitles: true,
          reservedSize: 16,
          getTitlesWidget: _buildBottomTiles,
        ),
      ),
      leftTitles: AxisTitles(
        sideTitles: SideTitles(
          maxIncluded: true,
          showTitles: true,
          reservedSize: 28,
          getTitlesWidget: _buildLeftTitles,
        ),
      ),
      topTitles: const AxisTitles(
        sideTitles: SideTitles(showTitles: false),
      ),
      rightTitles: const AxisTitles(
        sideTitles: SideTitles(showTitles: false),
      ),
    );
  }

  Widget _buildLeftTitles(double value, TitleMeta meta) {
    return Padding(
      padding:  EdgeInsets.only(bottom: value == 0?8.0:0),
      child: Text(
        meta.formattedValue,
        style:
        AppTextStyles.bodyTinyReg.copyWith(color: AppColors.darkBgInactive),
      ),
    );
  }
  Widget _buildBottomTiles(double value, TitleMeta meta) {
    var diap = '1-8 9-15 16-23 24-30'.split(' ');
    return Padding(
      padding: const EdgeInsets.only(top:4.0),
      child: Text(
        diap[value.toInt()],
        style:
        AppTextStyles.bodyTinyReg.copyWith(color: AppColors.darkBgInactive),
      ),
    );
  }

  BarTouchData buildBarTouchData() {
    return BarTouchData(
        allowTouchBarBackDraw: true,
      touchExtraThreshold: const EdgeInsets.only(top:16),
      touchCallback: (FlTouchEvent event, barTouchResponse) {
        setState(() {
          if (!event.isInterestedForInteractions ||
              barTouchResponse == null ||
              barTouchResponse.spot == null) {
            touchedIndex = -1;
            return;
          }
          touchedIndex = barTouchResponse.spot!.touchedBarGroupIndex;
        });
      },
      touchTooltipData: BarTouchTooltipData(
        getTooltipColor: (group) => AppColors.primaryMint,
        tooltipRoundedRadius: 24,
        tooltipPadding:
        const EdgeInsets.only(left: 12, right: 12, top: 12, bottom: 8),
        getTooltipItem: (group, groupIndex, rod, rodIndex) {
          return BarTooltipItem(
            '\$${rod.toY.round()}',
            AppTextStyles.bodyMediumMed,
          );
        },
      ),
    );
  }

  List<BarChartGroupData> getData() {
    double width = (MediaQuery.of(context).size.width-140)/4;


    return  List.generate(4, (i)=>
        BarChartGroupData(
          x: i,
          barRods: [
            BarChartRodData(
                toY: values[i].toDouble(),
                borderRadius: const BorderRadius.all(Radius.circular(12)),
                color: touchedIndex == i?AppColors.primaryMint:AppColors.primaryYellow,
                width: width),
          ],
        ),);

  }
}
