How to Prevent Invalid States with Route Type?

[nickkohrn]

I have a view which can present two mutually exclusive sheets. Currently, my logic allows for invalid states:

struct ProjectFeatureReducer: ReducerProtocol {
    struct State: Equatable {  
        var filterFeatureState: FilterFeatureReducer.State?
        var sessionFeatureState: SessionFeatureReducer.State?
        var showFilterFeatureView = false
        var showSessionFeatureView = false
    }
    
    enum Action: Equatable {
        case dismissFilterFeatureView
        case dismissSessionFeatureView
        case filterFeatureAction(FilterFeatureReducer.Action)
        case sessionFeatureAction(SessionFeatureReducer.Action)
        case showFilterFeatureView
        case showSessionFeatureView
    }
    
    var body: some ReducerProtocol<State, Action> {
        Reduce { state, action in
            switch action {
            case .dismissFilterFeatureView:
                state.showFilterFeatureView = false
                return .none
                
            case .dismissSessionFeatureView:
                state.showSessionFeatureView = false
                return .none
                
            case .showFilterFeatureView:
                state.filterFeatureState = .init()
                state.showFilterFeatureView = true
                return .none
                
            case .showSessionFeatureView:
                state.sessionFeatureState = .init()
                state.showSessionFeatureView = true
                return .none
            }
        }
        .ifLet(\.filterFeatureState, action: /Action.filterFeatureAction) {
            FilterFeatureReducer()
        }
        .ifLet(\.sessionFeatureState, action: /Action.sessionFeatureAction) {
            SessionFeatureReducer()
        }
    }
}

In the view, I am using the following to present the respective content in a sheet:

.sheet(
    isPresented: viewStore.binding(
        get: \.showFilterFeatureView,
        send: .dismissFilterFeatureView
    )
) {
    IfLetStore(
        store.scope(
            state: \.filterFeatureState,
            action: ProjectFeatureReducer.Action.filterFeatureAction
        ),
        then: FilterFeatureView.init(store:)
    )
}
.sheet(
    isPresented: viewStore.binding(
        get: \.showSessionFeatureView,
        send: .dismissSessionFeatureView
    )
) {
    IfLetStore(
        store.scope(
            state: \.sessionFeatureState,
            action: ProjectFeatureReducer.Action.sessionFeatureAction
        ),
        then: SessionFeatureView.init(store:)
    )
}

Because of the possibility of invalid state (mismatching state/boolean, honest state and false, nil state and true, etc), I was looking at examples of using a Route enum. I found this answer, which guided me to using .ifLet(\.route, action: /Action.self) { to access the non-nil route:

struct ProjectFeatureReducer: ReducerProtocol {
    struct State: Equatable {
        enum Route: Equatable {
            case filter(FilterFeatureReducer.State)
            case session(SessionFeatureReducer.State)
        }
        
        var route: Route?
    }
    
    enum Action: Equatable {
        case dismissFilterFeatureView
        case dismissSessionFeatureView
        case filterFeatureAction(FilterFeatureReducer.Action)
        case sessionFeatureAction(SessionFeatureReducer.Action)
        case showFilterFeatureView
        case showSessionFeatureView
    }
    
    var body: some ReducerProtocol<State, Action> {
        Reduce { state, action in
            switch action {
            case .dismissFilterFeatureView:
                state.route = nil
                return .none
                
            case .dismissSessionFeatureView:
                state.route = nil
                return .none
                
            case .showFilterFeatureView:
                state.route = .filter(.init())
                return .none
                
            case .showSessionFeatureView:
                state.route = .session(.init())
                return .none
            }
        }
        .ifLet(\.route, action: /Action.self) {
            EmptyReducer()
                .ifCaseLet(/State.Route.filter, action: /Action.filterFeatureAction) {
                    FilterFeatureReducer()
                }
                .ifCaseLet(/State.Route.session, action: /Action.sessionFeatureAction) {
                    SessionFeatureReducer()
                }
        }
    }
}

When I tap the button which should present the FilterFeatureView in a sheet, I receive the following output:

2022-11-09 13:09:00.083365-0500 AstrophotographyTracker[19329:280201] [ComposableArchitecture] An "ifLet" at "******/ProjectFeatureReducer.swift:48" received a child action when child state was "nil". …

  Action:
    ProjectFeatureReducer.Action.showFilterFeatureView

This is generally considered an application logic error, and can happen for a few reasons:

• A parent reducer set child state to "nil" before this reducer ran. This reducer must run before any other reducer sets child state to "nil". This ensures that child reducers can handle their actions while their state is still available.

• An in-flight effect emitted this action when child state was "nil". While it may be perfectly reasonable to ignore this action, consider canceling the associated effect before child state becomes "nil", especially if it is a long-living effect.

• This action was sent to the store while state was "nil". Make sure that actions for this reducer can only be sent from a view store when state is non-"nil". In SwiftUI applications, use "IfLetStore".

Currently, I am not showing the sheet as I have not yet figured out how to do so with an optional Route type in my state.

After stepping through with breakpoints, I see the ifLet being evaluated before getting to showFilterFeatureView where the route is then set. I understand the state is nil before the FilterFeatureReducer() is ran, but I don't know what I need to change.

Can you help me better understand what I need to change so the state is initialized before the reducer is ran?

[ghost]

Hi @nickkohrn, I see that you quoted my question and the subsequent answer that was provided there. As I tried to implement that answer, I ran into exactly the same problem you did and was, in fact, going to post a question to follow up, but you beat me to it!
I upvoted your question and am eagerly awaiting for an answer. :)

[mbrandonw]

Hi @nickkohrn, the problem is that a ProjectFeature.Action is being sent, and the ifLet says it can process such actions, but at that time the state is nil.

It's usually best to have the nesting of your actions match the nesting of your states. That gives you an opportunity to ifLet into some optional state as well as the actions associated with that optional state.

So, your action becomes this:

enum Action: Equatable {
  case dismissFilterFeatureView
  case dismissSessionFeatureView
  case route(Route)
  case showFilterFeatureView
  case showSessionFeatureView

  enum Route: Equatable {
    case filterFeatureAction(FilterFeatureReducer.Action)
    case sessionFeatureAction(SessionFeatureReducer.Action)
  }
}

And your ifLet this:

.ifLet(\.route, action: /Action.Route.self) {
  EmptyReducer()
    .ifCaseLet(/State.Route.filter, action: /Action.Route.filterFeatureAction) {
      FilterFeatureReducer()
    }
    .ifCaseLet(/State.Route.session, action: /Action.Route.sessionFeatureAction) {
      SessionFeatureReducer()
    }
}

This is the exact pattern we plan to codify directly into the navigation tools we are working on.

[ghost]

Hi @mbrandonw. I'm struggling to make your suggestion work. Here's some minimal code that I believe follows your suggestion but I get two compiler errors, one at the reducer and the other at the view (shown below as comments).

Can you please point me to where I'm doing it wrong and offer a correction?
Many thanks in advance.

import ComposableArchitecture
import Foundation
import SwiftUI

public struct AppScene: ReducerProtocol {

    public init() {}

    public struct State: Equatable {

        enum Route: Equatable {
            case sceneA(SceneA.State)
            case sceneB(SceneB.State)
        }

        var route: Route?

        public init() {}

    }

    public enum Action: Equatable {

        public enum Route: Equatable {
            case sceneA(SceneA.Action)
            case sceneB(SceneB.Action)
        }

        case route(Route)

    }

    public var body: some ReducerProtocol<State, Action> {

        Reduce { state, action in
            switch action {
                case .route(.sceneA(_)):
                    return .none
                case .route(.sceneB(_)):
                    return .none
            }
        }
        // Static method 'buildExpression' requires the types
        // 'AppScene.Action' and 'AppScene.Action.Route'
        // be equivalent
        .ifLet(\.route, action: /Action.Route.self) {
            EmptyReducer()
                .ifCaseLet(/State.Route.sceneA, action: /Action.Route.sceneA) {
                    SceneA()
                }
                .ifCaseLet(/State.Route.sceneB, action: /Action.Route.sceneB) {
                    SceneB()
                }
        }

    }

    public struct View: SwiftUI.View {

        private let store: Store<State, Action>

        public init(store: Store<State, Action>) {
            self.store = store
        }

        public var body: some SwiftUI.View {
            // Cannot convert value of type
            // '() -> TupleView<(CaseLet<AppScene.State.Route, AppScene.Action.Route,
            //                             SceneA.State,               SceneA.Action, SceneA.View>,
            //                   CaseLet<AppScene.State.Route, AppScene.Action.Route,
            //                             SceneB.State, SceneB.Action, SceneB.View>,
            //                   Default<ProgressView<Text, EmptyView>>)>'
            // to expected argument type
            // '() -> TupleView<(CaseLet<AppScene.State.Route, AppScene.Action,
            //                                   SceneA.State,   SceneA.Action, SceneA.View>,
            //                   CaseLet<AppScene.State.Route, AppScene.Action,
            //                                   SceneB.State,   SceneB.Action, SceneB.View>,
            //                   Default<ProgressView<Text, EmptyView>>)>'
            IfLetStore(store.scope(state: \.route)) { routeStore in
                SwitchStore(routeStore) {
                    CaseLet(state: /State.Route.sceneA,
                            action: Action.Route.sceneA) {
                        SceneA.View(store: $0)
                    }
                    CaseLet(state: /State.Route.sceneB,
                            action: Action.Route.sceneB) {
                        SceneB.View(store: $0)
                    }
                    Default {
                        ProgressView("Something...")
                    }
                }
            }
        }

    }

}

[mbrandonw]

Hi @wtruppel, your ifLet is not properly scoping the action:

.ifLet(\.route, action: /Action.route) {
  …
}

And same with your IfLetStore:

IfLetStore(store.scope(state: \.route, action: AppScene.Action.route)) { routeStore in
  …
}

[ghost]

@mbrandonw Ah, thank you. Much appreciated.

[nickkohrn]

Ah, yes, this was quite helpful. Thanks for your assistance, @mbrandonw! 👏🏻

[tylerjames]

Oh cool, I didn't think routing via enum was possible. I often run into this problem and end up with multiple optional states instead. That EmptyReducer dance is interesting