I have a main tab bar that has three tabs, in the first tab I have a background task that may return an error, this error is presented by an alert view. now if I moved to any tab views in the app while the background task is running and an error occurred the alert will present on the current view instead of showing in the first tab view.

struct FirstTabView: View {
    // viewModel will fire the background task after init 
    @StateObject var viewModel: FirstViewModel = .init()

    var body: some View {
        Text("Hello First")
            .alert("error", isPresented: .init(get: {
                return viewModel.errorMessage != nil
            }, set: { _ in
                viewModel.errorMessage = nil
            })) {
                Button("OK") {
                    
                }
            }
    }
}

how can I limit the error alert to be presented on the first tab only?

CodePudding user response：

One solution could be move the alert to the main TabView, rather than having it shown in the child view. By doing that, you will be able to track what tab is selected and trigger the alert only when both conditions are true:

• the first tab is selected
• the view-model's property errorMessage is not nil

The trigger is a dedicated showAlert state property in your TabView view, that will change whenever the first tab appears on the screen.

In the example here below, you can change your view-model's property from the second view, but the alert will only be shown when you move to the first tab; I hope this is what you are looking for:

// The model must be an observable class
class MyModel: ObservableObject {
    
    // The error message must be a published property
    @Published var errorMessage: String? = nil
}

struct MyTabs: View {
    // viewModel will fire the background task after init
    let viewModel = MyModel()   // Use your ViewModel as applicable
    
    @State private var tabSelection = 0    // This property will track the selected tab
    @State private var showAlert = false   // This property is the trigger to the alert
    
    var body: some View {
        TabView(selection: $tabSelection) {    // The selection: parameter tracks the selected tab through the .tag()
            FirstTabView()
                .environmentObject(viewModel)     // Pass the same model to the Views in each tab
                .tabItem { Text("First") }
                .tag(0)       // This is View #0 for the tabSelection property
                .onAppear {
                    
                    // Only when this View appears the showAlert will be set to true,
                    // only if there is an error in the model's property and the first tab is selected
                    if viewModel.errorMessage != nil && tabSelection == 0 {
                        showAlert = true
                    }
                }

            Second()
                .environmentObject(viewModel)     // Pass the same model to the Views in each tab
                .tabItem { Text("Second") }
                .tag(1)       // This is View #1 for the tabSelection property
        }
        
        // Trigger the alert in the TabView, instead of in the child View
        .alert("error", isPresented: $showAlert) {
            Button {
                viewModel.errorMessage = nil
            } label: {
                Text("OK")
            }
        } message: {
            Text(viewModel.errorMessage ?? "not available")
        }
    }
}

struct FirstTabView: View {
    @EnvironmentObject var viewModel: MyModel

    var body: some View {
        VStack {
            Text("Hello First")
                .padding()
            Text("\(viewModel.errorMessage ?? "OK")")
                .padding()
        }
    }
}

struct Second: View {
    @EnvironmentObject var viewModel: MyModel
    
    var body: some View {
        VStack {
            Text("Second")
                .padding()
            Text("\(viewModel.errorMessage ?? "OK")")
                .padding()
            
            Button {
                viewModel.errorMessage = "error"
            } label: {
                Text("Show alert")
            }
        }
    }
}

CodePudding user response：

One way to handle it is by updating the badge icon on the first tab when the error occurs. Then the user can finish off what they are currently doing and then inspect the first tab when they notice it has updated, say with an exclamation mark badge. At that point, you could present the alert.