import 'package:ernaehrung/android/components/circular/circular_component.dart';
import 'package:ernaehrung/android/components/circular/line_circular_with_text_component.dart';
import 'package:ernaehrung/android/config/statistics.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class StatisticsPercentage extends StatelessWidget {
  final double heightStatisticsContainer = 220.0;
  final double widthStatisticsContainer = double.infinity;

  const StatisticsPercentage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {;
    return Container(
      decoration:
          BoxDecoration(border: Border.all(width: 2.0, color: Colors.black)),
      height: heightStatisticsContainer,
      padding: const EdgeInsets.symmetric(vertical: 16, horizontal: 0),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          const Expanded(
            child: SizedBox(
              child: Padding(
                padding: EdgeInsets.symmetric(vertical: 0, horizontal: 8),
                child: FittedBox(
                  child: CircularLoadingComponent(),
                ),
              ),
            ),
          ),
          Expanded(
            child: ValueListenableBuilder<List<double>>(
              valueListenable: StatisticsService.instance.ingredients,
              builder: (context, value, child) {
                print(value);
                return Column(
                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                  children: [
                    // TODO adjust 200 to values from user box
                    LineCircularWiTextComponent(
                        Colors.lightGreen, value[0], 200, "Fat (g)"),
                    LineCircularWiTextComponent(
                        Colors.lightGreen, value[1], 200, "Protein (g)"),
                    LineCircularWiTextComponent(
                        Colors.lightGreen, value[2], 200, "Carbohydrate (g)"),
                  ],
                );
              },
            ),
          )
        ],
      ),
    );
  }
}