syncrow-app/lib/features/devices/view/widgets/room_page.dart

import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:syncrow_app/features/devices/model/room_model.dart';
import 'package:syncrow_app/features/devices/view/widgets/room_page_switch.dart';
import 'package:syncrow_app/generated/assets.dart';
import 'package:syncrow_app/utils/resource_manager/color_manager.dart';

class RoomPage extends StatefulWidget {
  const RoomPage({super.key, required this.room});

  final RoomModel room;

  @override
  _RoomPageState createState() => _RoomPageState();
}

class _RoomPageState extends State<RoomPage> {
  final TextEditingController _searchController = TextEditingController();
  List<dynamic> _filteredDevices = [];

  @override
  void initState() {
    super.initState();
    _filteredDevices = widget.room.devices ?? [];
    _searchController.addListener(_filterDevices);
  }

  @override
  void dispose() {
    _searchController.removeListener(_filterDevices);
    _searchController.dispose();
    super.dispose();
  }

  void _filterDevices() {
    final query = _searchController.text.toLowerCase();
    setState(() {
      _filteredDevices = widget.room.devices!
          .where((device) => device.type!.toLowerCase().contains(query))
          .toList();
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        if (widget.room.devices!.isNotEmpty)
          TextFormField(
            controller: _searchController,
            decoration: InputDecoration(
              hintText: 'Search',
              hintStyle: const TextStyle(
                  color: ColorsManager.textGray,
                  fontSize: 16,
                  fontWeight: FontWeight.w400),
              prefixIcon: Container(
                padding: const EdgeInsets.all(5.0),
                margin: const EdgeInsets.all(10.0),
                child: SvgPicture.asset(
                  Assets.searchIcon,
                  fit: BoxFit.contain,
                ),
              ),
              border: OutlineInputBorder(
                borderRadius: BorderRadius.circular(8.0),
              ),
            ),
          ),
        Expanded(
          child: GridView.builder(
            gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 2,
              crossAxisSpacing: 10,
              mainAxisSpacing: 10,
              childAspectRatio: 1.5,
            ),
            padding: const EdgeInsets.only(top: 10),
            itemCount: _filteredDevices.length,
            itemBuilder: (context, index) {
              return RoomPageSwitch(device: _filteredDevices[index]);
            },
          ),
        ),
      ],
    );
  }
}