import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_web/pages/device_managment/device_setting/bloc/setting_bloc_bloc.dart';
import 'package:syncrow_web/pages/device_managment/device_setting/settings_model/sub_space_model.dart';
import 'package:syncrow_web/pages/device_managment/device_setting/subspace_dialog_buttons.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/extension/build_context_x.dart';

class SubSpaceDialog extends StatefulWidget {
  final List<SubSpaceModel> subSpaces;
  final String? selected;

  const SubSpaceDialog({
    Key? key,
    required this.subSpaces,
    this.selected,
  }) : super(key: key);

  @override
  State<SubSpaceDialog> createState() => _SubSpaceDialogState();
}

class _SubSpaceDialogState extends State<SubSpaceDialog> {
  String? _selectedId;

  @override
  void initState() {
    super.initState();
    _selectedId = widget.selected;
  }

  @override
  Widget build(BuildContext context) {
    return Dialog(
      backgroundColor: ColorsManager.whiteColors,
      insetPadding: const EdgeInsets.symmetric(horizontal: 24, vertical: 60),
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(28),
      ),
      child: Container(
        width: MediaQuery.of(context).size.width * 0.35,
        padding: const EdgeInsets.fromLTRB(0, 24, 0, 0),
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text(
              'Sub-Space',
              style: context.textTheme.bodyMedium?.copyWith(
                  fontWeight: FontWeight.w700,
                  color: ColorsManager.blueColor,
                  fontSize: 20),
            ),
            const Divider(),
            const SizedBox(height: 10),
            ...widget.subSpaces.map((space) {
              return RadioListTile<String>(
                value: space.id!,
                groupValue: _selectedId,
                onChanged: (value) {
                  setState(() {
                    _selectedId = value;
                  });
                },
                activeColor: Color(0xFF2962FF),
                title: Text(
                  space.name ?? 'Unnamed Sub-Space',
                  style: context.textTheme.bodyMedium?.copyWith(
                    fontSize: 15,
                    color: ColorsManager.grayColor,
                    fontWeight: FontWeight.w400,
                  ),
                ),
                controlAffinity: ListTileControlAffinity.trailing,
                contentPadding: const EdgeInsets.symmetric(horizontal: 24),
              );
            }).toList(),
            const SizedBox(height: 12),
            const Divider(height: 1, thickness: 1),
            SubSpaceDialogButtons(selectedId: _selectedId, widget: widget),
          ],
        ),
      ),
    );
  }
}

Future<SubSpaceModel?> showSubSpaceDialog(
  BuildContext context, {
  required List<SubSpaceModel> subSpaces,
  String? selected,
  required String communityUuid,
  required String spaceUuid,
}) {
  return showDialog<SubSpaceModel>(
    context: context,
    builder: (ctx) => BlocProvider.value(
      value: BlocProvider.of<SettingDeviceBloc>(context),
      child: SubSpaceDialog(
        subSpaces: subSpaces,
        selected: selected,
      ),
    ),
  );
}