import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_app/features/devices/bloc/devices_cubit.dart';
import 'package:syncrow_app/features/devices/model/device_control_model.dart';
import 'package:syncrow_app/features/devices/model/device_model.dart';
import 'package:syncrow_app/utils/resource_manager/color_manager.dart';
import 'package:collection/collection.dart';

class CustomSwitch extends StatelessWidget {
  const CustomSwitch({super.key, required this.device});

  final DeviceModel device;
  @override
  Widget build(BuildContext context) {
    return BlocBuilder<DevicesCubit, DevicesState>(
      builder: (context, state) {
        bool? status;
        if (device.status.isNotEmpty) {
          status = device.status
              .firstWhereOrNull((status) => status.code == "switch")
              ?.value;
        }
        return status == null
            ? const SizedBox()
            : GestureDetector(
                onTap: () {
                  DevicesCubit.getInstance().deviceControl(
                    DeviceControlModel(
                      deviceId: device.uuid,
                      code: device.status
                          .firstWhere((status) => status.code == "switch")
                          .code,
                      value: !device.status
                          .firstWhere((status) => status.code == "switch")
                          .value!,
                    ),
                    device.uuid!,
                  );
                },
                child: Container(
                  width: 45.0,
                  height: 28.0,
                  decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(24.0),
                      color: status
                          ? ColorsManager.primaryColor
                          : const Color(0xFFD9D9D9)),
                  child: Center(
                    child: Container(
                      width: 40.0,
                      height: 23.0,
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(24.0),
                        color: Colors.white,
                      ),
                      child: Padding(
                        padding: const EdgeInsets.all(2.0),
                        child: Container(
                          alignment: status
                              ? Alignment.centerRight
                              : Alignment.centerLeft,
                          child: Container(
                            width: 20.0,
                            height: 20.0,
                            decoration: BoxDecoration(
                              shape: BoxShape.circle,
                              color: status
                                  ? ColorsManager.primaryColor
                                  : Colors.grey,
                            ),
                          ),
                        ),
                      ),
                    ),
                  ),
                ),
              );
      },
    );
  }
}