Show completed task feature (#5)

This PR contains the work done to add support for showing or hiding completed todo tasks to the *Task list* view.

Reviewed-on: rock-n-code/todos-app#5
Co-authored-by: Javier Cicchelli <javier@rock-n-code.com>
Co-committed-by: Javier Cicchelli <javier@rock-n-code.com>

App/Sources/Views/TaskList/TaskListContent.swift

@@ -0,0 +1,104 @@
+import SwiftData
+import SwiftUI
+
+extension TaskListView {
+
+    /// Internal content view that manages the dynamic SwiftData query for tasks.
+    ///
+    /// This view is responsible for querying and displaying the list of tasks based on
+    /// the specified group and completion status filter. It exists as a separate view
+    /// to enable dynamic query updates when filter parameters change.
+    struct Content: View {
+
+        // MARK: Properties
+
+        /// Query to fetch todos filtered by group and completion status.
+        ///
+        /// This query is initialized with a `FetchDescriptor` that applies predicates
+        /// based on the group type and completion filter. SwiftData automatically
+        /// monitors changes and updates the view when the underlying data changes.
+        @Query
+        private var tasks: [Todo]
+
+        // MARK: Initializers
+
+        /// Creates a content view with a configured task query.
+        ///
+        /// This initializer sets up the `@Query` with a fetch descriptor that filters
+        /// tasks based on the specified group and completion status. When these parameters
+        /// change, SwiftUI recreates the view with new values, causing the query to update.
+        ///
+        /// - Parameters:
+        ///   - group: The todo group category to filter by (today, upcoming, overdue, or completed).
+        ///   - showCompleted: Whether to include completed tasks in the results. Only applies to groups other than `.completed`.
+        init(
+            group: TodoGroup,
+            showCompleted: Bool
+        ) {
+            _tasks = .init(
+                FetchDescriptor<Todo>(
+                    group: group,
+                    showCompleted: showCompleted
+                )
+            )
+        }
+
+        // MARK: Body
+
+        /// The content and behavior of the view.
+        ///
+        /// Displays either a content unavailable state or a list of tasks
+        /// based on whether any tasks match the current filters.
+        var body: some View {
+            Group {
+                if tasks.isEmpty {
+                    ContentUnavailableView(
+                        "view.task-list-content.content-unavailable.title",
+                        systemImage: "checkmark.circle"
+                    )
+                }
+                else {
+                    List {
+                        ForEach(tasks) { todo in
+                            TaskListView.Item(todo)
+                        }
+                    }
+                    .listStyle(.grouped)
+                }
+            }
+        }
+    }
+
+}
+
+// MARK: - Previews
+
+#Preview(
+    "Task list content when there are no tasks",
+    traits: .emptyContainer
+) {
+    TaskListView.Content(
+        group: .today,
+        showCompleted: .random()
+    )
+}
+
+#Preview(
+    "Task list content when completed tasks not shown",
+    traits: .sampleTasks
+) {
+    TaskListView.Content(
+        group: .today,
+        showCompleted: false
+    )
+}
+
+#Preview(
+    "Task list content when completed tasks shown",
+    traits: .sampleTasks
+) {
+    TaskListView.Content(
+        group: .today,
+        showCompleted: true
+    )
+}

App/Sources/Views/TaskListView.swift

@@ -1,54 +1,60 @@
 import SwiftData
 import SwiftUI
 
-/// A view that displays all todo tasks for a specific task group.
+/// A view that displays filtered todo tasks for a specific task group.
 ///
-/// This view shows a filtered list of tasks based on the selected group (today, upcoming, past, or completed).
-/// The view uses a view model to separate business logic from presentation.
+/// This view provides the presentation layer for displaying and managing tasks within a specific group category.
+/// It follows the MVVM pattern, delegating business logic to a view model and data fetching to a separate content view.
 struct TaskListView: View {
-    
+
     // MARK: Properties
-    
-    /// Query to fetch todos filtered by the current group.
-    @Query
-    private var tasks: [Todo]
-    
-    /// The view model managing the business logic for this view.
+
+    /// The view model managing the state and business logic for this view.
+    ///
+    /// This view model holds the group configuration and completion filter state.
     @State
     private var viewModel: ViewModel
 
     // MARK: Initialization
-    
+
     /// Creates a new task list view for a specific group.
-    /// - Parameter group: The todo group to display tasks for.
+    ///
+    /// - Parameter group: The todo group category to display tasks for.
     init(group: TodoGroup) {
-        _tasks = .init(FetchDescriptor<Todo>(group: group))
         _viewModel = .init(initialValue: ViewModel(group: group))
     }
-    
+
     // MARK: Body
-    
+
     /// The content and behavior of the view.
     ///
-    /// Displays a list of tasks filtered by the current group.
+    /// Displays the task list content with navigation title and toolbar controls.
+    /// The toolbar includes a completion filter toggle for groups that support it.
     var body: some View {
-        Group {
-            if tasks.isEmpty {
-                ContentUnavailableView(
-                    "view.task-list.content-unavailable.title",
-                    systemImage: "checkmark.circle"
-                )
-            } else {
-                List {
-                    ForEach(tasks) { todo in
-                        Item(todo)
+        Content(
+            group: viewModel.group,
+            showCompleted: viewModel.showCompleted
+        )
+        .navigationTitle(viewModel.navigationTitle)
+        .toolbar {
+            if viewModel.canShowCompleted {
+                Menu {
+                    Button.init(
+                        viewModel.buttonCompleted.title,
+                        systemImage: viewModel.buttonCompleted.icon
+                    ) {
+                        viewModel.toggleCompletedVisibility()
                     }
+                } label: {
+                    Label(
+                        "view.task-list.label.actions",
+                        systemImage: "ellipsis"
+                    )
                 }
-                .listStyle(.grouped)
             }
         }
-        .navigationTitle(viewModel.navigationTitle)
     }
+
 }
 
 // MARK: - Previews