import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';

import '../../../../../../../common/theme/theme.dart';
import '../../../../../../../domain/analytic/analytic.dart';
import '../../../../../../components/spaces/space.dart';

class ReportDashboardProductChart extends StatelessWidget {
  final List<DashboardTopProduct> data;
  const ReportDashboardProductChart({super.key, required this.data});

  @override
  Widget build(BuildContext context) {
    final colors = [
      AppColor.primary,
      AppColor.secondary,
      AppColor.info,
      AppColor.warning,
      AppColor.success,
    ];

    return Container(
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(12),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            'Distribusi Produk',
            style: AppStyle.xl.copyWith(
              fontWeight: FontWeight.bold,
              color: AppColor.textPrimary,
            ),
          ),
          const SpaceHeight(12),
          SizedBox(
            height: 160,
            child: PieChart(
              PieChartData(
                sectionsSpace: 2,
                centerSpaceRadius: 40,
                sections: data.asMap().entries.map((entry) {
                  return PieChartSectionData(
                    color: colors[entry.key % colors.length],
                    value: entry.value.quantitySold.toDouble(),
                    title: '${entry.value.quantitySold}',
                    radius: 40,
                    titleStyle: AppStyle.sm.copyWith(
                      fontWeight: FontWeight.bold,
                      color: Colors.white,
                    ),
                  );
                }).toList(),
              ),
            ),
          ),
          const SpaceHeight(16),
          Column(
            children: data.take(3).map((product) {
              final index = data.indexOf(product);

              return Padding(
                padding: const EdgeInsets.only(bottom: 8),
                child: Row(
                  children: [
                    Container(
                      width: 8,
                      height: 8,
                      decoration: BoxDecoration(
                        color: colors[index % colors.length],
                        shape: BoxShape.circle,
                      ),
                    ),
                    const SizedBox(width: 8),
                    Expanded(
                      child: Text(product.productName, style: AppStyle.sm),
                    ),
                    Text(
                      '${product.quantitySold}',
                      style: AppStyle.sm.copyWith(fontWeight: FontWeight.w500),
                    ),
                  ],
                ),
              );
            }).toList(),
          ),
        ],
      ),
    );
  }
}
