import 'package:core_localization/core_localization.dart';
import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';
import '../models/billing_invoice_model.dart';

/// Section showing the history of paid invoices.
class InvoiceHistorySection extends StatelessWidget {
  /// Creates an [InvoiceHistorySection].
  const InvoiceHistorySection({required this.invoices, super.key});

  /// The list of historical invoices.
  final List<BillingInvoice> invoices;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[
            Text(
              t.client_billing.invoice_history,
              style: UiTypography.title2b.textPrimary,
            ),
            GestureDetector(
              onTap: () {},
              child: Row(
                children: <Widget>[
                  Text(
                    t.client_billing.view_all,
                    style: UiTypography.footnote2b.textPrimary,
                  ),
                  const Icon(
                    UiIcons.chevronRight,
                    size: 16,
                    color: UiColors.primary,
                  ),
                ],
              ),
            ),
          ],
        ),
        const SizedBox(height: UiConstants.space2),
        Container(
          decoration: BoxDecoration(
            color: UiColors.white,
            borderRadius: UiConstants.radiusLg,
            border: Border.all(color: UiColors.border),
            boxShadow: <BoxShadow>[
              BoxShadow(
                color: UiColors.black.withValues(alpha: 0.04),
                blurRadius: 8,
                offset: const Offset(0, 2),
              ),
            ],
          ),
          child: Column(
            children: invoices.asMap().entries.map((
              MapEntry<int, BillingInvoice> entry,
            ) {
              final int index = entry.key;
              final BillingInvoice invoice = entry.value;
              return Column(
                children: <Widget>[
                  if (index > 0)
                    const Divider(height: 1, color: UiColors.border),
                  _InvoiceItem(invoice: invoice),
                ],
              );
            }).toList(),
          ),
        ),
      ],
    );
  }
}

class _InvoiceItem extends StatelessWidget {
  const _InvoiceItem({required this.invoice});

  final BillingInvoice invoice;

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(UiConstants.space4),
      child: Row(
        children: <Widget>[
          Container(
            padding: const EdgeInsets.all(UiConstants.space2),
            decoration: BoxDecoration(
              color: UiColors.bgSecondary,
              borderRadius: UiConstants.radiusMd,
            ),
            child: const Icon(UiIcons.file, color: UiColors.primary, size: 20),
          ),
          const SizedBox(width: UiConstants.space3),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                Text(invoice.id, style: UiTypography.body2b.textPrimary),
                Text(
                  invoice.date,
                  style: UiTypography.footnote2r.textSecondary,
                ),
              ],
            ),
          ),
          Column(
            crossAxisAlignment: CrossAxisAlignment.end,
            children: <Widget>[
              Text(
                '\$${invoice.totalAmount.toStringAsFixed(2)}',
                style: UiTypography.body2b.textPrimary,
              ),
              _StatusBadge(status: invoice.status),
            ],
          ),
          const SizedBox(width: UiConstants.space2),
          const Icon(UiIcons.download, size: 16, color: UiColors.iconSecondary),
        ],
      ),
    );
  }
}

class _StatusBadge extends StatelessWidget {
  const _StatusBadge({required this.status});

  final String status;

  @override
  Widget build(BuildContext context) {
    final bool isPaid = status.toUpperCase() == 'PAID';
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
      decoration: BoxDecoration(
        color: isPaid ? UiColors.tagSuccess : UiColors.tagPending,
        borderRadius: BorderRadius.circular(4),
      ),
      child: Text(
        isPaid ? t.client_billing.paid_badge : t.client_billing.pending_badge,
        style: UiTypography.titleUppercase4b.copyWith(
          color: isPaid ? UiColors.iconSuccess : UiColors.textWarning,
        ),
      ),
    );
  }
}
