import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_web/pages/device_managment/schedule_device/schedule_widgets/schedual_view.dart';
import 'package:syncrow_web/pages/device_managment/schedule_device/schedule_widgets/schedule_control_button.dart';
import 'package:syncrow_web/pages/device_managment/shared/toggle_widget.dart';
import 'package:syncrow_web/pages/device_managment/two_gang_switch/bloc/two_gang_switch_bloc.dart';
import 'package:syncrow_web/pages/device_managment/two_gang_switch/bloc/two_gang_switch_event.dart';
import 'package:syncrow_web/pages/device_managment/two_gang_switch/bloc/two_gang_switch_state.dart';
import 'package:syncrow_web/pages/device_managment/two_gang_switch/factories/two_gang_switch_bloc_factory.dart';
import 'package:syncrow_web/pages/device_managment/two_gang_switch/models/two_gang_status_model.dart';
import 'package:syncrow_web/utils/constants/assets.dart';
import 'package:syncrow_web/utils/helpers/responsice_layout_helper/responsive_layout_helper.dart';

class TwoGangDeviceControlView extends StatelessWidget
    with HelperResponsiveLayout {
  final String deviceId;

  const TwoGangDeviceControlView({super.key, required this.deviceId});
  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (context) => TwoGangSwitchBlocFactory.create(deviceId: deviceId)
        ..add(TwoGangSwitchFetchDeviceEvent(deviceId)),
      child: BlocBuilder<TwoGangSwitchBloc, TwoGangSwitchState>(
        builder: (context, state) {
          if (state is TwoGangSwitchLoading) {
            return const Center(child: CircularProgressIndicator());
          } else if (state is TwoGangSwitchStatusLoaded) {
            return _buildStatusControls(context, state.status);
          } else if (state is TwoGangSwitchError ||
              state is TwoGangSwitchControlError) {
            return const Center(child: Text('Error fetching status'));
          } else {
            return const Center(child: CircularProgressIndicator());
          }
        },
      ),
    );
  }

  Widget _buildStatusControls(BuildContext context, TwoGangStatusModel status) {
    return Center(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Row(
            crossAxisAlignment: CrossAxisAlignment.center,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              SizedBox(
                width: 200,
                height: 150,
                child: ToggleWidget(
                  value: status.switch1,
                  code: 'switch_1',
                  deviceId: deviceId,
                  label: 'Wall Light',
                  onChange: (value) {
                    context.read<TwoGangSwitchBloc>().add(TwoGangSwitchControl(
                          deviceId: deviceId,
                          code: 'switch_1',
                          value: value,
                        ));
                  },
                ),
              ),
              const SizedBox(width: 10),
              SizedBox(
                width: 200,
                height: 150,
                child: ToggleWidget(
                  value: status.switch2,
                  code: 'switch_2',
                  deviceId: deviceId,
                  label: 'Ceiling Light',
                  onChange: (value) {
                    context.read<TwoGangSwitchBloc>().add(TwoGangSwitchControl(
                          deviceId: deviceId,
                          code: 'switch_2',
                          value: value,
                        ));
                  },
                ),
              ),
            ],
          ),
          const SizedBox(height: 20),
          Row(
            crossAxisAlignment: CrossAxisAlignment.center,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              SizedBox(
                width: 200,
                height: 150,
                child: ScheduleControlButton(
                  onTap: () {
                    showDialog<void>(
                        context: context,
                        builder: (ctx) => BlocProvider.value(
                              value:
                                  BlocProvider.of<TwoGangSwitchBloc>(context),
                              child: BuildScheduleView(
                                deviceUuid: deviceId,
                                category: 'switch_1',
                                countdownCode: 'countdown_1',
                                deviceType: '2G',
                              ),
                            ));
                  },
                  mainText: 'Wall Light',
                  subtitle: 'Scheduling',
                  iconPath: Assets.scheduling,
                ),
              ),
              const SizedBox(width: 10),
              SizedBox(
                width: 200,
                height: 150,
                child: ScheduleControlButton(
                  onTap: () {
                    showDialog<void>(
                        context: context,
                        builder: (ctx) => BlocProvider.value(
                              value:
                                  BlocProvider.of<TwoGangSwitchBloc>(context),
                              child: BuildScheduleView(
                                deviceUuid: deviceId,
                                category: 'switch_2',
                                countdownCode: 'countdown_2',
                                deviceType: '2G',
                              ),
                            ));
                  },
                  mainText: 'Ceiling Light',
                  subtitle: 'Scheduling',
                  iconPath: Assets.scheduling,
                ),
              ),
            ],
          )
        ],
      ),
    );
  }
}
