New task feature (#2)

This PR contains the work done to implement the **New Task** feature, and to integrate it into the main context view of the app.

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

App/Sources/Views/ContentView.swift

@@ -1,63 +1,52 @@
 import SwiftData
 import SwiftUI
 
+/// The main content view of the app.
+///
+/// This view serves as the primary interface for managing todo tasks.
+///
+/// The view uses a dedicated view model (`ViewModel`) to manage state and business logic, following the MVVM pattern.
+/// User interactions are handled through the view model, maintaining separation of concerns.
 struct ContentView: View {
 
-    @Environment(\.modelContext)
-    private var modelContext
+    // MARK: Properties
 
-    @Query
-    private var items: [Item]
+    /// The view model managing the state and logic for this view.
+    @State
+    private var viewModel = ViewModel()
 
+    // MARK: Body
+
+    /// The content and behavior of the view.
+    ///
+    /// Displays a navigation view containing:
+    /// - A floating action button for adding new tasks
+    ///
+    /// The view presents a sheet when `viewModel.newTaskShown` is true,
+    /// allowing users to create new todo tasks.
     var body: some View {
-        NavigationSplitView {
-            List {
-                ForEach(items) { item in
-                    NavigationLink {
-                        Text("Item at \(item.timestamp, format: Date.FormatStyle(date: .numeric, time: .standard))")
-                    } label: {
-                        Text(item.timestamp, format: Date.FormatStyle(date: .numeric, time: .standard))
-                    }
-                }
-                .onDelete(perform: deleteItems)
-            }
-            #if os(macOS)
-            .navigationSplitViewColumnWidth(min: 180, ideal: 200)
-            #endif
-            .toolbar {
-                #if os(iOS)
-                ToolbarItem(placement: .navigationBarTrailing) {
-                    EditButton()
-                }
-                #endif
-                ToolbarItem {
-                    Button(action: addItem) {
-                        Label("Add Item", systemImage: "plus")
-                    }
-                }
-            }
-        } detail: {
-            Text("Select an item")
-        }
-    }
+        NavigationView {
+            ZStack(alignment: .bottomTrailing) {
+                List {}
 
-    private func addItem() {
-        withAnimation {
-            let newItem = Item(timestamp: Date())
-            modelContext.insert(newItem)
-        }
-    }
-
-    private func deleteItems(offsets: IndexSet) {
-        withAnimation {
-            for index in offsets {
-                modelContext.delete(items[index])
+                Button(action: viewModel.showNewTask) {
+                    Image(systemName: "plus")
+                        .frame(width: 48, height: 48)
+                        .foregroundStyle(.white)
+                }
+                .glassEffect(.regular.tint(.blue.opacity(0.8)).interactive())
+                .padding(.trailing, 20)
             }
+            .navigationTitle("Todos")
+        }
+        .sheet(isPresented: $viewModel.newTaskShown) {
+            NewTaskView()
         }
     }
 }
 
+// MARK: - Previews
+
 #Preview {
     ContentView()
-        .modelContainer(for: Item.self, inMemory: true)
 }

App/Sources/Views/NewTaskView.swift

@@ -0,0 +1,105 @@
+import SwiftData
+import SwiftUI
+
+/// A view for creating new todo tasks.
+///
+/// This view provides a form interface for users to input todo task details including:
+/// - *Title* (required)
+/// - *Note* (optional)
+/// - *Due date* (required)
+///
+/// The view uses a dedicated view model (`ViewModel`) to manage state and business logic, following the MVVM pattern.
+/// When the user saves, the todo is inserted into the SwiftData model context and the view is dismissed afterwards.
+struct NewTaskView: View {
+
+    // MARK: Properties
+
+    /// Environment value for dismissing this view.
+    @Environment(\.dismiss)
+    private var dismiss
+
+    /// SwiftData model context for saving todo tasks.
+    @Environment(\.modelContext)
+    private var modelContext
+
+    /// The view model managing the state and logic for this view.
+    @State
+    private var viewModel: ViewModel
+
+    // MARK: Initialization
+
+    /// Initializes a new task view with a fresh view model instance.
+    init() {
+        _viewModel = State(initialValue: .init())
+    }
+
+    // MARK: Body
+
+    /// The content and behavior of the view.
+    ///
+    /// Displays a navigation stack containing a form with sections for:
+    /// - Task details (title and note fields)
+    /// - Due date picker with graphical style
+    ///
+    /// The toolbar includes:
+    /// - Cancel button to dismiss without saving
+    /// - Confirm button to persist the todo and dismiss (disabled when title is empty)
+    var body: some View {
+        NavigationStack {
+            Form {
+                Section("view.new-task.section.task") {
+                    TextField(
+                        "view.new-task.placeholder.title",
+                        text: $viewModel.title
+                    )
+                    .autocapitalization(.none)
+                    .autocorrectionDisabled(false)
+                    .keyboardType(.asciiCapable)
+
+                    TextField(
+                        "view.new-task.placeholder.note",
+                        text: $viewModel.note,
+                        axis: .vertical
+                    )
+                    .autocapitalization(.none)
+                    .autocorrectionDisabled(false)
+                    .keyboardType(.asciiCapable)
+                    .lineLimit(3 ... 6)
+                }
+
+                Section("view.new-task.section.due-date") {
+                    DatePicker(
+                        "view.new-task.placeholder.due-date",
+                        selection: $viewModel.due,
+                        displayedComponents: [.date]
+                    )
+                    .datePickerStyle(.graphical)
+                }
+            }
+            .navigationTitle("view.new-task.navigation.title")
+            .navigationBarTitleDisplayMode(.inline)
+            .toolbar {
+                ToolbarItem(placement: .cancellationAction) {
+                    Button(role: .cancel) {
+                        dismiss()
+                    }
+                }
+                ToolbarItem(placement: .confirmationAction) {
+                    Button(role: .confirm) {
+                        viewModel.save(to: modelContext)
+                        dismiss()
+                    }
+                    .disabled(!viewModel.canConfirm)
+                }
+            }
+        }
+    }
+
+}
+
+// MARK: - Previews
+
+#Preview("New todo task") {
+    NewTaskView()
+        .modelContainer(for: Todo.self, inMemory: true)
+}