import 'package:flutter/material.dart';
import 'package:jiffy/jiffy.dart';
import 'package:provider/provider.dart';

import '../../../api/mhsl/customTimetableEvent/get/getCustomTimetableEventResponse.dart';
import '../../../model/timetable/timetableProps.dart';
import '../../../widget/centeredLeading.dart';
import '../../../widget/loadingSpinner.dart';
import '../../../widget/placeholderView.dart';
import 'appointmentDetails.dart';
import 'customTimetableEventEditDialog.dart';

class ViewCustomTimetableEvents extends StatefulWidget {
  const ViewCustomTimetableEvents({super.key});

  @override
  State<ViewCustomTimetableEvents> createState() => _ViewCustomTimetableEventsState();
}

class _ViewCustomTimetableEventsState extends State<ViewCustomTimetableEvents> {
  late Future<GetCustomTimetableEventResponse> events;

  @override
  void initState() {
    super.initState();
  }

  _openCreateDialog() {
    showDialog(
      context: context,
      builder: (context) => const CustomTimetableEventEditDialog(),
      barrierDismissible: false,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Eigene Termine'),
        actions: [
          IconButton(
            icon: const Icon(Icons.add),
            onPressed: _openCreateDialog,
          )
        ],
      ),
      body: Consumer<TimetableProps>(builder: (context, value, child) {
        if(value.primaryLoading()) return const LoadingSpinner();

        var listView = ListView(
          children: value.getCustomTimetableEventResponse.events.map((e) {
            return ListTile(
              title: Text(e.title),
              subtitle: Text("${e.rrule.isNotEmpty ? "wiederholdend, " : ""}beginnend ${Jiffy.parseFromDateTime(e.startDate).fromNow()}"),
              leading: CenteredLeading(Icon(e.rrule.isEmpty ? Icons.event_outlined : Icons.event_repeat_outlined)),
              trailing: Row(
                mainAxisSize: MainAxisSize.min,
                children: [
                  IconButton(
                    icon: const Icon(Icons.edit_outlined),
                    onPressed: () {
                      showDialog(context: context, builder: (context) => CustomTimetableEventEditDialog(existingEvent: e));
                    },
                  ),
                  IconButton(
                    icon: const Icon(Icons.delete_outline),
                    onPressed: () {
                      AppointmentDetails.deleteCustomEvent(context, e);
                    },
                  )
                ],
              ),
            );
          }).toList(),
        );

        var placeholder = PlaceholderView(
          icon: Icons.calendar_today_outlined,
          text: 'Keine Einträge vorhanden',
          button: TextButton(
            onPressed: _openCreateDialog,
            child: const Text('Termin erstellen'),
          ),
        );

        return RefreshIndicator(
          onRefresh: () {
            Provider.of<TimetableProps>(context, listen: false).run(renew: true);
            return Future.delayed(const Duration(seconds: 3));
          },
          child: value.getCustomTimetableEventResponse.events.isEmpty
            ? placeholder
            : listView
        );
      }),
    );
  }
}