Eagerly set `read` flags in Redux, before hearing from server

From a chat thread the other day.

Rishi reported:

Getting a bug where the unread marker is clearing but the message is not being marked as read. Eg if I go back to the home view it's still there as unread, and I can click it again and get the animation again.

This is on pretty bad internet.

Though, it's still happening on somewhat reasonable internet. Another clue is that the "1 unread message" banner at the top is not clearing

And sending messages here is working fine

[...] I guess the animation is not connected with talking to the server?

As I said there: the animation is indeed not made to wait on talking to the server -- and I think that's probably important for having it reliably happen promptly. I believe the webapp has the same behavior, though I'm not as confident of that.

What's definitely a bug is that we have two conflicting ideas of whether each message is read, causing us to show the inconsistencies Rishi described. The Redux store controls the home view and the "1 unread message" banner, and the data inside the webview controls the unread marker. I believe the unread flag in the Redux store only gets cleared when we hear back from the server.

I think the right fix is that we should go ahead and eagerly clear that flag when the user reads a message locally, just like we clear the visual unread marker in the message list.

This is related to #3509; and @jainkuniya described a version of this in a comment there, too.