Navigation and Stores

[virgilius-santos]

Hi guys

(Updated!)
I'm studying TCA and I have a question about navigation:

in this example, when I select a value in Picker instead of going back to the previous screen, the navigation goes back to the root

could you help me?

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        NavigationView {
            App.View(store: .init(
                initialState: .init(),
                reducer: App.reducer,
                environment: App.Environment()
            ))
        }
    }
}

enum App {
    typealias Store = ComposableArchitecture.Store<State, Action>
    typealias Reducer = ComposableArchitecture.Reducer<State, Action, Environment>
    
    struct State: Equatable {
        
        var first: First.State?
        var showFirst: Bool { first != nil }
        
        var second: Second.State?
        var showSecond: Bool { second != nil }
    }
    
    enum Action: Equatable {
        case first(First.Action)
        case firstVisibility(Bool)
        
        case second(Second.Action)
        case secondVisibility(Bool)
    }
    
    struct Environment {}
    
    static let reducer: Reducer = .combine(
        First.reducer
            .optional()
            .pullback(
                state: \.first,
                action: /App.Action.first,
                environment: { _ in First.Environment() }
            ),
        Second.reducer
            .optional()
            .pullback(
                state: \.second,
                action: /App.Action.second,
                environment: { _ in Second.Environment() }
            )
    )
    .combined(with: .init { state, action, environment in
        switch action {
        
        case .first:
            return .none
            
        case .firstVisibility(true):
            state.first = .init()
            return .none
            
        case .firstVisibility(false):
            state.first = nil
            return .none
            
        case .second:
            return .none
            
        case .secondVisibility(true):
            state.second = .init()
            return .none
            
        case .secondVisibility(false):
            state.second = nil
            return .none
        }
    })
    
    struct View: SwiftUI.View {
        
        let store: Store
        
        var body: some SwiftUI.View {
            WithViewStore(store) { viewStore in
                
                VStack {
                    NavigationLink(
                        destination: IfLetStore(
                            store.scope(
                                state: \.first,
                                action: App.Action.first
                            ),
                            then: { First.View(store: $0) }
                        ),
                        isActive: viewStore.binding(
                            get: \.showFirst,
                            send: App.Action.firstVisibility
                        ),
                        label: { EmptyView() }
                    )
                    
                    NavigationLink(
                        destination: IfLetStore(
                            store.scope(
                                state: \.second,
                                action: App.Action.second
                            ),
                            then: { Second.View(store: $0) }
                        ),
                        isActive: viewStore.binding(
                            get: \.showSecond,
                            send: App.Action.secondVisibility
                        ),
                        label: { EmptyView() }
                    )
                    
                    Button("First", action: { viewStore.send(.firstVisibility(true)) })
                    
                    Button("Second", action: { viewStore.send(.secondVisibility(true)) })
                }
            }
        }
    }
}

enum First {
    typealias Store = ComposableArchitecture.Store<State, Action>
    typealias Reducer = ComposableArchitecture.Reducer<State, Action, Environment>
    
    struct State: Equatable {
        
        var current: Int = 2
        
        init(current: Int = 2) {
            self.current = current
        }
    }
    
    enum Action: Equatable {
        case form(BindingAction<State>)
    }
    
    struct Environment {}
    
    static let reducer: Reducer = .init { state, action, environment in
        return .none
    }
    .binding(action: /First.Action.form)
    
    struct View: SwiftUI.View {
        
        let store: Store
        
        var body: some SwiftUI.View {
            WithViewStore(store) { viewStore in
                Form {
                    Picker(
                        "Current installment",
                        selection: viewStore.binding(
                            keyPath: \.current,
                            send: First.Action.form
                        )
                    ) {
                        ForEach(1..<10, id: \.self) {
                            Text("\($0)")
                        }
                    }
                }
            }
        }
    }
}


enum Second {
    typealias Store = ComposableArchitecture.Store<State, Action>
    typealias Reducer = ComposableArchitecture.Reducer<State, Action, Environment>
    
    struct State: Equatable {
        
        var current: Int = 2
        
        init(current: Int = 2) {
            self.current = current
        }
    }
    
    enum Action: Equatable {
        case form(BindingAction<State>)
    }
    
    struct Environment {}
    
    static let reducer: Reducer = .init { state, action, environment in
        return .none
    }
    .binding(action: /Second.Action.form)
    
    struct View: SwiftUI.View {
        
        let store: Store
        
        var body: some SwiftUI.View {
            WithViewStore(store) { viewStore in
                Form {
                    Picker(
                        "Current installment",
                        selection: viewStore.binding(
                            keyPath: \.current,
                            send: Second.Action.form
                        )
                    ) {
                        ForEach(1..<10, id: \.self) {
                            Text("\($0)")
                        }
                    }
                }
            }
        }
    }
}