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

import '../controller/home_controller.dart';
import '../models/kauf_filament_model.dart';
import '../theme/app_theme.dart';
import 'filament_card.dart';

/// A lazy list section for both the shared mobile scroll and the desktop pane.
class FilamentInventory extends StatelessWidget {
  const FilamentInventory({
    super.key,
    required this.controller,
    required this.onOpen,
    required this.onAction,
  });

  final HomeController controller;
  final ValueChanged<KaufFilamentModel> onOpen;
  final void Function(String, KaufFilamentModel) onAction;

  @override
  Widget build(BuildContext context) {
    return DecoratedSliver(
      decoration: BoxDecoration(
        color: AppTheme.inventorySurface,
        borderRadius: BorderRadius.circular(24),
      ),
      sliver: SliverPadding(
        padding: const EdgeInsets.all(24),
        sliver: Obx(() {
          final filamente = controller.filamente.toList();
          final verbrauch = Map<String, double>.from(controller.verbrauch);
          final total = filamente.fold<double>(
            0,
            (sum, item) => sum + item.preis,
          );
          return SliverMainAxisGroup(
            slivers: [
              SliverToBoxAdapter(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const Row(
                      children: [
                        Icon(
                          Icons.inventory_2_outlined,
                          color: Color(0xFF79D7C6),
                          size: 21,
                        ),
                        SizedBox(width: 10),
                        Flexible(
                          child: Text(
                            'DEIN BESTAND',
                            style: TextStyle(
                              color: Color(0xFF79D7C6),
                              fontSize: 12,
                              fontWeight: FontWeight.w700,
                              letterSpacing: 1.4,
                            ),
                          ),
                        ),
                      ],
                    ),
                    const SizedBox(height: 14),
                    const Text(
                      'Filamentübersicht',
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 25,
                        fontWeight: FontWeight.w700,
                      ),
                    ),
                    const SizedBox(height: 6),
                    const Text(
                      'Deine Einkäufe, die neuesten zuerst.',
                      style: TextStyle(color: Color(0xFFB9CCD9), height: 1.5),
                    ),
                    const SizedBox(height: 20),
                    Wrap(
                      spacing: 12,
                      runSpacing: 12,
                      children: [
                        _InventoryStat(
                          label: 'Filamente',
                          value: '${filamente.length}',
                        ),
                        _InventoryStat(
                          label: 'Gesamtausgaben',
                          value: NumberFormat.currency(
                            locale: 'de_AT',
                            symbol: '€',
                          ).format(total),
                        ),
                      ],
                    ),
                    const SizedBox(height: 24),
                  ],
                ),
              ),
              if (filamente.isEmpty)
                const SliverToBoxAdapter(
                  child: Padding(
                    padding: EdgeInsets.symmetric(vertical: 36),
                    child: Column(
                      children: [
                        Icon(
                          Icons.inventory_2_outlined,
                          size: 48,
                          color: Color(0xFF79D7C6),
                        ),
                        SizedBox(height: 16),
                        Text(
                          'Hier beginnt dein Bestand',
                          textAlign: TextAlign.center,
                          style: TextStyle(
                            color: Colors.white,
                            fontSize: 18,
                            fontWeight: FontWeight.w600,
                          ),
                        ),
                        SizedBox(height: 8),
                        Text(
                          'Erfasse deinen ersten Einkauf.\nDeine Filamente erscheinen dann hier.',
                          textAlign: TextAlign.center,
                          style: TextStyle(
                            color: Color(0xFFB9CCD9),
                            height: 1.6,
                          ),
                        ),
                      ],
                    ),
                  ),
                )
              else
                SliverList.separated(
                  itemCount: filamente.length,
                  separatorBuilder: (context, index) =>
                      const SizedBox(height: 12),
                  itemBuilder: (context, index) {
                    final filament = filamente[index];
                    return FilamentCard(
                      key: ValueKey(filament.filamentId),
                      filament: filament,
                      verbrauchGramm: verbrauch[filament.filamentId] ?? 0,
                      onTap: () => onOpen(filament),
                      onAction: (action) => onAction(action, filament),
                    );
                  },
                ),
            ],
          );
        }),
      ),
    );
  }
}

class _InventoryStat extends StatelessWidget {
  const _InventoryStat({required this.label, required this.value});
  final String label;
  final String value;

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
      decoration: BoxDecoration(
        color: const Color(0xFF243E50),
        borderRadius: BorderRadius.circular(12),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            label,
            style: const TextStyle(color: Color(0xFFB9CCD9), fontSize: 12),
          ),
          const SizedBox(height: 4),
          Text(
            value,
            style: const TextStyle(
              color: Colors.white,
              fontSize: 20,
              fontWeight: FontWeight.w700,
            ),
          ),
        ],
      ),
    );
  }
}