import 'package:flutter/material.dart';
import '../../../theme/etm_tokens.dart';
import '../models/dashboard_models.dart';
import '../painters/day_plan_painter.dart';

class DayPlanCard extends StatelessWidget {
  const DayPlanCard({super.key});

  @override
  Widget build(BuildContext context) {
    final plan = DayPlan.demo();
    final isDark = Theme.of(context).brightness == Brightness.dark;

    return Container(
      decoration: BoxDecoration(
        color: EtmTokens.surfaceOf(context),
        borderRadius: BorderRadius.circular(EtmTokens.radiusCard),
        boxShadow: EtmTokens.cardShadowOf(context),
      ),
      padding: const EdgeInsets.fromLTRB(16, 16, 16, 12),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text('Plan de la journée',
                  style: EtmTokens.sans(
                      size: 15,
                      weight: FontWeight.w600,
                      color: EtmTokens.inkOf(context))),
              Text("aujourd'hui",
                  style: EtmTokens.sans(
                      size: 12, color: EtmTokens.mutedOf(context))),
            ],
          ),
          const SizedBox(height: 12),
          SizedBox(
            height: 180,
            child: CustomPaint(
              painter: DayPlanPainter(
                plan: plan,
                surfaceColor: EtmTokens.surfaceOf(context),
                lineColor: EtmTokens.lineOf(context),
                inkColor: EtmTokens.inkOf(context),
                mutedColor: EtmTokens.mutedOf(context),
                isDark: isDark,
              ),
              size: const Size(double.infinity, 180),
            ),
          ),
          const SizedBox(height: 12),
          _Legend(context: context),
        ],
      ),
    );
  }
}

class _Legend extends StatelessWidget {
  final BuildContext context;
  const _Legend({required this.context});

  @override
  Widget build(BuildContext _) {
    final items = [
      ('Maison', EtmTokens.solToHouse),
      ('ECS', EtmTokens.solToEcs),
      ('VE', EtmTokens.solToVe),
      ('Batterie', EtmTokens.solToBatt),
      ('Réseau', EtmTokens.solToGrid),
      ('Batt.→maison', EtmTokens.battToHouse),
    ];
    return Wrap(
      spacing: 12,
      runSpacing: 6,
      children: items.map((e) {
        return Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            Container(
              width: 10, height: 10,
              decoration: BoxDecoration(
                color: e.$2,
                borderRadius: BorderRadius.circular(2),
              ),
            ),
            const SizedBox(width: 4),
            Text(e.$1,
                style: EtmTokens.sans(
                    size: 10, color: EtmTokens.mutedOf(context))),
          ],
        );
      }).toList(),
    );
  }
}