import 'package:diacritic/diacritic.dart';
import 'package:flutter/material.dart';
import 'package:manager_app/Components/message_notification.dart';
import 'package:manager_app/Components/string_input_container.dart';
import 'package:manager_app/Models/managerContext.dart';
import 'package:manager_app/Screens/Configurations/listView_card_section.dart';
import 'package:manager_app/Screens/Configurations/new_section_popup.dart';
import 'package:manager_app/app_context.dart';
import 'package:manager_app/constants.dart';
import 'package:manager_api_new/api.dart';
import 'package:provider/provider.dart';

class SectionReorderList extends StatefulWidget {
  final String configurationId;
  final List<SectionDTO> sectionsIn;
  final ValueChanged<List<SectionDTO>> onChangedOrder;
  final Function askReload;
  const SectionReorderList({
    Key? key,
    required this.configurationId,
    required this.sectionsIn,
    required this.onChangedOrder,
    required this.askReload,
  }) : super(key: key);

  @override
  _SectionReorderListState createState() => _SectionReorderListState();
}

class _SectionReorderListState extends State<SectionReorderList> {
  late List<SectionDTO> sections;
  String filterSearch = '';

  @override
  void initState() {
    super.initState();
    sections = new List<SectionDTO>.from(widget.sectionsIn);
  }

  void _onReorder(int oldIndex, int newIndex) {
    setState(
        () {
          if (newIndex > oldIndex) {
            newIndex -= 1;
          }
          final SectionDTO item = sections.removeAt(oldIndex);
          sections.insert(newIndex, item);

          var i = 0;
          sections.forEach((section) {
            section.order = i;
            i++;
          });

          widget.onChangedOrder(sections);
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    final appContext = Provider.of<AppContext>(context);
    Size size = MediaQuery.of(context).size;

    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Row(
          children: [
            Expanded(
              child: StringInputContainer(
                label: "Recherche:",
                isSmall: true,
                fontSize: 15,
                fontSizeText: 15,
                onChanged: (String value) {
                  setState(() {
                    filterSearch = value;
                    filterResource();
                  });
                },
              ),
            ),
            const SizedBox(width: 8),
            InkWell(
              onTap: () async {
                var sectionToCreate = await showNewSection(widget.configurationId, appContext, context, false);
                if (sectionToCreate != null) {
                  ManagerAppContext managerAppContext = appContext.getContext();
                  sectionToCreate.instanceId = managerAppContext.instanceId;
                  sectionToCreate.isBeacon = false;
                  sectionToCreate.dateCreation = DateTime.now();
                  await managerAppContext.clientAPI!.sectionApi!.sectionCreate(sectionToCreate);
                  showNotification(kSuccess, kWhite, 'La section a été créée avec succès !', context, null);
                  widget.askReload();
                }
              },
              child: Container(
                height: 36,
                width: 36,
                decoration: BoxDecoration(
                  color: kSuccess,
                  shape: BoxShape.rectangle,
                  borderRadius: BorderRadius.circular(20.0),
                  boxShadow: [
                    BoxShadow(
                      color: kSecond,
                      spreadRadius: 0.5,
                      blurRadius: 5,
                      offset: Offset(0, 1.5),
                    ),
                  ],
                ),
                child: const Icon(
                  Icons.add,
                  color: kTextLightColor,
                  size: 20.0,
                ),
              ),
            ),
          ],
        ),
        const SizedBox(height: 8),
        SizedBox(
          height: size.height * 0.3,
          child: ReorderableListView.builder(
            itemCount: sections.length,
            onReorder: _onReorder,
            scrollDirection: Axis.horizontal,
            padding: const EdgeInsets.symmetric(vertical: 8.0),
            itemBuilder: (context, index) {
              return ListViewCardSections(
                sections,
                index,
                Key('$index'),
                false,
                appContext,
                (section) {
                  WidgetsBinding.instance.addPostFrameCallback((_) {
                    setState(() {
                      ManagerAppContext managerAppContext = appContext.getContext();
                      managerAppContext.selectedSection = section;
                      appContext.setContext(managerAppContext);
                    });
                  });
                },
              );
            },
          ),
        ),
      ],
    );
  }

  void filterResource() {
    sections = filterSearch.isEmpty ? widget.sectionsIn: widget.sectionsIn.where((SectionDTO section) => removeDiacritics(section.label!.toUpperCase()).contains(removeDiacritics(filterSearch.toUpperCase()))).toList();
  }
}