Feat: Added 'Online User Status' Filter to Members List

[dhairyashiil]

Brief Title

Feat: Added 'Online User Status' Filter to Members List

Acceptance Criteria fulfillment

• Added a filter dropdown to toggle between All and Online members.
• By default, the filter is set to All, displaying all members.
• When Online is selected, only online members are shown.
• Ensured UI consistency with the Rocket.Chat member filter.
• Ensured the filter is functional across all EmbeddedChat variants.

Fixes #781

Video/Screenshots

online.user.status.filter.mp4

and

online.user.status.filter.in.theme.mp4

Admin View:

PR Test Details

Note: The PR will be ready for live testing at https://rocketchat.github.io/EmbeddedChat/pulls/pr-782 after approval. Contributors are requested to replace <pr_number> with the actual PR number.

[smritidoneria]

Hey @dhairyashiil, I believe this feature might not be a priority for Embedded Chat at the moment. Since the online status of members is already indicated by the green dot over the circle, adding an extra filtering option for this seems redundant. What are your thoughts on this, @dhairyashiil, @Spiral-Memory?

[dhairyashiil]

Hey @dhairyashiil, I believe this feature might not be a priority for Embedded Chat at the moment. Since the online status of members is already indicated by the green dot over the circle, adding an extra filtering option for this seems redundant. What are your thoughts on this, @dhairyashiil, @Spiral-Memory?

Hello Smriti, I see your point, but I think this feature could still be useful in some situations:

1. What if there are many users? When there are a lot of people in the chat, this feature could help. If there are more than 10 or 20 people, being able to filter by online status will help users quickly find people who are available.

2. Search bar and filter together: The search bar and filter can work at the same time. This would make it easier to find active users, especially in bigger group chats.

3. Following Rocket.Chat’s idea: Since we usually follow Rocket.Chat's way of doing things, I thought this feature might work well here too. They added it, and it could be useful for us as well, especially in larger chats.

I agree that for small chats with just 1-10 people, it’s not needed, but when there are more members, it could really help.

[Spiral-Memory]

Yeah, initially it felt like a useless option to me as well, but it does have its own use. and Since Rocket.Chat follows this idea, we’re good to integrate it into Embedded Chat as well.

Will review, @dhairyashiil .

[dhairyashiil]

Hello @Spiral-Memory and @smritidoneria,
I have added the display count functionality as well. You can now find this in Rocket Chat.
Above the member list, you will see the text 'Showing 6 of 6,' where 6 represents the count of members.

I believe the filter now makes even more sense. By selecting "Online" from the filter, you will see the total number of online users currently.

For reference, please see the screenshot (SS) of Rocket Chat.

.
and
The Embedded Chat's View after the recent commit:

divider.and.count.mp4

[dhairyashiil]

@Spiral-Memory, quick question:

If there are a total of 6 users in the room and 2 of them are online, should we show 'Showing 2 of 2' or 'Showing 2 of 6'?

[Spiral-Memory]

Technically it should 2/6, but follow whatever RC is following

[dhairyashiil]

Hello @Spiral-Memory, we haven't discussed this PR today. Please review it when you get a chance. Thank you.

[Spiral-Memory]

I'm a bit unsure about this, this is why I didn't say anything on this, this is like creating so many requests to the server right ?

You need not to do that, you may simply filter from the member list right ?

[dhairyashiil]

Ahh, yupp. That's correct.

Then maybe we can implement a batch strategy.

If the API supports it, we could make a single request that retrieves the statuses of multiple users at once, instead of making a request for each individual member. For example, an endpoint like GET /users/statuses?ids=1,2,3,4,... would reduce the number of requests from N to 1.

[Spiral-Memory]

Maybe, you can just filter the list

[dhairyashiil]

Okay, so by getting the member IDs from the member list and using the API const res = await RCInstance.getUserStatus(user._id);, correct?

[Spiral-Memory]

See you already have the member list and in that list, you've the status of all the members..

Now when then online filter is set, you can iterate and filter out all online people..

[dhairyashiil]

Okay, got it. will work on this.
Thank you for time 👍