Monterey / SwiftUI view not updating as expecting

The following code is stripped out from an app that compiles and works under MacOS 11. It shows a tab bar - clicking on an item will highlight it. Under the tab bar is a text edit field where one can edit the title of the selected tab.

There are 2 issues:

  1. The tab title shown in the title editor is allows out of phase from the selected tab
  2. Irrespective of which tab item is selected, when the title is edited it always updates the first tab

I'm not sure if I was very lucky that this code ever worked under Big Sur, or if there is an issue with Monterey. I'm definitely not holding this up as example code - I'm sure there are better ways to implement it, but seek opinions on whether it should work.

import SwiftUI

class Document: ObservableObject {
    var tabs = [Tab(id: 0), Tab(id: 1)]
    var viewSettings = ViewSettings()
}

class Tab: ObservableObject, Identifiable {
    let id: Int
    @Published var title: String
    
    init(id: Int) {
        self.id = id
        self.title = "Tab \(id)"
    }
}

class ViewSettings: ObservableObject {
    @Published var activeTab: Int = 0
}

@main
struct Test: App {
    @StateObject var document: Document = Document()
    
    var body: some Scene {
        WindowGroup {
            ContentView()
                .padding()
                .environmentObject(document)
                .environmentObject(document.viewSettings)
        }
    }
}

struct ContentView: View {
    @EnvironmentObject var document: Document
    @EnvironmentObject var viewSettings: ViewSettings
    
    var body: some View {
        TabBar(viewSettings: document.viewSettings)
        TabEditView(activeTab: document.tabs[viewSettings.activeTab])
    }
}

struct TabEditView: View {
    @EnvironmentObject var viewSettings: ViewSettings
    @ObservedObject var activeTab: Tab
    @State var title: String = ""

    init(activeTab: Tab) {
        print("CONSOLE - Init TabEditView for tab \(activeTab.id)")
        self.activeTab = activeTab
    }
    
    var body: some View {
        HStack {
            Text("Tab title:")
            TextField("Tab title:", text: $title, onCommit: { activeTab.title = title })
                .onAppear { title = activeTab.title }
                .onChange(of: viewSettings.activeTab) { _ in
                    print("CONSOLE - Updating TextField from tab \(activeTab.id)")
                    title = activeTab.title
                }
        }
    }
}

struct TabBar: View {
    @EnvironmentObject var document: Document
    @ObservedObject var viewSettings: ViewSettings
    
    var body: some View {
        HStack {
            ForEach(document.tabs, content: TabItem.init)
        }
    }
}

struct TabItem: View {
    @EnvironmentObject var viewSettings: ViewSettings
    @ObservedObject var tab: Tab
    
    init(_ tab : Tab) { self.tab = tab }
    
    var body: some View {
        Text(tab.title)
            .padding(2)
            .background(tab.id == viewSettings.activeTab ? .red : .clear)
            .cornerRadius(4)
            .onTapGesture {
                viewSettings.activeTab = tab.id
            }
    }
}
Monterey / SwiftUI view not updating as expecting
 
 
Q