import 'package:flutter/material.dart';
import 'package:manager_api_new/api.dart';
import 'package:manager_app/constants.dart';
import 'package:manager_app/Models/managerContext.dart';
import 'package:manager_app/app_context.dart';
import 'package:manager_app/Screens/Resources/select_resource_modal.dart';
import 'package:provider/provider.dart';

class ResourceInputContainer extends StatefulWidget {
  final Color color;
  final String label;
  final String? initialValue;
  final ValueChanged<ResourceDTO> onChanged;
  final BoxFit imageFit;
  final double fontSize;
  final List<ResourceType> inResourceTypes;
  final bool isSmall;
  final bool isLanguageTab;

  const ResourceInputContainer({
    Key? key,
    this.color = kSecond,
    required this.label,
    this.initialValue,
    required this.onChanged,
    this.imageFit = BoxFit.cover,
    this.fontSize = 18,
    this.inResourceTypes = const [ResourceType.Image, ResourceType.ImageUrl],
    this.isSmall = false,
    this.isLanguageTab = false,
  }) : super(key: key);

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

class _ResourceInputContainerState extends State<ResourceInputContainer> {
  String? resourceIdToShow;

  @override
  void initState() {
    super.initState();
    resourceIdToShow = widget.initialValue;
  }

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

    if (widget.isLanguageTab) {
      resourceIdToShow = widget.initialValue;
    }

    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Align(
          alignment: AlignmentDirectional.centerStart,
          child: Text(
            widget.label,
            style: const TextStyle(
              fontWeight: FontWeight.w400,
              fontSize: 16,
            ),
          ),
        ),
        const SizedBox(height: 8, width: 10),
        Container(
          padding: const EdgeInsets.all(4),
          /*decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(12),
            border: Border.all(color: Colors.grey.shade400, width: 1.2),
          ),*/
          child: InkWell(
            onTap: () async {
              ResourceDTO? result = await showSelectResourceModal(
                "Sélectionner une ressource",
                1,
                widget.inResourceTypes,
                context,
                true,
                true,
                true,
              );

              if (result != null) {
                setState(() {
                  resourceIdToShow = result.id;
                });
                widget.onChanged(result);
              }
            },
            child: Container(
              height: widget.isSmall ? 35 : 100,
              width: widget.isSmall ? 60 : 120,
              alignment: Alignment.center,
              decoration: BoxDecoration(
                color: resourceIdToShow == null ? widget.color : Colors.transparent,
                borderRadius: BorderRadius.circular(10),
              ),
              child: resourceIdToShow == null
                  ? Text(
                "Choisir",
                style: TextStyle(
                  color: kWhite,
                  fontSize: widget.fontSize,
                ),
                maxLines: 1,
              )
                  : FutureBuilder<ResourceDTO?>(
                future: (appContext.getContext() as ManagerAppContext)
                    .clientAPI!
                    .resourceApi!
                    .resourceGetDetail(resourceIdToShow!),
                builder: (context, snapshot) {
                  if (snapshot.connectionState == ConnectionState.waiting) {
                    return const SizedBox(
                      width: 24,
                      height: 24,
                      child: CircularProgressIndicator(strokeWidth: 2),
                    );
                  } else if (snapshot.hasError || snapshot.data == null) {
                    return Text(
                      "Erreur",
                      style: TextStyle(
                        color: kWhite,
                        fontSize: widget.fontSize,
                      ),
                      maxLines: 1,
                    );
                  } else {
                    return Container(
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(10),
                        image: DecorationImage(
                          fit: widget.imageFit,
                          image: NetworkImage(snapshot.data!.url!),
                        ),
                      ),
                    );
                  }
                },
              ),
            ),
          ),
        ),
      ],
    );
  }
}