import 'package:flutter/material.dart';
import 'package:lucide_icons/lucide_icons.dart';
import 'package:design_system/design_system.dart';

/// Displays the staff member's reliability statistics (Shifts, Rating, On Time, etc.).
///
/// Uses design system tokens for all colors, typography, spacing, and icons.
class ReliabilityStatsCard extends StatelessWidget {
  final int? totalShifts;
  final double? averageRating;
  final int? onTimeRate;
  final int? noShowCount;
  final int? cancellationCount;

  const ReliabilityStatsCard({
    super.key,
    this.totalShifts,
    this.averageRating,
    this.onTimeRate,
    this.noShowCount,
    this.cancellationCount,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.all(UiConstants.space4),
      decoration: BoxDecoration(
        color: UiColors.bgPopup,
        borderRadius: BorderRadius.circular(UiConstants.radiusBase),
        border: Border.all(color: UiColors.border),
        boxShadow: [
          BoxShadow(
            color: UiColors.foreground.withOpacity(0.05),
            blurRadius: 4,
            offset: const Offset(0, 1),
          ),
        ],
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          _buildStatItem(
            context,
            LucideIcons.briefcase,
            "${totalShifts ?? 0}",
            "Shifts",
          ),
          _buildStatItem(
            context,
            LucideIcons.star,
            (averageRating ?? 0.0).toStringAsFixed(1),
            "Rating",
          ),
          _buildStatItem(
            context,
            LucideIcons.clock,
            "${onTimeRate ?? 0}%",
            "On Time",
          ),
          _buildStatItem(
            context,
            LucideIcons.xCircle,
            "${noShowCount ?? 0}",
            "No Shows",
          ),
          _buildStatItem(
            context,
            LucideIcons.ban,
            "${cancellationCount ?? 0}",
            "Cancel.",
          ),
        ],
      ),
    );
  }

  Widget _buildStatItem(
    BuildContext context,
    IconData icon,
    String value,
    String label,
  ) {
    return Expanded(
      child: Column(
        children: [
          Container(
            width: 40,
            height: 40,
            decoration: BoxDecoration(
              color: UiColors.primary.withOpacity(0.1),
              borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
            ),
            alignment: Alignment.center,
            child: Icon(icon, size: 20, color: UiColors.primary),
          ),
          SizedBox(height: UiConstants.space1),
          Text(
            value,
            style: UiTypography.body1b.copyWith(
              color: UiColors.foreground,
            ),
          ),
          FittedBox(
            fit: BoxFit.scaleDown,
            child: Text(
              label,
              style: UiTypography.footnote2r.copyWith(
                color: UiColors.mutedForeground,
              ),
            ),
          ),
        ],
      ),
    );
  }
}
