ForEach / ForEachStore doesn't update UI

[artemkrachulov]

Description

I found strange behavior in our application connected to ForEachStore & SwitchStore / ForEach & Switch. Unfortunately, I can't provide example code in the zipped project, but I'll try to explain and add code examples for SwiftUI and TCA flows.

Current flow
We have the message list which updates when a new message receives. We use a simple combination of ForEachStore and SwitchStore which switches different contents. Also for testing, I've added message count.

ForEachStore(
  store.scope(
    state: \.messages,
    action: ChatAction.message(id:action:)
  ),
  content: { messageStore in
    SwitchStore(messageStore.scope(state: \.content, action: { $0 })) { type in
      switch type {
      case let .text(content):
        Text("Text: \(content.body)")
      default:
        Text("Other")
      }
    }
  }
)
Text("Count:, \(viewStore.messages.count)")

Bug
But we've found that if you navigate to the next screen, receive a new message and go back. The list doesn't change. Counter updates.

Testing
I tried to play with different view configurations and have some results:

• TCA version remove switch { } ✅

ForEachStore(
  store.scope(
    state: \.messages,
    action: ChatAction.message(id:action:)
  ),
  content: { messageStore in
    SwitchStore(messageStore.scope(state: \.content, action: { $0 })) { type in
       Text("Message")
    }
  }
)

• SwiftUI version ❌

ForEach(viewStore.messages) { item in
  switch item.message.content {
  case let .text(content):
    Text("Text: \(content.body)")
  default:
    Text("Other")
  }
}

• SwiftUI version wrapped to view (ex. ZStack) ✅

ForEach(viewStore.messages) { item in
  ZStack {
    switch item.message.content {
    case let .text(content):
      Text("Text: \(content.body)")
    default:
      Text("Other")
    }
  }
}

• TCA version wrapped to view (ex. ZStack) ✅

ForEachStore(
  store.scope(
    state: \.messages,
    action: ChatAction.message(id:action:)
  ),
  content: { messageStore in
    ZStack {
      SwitchStore(messageStore.scope(state: \.content, action: { $0 })) { type in
        switch type {
        case let .text(content):
          Text("Text \(content.body)")
        default:
          Text("Other")
        }
      }
    }
  }
)

Probably it's more a SwiftUI issue rather than TCA, but anyway wanted to share. As a temporary solution, I'll wrap SwitchStore to ZStack. And want to repeat, it doesn't work when you trigger view updates from the next screen pushed by navigation.

Checklist

• I have determined whether this bug is also reproducible in a vanilla SwiftUI project.
• If possible, I've reproduced the issue using the main branch of this package.
• This issue hasn't been addressed in an existing GitHub issue or discussion.

Expected behavior

No response

Actual behavior

No response

Steps to reproduce

No response

The Composable Architecture version information

0.55.0

Destination operating system

16.5.1

Xcode version information

Version 14.3.1 (14E300c)

Swift Compiler version information

swift-driver version: 1.75.2 Apple Swift version 5.8.1 (swiftlang-5.8.0.124.5 clang-1403.0.22.11.100)
Target: x86_64-apple-macosx13.0

[stephencelis]

@artemkrachulov This definitely sounds like a SwiftUI bug, and could probably be reproduced in vanilla SwiftUI. If possible can you share a full repro of the problem?