Collection of Reducers, Scope and item access

[JeromeTonnelierOgury]

Hi everyone,

still continuing to learn TCA, and I encoutered a weird case, I don't how to resolve this one 😓
Let's say I have a list of ingredient (flour, sugar, chocolate, ...) and I want to present a controller that allows me to choose the quantity of each ingredient.

I ordered my objects like this basically

enum IngredientType {
   case flour
   case sugar
   case chocolate
   case aubergine
   case courgette
   case butternut
   // yes, very eclectic :D :D 
}

struct Ingredient {
   let type: IngredientType
   var nbOfItems = 0
}

struct IngredientSection {
   let title: String
   var ingredients: [Ingredient]
}

I have a view with a stepper that allows me to increment the nb of a particular item. So I created a Reducer that holds an Ingredient as a State and it works fine.

Now I would like to put it all together with a double scroll view (an horizontal list of Ingredients ("Section") and a vertical list of sections, just like the App Store App for example).

So I have a reducer's State that will look like this

struct State: Equatable {
   @BindingState var sections: [IngredientSection]
}

I managed to create the view, but I'm stuck when I have to scope my main reducer into the small one. Usually, from what I saw and used, we have to create a target reducer State inside the parent's state and use setters and getter to do the magic. But here, I have to do this from an array, so I cannot use a variable.

A Stepper needs a binding, how can I use it with a Collection (Array, set, ...)

ForEach(viewStore.section) { section in 
   VStack {
      Text(section.title)
      HStack {
         ForEach(section.ingredient) ( ingredient in 
            Stepper("",
                    value: viewStore.$section[???] // <-- how can I use index here ? $section is a Binding, so $section[index] does not work
                    )
         }
      }
   }
}

Is it an architectural issue or more likely, the geniuses of PointFree have developed a stuff I'm not aware of :D

Thanks for your help <3

[mbrandonw]

Hi @JeromeTonnelierOgury, I think you can handle this just like you would in a regular, vanilla SwiftUI application.

At the root reducer feature level you can add a setSection action for updating the section (or you can use @BindingState, but that may be more work than necessary). Once that is done you can derive a binding to the section field:

ForEach(viewStore.binding(get: \.section, send: Feature.Action.setSection) { $section in 
  …
}

This uses the initializer of ForEach that takes a binding to a collection and products a binding to each individual element (hence there $section argument).

Then you can just keep deriving bindings to smaller and smaller pieces of the state by using dynamic member lookup on Binding:

ForEach(viewStore.binding(get: \.section, send: Feature.Action.setSection) { $section in 
  VStack { 
    Text(section.title)
    HStack {
      ForEach($section.ingredient) ( $ingredient in 
        Stepper("", value: $ingredient)
      }
    }
  }
}

If the elements of your ForEach do not have significant behavior (such as side effects), then there is no need to compose a bunch of reducers together.

[JeromeTonnelierOgury]

Thanks a lot for this quick answer. I didn't think of this binding stuff, I'll give it a try right away!
Thanks a lot @mbrandonw <3

[JeromeTonnelierOgury]

@mbrandonw Sorry for the late reply

when I do this

ForEach(viewStore.binding(
                        get: \.section,
                        send: AddFeature.Action.setSection)) { $section in ………
}

I get this error
Initializer 'init(_:content:)' requires that 'AddFormatSection' conform to 'MutableCollection'
and Initializer 'init(_:content:)' requires that 'AddFormatSection' conform to 'RandomAccessCollection'

It seems that the .binding does not allow a ForEach operator, which is weird since the State is defined as

struct State: Equatable {
        var sections: IdentifiedArrayOf<AddFormatSection> = []
        var section: AddFormatSection!
        }
}

and AddFormatSection conforms to Equatable, Identifiable, Hashable
I guess it's a small stuff that I forgot somewhere, but I can't point ouy what 😓

[JeromeTonnelierOgury]

Ok I got what I did wrong. It's the section name that mislead me. It should be sectionS. I updated it, now it compiles! I know, I'm dumb sometimes :D :D