import 'package:flutter/material.dart';
import 'package:syncrow_web/pages/spaces_management/all_spaces/model/tag.dart';
import 'package:uuid/uuid.dart';

import '../../../../../common/dialog_dropdown.dart';
import '../../../../../common/tag_dialog_textfield_dropdown.dart';
import '../../../../../utils/color_manager.dart';

class AssignTagsTable extends StatelessWidget {
  const AssignTagsTable({
    super.key,
    required this.controllers,
    required this.locations,
    required this.tags,
    required this.updatedTags,
    required this.onDeleteDevice,
    required this.onLocationDropDownSelected,
    required this.onTagDropDownSelected,
  });
  final void Function({required Tag tag, required int index})
      onTagDropDownSelected;
  final void Function({required String location, required int index})
      onLocationDropDownSelected;
  final void Function({required Tag tag, required int index}) onDeleteDevice;
  final List<Tag> tags;
  final List<Tag> updatedTags;
  final List<TextEditingController> controllers;
  final List<String> locations;

  @override
  Widget build(BuildContext context) {
    return ClipRRect(
      borderRadius: BorderRadius.circular(20),
      child: DataTable(
        headingRowColor: WidgetStateProperty.all(ColorsManager.dataHeaderGrey),
        key: ValueKey(tags.length),
        border: TableBorder.all(
          color: ColorsManager.dataHeaderGrey,
          width: 1,
          borderRadius: BorderRadius.circular(20),
        ),
        columns: [
          DataColumn(
              label: Text('#', style: Theme.of(context).textTheme.bodyMedium)),
          DataColumn(
              label: Text('Device',
                  style: Theme.of(context).textTheme.bodyMedium)),
          DataColumn(
              numeric: false,
              label:
                  Text('Tag', style: Theme.of(context).textTheme.bodyMedium)),
          DataColumn(
              label: Text('Location',
                  style: Theme.of(context).textTheme.bodyMedium)),
        ],
        rows: tags.isEmpty
            ? [
                DataRow(cells: [
                  DataCell(
                    Center(
                      child: Text('No Devices Available',
                          style:
                              Theme.of(context).textTheme.bodyMedium?.copyWith(
                                    color: ColorsManager.lightGrayColor,
                                  )),
                    ),
                  ),
                  const DataCell(SizedBox()),
                  const DataCell(SizedBox()),
                  const DataCell(SizedBox()),
                ])
              ]
            : List.generate(tags.length, (index) {
                final tag = tags[index];
                final controller = controllers[index];

                return DataRow(
                  cells: [
                    DataCell(Text((index + 1).toString())),
                    DataCell(
                      Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Expanded(
                              child: Text(
                            tag.product?.name ?? 'Unknown',
                            overflow: TextOverflow.ellipsis,
                          )),
                          const SizedBox(width: 10),
                          Container(
                            width: 20.0,
                            height: 20.0,
                            decoration: BoxDecoration(
                              shape: BoxShape.circle,
                              border: Border.all(
                                color: ColorsManager.lightGrayColor,
                                width: 1.0,
                              ),
                            ),
                            child: IconButton(
                              icon: const Icon(
                                Icons.close,
                                color: ColorsManager.lightGreyColor,
                                size: 16,
                              ),
                              onPressed: () {
                                onDeleteDevice(tag: tag, index: index);
                              },
                              tooltip: 'Delete Tag',
                              padding: EdgeInsets.zero,
                              constraints: const BoxConstraints(),
                            ),
                          ),
                        ],
                      ),
                    ),
                    DataCell(
                      Container(
                        alignment: Alignment
                            .centerLeft, // Align cell content to the left
                        child: SizedBox(
                          width: double.infinity,
                          child: TagDialogTextfieldDropdown(
                            key: ValueKey(
                                'dropdown_${const Uuid().v4()}_$index'),
                            product: tag.product?.uuid ?? 'Unknown',
                            items: updatedTags,
                            initialValue: tag,
                            onSelected: (value) {
                              controller.text = value.tag ?? '';
                              onTagDropDownSelected(tag: value, index: index);
                            },
                          ),
                        ),
                      ),
                    ),
                    DataCell(
                      SizedBox(
                          width: double.infinity,
                          child: DialogDropdown(
                            items: locations,
                            selectedValue: tag.location ?? 'Main Space',
                            onSelected: (value) {
                              onLocationDropDownSelected(
                                  location: value, index: index);
                            },
                          )),
                    ),
                  ],
                );
              }),
      ),
    );
  }
}
