213 lines
8.4 KiB
Dart
213 lines
8.4 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:provider/provider.dart';
|
|
import '../models/todo_item.dart';
|
|
import '../models/family_member.dart';
|
|
import '../services/todo_service.dart';
|
|
import '../services/family_service.dart';
|
|
|
|
class TodoListWidget extends StatelessWidget {
|
|
const TodoListWidget({super.key});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Container(
|
|
decoration: BoxDecoration(
|
|
color: Theme.of(context).cardTheme.color,
|
|
borderRadius: BorderRadius.circular(16),
|
|
),
|
|
padding: const EdgeInsets.all(16),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Text(
|
|
"Today's Todos",
|
|
style: Theme.of(context).textTheme.titleLarge?.copyWith(
|
|
color: Colors.white,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
Icon(
|
|
Icons.check_circle_outline,
|
|
color: Theme.of(context).colorScheme.secondary,
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 12),
|
|
Expanded(
|
|
child: FutureBuilder<List<dynamic>>(
|
|
future: Future.wait([
|
|
Provider.of<TodoService>(
|
|
context,
|
|
listen: false,
|
|
).fetchTodayTodos(),
|
|
Provider.of<FamilyService>(
|
|
context,
|
|
listen: false,
|
|
).fetchFamilyMembers(),
|
|
]),
|
|
builder: (context, snapshot) {
|
|
if (snapshot.connectionState == ConnectionState.waiting) {
|
|
return const Center(child: CircularProgressIndicator());
|
|
}
|
|
|
|
if (snapshot.hasError) {
|
|
return const Center(
|
|
child: Text(
|
|
'Failed to load todos',
|
|
style: TextStyle(color: Colors.white54),
|
|
),
|
|
);
|
|
}
|
|
|
|
if (!snapshot.hasData) {
|
|
return const Center(
|
|
child: Text(
|
|
'No todos today',
|
|
style: TextStyle(color: Colors.white54),
|
|
),
|
|
);
|
|
}
|
|
|
|
final todos = snapshot.data![0] as List<TodoItem>;
|
|
final members = snapshot.data![1] as List<FamilyMember>;
|
|
|
|
if (todos.isEmpty) {
|
|
return const Center(
|
|
child: Column(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
Icon(Icons.thumb_up, color: Colors.white24, size: 32),
|
|
SizedBox(height: 8),
|
|
Text(
|
|
'All done for today!',
|
|
style: TextStyle(color: Colors.white54),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
return ListView.separated(
|
|
itemCount: todos.length,
|
|
separatorBuilder: (context, index) =>
|
|
const Divider(color: Colors.white10),
|
|
itemBuilder: (context, index) {
|
|
final todo = todos[index];
|
|
final member = members.firstWhere(
|
|
(m) => m.id == todo.familyMemberId,
|
|
orElse: () => const FamilyMember(
|
|
id: '',
|
|
name: 'Unknown',
|
|
iconUrl: '',
|
|
emoji: '👤',
|
|
color: '#888888',
|
|
order: 0,
|
|
),
|
|
);
|
|
|
|
// Parse color
|
|
Color memberColor;
|
|
try {
|
|
String cleanHex =
|
|
member.color.replaceAll('#', '').replaceAll('0x', '');
|
|
if (cleanHex.length == 6) {
|
|
cleanHex = 'FF$cleanHex';
|
|
}
|
|
if (cleanHex.length == 8) {
|
|
memberColor = Color(int.parse('0x$cleanHex'));
|
|
} else {
|
|
memberColor = Colors.grey;
|
|
}
|
|
} catch (_) {
|
|
memberColor = Colors.grey;
|
|
}
|
|
|
|
return ListTile(
|
|
contentPadding: EdgeInsets.zero,
|
|
leading: CircleAvatar(
|
|
backgroundColor: memberColor.withOpacity(0.2),
|
|
child: member.iconUrl.isNotEmpty
|
|
? ClipOval(
|
|
child: Image.network(
|
|
member.iconUrl,
|
|
width: 40,
|
|
height: 40,
|
|
fit: BoxFit.cover,
|
|
errorBuilder: (context, error, stackTrace) {
|
|
return Text(
|
|
member.name.isNotEmpty
|
|
? member.name[0].toUpperCase()
|
|
: '?',
|
|
style: TextStyle(
|
|
color: memberColor,
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 20,
|
|
),
|
|
);
|
|
},
|
|
),
|
|
)
|
|
: (member.name.isNotEmpty
|
|
? Text(
|
|
member.name[0].toUpperCase(),
|
|
style: TextStyle(
|
|
color: memberColor,
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 20,
|
|
),
|
|
)
|
|
: Icon(
|
|
Icons.person,
|
|
color: memberColor,
|
|
)),
|
|
),
|
|
title: Text(
|
|
todo.title,
|
|
style: TextStyle(
|
|
color: todo.completed ? Colors.white54 : Colors.white,
|
|
decoration: todo.completed
|
|
? TextDecoration.lineThrough
|
|
: null,
|
|
decorationColor: Colors.white54,
|
|
),
|
|
),
|
|
trailing: Checkbox(
|
|
value: todo.completed,
|
|
onChanged: (val) async {
|
|
// Toggle completion
|
|
final updated = TodoItem(
|
|
id: todo.id,
|
|
familyMemberId: todo.familyMemberId,
|
|
title: todo.title,
|
|
completed: val ?? false,
|
|
dueDate: todo.dueDate,
|
|
);
|
|
await Provider.of<TodoService>(
|
|
context,
|
|
listen: false,
|
|
).updateTodo(updated);
|
|
// Force rebuild? In a real app we'd use a reactive state.
|
|
// Here we rely on the parent or timer to refresh, or we could convert this to StatefulWidget.
|
|
// For now, let's just let the next refresh cycle pick it up, or if the user interacts, maybe we should optimistic update?
|
|
// Given it's a TV dashboard, interaction might be rare, but if it is interactive:
|
|
(context as Element)
|
|
.markNeedsBuild(); // HACK to refresh
|
|
},
|
|
activeColor: Theme.of(context).colorScheme.secondary,
|
|
checkColor: Colors.black,
|
|
),
|
|
);
|
|
},
|
|
);
|
|
},
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
}
|