import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import '../buisness/ToDoItem.dart';
import '../buisness/ToDoProvider.dart';

class ToDoExpandableWidget extends StatelessWidget {
  final ToDoItem toDoItem;
  final int id;

  getStatusColor(String status) {
    switch(status) {
      case 'Pending':
        return Colors.blueGrey;
      case 'In Progress':
        return Colors.lime;
      case 'Completed':
        return Colors.green;
    }
  }

  const ToDoExpandableWidget({
    super.key,
    required this.toDoItem,
    required this.id,
  });

  @override
  Widget build(BuildContext context) {
    return Card(
      color: getStatusColor(toDoItem.status),
      margin: const EdgeInsets.only(bottom: 16),

      child: ExpansionTile(
        title: Text(toDoItem.name, style: const TextStyle(color: Colors.black)),
        subtitle: Text('Due: ${toDoItem.dueDate.toLocal()}'),
        children: [
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(toDoItem.description, style: const TextStyle(color: Colors.black)),
                const SizedBox(height: 10),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    TextButton.icon(
                      onPressed: () {
                        Provider.of<ToDoProvider>(context, listen: false).deleteItem(toDoItem.id!);
                      },
                      icon: const Icon(Icons.delete),
                      label: const Text("Delete"),
                      style: ElevatedButton.styleFrom(
                        foregroundColor: const Color(0xFFBB0000),
                        backgroundColor: getStatusColor(toDoItem.status),
                        textStyle: const TextStyle(fontSize: 15),
                        iconColor: const Color(0xFFBB0000),
                      ),
                    ),
                    Container(
                      decoration: BoxDecoration(
                        color: getStatusColor(toDoItem.status),
                        borderRadius: BorderRadius.circular(20.0),
                      ),
                      padding: const EdgeInsets.symmetric(horizontal: 16),
                      child: DropdownButton<String>(
                        value: toDoItem.status,
                        items: ['Pending', 'In Progress', 'Completed']
                            .map((status) => DropdownMenuItem(
                          value: status,
                          child: Text(status),
                        ))
                            .toList(),
                        dropdownColor: getStatusColor(toDoItem.status),
                        borderRadius: BorderRadius.circular(20),
                        onChanged: (value) {
                          if (value != null) {
                            Provider.of<ToDoProvider>(context, listen: false).updateStatus(id, value);
                          }
                        },
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}