Issues with Custom Wrapped Views

[bobmosh]

Hey all,

I am currently trying to understand TCA better, and in this process have encountered an issue that doesn't look like I can solve it.

Basically the issue is as follows. I try to change the position of an element on screen by using a SwiftUI gesture. Everything works perfectly fine until I have to start embedding viewStore content into a custom wrapped view. I think the issue might be connected to the scoping or the events not being passed to the custom wrapper view. If I move the WithViewStore inside the closure of the custom wrapper view (Canvas) everything works fine, but I need it outside, because the other pieces will access it as well.

Any Idea how to solve this? Is this a bug or intended behaviour?
Should I start thinking about scoping at this point? Could this solve the problem?

Below you'll find some sample code that reproduces the issue.

Any pointers will be highly appreciated!

import SwiftUI
import ComposableArchitecture

struct Canvas<Content: View>: View {
    var content: () -> Content

    init(@ViewBuilder content: @escaping () -> Content) { self.content = content }

    var body: some View {
        content()
    }
}

struct WrappedViewApp {
    enum Action { case updatePosition(DragGesture.Value) }
    struct State: Equatable {
        var position: CGPoint
    }
    struct Environment { }

    static var reducer = buildReducer()
    static func buildReducer() -> Reducer<WrappedViewApp.State, WrappedViewApp.Action, WrappedViewApp.Environment> {
        Reducer { state, action, environment in
            switch action {
            case let .updatePosition(value):
                state.position = value.location
                break
            }
            return .none
        }.debug()
    }
}

struct ContentView: View {
    let store: Store<WrappedViewApp.State, WrappedViewApp.Action>

    var body: some View {
        ZStack {
            WithViewStore(self.store) { viewStore in
                Canvas {
                    Text("Hello, world!")
                        .position(viewStore.position)
                        .gesture(DragGesture().onChanged { value in
                            viewStore.send(.updatePosition(value))
                        })
                }
            }
        }
    }
}

[stephencelis]

@bobmosh This is most likely the same bug we see with GeometryReader, seen here:

swift-composable-architecture/Examples/CaseStudies/SwiftUICaseStudies/04-HigherOrderReducers-ElmLikeSubscriptions.swift

Lines 80 to 85 in 6f1bc25

	// NB: We are using an explicit `ObservedObject` for the view store here instead of
	// `WithViewStore` due to a SwiftUI bug where `GeometryReader`s inside `WithViewStore` will
	// not properly update.
	//
	// Feedback filed: https://gist.github.com/mbrandonw/cc5da3d487bcf7c4f21c27019a440d18
	@ObservedObject var viewStore: ViewStore<ClockState, ClockAction>

The workaround there is to hold onto the view store in your view directly as an @ObservedObject. Please let us know if that fixes things for you!

[bobmosh]

Perfect! Thanks so much! I couldn't for the life of me figure out what went wrong there. Now it works perfectly fine. Thanks so much!