import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:manager_app/Components/message_notification.dart';
import 'package:manager_app/Models/managerContext.dart';
import 'package:manager_app/Screens/Kiosk_devices/change_device_info_modal.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 DeviceElement extends StatefulWidget {
  final DeviceDTO deviceDTO;
  final AppConfigurationLinkDTO appConfigurationLinkDTO;
  const DeviceElement({
    Key? key,
    required this.deviceDTO,
    required this.appConfigurationLinkDTO,
  }) : super(key: key);

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

class _DeviceElementState extends State<DeviceElement> {

  @override
  Widget build(BuildContext context) {
    final appContext = Provider.of<AppContext>(context);
    //Size size = MediaQuery.of(context).size;
    return Stack(
      children: [
        Positioned(
          top: 0,
          right: 0,
          child: Container(
            width: 15,
            height: 15,
            decoration: BoxDecoration(
              color: widget.deviceDTO.connected! ? Colors.green : kError,
              shape: BoxShape.rectangle,
              borderRadius: BorderRadius.circular(25.0),
              boxShadow: [
                BoxShadow(
                  color: kSecond,
                  spreadRadius: 0.5,
                  blurRadius: 3,
                  offset: Offset(0, 1.5), // changes position of shadow
                ),
              ],
            ),
          ),
        ),
        Positioned(
          top: 10,
          left: 10,
          child: Row(
            children: [
              AutoSizeText(
                widget.deviceDTO.name != null ? widget.deviceDTO.name! : widget.deviceDTO.identifier!,
                style: new TextStyle(fontSize: 25, fontWeight: FontWeight.w300),
                maxLines: 1,
              ),
            ],
          ),
        ),
        Center(
          child: Text(
            widget.appConfigurationLinkDTO.configuration != null ? widget.appConfigurationLinkDTO.configuration!.label! : "Aucune configuration",
            style: new TextStyle(fontSize: 20),
            maxLines: 1,
          ),
        ),
        Positioned(
          bottom: 10,
          right: 10,
          child: IconButton(
            icon: Icon(Icons.edit),
            onPressed: () {
              showChangeInfo(
                  "Mettre à jour la tablette",
                  widget.deviceDTO,
                  widget.appConfigurationLinkDTO,
                  (DeviceDTO outputDevice, AppConfigurationLinkDTO outputAppConfig) {
                    // For refresh
                    setState(() {
                      //print("output");
                      //print(outputDevice);
                      var deviceDTO = outputDevice;
                      // Update device main info
                      updateMainInfos(deviceDTO, outputAppConfig, appContext);
                    });
                  },
                  1,
                  context,
                  appContext
              );
            },
            color: kPrimaryColor,
          ),
        ),
      ],
    );
  }

  Future<DeviceDTO?> updateMainInfos(DeviceDTO deviceToUpdate, AppConfigurationLinkDTO appConfigurationToUpdate, dynamic appContext) async {
    ManagerAppContext managerAppContext = appContext.getContext();

    DeviceDTO? device = await managerAppContext.clientAPI!.deviceApi!.deviceUpdateMainInfos(deviceToUpdate);

    appConfigurationToUpdate.layoutMainPage = LayoutMainPageType.SimpleGrid; // Hardcoded for now as not supported
    AppConfigurationLinkDTO? result = await managerAppContext.clientAPI!.applicationInstanceApi!.applicationInstanceUpdateApplicationLink(appConfigurationToUpdate);

    //print(device);
    showNotification(kSuccess, kWhite, "Le kiosk a été mis à jour", context, null);
    return device;
  }

}