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

/// Displays the staff member's reliability score as a progress bar.
///
/// Uses design system tokens for all colors, typography, and spacing.
class ReliabilityScoreBar extends StatelessWidget {
  final int? reliabilityScore;

  const ReliabilityScoreBar({
    super.key,
    this.reliabilityScore,
  });

  @override
  Widget build(BuildContext context) {
    final i18n = t.staff.profile.reliability_score;
    final score = (reliabilityScore ?? 0) / 100;

    return Container(
      padding: EdgeInsets.all(UiConstants.space4),
      decoration: BoxDecoration(
        color: UiColors.primary.withOpacity(0.1),
        borderRadius: BorderRadius.circular(UiConstants.radiusBase),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(
                i18n.title,
                style: UiTypography.body2m.copyWith(
                  color: UiColors.primary,
                ),
              ),
              Text(
                "${reliabilityScore ?? 0}%",
                style: UiTypography.headline4m.copyWith(
                  color: UiColors.primary,
                ),
              ),
            ],
          ),
          SizedBox(height: UiConstants.space2),
          ClipRRect(
            borderRadius: BorderRadius.circular(UiConstants.space1),
            child: LinearProgressIndicator(
              value: score,
              backgroundColor: UiColors.background,
              color: UiColors.primary,
              minHeight: 8,
            ),
          ),
          Padding(
            padding: EdgeInsets.only(top: UiConstants.space2),
            child: Text(
              i18n.description,
              style: UiTypography.footnote2r.copyWith(
                color: UiColors.mutedForeground,
              ),
            ),
          ),
        ],
      ),
    );
  }
}
