WhatsApp Clone — Jetpack Compose — Chats
Let’s see the set the of conversation the current user is having.
To get the chat list the logic is similar to the status. We are listening to the user list and then inside that we listen to the chat list. Can check FirestoreUtility for more details on how we are handling it. In that check the currentUserChatList method.
Now there are few ways a chat can be shown,
- Normal chat with message read
- Normal chat with new message
- Favourite chat with message read
- Favourite chat with new message
Let’c check all this one by one.
Normal chat
Message read
If the message is read by the user, the chat details just shows the user details, the last message and at what time it was sent. If the last message is sent by the current user then “You:” is added to let the user know that the reply has not come yet.
New Message
If it’s a new message from the other user. Then all the details remain the same, just a green border is shown to let the current user know that a message is not read till now.
Favourite chat
Message read
Favourite messages are shown separately from the recents. In that we just show the user profile image and the name. The flow is same as the recent.
New message
The UI of the new message for Favourite list is similar. Except a green border is shown and also the last message which was sent by the user. This helps the current user know what the last message is before opening the chat details.
This is how the chat list is divided into. For more details on the logic on the chat list go to the source code of Chat and FirestoreUtility.
Now this is all the things which was needed to make a WhatsApp clone using Jetpack Compose. Let’s go to the last article were all the links which I used for this project is added, WhatsApp Clone — Jetpack Compose — Final Remark.
