SwiftUI menu picker selection issue

menu_picker_selection_issue.swift

import SwiftUI

struct ContentView: View {
    @State private var selection: SortOrder = .ascending

    var body: some View {
        NavigationView {
            VStack {
                Text("Selected Sort Order:")
                Text(selection.rawValue)
                    .font(.largeTitle)
                Picker(selection: $selection) {
                    ForEach(SortOrder.allCases) {
                        Text($0.rawValue)
                            .tag($0)
                    }
                } label: { }
                .pickerStyle(.segmented)
                .padding()
            }
            .toolbar {
                Menu {
                    Picker(selection: $selection) {
                        ForEach(SortOrder.allCases) {
                            Text($0.rawValue)
                                .tag($0)
                        }
                    } label: { }
                } label: {
                    Text("Sort by")
                }
            }
        }
    }
}

enum SortOrder: String, CaseIterable, Identifiable {
    case ascending = "Ascending"
    case descending = "Descending"
    case high = "High"
    case low = "Low"

    var id: String { self.rawValue }
}

This video shows selecting the different values in the menu picker within the toolbar updates the selection as shown in the middle of the screen, however the picker menu selection does not change. (The tick is still selecting the first item)

Simulator.Screen.Recording.-.iPhone.13.Pro.Max.-.2022-08-06.at.17.47.47.mp4

Raised FB11104547

Issue still exists in Xcode 14 beta 5

A workaround, https://twitter.com/DanielKasaj/status/1559453531760992257

Setting the .id(UUID()) on the menu fixes the selection issue.

Menu {
    Picker(selection: $selection) {
        ForEach(SortOrder.allCases) {
            Text($0.rawValue)
                .tag($0)
        }
    } label: { }
} label: {
    Text("Sort by")
}
.id(UUID())