Cookcademy 8: Edit Mode Acting Strange

Hi all,

I’m running through the Cookcademy course for SwiftUI and I’m at the portion where you add the EditButton() to allow for changes to the list. I’m running in to an issue however where when I press the button, and move a row in the list, the animation will stall making it look like there’s an empty space in the list, then edit mode will just toggle off right afterward with the newly organized list. There’s also a bug where once I click done to exit edit mode, I leave and then re-enter editing mode as if the button was pressed twice.

I, for the most part, followed the code provided. (One of the only major changes I made due to some of the components and functions listed in the course is switching NavigationView for NavigationStack due to it being deprecated) But the parts I’ve changed don’t feel as though they should affect this part of the code so I’m stuck debugging.

Was wondering if anyone might know what could be causing these issues?
(I also have video of these behaviors but the forum says “New users can’t upload attachments”?)

// ModifyComponentsView.swift
HStack {
    Text(Component.pluralName().capitalized)
        .font(.title)
        .padding()
    Spacer()
    EditButton()
        .padding()
}

List {
    ForEach(components.indices, id: \.self) { index in
        let component = components[index]
        let editComponentView = DestinationView(component: $components[index], modifyComponentMode: .edit) { _ in
            return
        }
        NavigationLink(component.description, destination: editComponentView)
            .listRowBackground(listBackgroundColor)
    }
    .onDelete {
        components.remove(atOffsets: $0)
    }
    .onMove { indices, newOffset in
        components.move(fromOffsets: indices, toOffset: newOffset)
    }
    
    NavigationLink("Add another \(Component.singularName())", destination: addComponentView)
        .listRowBackground(listBackgroundColor)
}
.foregroundColor(listTextColor)