import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_web/pages/device_managment/ac/bloc/ac_bloc.dart';
import 'package:syncrow_web/pages/device_managment/ac/bloc/ac_event.dart';
import 'package:syncrow_web/pages/device_managment/ac/bloc/ac_state.dart';
import 'package:syncrow_web/pages/device_managment/ac/view/control_list/ac_mode.dart';
import 'package:syncrow_web/pages/device_managment/ac/view/control_list/current_temp.dart';
import 'package:syncrow_web/pages/device_managment/ac/view/control_list/fan_speed.dart';
import 'package:syncrow_web/pages/device_managment/all_devices/models/devices_model.dart';
import 'package:syncrow_web/pages/device_managment/shared/toggle_widget.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/constants/assets.dart';
import 'package:syncrow_web/utils/helpers/responsice_layout_helper/responsive_layout_helper.dart';

class AcDeviceControlsView extends StatelessWidget with HelperResponsiveLayout {
  AcDeviceControlsView({super.key, required this.device});

  final AllDevicesModel device;

  @override
  Widget build(BuildContext context) {
    final isExtraLarge = isExtraLargeScreenSize(context);
    final isLarge = isLargeScreenSize(context);
    final isMedium = isMediumScreenSize(context);

    return BlocProvider(
      create: (context) => AcBloc(deviceId: device.uuid!)
        ..add(AcFetchDeviceStatusEvent(device.uuid!)),
      child: BlocBuilder<AcBloc, AcsState>(
        builder: (context, state) {
          final acBloc = BlocProvider.of<AcBloc>(context);
          if (state is ACStatusLoaded) {
            return GridView(
              padding: const EdgeInsets.symmetric(horizontal: 50),
              shrinkWrap: true,
              physics: const NeverScrollableScrollPhysics(),
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: isLarge || isExtraLarge
                    ? 3
                    : isMedium
                        ? 2
                        : 1,
                mainAxisExtent: 140,
                crossAxisSpacing: 12,
                mainAxisSpacing: 16,
              ),
              children: [
                ToggleWidget(
                  label: 'Thermostat',
                  value: state.status.acSwitch,
                  code: 'switch',
                  deviceId: device.uuid!,
                  icon: Assets.ac,
                  onChange: (value) {
                    context.read<AcBloc>().add(
                          AcControlEvent(
                            deviceId: device.uuid!,
                            code: 'switch',
                            value: value,
                          ),
                        );
                  },
                ),
                CurrentTemp(
                  currentTemp: state.status.currentTemp,
                  tempSet: state.status.tempSet,
                  code: 'temp_set',
                  deviceId: device.uuid!,
                ),
                AcMode(
                  value: state.status.acMode,
                  code: 'mode',
                  deviceId: device.uuid!,
                ),
                FanSpeedControl(
                  value: state.status.acFanSpeed,
                  code: 'level',
                  deviceId: device.uuid!,
                ),
                ToggleWidget(
                  label: '',
                  labelWidget: Column(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Container(
                        width: MediaQuery.of(context).size.width,
                        decoration: const ShapeDecoration(
                          color: ColorsManager.primaryColor,
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.all(Radius.circular(30)),
                          ),
                        ),
                      ),
                      Center(
                        child: SizedBox(
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                            children: [
                              IconButton(
                                onPressed: () {
                                  if (acBloc.timerActive == false) {
                                    context
                                        .read<AcBloc>()
                                        .add(DecreaseTimeEvent());
                                  }
                                },
                                icon: const Icon(Icons.remove,
                                    color: ColorsManager.greyColor),
                              ),
                              Text(
                                acBloc.scheduledHours
                                    .toString()
                                    .padLeft(2, '0'),
                                style: Theme.of(context)
                                    .textTheme
                                    .titleLarge!
                                    .copyWith(
                                      color: ColorsManager.dialogBlueTitle,
                                      fontWeight: FontWeight.bold,
                                    ),
                              ),
                              Text(
                                'h',
                                style: Theme.of(context)
                                    .textTheme
                                    .bodySmall!
                                    .copyWith(
                                      color: ColorsManager.blackColor,
                                    ),
                              ),
                              Text(
                                acBloc.scheduledMinutes
                                    .toString()
                                    .padLeft(2, '0'),
                                style: Theme.of(context)
                                    .textTheme
                                    .titleLarge!
                                    .copyWith(
                                      color: ColorsManager.dialogBlueTitle,
                                      fontWeight: FontWeight.bold,
                                    ),
                              ),
                              Text(
                                'm',
                                style: Theme.of(context)
                                    .textTheme
                                    .bodySmall!
                                    .copyWith(
                                      color: ColorsManager.blackColor,
                                    ),
                              ),
                              IconButton(
                                onPressed: () {
                                  if (acBloc.timerActive == false) {
                                    context
                                        .read<AcBloc>()
                                        .add(IncreaseTimeEvent());
                                  }
                                },
                                icon: const Icon(Icons.add,
                                    color: ColorsManager.greyColor),
                              ),
                            ],
                          ),
                        ),
                      ),
                    ],
                  ),
                  value: acBloc.timerActive,
                  code: 'ac_schedule',
                  deviceId: device.uuid!,
                  icon: Assets.acSchedule,
                  onChange: (value) {
                    context.read<AcBloc>().add(ToggleScheduleEvent());
                  },
                ),
                ToggleWidget(
                  deviceId: device.uuid!,
                  code: 'child_lock',
                  value: state.status.childLock,
                  label: 'Lock',
                  icon: state.status.childLock ? Assets.acLock : Assets.unlock,
                  onChange: (value) {
                    context.read<AcBloc>().add(
                          AcControlEvent(
                            deviceId: device.uuid!,
                            code: 'child_lock',
                            value: value,
                          ),
                        );
                  },
                ),
              ],
            );
          } else if (state is AcsLoadingState) {
            return const Center(child: CircularProgressIndicator());
          } else {
            return const Center(child: Text('Error fetching status'));
          }
        },
      ),
    );
  }
}