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

/// A widget that allows the user to navigate between months.
class MonthSelector extends StatelessWidget {
  final DateTime selectedDate;
  final VoidCallback onPreviousMonth;
  final VoidCallback onNextMonth;

  const MonthSelector({
    super.key,
    required this.selectedDate,
    required this.onPreviousMonth,
    required this.onNextMonth,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.all(UiConstants.space1),
      decoration: BoxDecoration(
        color: UiColors.bgPopup,
        borderRadius: UiConstants.radiusLg,
        border: Border.all(color: UiColors.border),
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          IconButton(
            icon: const Icon(UiIcons.chevronLeft, color: UiColors.iconSecondary),
            onPressed: onPreviousMonth,
          ),
          Text(
            DateFormat('MMM yyyy').format(selectedDate),
            style: UiTypography.title2b.copyWith(
              color: UiColors.textPrimary,
            ),
          ),
          IconButton(
            icon: const Icon(
              UiIcons.chevronRight,
              color: UiColors.iconSecondary,
            ),
            onPressed: onNextMonth,
          ),
        ],
      ),
    );
  }
}
