import 'package:flutter/material.dart';

void main() {
  runApp(const MaterialApp(
    home: TaskManagerApp(),
    debugShowCheckedModeBanner: false,
  ));
}

class TaskManagerApp extends StatefulWidget {
  const TaskManagerApp({Key? key}) : super(key: key);

  @override
  State<TaskManagerApp> createState() => _TaskManagerAppState();
}

class _TaskManagerAppState extends State<TaskManagerApp> {
  final _formKey = GlobalKey<FormState>();
  final TextEditingController _taskController = TextEditingController();

  List<String> tasks = [];

  // Add a new task after validating the form
  void _addTask() {
    if (_formKey.currentState!.validate()) {
      setState(() {
        tasks.add(_taskController.text.trim());
        _taskController.clear();
      });
    }
  }

  // Remove task by index
  void _removeTask(int index) {
    setState(() {
      tasks.removeAt(index);
    });
  }

  @override
  void dispose() {
    _taskController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    // Use MediaQuery for responsive padding (optional)
    final screenWidth = MediaQuery.of(context).size.width;

    return Scaffold(
      appBar: AppBar(
        title: const Text('Simple Task Manager'),
        centerTitle: true,
      ),
      body: Padding(
        padding: EdgeInsets.symmetric(horizontal: screenWidth * 0.05, vertical: 12),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            // Form with input field and validation
            Form(
              key: _formKey,
              child: TextFormField(
                controller: _taskController,
                decoration: const InputDecoration(
                  labelText: 'Enter a new task',
                  border: OutlineInputBorder(),
                ),
                validator: (value) {
                  if (value == null || value.trim().isEmpty) {
                    return 'Please enter a task';
                  }
                  return null;
                },
                onFieldSubmitted: (_) => _addTask(),
              ),
            ),
            const SizedBox(height: 16),

            // Show number of tasks dynamically
            Text(
              'Total Tasks: ${tasks.length}',
              style: const TextStyle(fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 10),

            // Expanded ListView to display tasks dynamically
            Expanded(
              child: tasks.isEmpty
                  ? const Center(
                      child: Text(
                        'No tasks added yet!',
                        style: TextStyle(fontSize: 18, color: Colors.grey),
                      ),
                    )
                  : ListView.builder(
                      itemCount: tasks.length,
                      itemBuilder: (context, index) {
                        return Card(
                          margin: const EdgeInsets.symmetric(vertical: 6),
                          child: ListTile(
                            title: Text(tasks[index]),
                            trailing: IconButton(
                              icon: const Icon(Icons.delete, color: Colors.red),
                              onPressed: () => _removeTask(index),
                            ),
                            onTap: () {
                              // Optional: show a snackbar or detail when tapped
                              ScaffoldMessenger.of(context).showSnackBar(
                                SnackBar(content: Text('Tapped: ${tasks[index]}')),
                              );
                            },
                          ),
                        );
                      },
                    ),
            ),
          ],
        ),
      ),

      // FloatingActionButton to add tasks
      floatingActionButton: FloatingActionButton(
        onPressed: _addTask,
        tooltip: 'Add Task',
        child: const Icon(Icons.add),
      ),
    );
  }
}