import 'dart:convert';

import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';
import 'package:manager_app/Components/color_picker_input_container.dart';
import 'package:manager_app/Components/common_loader.dart';
import 'package:manager_app/Components/confirmation_dialog.dart';
import 'package:manager_app/Components/message_notification.dart';
import 'package:manager_app/Components/multi_select_dropdown_language_container.dart';
import 'package:manager_app/Components/multi_string_input_container.dart';
import 'package:manager_app/Components/reorderable_custom_list.dart';
import 'package:manager_app/Components/resource_input_container.dart';
import 'package:manager_app/Components/segmented_enum_input_container.dart';
import 'package:manager_app/Components/single_choice_input_container.dart';
import 'package:manager_app/Models/managerContext.dart';
import 'package:manager_app/Screens/Applications/add_configuration_link_popup.dart';
import 'package:manager_app/Screens/Applications/phone_mockup.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 AppConfigurationLinkScreen extends StatefulWidget {
  final ApplicationInstanceDTO applicationInstanceDTO;
  AppConfigurationLinkScreen({Key? key, required this.applicationInstanceDTO}) : super(key: key);

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

class _AppConfigurationLinkScreenState extends State<AppConfigurationLinkScreen> {
  @override
  Widget build(BuildContext context) {
    final appContext = Provider.of<AppContext>(context);
    Size size = MediaQuery.of(context).size;
    ManagerAppContext managerAppContext = appContext.getContext() as ManagerAppContext;

    _generalInfoCard() {

      var elementWidth = 400.0;
      var elementHeight = 125.0;

      return Card(
        margin: const EdgeInsets.symmetric(vertical: 8),
        color: kWhite,
        elevation: 0,
        child: Padding(
          padding: const EdgeInsets.all(16),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text("Informations générales", style: TextStyle(fontWeight: FontWeight.w500, fontSize: 21)),
              SizedBox(height: 8),
              Expanded(
                child: Center(
                  child: SingleChildScrollView(
                    child: Wrap(
                      alignment: WrapAlignment.center,
                      crossAxisAlignment: WrapCrossAlignment.center,
                      runAlignment: WrapAlignment.center,
                      spacing: 16,
                      runSpacing: 16,
                      children: [
                        // Image principale
                        Container(
                          width: elementWidth,
                          height: elementHeight,
                          child: Center(
                            child: ResourceInputContainer(
                              label: "Image principale :",
                              initialValue: widget.applicationInstanceDTO.mainImageId,
                              color: kPrimaryColor,
                              imageFit: BoxFit.fitHeight,
                              onChanged: (ResourceDTO resource) async {
                                if(resource.id == null) {
                                  widget.applicationInstanceDTO.mainImageId = null;
                                  widget.applicationInstanceDTO.mainImageUrl = null;
                                } else {
                                  widget.applicationInstanceDTO.mainImageId = resource.id;
                                  widget.applicationInstanceDTO.mainImageUrl = resource.url;
                                }

                                // automatic save
                                var applicationLink = await updateApplicationInstance(appContext, widget.applicationInstanceDTO);
                                if(applicationLink != null) {
                                  showNotification(kSuccess, kWhite, "Application mobile mise à jour succès", context, null);
                                  setState(() {

                                  });
                                }
                              },
                            ),
                          ),
                        ),
                        // Image Loader
                        Container(
                          width: elementWidth,
                          height: elementHeight,
                          child: Center(
                            child: ResourceInputContainer(
                              label: "Loader :",
                              initialValue: widget.applicationInstanceDTO.loaderImageId,
                              color: kPrimaryColor,
                              imageFit: BoxFit.fitHeight,
                              onChanged: (ResourceDTO resource) async {
                                if(resource.id == null) {
                                  widget.applicationInstanceDTO.loaderImageId = null;
                                  widget.applicationInstanceDTO.loaderImageUrl = null;
                                } else {
                                  widget.applicationInstanceDTO.loaderImageId = resource.id;
                                  widget.applicationInstanceDTO.loaderImageUrl = resource.url;
                                }

                                // automatic save
                                var applicationLink = await updateApplicationInstance(appContext, widget.applicationInstanceDTO);
                                if(applicationLink != null) {
                                  showNotification(kSuccess, kWhite, "Application mobile mise à jour succès", context, null);
                                  setState(() {

                                  });
                                }
                              },
                            ),
                          ),
                        ),
                        // Primary color
                        Container(
                          width: elementWidth,
                          height: elementHeight,
                          child: Center(
                            child: ColorPickerInputContainer(
                              label: "Couleur principale :",
                              fontSize: 20,
                              color: widget.applicationInstanceDTO.primaryColor,
                              onChanged: (value) async {
                                widget.applicationInstanceDTO.primaryColor = value;
                                // automatic save
                                var applicationLink = await updateApplicationInstance(appContext, widget.applicationInstanceDTO);
                                if(applicationLink != null) {
                                  showNotification(kSuccess, kWhite, "Application mobile mise à jour succès", context, null);
                                  setState(() {

                                  });
                                }
                              },
                            ),
                          ),
                        ),
                        // Secondary color
                        SizedBox(
                          width: elementWidth,
                          height: elementHeight,
                          child: Center(
                            child: ColorPickerInputContainer(
                              label: "Couleur secondaire :",
                              fontSize: 20,
                              color: widget.applicationInstanceDTO.secondaryColor,
                              onChanged: (value) async {
                                widget.applicationInstanceDTO.secondaryColor = value;
                                // automatic save
                                var applicationLink = await updateApplicationInstance(appContext, widget.applicationInstanceDTO);
                                if(applicationLink != null) {
                                  showNotification(kSuccess, kWhite, "Application mobile mise à jour succès", context, null);
                                  setState(() {

                                  });
                                }
                              },
                            ),
                          ),
                        ),
                        // Layout (Grid or Mansonry)
                        SizedBox(
                            width: elementWidth,
                            height: elementHeight,
                            child: Center(
                              child: SegmentedEnumInputContainer(
                                label: "Affichage :",
                                selected: LayoutMainPageType.MasonryGrid,
                                values: LayoutMainPageType.values,
                                inputValues: { LayoutMainPageType.SimpleGrid: {'label': 'Grille', 'icon': Icons.grid_view}, LayoutMainPageType.MasonryGrid : {'label': 'Masonry', 'icon': Icons.view_quilt }},
                                onChanged: (value) async {
                                  var tempOutput = value;
                                  widget.applicationInstanceDTO.layoutMainPage = tempOutput;
                                  // automatic save
                                  var applicationLink = await updateApplicationInstance(appContext, widget.applicationInstanceDTO);
                                  if(applicationLink != null) {
                                    showNotification(kSuccess, kWhite, "Application mobile mise à jour succès", context, null);
                                    setState(() {

                                    });
                                  }
                                  //print(configurationDTO.languages);
                                },
                              ),
                            )
                        ),
                        // Langues
                        SizedBox(
                          width: elementWidth,
                          height: elementHeight,
                          child: Center(
                            child: MultiSelectDropdownLanguageContainer(
                              label: "Langues :",
                              initialValue: widget.applicationInstanceDTO.languages != null ? widget.applicationInstanceDTO.languages!: [],
                              values: languages,
                              isMultiple: true,
                              fontSize: 20,
                              isAtLeastOne: true,
                              onChanged: (value) async {
                                var tempOutput = new List<String>.from(value);
                                widget.applicationInstanceDTO.languages = tempOutput;
                                // automatic save
                                var applicationLink = await updateApplicationInstance(appContext, widget.applicationInstanceDTO);
                                if(applicationLink != null) {
                                  showNotification(kSuccess, kWhite, "Application mobile mise à jour succès", context, null);
                                  setState(() {

                                  });
                                }
                                //print(configurationDTO.languages);
                              },
                            ),
                          ),
                        ),
                        // Highlight / Event principal
                        Container(
                          width: elementWidth,
                          height: elementHeight,
                          child: Center(
                            child: FutureBuilder(
                              future: getSectionEvents(appContext, widget.applicationInstanceDTO),
                              builder: (context, snapshot) {
                                var rawList = snapshot.data;
                                var rawSubsections = jsonDecode(jsonEncode(snapshot.data));
                                rawSubsections = rawSubsections?.map((json) => SectionEventDTO.fromJson(json)).toList();
                                List<SectionEventDTO>? sectionEvents = rawSubsections?.whereType<SectionEventDTO>().toList();
                                sectionEvents = sectionEvents == null ? [] : sectionEvents;

                                sectionEvents.add(SectionEventDTO(id: null, label: "Aucun"));

                                return SingleChoiceInputContainer<SectionEventDTO?>(
                                  label: "Evènement à l'affiche :",
                                  selectLabel: "Choisir un évènement",
                                  selected: widget.applicationInstanceDTO.sectionEventDTO,
                                  values: sectionEvents.toList(),
                                  onChanged: (SectionEventDTO? sectionEvent) async {
                                    if(sectionEvent == null) {
                                      widget.applicationInstanceDTO.sectionEventId = null;
                                      widget.applicationInstanceDTO.sectionEventDTO = null;
                                      return;
                                    }
                                    print("Sélectionné: $sectionEvent");
                                    print(sectionEvent.label);
                                    print(sectionEvent.id);
                                    widget.applicationInstanceDTO.sectionEventId = sectionEvent.id;

                                    // automatic save
                                    var applicationLink = await updateApplicationInstance(appContext, widget.applicationInstanceDTO);
                                    if(applicationLink != null) {
                                      showNotification(kSuccess, kWhite, "Application mobile mise à jour succès", context, null);
                                      setState(() {

                                      });
                                    }
                                  },
                                );
                              }
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
              )
            ],
          ),
        ),
      );
    }

    _phoneConfigCard(List<AppConfigurationLinkDTO>? appConfigurationLinks) {
      return Card(
        margin: const EdgeInsets.symmetric(vertical: 8),
        color: kWhite,
        elevation: 0,
        child: Stack(
          //crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Padding(
              padding: const EdgeInsets.all(16),
              child: Text("Configurations sur le téléphone", style: TextStyle(fontWeight: FontWeight.w500, fontSize: 21)),
            ),
            appConfigurationLinks != null ? Padding(
              padding: const EdgeInsets.only(left: 32, right: 32, top: 75),
              child: Container(
                height: size.height * 0.6,
                width: size.width * 0.8,
                constraints: BoxConstraints(
                    minHeight: 300,
                    minWidth: 300,
                    maxHeight: 500
                ),
                //color: Colors.blue,
                child: SingleChildScrollView(
                  child: ReorderableCustomList<AppConfigurationLinkDTO>(
                    items: appConfigurationLinks,
                    shrinkWrap: true,
                    onChanged: (updatedList) async {
                      int order = 0;
                      // update order manually
                      for(var item in updatedList) {
                        item.order = order;
                        order++;
                      }
                      // TODO use order put method
                      var result = await updateAppConfigurationOrder(appContext, updatedList);
                      setState(() {
                        // for refresh
                        showNotification(kSuccess, kWhite, "Application mobile mise à jour succès", context, null);
                      });
                    },
                    actions: [
                      /*(BuildContext context, int index, AppConfigurationLinkDTO link) {
                                          return Container(
                                            height: 50,
                                            width: 50,
                                            child: InkWell(
                                              onTap: () async {
                                                try {
                                                  var applicationInstance = widget.applicationInstanceDTO;
                                                  applicationInstance.
                                                  var applicationLink = await updateApplicationInstance(appContext, widget.applicationInstanceDTO);
                                                  if(applicationLink != null) {
                                                    if(newValue) {
                                                      showNotification(kSuccess, kWhite, "Configuration activée avec succès", context, null);
                                                    } else {
                                                      showNotification(kSuccess, kWhite, "Configuration désactivée avec succès", context, null);
                                                    }
                                                    setState(() {
                                                      link.isActive = applicationLink.isActive;
                                                    });
                                                  }
                                                } catch (e) {
                                                  showNotification(kError, kWhite, "Une erreur est survenue", context, null);
                                                }
                                              },
                                              child: Icon(Icons.star, color: kError, size: 25),
                                            ),
                                          );
                                        },*/
                          (BuildContext context, int index, AppConfigurationLinkDTO link) {
                        return Container(
                          height: 50,
                          width: 70,
                          child: Switch(
                            activeThumbColor: kPrimaryColor,
                            inactiveThumbColor: kBodyTextColor,
                            inactiveTrackColor: kSecond,
                            hoverColor: kPrimaryColor.withValues(alpha: 0.2),
                            value: link.isActive ?? false,
                            onChanged: (bool newValue) async {
                              try {
                                link.isActive = newValue;
                                var applicationLink = await updateApplicationLink(appContext, link);
                                if(applicationLink != null) {
                                  if(newValue) {
                                    showNotification(kSuccess, kWhite, "Configuration activée avec succès", context, null);
                                  } else {
                                    showNotification(kSuccess, kWhite, "Configuration désactivée avec succès", context, null);
                                  }
                                  setState(() {
                                    link.isActive = applicationLink.isActive;
                                  });
                                }
                              } catch (e) {
                                showNotification(kError, kWhite, "Une erreur est survenue", context, null);
                              }
                            },
                          ),
                        );
                      },
                          (BuildContext context, int index, AppConfigurationLinkDTO link) {
                        return Container(
                          height: 50,
                          width: 50,
                          child: InkWell(
                            onTap: () async {
                              showConfirmationDialog(
                                  "Êtes-vous sûr de vouloir retirer cette configuration de l'application ?",
                                      () {},
                                      () async {
                                    try {
                                      var result = await deleteConfigurationToApp(appContext, link, widget.applicationInstanceDTO);

                                      showNotification(kSuccess, kWhite, "La configuration a été retirée de l'application avec succès", context, null);

                                      setState(() {
                                        // for refresh ui
                                      });
                                    } catch(e) {
                                      showNotification(kError, kWhite, 'Une erreur est survenue lors du retrait de la configuration', context, null);
                                    }
                                  },
                                  context
                              );
                            },
                            child: Icon(Icons.delete, color: kError, size: 25),
                          ),
                        );
                      },
                    ],
                    padding: const EdgeInsets.all(8),
                    itemBuilder: (context, index, appConfigurationLink) {
                      return Container(
                        decoration: BoxDecoration(

                        ),
                        margin: const EdgeInsets.symmetric(vertical: 3),
                        padding: const EdgeInsets.all(8),
                        child: Row(
                          children: [
                            if(appConfigurationLink.configuration!.imageId != null)
                              Container(
                                  width: 50,
                                  height: 50,
                                  decoration: BoxDecoration(
                                    color: kSecond.withValues(alpha: 0.65),
                                    borderRadius: BorderRadius.circular(8.0),
                                    image: DecorationImage(
                                        fit: BoxFit.cover,
                                        image: NetworkImage(appConfigurationLink.configuration!.imageSource!)
                                    ),
                                  )
                              ),
                            Padding(
                              padding: const EdgeInsets.all(8.0),
                              child: Text(appConfigurationLink.configuration?.label ?? ""),
                            ),
                          ],
                        ),
                      );
                    },
                  ),
                ),
              ),
              /*PhoneMockup(
                                  child: Center(
                                    child: GridView.builder(
                                        shrinkWrap: true,
                                        gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: crossAxisCount),
                                        itemCount: appConfigurationLinks.length,
                                        itemBuilder: (BuildContext context, int index) {
                                          AppConfigurationLinkDTO appConfigurationLink = appConfigurationLinks[index];
                                          return Container(
                                            decoration: BoxDecoration(
                                              color: Colors.green,
                                            ),
                                            padding: const EdgeInsets.all(15),
                                            margin: EdgeInsets.symmetric(vertical: 15, horizontal: 15),
                                            child: Stack(
                                              children: [
                                                Align(
                                                  alignment: Alignment.center,
                                                  child: Text(appConfigurationLink.configuration!.label!),
                                                ),
                                                Positioned(
                                                    right: 0,
                                                    bottom: 0,
                                                    child: InkWell(
                                                      onTap: () async {
                                                        showConfirmationDialog(
                                                            "Êtes-vous sûr de vouloir retirer cette configuration de l'application ?",
                                                                () {},
                                                                () async {
                                                              try {
                                                                var result = await deleteConfigurationToApp(appContext, appConfigurationLink, widget.applicationInstanceDTO);

                                                                showNotification(kSuccess, kWhite, "La configuration a été retirée de l'application avec succès", context, null);

                                                                setState(() {
                                                                  // for refresh ui
                                                                });
                                                              } catch(e) {
                                                                showNotification(kError, kWhite, 'Une erreur est survenue lors du retrait de la configuration', context, null);
                                                              }
                                                            },
                                                            context
                                                        );
                                                      },
                                                      child: Icon(Icons.delete, color: kError, size: 25),
                                                    )
                                                )
                                              ],
                                            ),
                                          );
                                        }
                                    ),
                                  ),
                                ),*/
            ): Center(child: Text("No data")),
            appConfigurationLinks != null ? Positioned(
              top: 8,
              right: 8,
              child: InkWell(
                onTap: () async {
                  // Show configuration selector to link with !
                  var result = await showAddConfigurationLink(context, appContext, managerAppContext.instanceDTO!, appConfigurationLinks.map((acl) => acl.configurationId!).toList() ?? []);
                  if(result != null) {
                    for(var configurationId in result) {
                      AppConfigurationLinkDTO appConfigurationLinkDTO = AppConfigurationLinkDTO(
                          applicationInstanceId: widget.applicationInstanceDTO.id,
                          configurationId: configurationId,
                          isActive: true,
                          isDate: false,
                          isHour: false,
                          isSectionImageBackground: false,
                          layoutMainPage: LayoutMainPageType.SimpleGrid
                      );
                      await addConfigurationToApp(appContext, appConfigurationLinkDTO, widget.applicationInstanceDTO);
                    }
                    setState(() {
                      // Refresh ui
                    });
                  }
                },
                child: Container(
                    height: 60,
                    width: 60,
                    decoration: BoxDecoration(
                      color: kSuccess,
                      borderRadius: BorderRadius.circular(12.0),
                    ),
                    child: Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Icon(Icons.add, size: 24, color: kWhite),
                    )
                ),
              ),
            ) : SizedBox(),
          ],
        ),
      );
    }

    return FutureBuilder(
      future: getAppConfigurationLink(appContext, widget.applicationInstanceDTO),
      builder: (context, AsyncSnapshot<dynamic> snapshot) {
        List<AppConfigurationLinkDTO>? appConfigurationLinks = snapshot.data;

        if (snapshot.connectionState == ConnectionState.done) {
          final screenWidth = MediaQuery.of(context).size.width;
          final itemWidth = 175;

          final crossAxisCount = (screenWidth / itemWidth).floor().clamp(1, 6);

          return LayoutBuilder(
            builder: (context, constraints) {
              final maxHeight = constraints.maxHeight;

              return SingleChildScrollView(
                padding: const EdgeInsets.all(16),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [
                    ConstrainedBox(
                      constraints: BoxConstraints(
                        maxHeight: maxHeight * 0.45,
                        minHeight: 150,
                      ),
                      child: _generalInfoCard(),
                    ),
                    const SizedBox(height: 10),
                    ConstrainedBox(
                      constraints: BoxConstraints(
                        maxHeight: maxHeight * 0.5,
                        minHeight: 150,
                      ),
                      child: _phoneConfigCard(appConfigurationLinks),
                    ),
                  ],
                ),
              );
            },
          );

          return Align(
            alignment: AlignmentDirectional.topCenter,
            child: Container(
              color: Colors.pink,
              width: size.width * 0.85,
              height: size.height * 0.65,
              constraints: BoxConstraints(minWidth: 200, minHeight: 200),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Align(
                      alignment: AlignmentDirectional.centerStart,
                      child: Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: Text("Informations générales"),
                      )
                  ),
                  Align(
                    alignment: AlignmentDirectional.centerStart,
                    child: Container(
                      child: Column(
                        children: [
                          // Titre affiché main
                          /*MultiStringInputContainer(
                            label: "Titre affiché:",
                            modalLabel: "Titre",
                            color: kPrimaryColor,
                            initialValue: widget.applicationInstanceDTO.title,
                            onGetResult: (value) {
                              if (sectionDTO.title! != value) {
                                sectionDTO.title = value;
                                save(true, appContext);
                              }
                            },
                            maxLines: 1,
                            isHTML: true,
                            isTitle: true,
                          ),*/
                          // Image principale
                          ResourceInputContainer(
                            label: "Image principale :",
                            initialValue: widget.applicationInstanceDTO.mainImageId,
                            color: kPrimaryColor,
                            onChanged: (ResourceDTO resource) {
                              if(resource.id == null) {
                                widget.applicationInstanceDTO.mainImageId = null;
                                widget.applicationInstanceDTO.mainImageUrl = null;
                              } else {
                                widget.applicationInstanceDTO.mainImageId = resource.id;
                                widget.applicationInstanceDTO.mainImageUrl = resource.url;
                              }
                            },
                          ),
                          // Image Loader
                          ResourceInputContainer(
                            label: "Loader :",
                            initialValue: widget.applicationInstanceDTO.loaderImageId,
                            color: kPrimaryColor,
                            onChanged: (ResourceDTO resource) {
                              if(resource.id == null) {
                                widget.applicationInstanceDTO.loaderImageId = null;
                                widget.applicationInstanceDTO.loaderImageUrl = null;
                              } else {
                                widget.applicationInstanceDTO.loaderImageId = resource.id;
                                widget.applicationInstanceDTO.loaderImageUrl = resource.url;
                              }
                            },
                          ),
                          // Primary color
                          ColorPickerInputContainer(
                            label: "Couleur principale :",
                            fontSize: 20,
                            color: widget.applicationInstanceDTO.primaryColor,
                            onChanged: (value) {
                              widget.applicationInstanceDTO.primaryColor = value;
                            },
                          ),
                          // Secondary color
                          ColorPickerInputContainer(
                            label: "Couleur secondaire :",
                            fontSize: 20,
                            color: widget.applicationInstanceDTO.secondaryColor,
                            onChanged: (value) {
                              widget.applicationInstanceDTO.secondaryColor = value;
                            },
                          ),
                          // Layout (Grid or Mansonry)
                          Text('Todo Type selector Grid or Mansonry'),
                          // Langues
                          MultiSelectDropdownLanguageContainer(
                            label: "Langues :",
                            initialValue: widget.applicationInstanceDTO.languages != null ? widget.applicationInstanceDTO.languages!: [],
                            values: languages,
                            isMultiple: true,
                            fontSize: 20,
                            isAtLeastOne: true,
                            onChanged: (value) {
                              var tempOutput = new List<String>.from(value);
                              widget.applicationInstanceDTO.languages = tempOutput;
                              //print(configurationDTO.languages);
                            },
                          ),
                          // Highlight / Event principal -> Remplace l'image principale
                          Text('Todo, event section selector')
                        ],
                      ), // Elements
                    ),
                  ),
                  Align(
                    alignment: AlignmentDirectional.centerStart,
                    child: Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Text("Configurations sur le téléphone"),
                    )
                  ),
                  Align(
                    alignment: AlignmentDirectional.topCenter,
                    child: appConfigurationLinks != null ? SingleChildScrollView(
                      child: Stack(
                        children: [
                          Container(
                            height: size.height * 0.6,
                            width: size.width * 0.8,
                            constraints: BoxConstraints(
                              minHeight: 300,
                              minWidth: 300,
                              maxHeight: 500
                            ),
                            color: Colors.blue,
                            child: ReorderableCustomList<AppConfigurationLinkDTO>(
                              items: appConfigurationLinks,
                              shrinkWrap: true,
                              onChanged: (updatedList) async {
                                int order = 0;
                                // update order manually
                                for(var item in updatedList) {
                                  item.order = order;
                                  order++;
                                }
                                // TODO use order put method
                                var result = await updateAppConfigurationOrder(appContext, updatedList);
                                setState(() {
                                  // for refresh
                                });
                              },
                              actions: [
                                /*(BuildContext context, int index, AppConfigurationLinkDTO link) {
                                  return Container(
                                    height: 50,
                                    width: 50,
                                    child: InkWell(
                                      onTap: () async {
                                        try {
                                          var applicationInstance = widget.applicationInstanceDTO;
                                          applicationInstance.
                                          var applicationLink = await updateApplicationInstance(appContext, widget.applicationInstanceDTO);
                                          if(applicationLink != null) {
                                            if(newValue) {
                                              showNotification(kSuccess, kWhite, "Configuration activée avec succès", context, null);
                                            } else {
                                              showNotification(kSuccess, kWhite, "Configuration désactivée avec succès", context, null);
                                            }
                                            setState(() {
                                              link.isActive = applicationLink.isActive;
                                            });
                                          }
                                        } catch (e) {
                                          showNotification(kError, kWhite, "Une erreur est survenue", context, null);
                                        }
                                      },
                                      child: Icon(Icons.star, color: kError, size: 25),
                                    ),
                                  );
                                },*/
                                (BuildContext context, int index, AppConfigurationLinkDTO link) {
                                  return Container(
                                    height: 50,
                                    width: 70,
                                    child: Switch(
                                      activeThumbColor: kPrimaryColor,
                                      inactiveThumbColor: kBodyTextColor,
                                      inactiveTrackColor: kSecond,
                                      hoverColor: kPrimaryColor.withValues(alpha: 0.2),
                                      value: link.isActive ?? false,
                                      onChanged: (bool newValue) async {
                                        try {
                                          link.isActive = newValue;
                                          var applicationLink = await updateApplicationLink(appContext, link);
                                          if(applicationLink != null) {
                                            if(newValue) {
                                              showNotification(kSuccess, kWhite, "Configuration activée avec succès", context, null);
                                            } else {
                                              showNotification(kSuccess, kWhite, "Configuration désactivée avec succès", context, null);
                                            }
                                            setState(() {
                                              link.isActive = applicationLink.isActive;
                                            });
                                          }
                                        } catch (e) {
                                          showNotification(kError, kWhite, "Une erreur est survenue", context, null);
                                        }
                                      },
                                    ),
                                  );
                                },
                                (BuildContext context, int index, AppConfigurationLinkDTO link) {
                                  return Container(
                                    height: 50,
                                    width: 50,
                                    child: InkWell(
                                      onTap: () async {
                                        showConfirmationDialog(
                                            "Êtes-vous sûr de vouloir retirer cette configuration de l'application ?",
                                                () {},
                                                () async {
                                              try {
                                                var result = await deleteConfigurationToApp(appContext, link, widget.applicationInstanceDTO);

                                                showNotification(kSuccess, kWhite, "La configuration a été retirée de l'application avec succès", context, null);

                                                setState(() {
                                                  // for refresh ui
                                                });
                                              } catch(e) {
                                                showNotification(kError, kWhite, 'Une erreur est survenue lors du retrait de la configuration', context, null);
                                              }
                                            },
                                            context
                                        );
                                      },
                                      child: Icon(Icons.delete, color: kError, size: 25),
                                    ),
                                  );
                                },
                              ],
                              padding: const EdgeInsets.all(8),
                              itemBuilder: (context, index, appConfigurationLink) {
                                return Container(
                                  decoration: BoxDecoration(

                                  ),
                                  margin: const EdgeInsets.symmetric(vertical: 3),
                                  padding: const EdgeInsets.all(8),
                                  child: Row(
                                    children: [
                                      if(appConfigurationLink.configuration!.imageId != null)
                                        Container(
                                          width: 50,
                                          height: 50,
                                          decoration: BoxDecoration(
                                            color: kSecond.withValues(alpha: 0.65),
                                            borderRadius: BorderRadius.circular(8.0),
                                            image: DecorationImage(
                                              fit: BoxFit.cover,
                                              image: NetworkImage(appConfigurationLink.configuration!.imageSource!)
                                            ),
                                          )
                                        ),
                                      Padding(
                                        padding: const EdgeInsets.all(8.0),
                                        child: Text(appConfigurationLink.configuration?.label ?? ""),
                                      ),
                                    ],
                                  ),
                                );
                              },
                            ),
                          ),
                          Positioned(
                            bottom: 20,
                            right: 20,
                            child: InkWell(
                              onTap: () async {
                                // Show configuration selector to link with !
                                var result = await showAddConfigurationLink(context, appContext, managerAppContext.instanceDTO!, appConfigurationLinks.map((acl) => acl.configurationId!).toList() ?? []);
                                if(result != null) {
                                  for(var configurationId in result) {
                                    AppConfigurationLinkDTO appConfigurationLinkDTO = AppConfigurationLinkDTO(
                                        applicationInstanceId: widget.applicationInstanceDTO.id,
                                        configurationId: configurationId,
                                        isActive: true,
                                        isDate: false,
                                        isHour: false,
                                        isSectionImageBackground: false,
                                        layoutMainPage: LayoutMainPageType.SimpleGrid
                                    );
                                    await addConfigurationToApp(appContext, appConfigurationLinkDTO, widget.applicationInstanceDTO);
                                  }
                                  setState(() {
                                    // Refresh ui
                                  });
                                }
                              },
                              child: Container(
                                  height: 85,
                                  width: 85,
                                  decoration: BoxDecoration(
                                    color: kSuccess,
                                    borderRadius: BorderRadius.circular(8.0),
                                  ),
                                  child: Padding(
                                    padding: const EdgeInsets.all(8.0),
                                    child: Icon(Icons.add, size: 25, color: kWhite),
                                  )
                              ),
                            ),
                          ),
                          /*PhoneMockup(
                              child: Center(
                                child: GridView.builder(
                                    shrinkWrap: true,
                                    gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: crossAxisCount),
                                    itemCount: appConfigurationLinks.length,
                                    itemBuilder: (BuildContext context, int index) {
                                      AppConfigurationLinkDTO appConfigurationLink = appConfigurationLinks[index];
                                      return Container(
                                        decoration: BoxDecoration(
                                          color: Colors.green,
                                        ),
                                        padding: const EdgeInsets.all(15),
                                        margin: EdgeInsets.symmetric(vertical: 15, horizontal: 15),
                                        child: Stack(
                                          children: [
                                            Align(
                                              alignment: Alignment.center,
                                              child: Text(appConfigurationLink.configuration!.label!),
                                            ),
                                            Positioned(
                                                right: 0,
                                                bottom: 0,
                                                child: InkWell(
                                                  onTap: () async {
                                                    showConfirmationDialog(
                                                        "Êtes-vous sûr de vouloir retirer cette configuration de l'application ?",
                                                            () {},
                                                            () async {
                                                          try {
                                                            var result = await deleteConfigurationToApp(appContext, appConfigurationLink, widget.applicationInstanceDTO);

                                                            showNotification(kSuccess, kWhite, "La configuration a été retirée de l'application avec succès", context, null);

                                                            setState(() {
                                                              // for refresh ui
                                                            });
                                                          } catch(e) {
                                                            showNotification(kError, kWhite, 'Une erreur est survenue lors du retrait de la configuration', context, null);
                                                          }
                                                        },
                                                        context
                                                    );
                                                  },
                                                  child: Icon(Icons.delete, color: kError, size: 25),
                                                )
                                            )
                                          ],
                                        ),
                                      );
                                    }
                                ),
                              ),
                            ),*/
                        ],
                      ),
                    ): Center(child: Text("No data")),
                  ),
                ],
              ),
            ),
          );
        } else if (snapshot.connectionState == ConnectionState.none) {
          return Text("No data");
        } else {
          return Center(
              child: Container(
                  height: size.height * 0.2,
                  child: CommonLoader()
              )
          );
        }
      }
    );
  }
}

Future<void> updateMainInfos(DeviceDTO deviceToUpdate, dynamic appContext) async {
  ManagerAppContext managerAppContext = appContext.getContext();
  await managerAppContext.clientAPI!.deviceApi!.deviceUpdateMainInfos(deviceToUpdate);
}

Future<List<AppConfigurationLinkDTO>?> getAppConfigurationLink(AppContext appContext, ApplicationInstanceDTO applicationInstanceDTO) async {
  try{
    List<AppConfigurationLinkDTO>? appConfigurationsLinks = await (appContext.getContext() as ManagerAppContext).clientAPI!.applicationInstanceApi!.applicationInstanceGetAllApplicationLinkFromApplicationInstance(applicationInstanceDTO.id!);

    if(appConfigurationsLinks != null) {
      appConfigurationsLinks.forEach((element) {
        print(element);
      });
    }

    return appConfigurationsLinks;
  } catch(e) {

    return null;
  }
}

Future<List<dynamic>?> getSectionEvents(AppContext appContext, ApplicationInstanceDTO applicationInstanceDTO) async {
  try{
    final rawList = await (appContext.getContext() as ManagerAppContext).clientAPI!.sectionApi!.sectionGetAllFromType(instanceId: applicationInstanceDTO.instanceId!, sectionType: SectionType.Event.toString());

    if(rawList == null) { return [];}
    var sections = rawList.map((json) => SectionEventDTO.fromJson(json)!).toList();
    return sections ?? [];
  } catch(e) {

    return null;
  }

}

Future<AppConfigurationLinkDTO?> addConfigurationToApp(AppContext appContext, AppConfigurationLinkDTO appConfigurationLink, ApplicationInstanceDTO applicationInstanceDTO) async {
  AppConfigurationLinkDTO? appConfigurationsLink = await (appContext.getContext() as ManagerAppContext).clientAPI!.applicationInstanceApi!.applicationInstanceAddConfigurationToApplicationInstance(applicationInstanceDTO.id!, appConfigurationLink);
  return appConfigurationsLink;
}

Future<ApplicationInstanceDTO?> updateApplicationInstance(AppContext appContext, ApplicationInstanceDTO applicationInstanceDTO) async {
  ApplicationInstanceDTO? result = await (appContext.getContext() as ManagerAppContext).clientAPI!.applicationInstanceApi!.applicationInstanceUpdate(applicationInstanceDTO);
  return result;
}

Future<List<AppConfigurationLinkDTO>?> updateAppConfigurationOrder(AppContext appContext, List<AppConfigurationLinkDTO> appConfigurationLinks) async {
  List<AppConfigurationLinkDTO>? appConfigurationsLinks = await (appContext.getContext() as ManagerAppContext).clientAPI!.applicationInstanceApi!.applicationInstanceUpdateApplicationLinkOrder(appConfigurationLinks);
  return appConfigurationsLinks;
}

Future<AppConfigurationLinkDTO?> updateApplicationLink(AppContext appContext, AppConfigurationLinkDTO appConfigurationLinkDTO) async {
  AppConfigurationLinkDTO? result = await (appContext.getContext() as ManagerAppContext).clientAPI!.applicationInstanceApi!.applicationInstanceUpdateApplicationLink(appConfigurationLinkDTO);
  return result;
}

Future<String?> deleteConfigurationToApp(AppContext appContext, AppConfigurationLinkDTO appConfigurationLink, ApplicationInstanceDTO applicationInstanceDTO) async {
  var result = await (appContext.getContext() as ManagerAppContext).clientAPI!.applicationInstanceApi!.applicationInstanceDeleteAppConfigurationLink(applicationInstanceDTO.id!, appConfigurationLink.id!);
  return result;
}