odoo_loyalty_app/lib/widgets/subscription_list_widget.dart

import 'package:flutter/material.dart';
import '../theme/app_theme.dart';

/// Compact "My Subscriptions" list — displayed on the home tab below the loyalty card.
/// Each row shows the subscription name, active/expired badge, validity period, and card code.
class SubscriptionListWidget extends StatelessWidget {
  final List<dynamic> subscriptions;

  const SubscriptionListWidget({super.key, required this.subscriptions});

  @override
  Widget build(BuildContext context) {
    if (subscriptions.isEmpty) return const SizedBox.shrink();

    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Padding(
          padding: const EdgeInsets.fromLTRB(16, 20, 16, 10),
          child: Text(
            'MY SUBSCRIPTIONS',
            style: Theme.of(context).textTheme.labelLarge?.copyWith(
                  color: AppTheme.onSurfaceVariant,
                  letterSpacing: 1.2,
                  fontSize: 11,
                ),
          ),
        ),
        Container(
          margin: const EdgeInsets.symmetric(horizontal: 16),
          decoration: const BoxDecoration(
            color: AppTheme.surfaceContainerLow,
          ),
          child: Column(
            children: List.generate(subscriptions.length, (index) {
              final sub = subscriptions[index];
              final isLast = index == subscriptions.length - 1;
              return _SubscriptionTile(sub: sub, isLast: isLast);
            }),
          ),
        ),
      ],
    );
  }
}

class _SubscriptionTile extends StatelessWidget {
  final dynamic sub;
  final bool isLast;

  const _SubscriptionTile({required this.sub, required this.isLast});

  /// Determine active/expired status from subscription_end_date.
  bool _isActive() {
    final endRaw = sub['subscription_end_date'];
    if (endRaw == null || endRaw == false) return true; // no end date = no expiry
    try {
      final endDate = DateTime.parse(endRaw.toString());
      return endDate.isAfter(DateTime.now());
    } catch (_) {
      return true;
    }
  }

  /// Format a date string (YYYY-MM-DD) to a readable label.
  String _formatDate(dynamic raw) {
    if (raw == null || raw == false) return '—';
    try {
      final dt = DateTime.parse(raw.toString());
      return '${dt.day.toString().padLeft(2, '0')} '
          '${_monthName(dt.month)} '
          '${dt.year}';
    } catch (_) {
      return raw.toString();
    }
  }

  String _monthName(int m) {
    const months = [
      'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
      'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'
    ];
    return months[m - 1];
  }

  @override
  Widget build(BuildContext context) {
    final programName = sub['program_id'] is List
        ? (sub['program_id'][1] as String? ?? 'Subscription')
        : 'Subscription';
    final code = sub['code'] as String? ?? '';
    final startDate = _formatDate(sub['subscription_start_date']);
    final endDate = _formatDate(sub['subscription_end_date']);
    final active = _isActive();

    return Container(
      decoration: BoxDecoration(
        border: isLast
            ? null
            : const Border(
                bottom: BorderSide(
                  color: AppTheme.surfaceContainer,
                  width: 1,
                ),
              ),
      ),
      padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          // Icon
          Container(
            padding: const EdgeInsets.all(10),
            decoration: BoxDecoration(
              color: active
                  ? AppTheme.secondaryContainer.withValues(alpha: 0.35)
                  : AppTheme.surfaceContainer,
              shape: BoxShape.rectangle,
            ),
            child: Icon(
              Icons.verified_rounded,
              size: 22,
              color: active ? AppTheme.secondary : AppTheme.outlineVariant,
            ),
          ),

          const SizedBox(width: 14),

          // Name + dates
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  programName,
                  style: Theme.of(context).textTheme.titleSmall?.copyWith(
                        fontWeight: FontWeight.bold,
                        color: AppTheme.onSurface,
                      ),
                ),
                const SizedBox(height: 3),
                Text(
                  '$startDate → $endDate',
                  style: Theme.of(context).textTheme.bodySmall?.copyWith(
                        color: AppTheme.onSurfaceVariant,
                      ),
                ),
                if (code.isNotEmpty) ...[
                  const SizedBox(height: 2),
                  Text(
                    code,
                    style: Theme.of(context).textTheme.bodySmall?.copyWith(
                          color: AppTheme.outlineVariant,
                          fontFamily: 'monospace',
                          fontSize: 11,
                        ),
                  ),
                ],
              ],
            ),
          ),

          const SizedBox(width: 8),

          // Active / Expired badge
          Container(
            padding: const EdgeInsets.symmetric(horizontal: 9, vertical: 4),
            decoration: BoxDecoration(
              color: active
                  ? const Color(0xFF1B5E20).withValues(alpha: 0.12)
                  : const Color(0xFFB02500).withValues(alpha: 0.10),
              borderRadius: BorderRadius.circular(4),
            ),
            child: Text(
              active ? 'ACTIVE' : 'EXPIRED',
              style: TextStyle(
                fontSize: 10,
                fontWeight: FontWeight.bold,
                letterSpacing: 0.8,
                color: active
                    ? const Color(0xFF2E7D32)
                    : const Color(0xFFB02500),
              ),
            ),
          ),
        ],
      ),
    );
  }
}