import 'package:flutter/material.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(12),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            'Produk Terlaris',
            style: AppStyle.xl.copyWith(
              fontWeight: FontWeight.bold,
              color: AppColor.textPrimary,
            ),
          ),
          const SpaceHeight(16),
          Column(
            children: data.map((product) {
              return Container(
                margin: const EdgeInsets.only(bottom: 12),
                padding: const EdgeInsets.all(12),
                decoration: BoxDecoration(
                  color: const Color(0xFFF8FAFC),
                  borderRadius: BorderRadius.circular(8),
                  border: Border.all(color: AppColor.border),
                ),
                child: Row(
                  children: [
                    Expanded(
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            product.productName,
                            style: AppStyle.md.copyWith(
                              fontWeight: FontWeight.w600,
                            ),
                          ),
                          const SpaceHeight(2),
                          Text(
                            product.categoryName,
                            style: AppStyle.sm.copyWith(
                              fontSize: 12,
                              color: AppColor.textSecondary,
                            ),
                          ),
                        ],
                      ),
                    ),
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.end,
                      children: [
                        Text(
                          '${product.quantitySold} unit',
                          style: AppStyle.md.copyWith(
                            fontWeight: FontWeight.w600,
                          ),
                        ),
                        const SpaceHeight(2),
                        Text(
                          product.revenue.currencyFormatRpV2,
                          style: AppStyle.sm.copyWith(
                            fontSize: 12,
                            color: AppColor.textSecondary,
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              );
            }).toList(),
          ),
        ],
      ),
    );
  }
}
