import 'package:app_popup_menu/app_popup_menu.dart';
import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter/src/widgets/placeholder.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:fluttericon/font_awesome_icons.dart';
import 'package:unit2/bloc/profile/profile_bloc.dart';
import 'package:unit2/bloc/user/user_bloc.dart';
import 'package:unit2/model/profile/eligibility.dart';
import 'package:unit2/screens/profile/components/eligibility/edit_modal.dart';
import 'package:unit2/theme-data.dart/box_shadow.dart';
import 'package:unit2/theme-data.dart/colors.dart';
import 'package:unit2/utils/alerts.dart';
import 'package:unit2/utils/global.dart';
import 'package:unit2/utils/text_container.dart';
import 'package:unit2/widgets/add_leading.dart';
import 'package:unit2/widgets/empty_data.dart';

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

  @override
  State<EligibiltyScreen> createState() => _EligibiltyScreenState();
}

class _EligibiltyScreenState extends State<EligibiltyScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: const Text(elibilityScreenTitle),
          centerTitle: true,
          backgroundColor: primary,
          actions: context.read()[AddLeading(
            onPressed: () => () {},
          )],
        ),
        body: BlocBuilder<UserBloc, UserState>(
          builder: (context, state) {
            return BlocBuilder<ProfileBloc, ProfileState>(
              builder: (context, state) {
                if(state is EligibilityLoaded){
return ListView.builder(
                    padding:
                        const EdgeInsets.symmetric(vertical: 8, horizontal: 10),
                    itemCount: state.eligibilities.length,
                    itemBuilder: (BuildContext context, int index) {
                      String title =
                          state.eligibilities[index].eligibility!.title!;
                      return Column(
                        mainAxisAlignment: MainAxisAlignment.start,
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Container(
                            width: screenWidth,
                            padding: const EdgeInsets.symmetric(
                                horizontal: 12, vertical: 8),
                            decoration: box1(),
                            child: Row(
                              children: [
                                Expanded(
                                  child: Column(
                                      mainAxisAlignment:
                                          MainAxisAlignment.start,
                                      crossAxisAlignment:
                                          CrossAxisAlignment.start,
                                      children: [
                                        Text(
                                          title,
                                          style: Theme.of(context)
                                              .textTheme
                                              .titleMedium!
                                              .copyWith(
                                                  fontWeight: FontWeight.w500),
                                        ),
                                        const Divider(),
                                        const SizedBox(
                                          height: 5,
                                        ),
                                        Text(
                                            "$licenseNumber: ${state.eligibilities[index].licenseNumber == null ? 'N/A' : state.eligibilities[index].licenseNumber.toString()}",
                                            style: Theme.of(context)
                                                .textTheme
                                                .titleSmall),
                                        const SizedBox(
                                          height: 3,
                                        ),
                                        Text(
                                            " : ${state.eligibilities[index].rating ?? 'N/A'}.",
                                            style: Theme.of(context)
                                                .textTheme
                                                .titleSmall)
                                      ]),
                                ),
                                AppPopupMenu<int>(
                                  offset: const Offset(-10, -10),
                                  elevation: 3,
                                  onSelected: (value) {
                                    // if (value == 1) {
                                    //   confirmAlert(context, () => null,
                                    //       "Delete?", "Confirm Delete?");
                                    // }
                                    // if (value == 2) {
                                    //   context.read<ProfileBloc>().add(
                                    //       EditEligibility(
                                    //           eligibityCert: widget
                                    //               .eligibilities[index]));
                                    // }
                                  },
                                  menuItems: [
                                    PopupMenuItem(
                                      value: 1,
                                      child: Row(
                                        children: const [
                                          Icon(
                                            Icons.delete,
                                          ),
                                          SizedBox(
                                            width: 10,
                                          ),
                                          Text(
                                            'Delete',
                                          ),
                                        ],
                                      ),
                                    ),
                                    PopupMenuItem(
                                      value: 2,
                                      child: Row(
                                        children: const [
                                          Icon(
                                            Icons.edit,
                                          ),
                                          SizedBox(
                                            width: 10,
                                          ),
                                          Text(
                                            'Edit',
                                          ),
                                        ],
                                      ),
                                    ),
                                    PopupMenuItem(
                                      value: 2,
                                      child: Row(
                                        children: const [
                                          Icon(
                                            FontAwesome.attach,
                                          ),
                                          SizedBox(
                                            width: 10,
                                          ),
                                          Text(
                                            'Attachment',
                                          ),
                                        ],
                                      ),
                                    ),
                                  ],
                                  icon: const Icon(
                                    Icons.more_vert,
                                    color: Colors.grey,
                                  ),
                                  tooltip: "Options",
                                )
                              ],
                            ),
                          ),
                          const SizedBox(
                            height: 5,
                          )
                        ],
                      );
                    });
                }
                return Container();
              },
            );
          },
        ));
  }
}