[SOLVED] How to allow row selection in a list when there is a ForEach inside it?

How to allow row selection in a list when there is a ForEach inside it?

I have a foreach inside a list and I am trying to make the items selectable with an edit Button:

@State private var selection: Workout?

var body: some View {
    NavigationStack {
        List(selection: $selection) {
            Section(header: Text("Recent Workouts")) {
                ForEach(workouts) { workout in
                    NavigationLink {
                        EditWorkoutView(workout: workout)
                            .navigationBarBackButtonHidden(true)
                    } label: {


  .toolbar {
                EditButton()

But when I click the edit button the whole list blanks out instead of making the items selectable, I have to use forEach I cannot add workouts directly into the List, so is there any way around this?

Solution

The type of selection must match the type of the ForEach id parameter which is the ID type of the Identifiable protocol if the id parameter is inferred.

Either specify id:

ForEach(workouts, id: \.self) { …

Or declare selection this way

@State private var selection: Workout.ID?

The second way is preferred.