import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_web/pages/common/buttons/cancel_button.dart';
import 'package:syncrow_web/pages/common/buttons/default_button.dart';
import 'package:syncrow_web/pages/spaces_management/link_space_model/bloc/link_space_to_model_bloc.dart';
import 'package:syncrow_web/pages/spaces_management/link_space_model/bloc/link_space_to_model_event.dart';
import 'package:syncrow_web/pages/spaces_management/link_space_model/bloc/link_space_to_model_state.dart';
import 'package:syncrow_web/pages/spaces_management/space_model/models/space_template_model.dart';
import 'package:syncrow_web/pages/spaces_management/space_model/widgets/space_model_card_widget.dart';
import 'package:syncrow_web/utils/color_manager.dart';

class LinkSpaceModelDialog extends StatelessWidget {
  final Function(SpaceTemplateModel?)? onSave;
  final int? initialSelectedIndex;
  final List<SpaceTemplateModel> spaceModels;

  const LinkSpaceModelDialog({
    Key? key,
    this.onSave,
    this.initialSelectedIndex,
    required this.spaceModels,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (context) => LinkSpaceToModelBloc()
        ..add(
          LinkSpaceModelSelectedEvent(initialSelectedIndex ?? -1),
        ),
      child: Builder(
        builder: (context) {
          final bloc = context.read<LinkSpaceToModelBloc>();
          return AlertDialog(
            backgroundColor: ColorsManager.whiteColors,
            title: const Text('Link a space model'),
            content: spaceModels.isNotEmpty
                ? Container(
                    color: ColorsManager.textFieldGreyColor,
                    width: MediaQuery.of(context).size.width * 0.7,
                    height: MediaQuery.of(context).size.height * 0.6,
                    child: BlocBuilder<LinkSpaceToModelBloc, LinkSpaceToModelState>(
                      builder: (context, state) {
                        int selectedIndex = -1;
                        if (state is SpaceModelSelectedState) {
                          selectedIndex = state.selectedIndex;
                        }
                        return GridView.builder(
                          gridDelegate:
                              const SliverGridDelegateWithFixedCrossAxisCount(
                            crossAxisCount: 2,
                            crossAxisSpacing: 10.0,
                            mainAxisSpacing: 10.0,
                            childAspectRatio: 3,
                          ),
                          itemCount: spaceModels.length,
                          itemBuilder: (BuildContext context, int index) {
                            final model = spaceModels[index];
                            final isSelected = selectedIndex == index;
                            return GestureDetector(
                              onTap: () {
                                bloc.add(LinkSpaceModelSelectedEvent(index));
                              },
                              child: Container(
                                margin: const EdgeInsets.all(10.0),
                                decoration: BoxDecoration(
                                  border: Border.all(
                                    color: isSelected
                                        ? ColorsManager.spaceColor
                                        : Colors.transparent,
                                    width: 2.0,
                                  ),
                                  borderRadius: BorderRadius.circular(8.0),
                                ),
                              child: SpaceModelCardWidget(model: model,),
                              ),
                            );
                          },
                        );
                      },
                    ),
                  )
                : const Text('No space models available.'),
            actions: [
              Center(
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    CancelButton(
                      onPressed: () {
                        Navigator.of(context).pop();
                      },
                      label: 'Cancel',
                    ),
                    const SizedBox(width: 10),
                    BlocBuilder<LinkSpaceToModelBloc, LinkSpaceToModelState>(
                      builder: (context, state) {
                        final isEnabled = state is SpaceModelSelectedState &&
                            state.selectedIndex >= 0;
                        return SizedBox(
                          width: 140,
                          child: DefaultButton(
                            height: 40,
                            borderRadius: 10,
                            onPressed: isEnabled
                                ? () {
                                    if (onSave != null) {
                                      final selectedModel =
                                          spaceModels[state.selectedIndex];

                                      onSave!(selectedModel);
                                    }
                                    Navigator.of(context).pop();
                                  }
                                : null,
                            child: const Text('Save'),
                          ),
                        );
                      },
                    ),
                  ],
                ),
              ),
            ],
          );
        },
      ),
    );
  }
}
