Adding "See all chats" for Persona on mobile

[thomas.pickles]

Hi folks! I'm new to the NodeBB community and really enjoying a new install that I just did. So please, if this is the wrong forum to plug a pull request, please let me know. Anyhow, after some feedback from the users of this new install, we picked up on a weird UI difficulty of the see all chats link missing from the mobile chat drawer.

The chats dropdown and chat slideout only display the 10 most recent chats in the Persona theme. For desktop viewing, there is a "See all chats" button that solves the issue of seeing all of a users chat by navigating to the chats page. On mobile, there is no such button. This forces users to manually type in the url to get to the chats page in order to see more than the 10 most recent chats.

PR 424 adds a link to the chats page in the mobile chats slide out drawer.

This is just a functional fix to meet an immediate need and sharing the change back with the core theme. Styling can be picked up separately or through custom styles.

The changes give us something like the following:

[thomas.pickles]

Pinging a few folks for visibility that seem to have committed a fair amount to the repo: @psychobunny @barisusakli @julian

[baris]

I think the styling should be fixed in the PR, also if you have many chats the see all chats link will be way down at the bottom, maybe it should be at the top on mobile?

[thomas.pickles]

@baris said in Adding "See all chats" for Persona on mobile:

I think the styling should be fixed in the PR, also if you have many chats the see all chats link will be way down at the bottom, maybe it should be at the top on mobile?

(apologies for the giant pictures in this post)

My original thinking was for UI consistency with the notification "see all" button in the left drawer (will add more padding and align font styling if we choose to stick with this direction):

However, I see your point, it would be nice to have the all chats page more accessible than behind a click and a scroll on mobile. I took a swing at a few other treatments that seem inline with other UI practices within the theme. If there's a preference on one of the following, please let me know:

1. See all floating to the right of the section header:
   

2. See all button like the desktop version but floating above the user chats
   

3. My last thought is the chat button could just link directly to the group chats page on mobile.

[thomas.pickles]

Been offline for a bit but it looks like this has been addressed. This has been fixed by @julian in commit d33d965 to nodebb-theme-persona and commit 9d202d9 to nodebb.

Thanks Julian!