import 'package:flutter/material.dart';
import 'package:outbag_app/backend/room.dart';

class CategoryPicker extends StatelessWidget {
  final List<RoomCategory> categories;
  final int? selected;
  final bool enabled;
  final Function(int?)? onSelect;

  // hint and label may differ depending on the screen
  final String? hint;
  final String? label;

  final String server;
  final String room;

  const CategoryPicker(
      {super.key,
      required this.categories,
      required this.server,
      required this.room,
      this.selected,
      this.onSelect,
      this.hint,
      this.label,
      this.enabled = true});

  @override
  Widget build(BuildContext context) {
    return Padding(
        padding: const EdgeInsets.all(8),
        child: DropdownButtonFormField<int?>(
          hint: hint == null ? null : Text(hint!),
          decoration: InputDecoration(
              label: label == null ? null : Text(label!),
              border: const OutlineInputBorder(),
              prefixIcon: const Icon(Icons.category)),
          value: selected,
          items: [...categories, RoomCategory.other(server, room, context)]
              .map((category) => DropdownMenuItem<int?>(
                    value: category.id,
                    child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: [
                          Text(category.name),
                          Icon(Icons.square_rounded,
                              color: category.color, size: 32)
                        ]),
                  ))
              .toList(),
          onChanged: enabled
              ? (cid) {
                  if (onSelect != null) {
                    onSelect!(cid);
                  }
                }
              : null,
        ));
  }
}