import 'package:basic_utils/basic_utils.dart';
import 'package:ernaehrung/android/components/card/card_data_food_component.dart';
import 'package:ernaehrung/android/components/card/card_title_component.dart';
import 'package:ernaehrung/android/config/cast_helper.dart';
import 'package:flutter/material.dart';
import '../../pages/nav_pages/search_food.dart';

class CardComponent extends StatelessWidget {
  final String title;
  final List<dynamic> foods;

  const CardComponent(this.title, this.foods, {super.key});

  Route createRoute(String cardName) {
    return PageRouteBuilder(
      pageBuilder: (context, animation, secondaryAnimation) =>
          SearchFoodPage(cardName),
      transitionsBuilder: (context, animation, secondaryAnimation, child) {
        const begin = Offset(0.0, 1.0);
        const end = Offset.zero;
        const curve = Curves.ease;

        var tween =
        Tween(begin: begin, end: end).chain(CurveTween(curve: curve));

        return SlideTransition(
          position: animation.drive(tween),
          child: child,
        );
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return Container(
        height: 300,
        decoration: BoxDecoration(
          color: const Color(0xFF6E7BFB),
          borderRadius: const BorderRadius.all(Radius.circular(16)),
          border: Border.all(
            color: Colors.black,
          ),
        ),
        margin: const EdgeInsets.fromLTRB(0, 16, 0, 16),
        child: Column(
          children: [
            CardTitleComponent(
                StringUtils.capitalize(title), "${castDynamicToListFood(foods).length} Kalorien"),
            CardDataFoodComponent(
              castDynamicToListFood(foods)
            ),
            Padding(
              padding: const EdgeInsets.symmetric(vertical: 0, horizontal: 8),
              child: Container(
                margin: const EdgeInsets.fromLTRB(0, 8, 0, 0),
                child: ElevatedButton(
                  style: ElevatedButton.styleFrom(
                    minimumSize: const Size.fromHeight(40), //
                    backgroundColor: const Color(0xFFffffff),
                    foregroundColor: const Color(0xFF6E7BFB),
                    shape: const StadiumBorder(),
                  ),
                  onPressed: () async {
                    Navigator.of(context).push(createRoute(title));
                  },
                  child: Text('Text Of Button'),
                ),
              ),
            )
          ],
        ));
  }
}