Binding Issue

[bradhowes]

I'm encountering the "A binding action sent from a store was not handled" log message, but I'm stumped on where the problem is in my code. I have a demo app at https://github.com/bradhowes/tca-bindings-issue -- below is basically from the README there.

When run, the demo app shows a list of tags. Long-pressinig on a tag
brings up the tags editor. Tags may be moved around, added, and removed with no issue. The problem appears when
attempting to edit the "User Tag" name (the other tags are read-only and cannot be changed).

• Clicking on "User Tag" text brings up the keyboard and allows editing

• The Xcode console shows a warning:

A binding action sent from a store was not handled. …

  Action:
    TagNameEditor.Action.binding(.set(_, "User Tag"))

To fix this, invoke "BindingReducer()" from your feature reducer's "body".

• Typing letters will repeat this message

• Setting a breakpoint in BindableActionDebugger, I can print out the key path of the action:

(lldb) p keyPath
(WritableKeyPath<State, Value> & Sendable) {
  object = 0x000060000178ff40 {
    Swift.KeyPath<RowBindings.TagNameEditor.State, Swift.String> = {
      Swift.PartialKeyPath<RowBindings.TagNameEditor.State> = {
        Swift.AnyKeyPath = {
          _kvcKeyPathStringPtr = nil
        }
      }
    }
  }
  wtable = 0x00000001025a88b8 type metadata for RowBindings.TagNameEditor.State
}

The code for the TagNamesEditor appears to be set up properly to register and process SwiftUI bindings to attributes
in the TagNameEditor.State but I am not sure where the solution would be. Any ideas?

[bradhowes]

So after playing around with the CaseStudies app and the FocusState and Nested features, I realized that the issue was due to my use of BindableAction/BindingReducer bits with a ForEach(store.scope(state: \.rows, action: \.rows) -- or at least my problems went away when I removed the binding stuff and changed my TextField text binding to be $store.value.sending(\.valueChanged) and handle the event in a normal way.

[bradhowes]

Here's the code that works now based off of the FocusState feature in the CaseStudies app:

import ComposableArchitecture
import SwiftUI

private let readMe = """
  This demonstrates how to make use of SwiftUI's `@FocusState` in the Composable Architecture with \
  the library's `bind` view modifier. If you tap the "Sign in" button while a field is empty, the \
  focus will be changed to the first empty field.
  """

@Reducer
struct FieldEditor {
  @ObservableState
  struct State: Equatable, Identifiable {
    let id: UUID
    var value: String
  }

  enum Action: Equatable {
    case valueChanged(String)
  }

  var body: some ReducerOf<Self> {
    Reduce { state, action in
      switch action {
      case .valueChanged(let value):
        state.value = value
        return .none
      }
    }._printChanges()
  }
}

struct FieldEditorView: View {
  @Bindable private var store: StoreOf<FieldEditor>
  @FocusState var isFocused: Bool

  public init(store: StoreOf<FieldEditor>) {
    self.store = store
    self.isFocused = false
  }

  public var body: some View {
    TextField(store.id.uuidString, text: $store.value.sending(\.valueChanged))
      .focused($isFocused)
      .textFieldStyle(.roundedBorder)
  }
}

@Reducer
struct FocusDemo2 {
  @ObservableState
  struct State: Equatable {
    var rows: IdentifiedArrayOf<FieldEditor.State> = [
      .init(id: .init(), value: "First"),
      .init(id: .init(), value: "Second"),
      .init(id: .init(), value: "Third"),
      .init(id: .init(), value: "Fourth")
    ]
  }

  enum Action: Equatable {
    case rows(IdentifiedActionOf<FieldEditor>)
  }

  var body: some Reducer<State, Action> {
    Reduce { state, action in
      switch action {
      case .rows(.element(let id, .valueChanged(let value))):
        if let index = state.rows.index(id: id) {
          state.rows[index].value = value
        }
        return .none
      }
    }
    ._printChanges()
  }
}

struct FocusDemo2View: View {
  var store: StoreOf<FocusDemo2>

  var body: some View {
    Form {
      AboutView(readMe: readMe)
      List {
        ForEach(store.scope(state: \.rows, action: \.rows)) { store in
          FieldEditorView(store: store)
        }
      }
    }
    .navigationTitle("Focus demo 2")
  }
}

#Preview {
  NavigationStack {
    FocusDemo2View(store: Store(initialState: FocusDemo2.State()) {
      FocusDemo2()
    })
  }
}