import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/constants/assets.dart';

class DynamicTable extends StatefulWidget {
  final List<String> headers;
  final List<List<dynamic>> data;
  final BoxDecoration? headerDecoration;
  final BoxDecoration? cellDecoration;
  final Size size;
  final bool withCheckBox;
  final bool isEmpty;
  final void Function(bool?)? selectAll;
  final void Function(int, bool, dynamic)? onRowSelected;
  final List<String>? initialSelectedIds;

  const DynamicTable({
    super.key,
    required this.headers,
    required this.data,
    required this.size,
    required this.isEmpty,
    required this.withCheckBox,
    this.headerDecoration,
    this.cellDecoration,
    this.selectAll,
    this.onRowSelected,
    this.initialSelectedIds,
  });

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

class _DynamicTableState extends State<DynamicTable> {
  late List<bool> _selected;

  @override
  void initState() {
    super.initState();
    _selected = List<bool>.generate(widget.data.length, (index) {
      return widget.initialSelectedIds != null &&
          widget.initialSelectedIds!.contains(widget.data[index][1]);
    });
  }

  void _toggleRowSelection(int index) {
    setState(() {
      // Deselect all rows
      for (int i = 0; i < _selected.length; i++) {
        _selected[i] = false;
      }
      // Select the clicked row
      _selected[index] = true;

      if (widget.onRowSelected != null) {
        widget.onRowSelected!(index, true, widget.data[index]);
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: widget.cellDecoration,
      child: Padding(
        padding: const EdgeInsets.all(2.0),
        child: ListView(
          scrollDirection: Axis.horizontal,
          children: [
            SizedBox(
              width: widget.size.width,
              child: Column(
                children: [
                  Container(
                    decoration: widget.headerDecoration ??
                        BoxDecoration(color: Colors.grey[200]),
                    child: Row(
                      children: [
                        if (widget.withCheckBox) _buildSelectAllCheckbox(),
                        ...widget.headers
                            .map((header) => _buildTableHeaderCell(header))
                            .toList(),
                      ],
                    ),
                  ),
                  widget.isEmpty
                      ? Expanded(
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Row(
                                crossAxisAlignment: CrossAxisAlignment.center,
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: [
                                  Column(
                                    children: [
                                      SvgPicture.asset(Assets.emptyTable),
                                      const SizedBox(
                                        height: 15,
                                      ),
                                      Text(
                                        'No Devices',
                                        style: Theme.of(context)
                                            .textTheme
                                            .bodySmall!
                                            .copyWith(
                                                color: ColorsManager.grayColor),
                                      )
                                    ],
                                  ),
                                ],
                              ),
                            ],
                          ),
                        )
                      : Expanded(
                          child: Container(
                            color: Colors.white,
                            child: ListView.builder(
                              shrinkWrap: true,
                              itemCount: widget.data.length,
                              itemBuilder: (context, index) {
                                final row = widget.data[index];
                                return Row(
                                  children: [
                                    if (widget.withCheckBox)
                                      _buildRowCheckbox(
                                          index, widget.size.height * 0.10),
                                    ...row
                                        .map((cell) => _buildTableCell(
                                            cell.toString(),
                                            widget.size.height * 0.10))
                                        .toList(),
                                  ],
                                );
                              },
                            ),
                          ),
                        ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildSelectAllCheckbox() {
    return Container(
      width: 50, // Fixed width to align with the checkbox column
      padding: const EdgeInsets.all(8.0),
      decoration: const BoxDecoration(
        border: Border.symmetric(
          vertical: BorderSide(color: ColorsManager.boxDivider),
        ),
      ),
      child: Checkbox(
        value: _selected.every((element) => element == true),
        onChanged: null, // Disabling the toggle as we're not using select all
      ),
    );
  }

  Widget _buildRowCheckbox(int index, double size) {
    return Container(
      width: 50, // Fixed width to align with the checkbox column
      padding: const EdgeInsets.all(8.0),
      height: size,
      decoration: const BoxDecoration(
        border: Border(
          bottom: BorderSide(
            color: ColorsManager.boxDivider,
            width: 1.0,
          ),
        ),
      ),
      alignment: Alignment.centerLeft,
      child: Center(
        child: Checkbox(
          value: _selected[index],
          onChanged: (bool? value) {
            _toggleRowSelection(index);
          },
        ),
      ),
    );
  }

  Widget _buildTableHeaderCell(String title) {
    return Expanded(
      child: Container(
        decoration: const BoxDecoration(
          border: Border.symmetric(
            vertical: BorderSide(color: ColorsManager.boxDivider),
          ),
        ),
        alignment: Alignment.centerLeft,
        child: Padding(
          padding: const EdgeInsets.all(8.0),
          child: Text(
            title,
            style: const TextStyle(
              fontWeight: FontWeight.w400,
              fontSize: 13,
              color: Color(0xFF999999),
            ),
          ),
        ),
      ),
    );
  }

  Widget _buildTableCell(String content, double size) {
    // Check if the content is a battery level percentage
    bool isBatteryLevel = content.endsWith('%');
    double? batteryLevel;

    if (isBatteryLevel) {
      batteryLevel = double.tryParse(content.replaceAll('%', '').trim());
    }

    return Expanded(
      child: Container(
        height: size,
        padding: const EdgeInsets.all(5.0),
        decoration: const BoxDecoration(
          border: Border(
            bottom: BorderSide(
              color: ColorsManager.boxDivider,
              width: 1.0,
            ),
          ),
        ),
        alignment: Alignment.centerLeft,
        child: Text(
          content,
          style: TextStyle(
            color: batteryLevel != null && batteryLevel < 20
                ? ColorsManager.red // Red color for low battery
                : content == 'Online'
                    ? ColorsManager.green // Green color for Online
                    : content == 'Offline'
                        ? ColorsManager.red // Red color for Offline
                        : Colors.black,
            fontSize: 12,
            fontWeight: FontWeight.w400,
          ),
        ),
      ),
    );
  }
}