manager-app/lib/Screens/Resources/resource_body_grid.dart

import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';
import 'package:manager_app/Components/fetch_resource_icon.dart';
import 'package:manager_app/Components/multi_select_container.dart';
import 'package:manager_app/Components/string_input_container.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';
import 'package:diacritic/diacritic.dart';

class ResourceBodyGrid extends StatefulWidget {
  final List<ResourceDTO> resources; //return ResourceDTO
  final Function onSelect;
  final bool isAddButton;
  final bool isSelectModal;
  final List<ResourceType> resourceTypesIn;
  const ResourceBodyGrid({
    Key? key,
    required this.resources,
    required this.onSelect,
    required this.isAddButton,
    required this.resourceTypesIn,
    this.isSelectModal = false
  }) : super(key: key);

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

class _ResourceBodyGridState extends State<ResourceBodyGrid> {
  late List<String> filterTypes;
  late List<String> currentFilterTypes;
  String filterSearch = '';
  late List<String> selectedTypes;
  late List<ResourceDTO> resourcesToShow;

  @override
  void initState() {
    resourcesToShow = widget.resources;
    currentFilterTypes = resource_types.where((rt) => widget.resourceTypesIn.contains(rt.type)).map((rt) => rt.label).toList();//, resource_types[2]]; // resource_types[3]
    filterTypes = resource_types.where((rt) => widget.resourceTypesIn.contains(rt.type)).map((rt) => rt.label).toList();//, resource_types[2]]; // resource_types[3]
    selectedTypes = resource_types.where((rt) => widget.resourceTypesIn.contains(rt.type)).map((rt) => rt.label).toList();
    super.initState();
  }

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

    return bodyGrid(resourcesToShow, size, appContext);
  }

  Widget bodyGrid(data, Size size, AppContext appContext)  {
    final screenWidth = MediaQuery.of(context).size.width;
    final itemWidth = 150;
    final crossAxisCount = (screenWidth / itemWidth).floor().clamp(1, 9);

    return Column(
      children: [
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: StringInputContainer(
                label: "Recherche:",
                onChanged: (String value) {
                  setState(() {
                    filterSearch = value;
                    filterResource();
                  });
                },
              ),
            ),
           Padding(
              padding: const EdgeInsets.all(8.0),
              child: MultiSelectContainer(
                label: "Type:",
                initialValue: filterTypes,
                values: currentFilterTypes,
                isMultiple: true,
                onChanged: (result) {
                  setState(() {
                    selectedTypes = result as List<String>; // TO TEST
                    filterResource();
                  });
                },
              ),
            ),
            if (widget.isAddButton)
              InkWell(
                onTap: () {
                  widget.onSelect(ResourceDTO(id: widget.isSelectModal ? "-1" : null));
                },
                child: Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Container(
                    height: size.height *0.08,
                    width: size.height *0.08,
                    decoration: BoxDecoration(
                      color: kSuccess,
                      shape: BoxShape.rectangle,
                      borderRadius: BorderRadius.circular(25.0),
                      boxShadow: [
                        BoxShadow(
                          color: kSecond,
                          spreadRadius: 0.5,
                          blurRadius: 5,
                          offset: Offset(0, 1.5), // changes position of shadow
                        ),
                      ],
                    ),
                    child:
                      Padding(
                        padding: const EdgeInsets.all(10.0),
                        child: LayoutBuilder(builder: (context, constraint) {
                         return new Icon(Icons.add, size: constraint.biggest.height, color: kTextLightColor);
                        }),
                      ),
                  ),
                ),
              )
          ],
        ),
        Expanded(
          child: GridView.builder(
              shrinkWrap: true,
              gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: crossAxisCount),
              itemCount: data.length,
              itemBuilder: (BuildContext context, int index) {
                return
                  InkWell(
                    onTap: () {
                      widget.onSelect(resourcesToShow[index]);
                    },
                    child: Container(
                      decoration: boxDecoration(data[index], appContext),
                      padding: const EdgeInsets.all(15),
                      margin: EdgeInsets.symmetric(vertical: 15, horizontal: 15),
                      child: Align(
                          alignment: Alignment.center,
                          child: getElement(data[index], size, appContext)
                      ),
                    ),
                  );
              }
          ),
        ),
      ],
    );
  }

  getElement(ResourceDTO resource, Size size, AppContext appContext) {
    if (resource.id != null) {
      return Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          SizedBox(
            height: size.width *0.01,
          ),
          Align(
            alignment: Alignment.center,
            child: AutoSizeText(
              resource.label == null ? "" : resource.label!,
              style: new TextStyle(fontSize: 20),
              maxLines: 1,
            ),
          ),
          Align(
            alignment: Alignment.bottomRight,
            child: Icon(
              getResourceIcon(resource.type),
              color: kPrimaryColor,
              size: 15,
            ),
          ),
        ],
      );
    } else {
      return Icon(
        Icons.close,
        color: kTextLightColor,
        size: 50.0,
      );
    }
  }

  void filterResource() {
    resourcesToShow = filterSearch.isEmpty ? widget.resources: widget.resources.where((ResourceDTO resource) => resource.id == null || removeDiacritics(resource.label!.toUpperCase()).contains(removeDiacritics(filterSearch.toUpperCase()))).toList();
    var getTypesInSelected = resource_types.where((ft) => selectedTypes.contains(ft.label)).map((rt) => rt.type).toList();
    resourcesToShow = resourcesToShow.where((resource) => resource.id == null || getTypesInSelected.contains(resource.type)).toList();
  }
}

boxDecoration(dynamic resourceDetailDTO, appContext) {
  return BoxDecoration(
    color: resourceDetailDTO.id == null ? kSecond : kBackgroundColor,
    shape: BoxShape.rectangle,
    borderRadius: BorderRadius.circular(30.0),
    image: resourceDetailDTO.id != null && (resourceDetailDTO.type == ResourceType.Image || resourceDetailDTO.type == ResourceType.ImageUrl) && resourceDetailDTO.url != null ? new DecorationImage(
      fit: BoxFit.cover,
      colorFilter: new ColorFilter.mode(Colors.black.withValues(alpha: 0.3), BlendMode.dstATop),
      image: new NetworkImage(
        resourceDetailDTO.url!,
      ),
    ) : null,
    boxShadow: [
      BoxShadow(
        color: kSecond,
        spreadRadius: 0.5,
        blurRadius: 5,
        offset: Offset(0, 1.5), // changes position of shadow
      ),
    ],
  );
}


/*Future<List<ResourceDTO>> getResources(Function onGetResult, bool isImage, AppContext appContext) async {
  List<ResourceDTO> resources = await (appContext.getContext() as ManagerAppContext).clientAPI.resourceApi.resourceGet(instanceId:(appContext.getContext() as ManagerAppContext).instanceId);
  if (onGetResult != null && isImage) {
    resources = resources.where((element) => element.type == ResourceType.image || element.type == ResourceType.imageUrl).toList();
  }
  return resources;
}*/