Readme

README.md

@@ -155,4 +155,14 @@ void main() {
 }
 ```
 
+## Use cases
+
+<img src="tomato.jpg">
+
+Tomato works like a Pomodoro timer, you can create multiple timers to organize your tasks and breks.
+This project use `flutter_shared_state` tecnique to share the states between multiple widgets and
+manage a lot of changes in the user interface.
+
+---
+
 Carlos Costa @ 2024

lib/modules/todo_list/todo_list_page.dart

@@ -13,7 +13,9 @@ class _TodoListPageState extends State<TodoListPage> with SharedState {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
+      key: const ValueKey('todo_list_page'),
       floatingActionButton: FloatingActionButton(
+        key: const ValueKey('add_todo_button'),
         onPressed: () {
           todoList.addTodo(
             description: 'New Todo: ${todoList.randomId}',
@@ -25,45 +27,56 @@ class _TodoListPageState extends State<TodoListPage> with SharedState {
       appBar: AppBar(
         title: Text('Todo List - Total: ${todoList.todos.length}'),
       ),
-      body: ListView.builder(
-        itemCount: todoList.todos.length,
-        itemBuilder: (context, index) {
-          Todo todo = todoList.todos[index];
+      body: Builder(builder: (context) {
+        if (todoList.todos.isEmpty) {
+          return const Center(
+            key: ValueKey('todo_list_empty_message'),
+            child: Text('No Todos', style: TextStyle(fontSize: 20)),
+          );
+        }
+
+        return ListView.builder(
+          key: const ValueKey('todo_list_body'),
+          itemCount: todoList.todos.length,
+          itemBuilder: (context, index) {
+            Todo todo = todoList.todos[index];
 
-          return ListTile(
-            title: Text(
-              todo.description,
-              style: TextStyle(
-                fontSize: 20,
-                color: todo.done ? Colors.red : Colors.black,
-                decoration: todo.done ? TextDecoration.lineThrough : null,
+            return ListTile(
+              key: ValueKey("todo_list_item_$index"),
+              title: Text(
+                todo.description,
+                style: TextStyle(
+                  fontSize: 20,
+                  color: todo.done ? Colors.red : Colors.black,
+                  decoration: todo.done ? TextDecoration.lineThrough : null,
+                ),
               ),
-            ),
-            onTap: () {
-              setDescription(context, (String description) {
-                todoList.setDescription(
-                  todo.id,
-                  description,
-                );
-              });
-            },
-            leading: IconButton(
-              onPressed: () {
-                todoList.checkTodo(todo.id, !todo.done);
+              onTap: () {
+                setDescription(context, (String description) {
+                  todoList.setDescription(
+                    todo.id,
+                    description,
+                  );
+                });
               },
-              icon: Icon(
-                todo.done ? Icons.check_box : Icons.check_box_outline_blank,
+              leading: IconButton(
+                onPressed: () {
+                  todoList.checkTodo(todo.id, !todo.done);
+                },
+                icon: Icon(
+                  todo.done ? Icons.check_box : Icons.check_box_outline_blank,
+                ),
               ),
-            ),
-            trailing: IconButton(
-              onPressed: () {
-                todoList.removeTodo(todo.id);
-              },
-              icon: const Icon(Icons.delete),
-            ),
-          );
-        },
-      ),
+              trailing: IconButton(
+                onPressed: () {
+                  todoList.removeTodo(todo.id);
+                },
+                icon: const Icon(Icons.delete),
+              ),
+            );
+          },
+        );
+      }),
     );
   }
 

test/widgets/todo_list_test.dart

@@ -0,0 +1,16 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_shared_state/modules/todo_list/todo_list_page.dart';
+import 'package:flutter_test/flutter_test.dart';
+
+void main() {
+  testWidgets('check rendering of todo list', (WidgetTester tester) async {
+    await tester.pumpWidget(const MaterialApp(
+      home: TodoListPage(),
+    ));
+
+    await tester.pumpAndSettle();
+
+    //see empty message
+    expect(find.byKey(const ValueKey('todo_list_empty_message')), findsOneWidget);
+  });
+}