SwiftUI - Pages with embedded NavigationViews - swiftui

Question

I'm attempting to build a paging app, where each page has its own NavigationView. It sort of works, but I get a completely redundant "Back" button in the navigation bar. My code so far is -
struct AllListsView: View {
#ObservedObject var viewModel: AllListsViewModel
#State private var pageName: String = ""
init(viewModel: AllListsViewModel) {
self.viewModel = viewModel
}
var body: some View {
IfLet($viewModel.listViews) { listViews in
TabView {
ForEach(listViews) { $0 }
}
.tabViewStyle(PageTabViewStyle(indexDisplayMode: .automatic))
} else: {
Text("No lists")
}
}
}
struct ListView: View, Identifiable, Hashable {
let id: String
private var viewModel: ListViewModel
init(viewModel: ListViewModel) {
self.id = String(viewModel.list.index)
self.viewModel = viewModel
}
var body: some View {
NavigationView {
Text("Any Text") // if I don't have this, nothing is displayed
List(viewModel.listItems) {
Text("\($0.quantity) \($0.name)")
}
.navigationBarTitle(viewModel.list.name)
}
}
func hash(into hasher: inout Hasher) {
hasher.combine(id)
}
static func == (lhs: ListView, rhs: ListView) -> Bool {
lhs.id == rhs.id
}
}
However, if I put the NavigationView outside the TabView, it displays correctly, but then scrolling the list doesn't shrink the large title text and I have to update the navigationBar title when the page changes -
// AllListsView -
var body: some View {
IfLet($viewModel.listViews) { listViews in
NavigationView {
TabView {
ForEach(listViews, id: \.self) { listView in
listView
.onAppear {
pageName = listView.name
}
}
}
.tabViewStyle(PageTabViewStyle(indexDisplayMode: .automatic))
.navigationBarTitle(pageName)
}
} else: {
Text("No lists")
}
}
// ListView -
var body: some View {
List(viewModel.listItems) {
Text("\($0.quantity) \($0.name)")
}
}
I'd like to be able to do this in SwiftUI, as it looks like the way ahead. But I know that for me to do this using UIKit would be fairly trivial, so it's frustrating.
Any help much appreciated!