Dismiss is not working when using NavigationStackStore and SwitchStore together

[atsixian]

Hi, I have a global NavManager registered as a dependency. The SwitchStore code is adapted from SwitchStoreTestCase.

In the video, the toolbar back button dismissed the view successfully, but calling self.dismiss() did nothing and popFrom action is not sent either. If I remove the SwitchStore and just use NavigationStackStore {...} in the root view, everything works as expected.

Am I missing something? Thank you!

iShot_2023-08-25_17.15.20.mp4

import ComposableArchitecture
import SwiftUI

struct Screen: Reducer {
    struct State: Equatable {
        let title: String
        var isChild = false
    }

    enum Action {
        case goToChildScreen
        case dismiss
    }

    @Dependency(\.navManager) var navManager
    @Dependency(\.dismiss) var dismiss
    func reduce(into state: inout State, action: Action) -> Effect<Action> {
        switch action {
        case .goToChildScreen:
            navManager.store.send(.goTo(.childScreen()))
            return .none
        case .dismiss:
            return .run { _ in
                await self.dismiss()
            }
        }
    }
}

struct ScreenView: View {
    let store: StoreOf<Screen>

    var body: some View {
        WithViewStore(self.store, observe: { $0 }) { viewStore in
            VStack {
                Text(viewStore.title).font(.largeTitle)
                if viewStore.isChild {
                    Button("Dismiss") {
                        viewStore.send(.dismiss)
                    }
                } else {
                    Button("Go to childScreen") {
                        viewStore.send(.goToChildScreen)
                    }
                }
            }
        }
    }
}

struct SwitchStoreTestCase: Reducer {
    enum State: Equatable {
        case loggedIn(Screen.State = .init(title: "Logged In"))
        case loggedOut(Screen.State = .init(title: "Logged Out"))
    }

    enum Action {
        case screenA(Screen.Action)
        case screenB(Screen.Action)
    }

    var body: some ReducerOf<Self> {
        Reduce { state, action in
            switch (state, action) {
            case (_, .screenA), (_, .screenB):
                return .none
            }
        }
        .ifCaseLet(/State.loggedIn, action: /Action.screenA) {
            Screen()
        }
        .ifCaseLet(/State.loggedOut, action: /Action.screenB) {
            Screen()
        }
    }
}

struct SwitchStoreTestCaseView: View {
    let store = Store(initialState: .loggedIn()) {
        SwitchStoreTestCase()
    }

    @Dependency(\.navManager) var navManager
    var body: some View {
        SwitchStore(self.store) {
            switch $0 {
            case .loggedIn:
                CaseLet(
                    /SwitchStoreTestCase.State.loggedIn, action: SwitchStoreTestCase.Action.screenA
                ) { store in
                    NavigationStackStore(
                        navManager.store.scope(state: \.path, action: { .path($0) })
                    ) {
                        ScreenView(store: store)
                    } destination: { state in
                        switch state {
                        case .childScreen:
                            CaseLet(
                                /Nav.Path.State.childScreen,
                                action: Nav.Path.Action.childScreen,
                                then: ScreenView.init(store:)
                            )
                        }
                    }
                }
            case .loggedOut:
                CaseLet(
                    /SwitchStoreTestCase.State.loggedOut, action: SwitchStoreTestCase.Action.screenB
                ) { store in
                    NavigationStackStore(
                        navManager.store.scope(state: \.path, action: { .path($0) })
                    ) {
                        ScreenView(store: store)
                    } destination: { state in
                        switch state {
                        case .childScreen:
                            CaseLet(
                                /Nav.Path.State.childScreen,
                                action: Nav.Path.Action.childScreen,
                                then: ScreenView.init(store:)
                            )
                        }
                    }
                }
            }
        }
    }
}

// NavManager

struct Nav: Reducer {
    struct State: Equatable {
        var path = StackState<Path.State>()
    }

    enum Action {
        case path(StackAction<Path.State, Path.Action>)
        case goTo(Path.State)
    }

    struct Path: Reducer {
        enum State: Equatable {
            case childScreen(Screen.State = .init(title: "Child", isChild: true))
        }

        enum Action {
            case childScreen(Screen.Action)
        }

        var body: some Reducer<State, Action> {
            Scope(state: /State.childScreen, action: /Action.childScreen) {
                Screen()
            }
        }
    }

    var body: some ReducerOf<Self> {
        Reduce { state, action in
            switch action {
            case let .goTo(newState):
                state.path.append(newState)
                return .none
            case .path:
                return .none
            }
        }
        .forEach(\.path, action: /Action.path) {
            Path()
        }
    }
}

struct NavManager {
    let store: StoreOf<Nav>

    init() {
        store = Store(initialState: Nav.State(), reducer: {
            Nav()._printChanges()
        })
    }
}

extension NavManager: DependencyKey {
    static let liveValue: Self = .init()
}

extension DependencyValues {
    var navManager: NavManager {
        get { self[NavManager.self] }
        set { self[NavManager.self] = newValue }
    }
}

[mbrandonw]

Hi @atsixian, I was able to run your demo and see the issue. It's hard to say currently whether there is an issue in the library or not. Your current set up is a bit non-standard. You have two stores running in the app (one in SwitchStoreTestCaseView and one in NavManager), but they also need to interact with each other. I'm not sure if that's problematic, or if there is a problem in our APIs.

We need a bit more time to look into it and we will get back to you.

[atsixian]

Thank you @mbrandonw! Is there a recommended way to implement a global NavManager if this is non-standard?

[mbrandonw]

Hi @atsixian, we tracked down the problem. It's not an issue with the library, but instead it's due to sending an action to the navManager directly in the Screen reducer:

case .goToChildScreen:
  navManager.store.send(.goTo(.childScreen()))
  return .none

This is problematic because you are running the Nav reducer inside the context of the SwitchStoreTestCase reducer, which means the Nav reducer is getting all of its dependencies from SwitchStoreTestCase. That messes things up because \.dismiss works by communicating through the dependency system.

So, in order to get back to navManager's default dependencies, you need to run store.send in a detached task (that resets the @TaskLocals that power dependencies), and you just do that from an effect:

case .goToChildScreen:
  return .run { _ in 
    Task.detached { 
      navManager.store.send(.goTo(.childScreen())) 
    }
  }

That will work the way you expect.