import 'package:eatvio_app/features/insights/models/insights_payload_model.dart';
import 'package:eatvio_app/features/insights/presentation/widgets/insights_colors.dart';
import 'package:eatvio_app/generated/l10n.dart';
import 'package:flutter/material.dart';

/// Легенда под графиком «В течение дня»: подъём, отход ко сну, затемнение сна.
class IntraLegend extends StatelessWidget {
  const IntraLegend({super.key, required this.model});

  final IntraChartModel model;

  @override
  Widget build(BuildContext context) {
    final s = S.of(context);
    final wakeText =
        model.wakeText ??
        (model.wakeLabel == null ? null : s.insights_wake_at(model.wakeLabel!));
    final sleepText =
        model.sleepText ??
        (model.sleepLabel == null
            ? null
            : s.insights_sleep_at(model.sleepLabel!));

    return Wrap(
      spacing: 16,
      runSpacing: 6,
      children: [
        if (wakeText != null)
          _LegendItem(
            key: const Key('insights_legend_wake'),
            color: InsightsColors.wake,
            text: wakeText,
            isDashed: true,
          ),
        if (sleepText != null)
          _LegendItem(
            key: const Key('insights_legend_sleep'),
            color: InsightsColors.sleepLine,
            text: sleepText,
            isDashed: true,
          ),
        _LegendItem(
          key: const Key('insights_legend_shade'),
          color: InsightsColors.sleepShade,
          text: s.insights_sleep_shade,
        ),
      ],
    );
  }
}

class _LegendItem extends StatelessWidget {
  const _LegendItem({
    super.key,
    required this.color,
    required this.text,
    this.isDashed = false,
  });

  final Color color;
  final String text;
  final bool isDashed;

  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        isDashed
            ? Container(
                width: 18,
                height: 0,
                decoration: BoxDecoration(
                  border: Border(top: BorderSide(color: color, width: 2)),
                ),
              )
            : Container(
                width: 18,
                height: 10,
                decoration: BoxDecoration(
                  color: color,
                  borderRadius: BorderRadius.circular(2),
                ),
              ),
        const SizedBox(width: 6),
        Text(
          text,
          style: const TextStyle(
            fontSize: 12.5,
            color: InsightsColors.subtitle,
          ),
        ),
      ],
    );
  }
}