import 'dart:convert';
import 'dart:typed_data';
import 'package:flutter/material.dart';
import '../theme/app_theme.dart';
import '../screens/promo_detail_screen.dart';

/// Horizontal scrollable row of promo highlight cards.
/// Tapping a card opens the full detail screen with rich text content.
class PromoCardRow extends StatelessWidget {
  final List<dynamic> promos;

  const PromoCardRow({super.key, required this.promos});

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

    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Padding(
          padding: const EdgeInsets.fromLTRB(16, 0, 16, 12),
          child: Text(
            'Promo Highlights',
            style: Theme.of(context).textTheme.titleMedium,
          ),
        ),
        SizedBox(
          height: 180,
          child: ListView.builder(
            scrollDirection: Axis.horizontal,
            padding: const EdgeInsets.symmetric(horizontal: 16),
            itemCount: promos.length,
            itemBuilder: (context, index) {
              final promo = promos[index];
              return _PromoCard(promo: promo);
            },
          ),
        ),
      ],
    );
  }
}

class _PromoCard extends StatelessWidget {
  final dynamic promo;
  const _PromoCard({required this.promo});

  @override
  Widget build(BuildContext context) {
    final base64Img = promo['image_128'] as String?;
    final title = promo['name'] as String? ?? '';

    Widget imageWidget;
    if (base64Img != null && base64Img.isNotEmpty) {
      try {
        final Uint8List bytes = base64Decode(base64Img);
        imageWidget = Image.memory(bytes, fit: BoxFit.cover,
            width: double.infinity, height: 110);
      } catch (_) {
        imageWidget = _imagePlaceholder();
      }
    } else {
      imageWidget = _imagePlaceholder();
    }

    return GestureDetector(
      onTap: () {
        Navigator.push(
          context,
          MaterialPageRoute(builder: (_) => PromoDetailScreen(promo: promo)),
        );
      },
      child: Container(
        width: 140,
        margin: const EdgeInsets.only(right: 12),
        decoration: const BoxDecoration(
          color: AppTheme.surfaceContainerLow,
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            SizedBox(
              height: 110,
              width: double.infinity,
              child: ClipRect(child: imageWidget),
            ),
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: Text(
                title,
                style: Theme.of(context).textTheme.labelLarge?.copyWith(
                  color: AppTheme.onSurface,
                  fontWeight: FontWeight.bold,
                ),
                maxLines: 2,
                overflow: TextOverflow.ellipsis,
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _imagePlaceholder() {
    return Container(
      color: AppTheme.surfaceContainer,
      child: const Center(
        child: Icon(Icons.local_offer_rounded, size: 32, color: AppTheme.outlineVariant),
      ),
    );
  }
}