Infinite Scroll with ForEachStore

[toomozoo]

Hi, I'm working on a view that uses infinite scroll and want to display ProgressView after the last item.

For example:

List {                                                                                                    
    ForEachStore(self.store.scope(state: \.posts, action: Action.post(id:action:))) {
        PostView(store: $0)

        if viewStore.isRequestInFlight && ViewStore($0).post == viewStore.lastPost {
            ProgressView()
        }
    }
}

This works fine, but is this a good way to compare values using ViewStore($0).post == viewStore.lastPost ? Or should I not use ForEachStore in this case?

[stephencelis]

@toomozoo Another approach would be to put the progress view after the ForEachStore and avoid needing that lastPost check:

List {                                                                                                    
  ForEachStore(self.store.scope(state: \.posts, action: Action.post(id:action:))) {
    PostView(store: $0)
  }

  if viewStore.isRequestInFlight {
    ProgressView()
  } else {
    // You could also kick off the request here:
    EmptyView().onAppear { viewStore.send(.scrolledToBottom) }
  }
}

[toomozoo]

@stephencelis
Thank you for your reply! I'm sorry I didn't make it clear enough.
ProgressView may appear in the middle of the posts or at the end, so I need to check each of posts.

Middle of the posts	End of the posts