import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_application_1/enums.dart';
import 'package:flutter_application_1/translations.dart';

// Widget zur Auswahl des Ausschüttungsintervalls
class IntervalWidget extends StatefulWidget {
  final String selectedInterval;
  final Function(String) onChanged;

  const IntervalWidget({super.key, required this.selectedInterval, required this.onChanged});

  @override
  // ignore: library_private_types_in_public_api
  _IntervalWidgetState createState() => _IntervalWidgetState();
}

class _IntervalWidgetState extends State<IntervalWidget> {
  bool isExpanded = false;

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        // Überschrift für das Dropdown-Menü
        const Row(
          children: [
            Text(
              'Ausschüttungsintervall',
              style: TextStyle(
                fontWeight: FontWeight.bold,
                fontSize: 16,
              ),
            ),
            SizedBox(width: 5),
            Tooltip(
              message: 'Das Ausschüttungsintervall bezieht sich darauf, wie oft die Erträge aus Ihrer Investition ausgeschüttet werden.',
              triggerMode: TooltipTriggerMode.tap,
              decoration: BoxDecoration(
                color: CupertinoColors.black,
                borderRadius: BorderRadius.all(Radius.circular(5))
              ),
              textStyle: TextStyle(
                color: CupertinoColors.white,
              ),
              margin: EdgeInsets.all(20),
              child: Icon(CupertinoIcons.question_circle_fill, size: 15),
            ),
          ]
        ),
        // Dropdown-Menü
        CupertinoTextField(
          placeholder: 'Ausschüttungsintervall auswählen',
          readOnly: true,
          onTap: () {
            showModalBottomSheet(
              context: context,
              backgroundColor: CupertinoColors.white,
              builder: (BuildContext context) {
                return Column(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    // Liste von Auswahlmöglichkeiten
                    Padding(
                      padding: const EdgeInsets.symmetric(vertical: 8.0),
                      child: ListTile(
                        title: Text(
                          translateInterval(PayoutInterval.yearly),
                          style: const TextStyle(
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                        hoverColor: Colors.transparent,
                        trailing: widget.selectedInterval == translateInterval(PayoutInterval.yearly) ? const Icon(CupertinoIcons.checkmark_alt) : null,
                        onTap: () {
                           // Auswahl des jährlichen Intervalls und Schließen des Bottom Sheets
                          widget.onChanged(translateInterval(PayoutInterval.yearly));
                          Navigator.pop(context);
                        },
                      ),
                    ),
                    Padding(
                      padding: const EdgeInsets.symmetric(vertical: 8.0),
                      child: ListTile(
                        title: Text(
                          translateInterval(PayoutInterval.monthly),
                          style: const TextStyle(
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                        hoverColor: Colors.transparent,
                        trailing: widget.selectedInterval == translateInterval(PayoutInterval.monthly) ? const Icon(CupertinoIcons.checkmark_alt) : null,
                        onTap: () {
                          // Auswahl des monatlichen Intervalls und Schließen des Bottom Sheets
                          widget.onChanged(translateInterval(PayoutInterval.monthly));
                          Navigator.pop(context);
                        },
                      ),
                    ),
                  ],
                );
              },
            ).then((value) {
              setState(() {
                isExpanded = false;
              });
            });
            setState(() {
              isExpanded = true;
            });
          },
          suffix: Padding(
            padding: const EdgeInsets.symmetric(horizontal: 5.0),
            child: Icon(isExpanded ? Icons.keyboard_arrow_up : Icons.keyboard_arrow_down),
          ),
          controller: TextEditingController(text: widget.selectedInterval),
          decoration: BoxDecoration(
            color: CupertinoColors.extraLightBackgroundGray,
            borderRadius: BorderRadius.circular(5),
          ),
          cursorColor: CupertinoColors.black,
        ),
        const SizedBox(height: 20),
      ],
    );
  }
}