import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_web/pages/device_managment/curtain_module/bloc/curtain_module_bloc.dart';
import 'package:syncrow_web/pages/device_managment/curtain_module/models/curtain_module_model.dart';
import 'package:syncrow_web/pages/device_managment/curtain_module/widgets/accurate_calibration_dialog.dart';
import 'package:syncrow_web/pages/device_managment/curtain_module/widgets/pref_revers_card_widget.dart';
import 'package:syncrow_web/pages/device_managment/curtain_module/widgets/quick_calibration_dialog.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/web_layout/default_container.dart';

class CurtainModulePrefrencesDialog extends StatelessWidget {
  final CurtainModuleStatusModel curtainModuleStatusModel;
  final String deviceId;
  final CurtainModuleBloc curtainModuleBloc;
  const CurtainModulePrefrencesDialog({
    super.key,
    required this.curtainModuleStatusModel,
    required this.deviceId,
    required this.curtainModuleBloc,
  });

  @override
  Widget build(_) {
    return AlertDialog(
      backgroundColor: ColorsManager.CircleImageBackground,
      contentPadding: const EdgeInsets.all(20),
      title: Center(
          child: Text(
        'Preferences',
        style: TextStyle(
          color: ColorsManager.dialogBlueTitle,
          fontSize: 24,
          fontWeight: FontWeight.bold,
        ),
      )),
      content: BlocBuilder<CurtainModuleBloc, CurtainModuleState>(
        bloc: curtainModuleBloc,
        builder: (context, state) {
          if (state is CurtainModuleLoading) {
            return const Center(
              child: CircularProgressIndicator(),
            );
          } else if (state is CurtainModuleStatusLoaded) {
            return SizedBox(
              height: 300,
              width: 400,
              child: GridView(
                gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: 2,
                  childAspectRatio: 1.5,
                  mainAxisSpacing: 10,
                  crossAxisSpacing: 10,
                ),
                children: [
                  PrefReversCardWidget(
                    title: state.curtainModuleStatus.controlBack,
                    body: 'Motor Steering',
                    onTap: () {
                      context.read<CurtainModuleBloc>().add(
                            ChangeControlBackEvent(
                              deviceId: deviceId,
                              controlBack:
                                  state.curtainModuleStatus.controlBack ==
                                          'forward'
                                      ? 'back'
                                      : 'forward',
                            ),
                          );
                    },
                  ),
                  PrefReversCardWidget(
                    title: formatDeviceType(
                        state.curtainModuleStatus.elecMachineryMode),
                    body: 'Motor Mode',
                    onTap: () => context.read<CurtainModuleBloc>().add(
                          ChangeElecMachineryModeEvent(
                            deviceId: deviceId,
                            elecMachineryMode:
                                state.curtainModuleStatus.elecMachineryMode ==
                                        'dry_contact'
                                    ? 'strong_power'
                                    : 'dry_contact',
                          ),
                        ),
                  ),
                  DefaultContainer(
                    padding: const EdgeInsets.all(12),
                    child: InkWell(
                      onTap: () => showDialog(
                        context: context,
                        builder: (_) => AccurateCalibrationDialog(
                          deviceId: deviceId,
                          parentContext: context,
                        ),
                      ),
                      child: const Column(
                        mainAxisAlignment: MainAxisAlignment.end,
                        children: [
                          Text('Accurte Calibration',
                              style: TextStyle(
                                fontSize: 18,
                                color: ColorsManager.blackColor,
                              )),
                        ],
                      ),
                    ),
                  ),
                  DefaultContainer(
                    padding: const EdgeInsets.all(12),
                    child: InkWell(
                      onTap: () => showDialog(
                        context: context,
                        builder: (_) => QuickCalibrationDialog(
                            timControl: state.curtainModuleStatus.trTimeControl,
                            deviceId: deviceId,
                            parentContext: context),
                      ),
                      child: const Column(
                        mainAxisAlignment: MainAxisAlignment.end,
                        children: [
                          Text('Quick Calibration',
                              style: TextStyle(
                                fontSize: 18,
                                color: ColorsManager.blackColor,
                              )),
                        ],
                      ),
                    ),
                  ),
                ],
              ),
            );
          } else {
            return const SizedBox();
          }
        },
      ),
    );
  }

  String formatDeviceType(String raw) {
    return raw
        .split('_')
        .map((word) => word.isNotEmpty
            ? '${word[0].toUpperCase()}${word.substring(1)}'
            : '')
        .join(' ');
  }
}
