import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_web/pages/device_managment/all_devices/models/devices_model.dart';
import 'package:syncrow_web/pages/routines/bloc/routine_bloc/routine_bloc.dart';
import 'package:syncrow_web/pages/routines/widgets/dragable_card.dart';

class RoutineDevices extends StatefulWidget {
  const RoutineDevices({super.key});

  @override
  State<RoutineDevices> createState() => _RoutineDevicesState();
}

class _RoutineDevicesState extends State<RoutineDevices> {
  @override
  void initState() {
    super.initState();
    context.read<RoutineBloc>().add(FetchDevicesInRoutine());
  }

  @override
  Widget build(BuildContext context) {
    return BlocBuilder<RoutineBloc, RoutineState>(
      builder: (context, state) {
        if (state.isLoading) {
          return const Center(child: CircularProgressIndicator());
        }

        Future.delayed(const Duration(seconds: 1), () {
          if (state.devices.isEmpty) {
            return const Center(child: Text('No devices found'));
          }
        });

        List<AllDevicesModel> deviceList = state.devices
            .where((device) =>
                device.productType == 'AC' ||
                device.productType == '1G' ||
                device.productType == '2G' ||
                device.productType == '3G' ||
                device.productType == 'WPS' ||
                device.productType == 'CPS')
            .toList();

        return Wrap(
          spacing: 10,
          runSpacing: 10,
          children: deviceList.asMap().entries.map((entry) {
            final device = entry.value;
            if (state.searchText != null && state.searchText!.isNotEmpty) {
              return device.name!
                      .toLowerCase()
                      .contains(state.searchText!.toLowerCase())
                  ? DraggableCard(
                      imagePath: device.getDefaultIcon(device.productType),
                      title: device.name ?? '',
                      deviceData: {
                        'device': device,
                        'imagePath': device.getDefaultIcon(device.productType),
                        'title': device.name ?? '',
                        'deviceId': device.uuid,
                        'productType': device.productType,
                        'functions': device.functions,
                        'uniqueCustomId': '',
                      },
                    )
                  : Container();
            } else {
              return DraggableCard(
                imagePath: device.getDefaultIcon(device.productType),
                title: device.name ?? '',
                deviceData: {
                  'device': device,
                  'imagePath': device.getDefaultIcon(device.productType),
                  'title': device.name ?? '',
                  'deviceId': device.uuid,
                  'productType': device.productType,
                  'functions': device.functions,
                  'uniqueCustomId': '',
                },
              );
            }
          }).toList(),
        );
      },
    );
  }
}