Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

UX: sort chat channels by activity in desktop drawer (#28822) 

This change sorts the desktop chat channels by activity in drawer mode, and keeps sidebar channel list sorted by slug.
This commit is contained in:
David Battersby 2024-09-13 10:14:37 +04:00 committed by GitHub
parent f6ba5ed4d9
commit e9b7663798
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 31 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
plugins/chat/assets/javascripts/discourse/components/channels-list-public.gjs
View File

@ -33,6 +33,12 @@ export default class ChannelsListPublic extends Component {
return this.chatChannelsManager.hasThreadedChannels;
}
get channelList() {
return this.args.sortByActivity === true
? this.chatChannelsManager.publicMessageChannelsByActivity
: this.chatChannelsManager.publicMessageChannels;
}
@action
toggleChannelSection(section) {
this.args.toggleSection(section);
@ -103,7 +109,7 @@ export default class ChannelsListPublic extends Component {
@showCTA={{this.chatChannelsManager.displayPublicChannels}}
/>
{{else}}
{{#each this.chatChannelsManager.publicMessageChannels as |channel|}}
{{#each this.channelList as |channel|}}
<ChatChannelRow
@channel={{channel}}
@options={{hash settingsButton=true}}

2
plugins/chat/assets/javascripts/discourse/components/chat/drawer-routes/channels.gjs
View File

@ -22,7 +22,7 @@ export default class ChatDrawerRoutesChannels extends Component {
{{#if this.chatStateManager.isDrawerExpanded}}
<div class="chat-drawer-content">
<ChannelsListPublic />
<ChannelsListPublic @sortByActivity={{true}} />
</div>
<ChatFooter />

2
plugins/chat/assets/javascripts/discourse/components/chat/routes/channels.gjs
View File

@ -17,7 +17,7 @@ export default class ChatRoutesChannels extends Component {
</navbar.Actions>
</Navbar>
<ChannelsListPublic />
<ChannelsListPublic @sortByActivity={{true}} />
</div>
</template>
}

18
plugins/chat/assets/javascripts/discourse/services/chat-channels-manager.js
View File

@ -125,16 +125,16 @@ export default class ChatChannelsManager extends Service {
@cached
get publicMessageChannels() {
const channels = this.channels.filter(
(channel) =>
channel.isCategoryChannel && channel.currentUserMembership.following
);
return this.channels
.filter(
(channel) =>
channel.isCategoryChannel && channel.currentUserMembership.following
)
.sort((a, b) => a?.slug?.localeCompare?.(b?.slug));
}
if (this.site.mobileView) {
return this.#sortChannelsByActivity(channels);
} else {
return channels.sort((a, b) => a?.slug?.localeCompare?.(b?.slug));
}
get publicMessageChannelsByActivity() {
return this.#sortChannelsByActivity(this.publicMessageChannels);
}
@cached

14
plugins/chat/spec/system/list_channels/sidebar_spec.rb
View File

@ -50,7 +50,19 @@ RSpec.describe "List channels | sidebar", type: :system do
channel_2.add(current_user)
end
it "sorts them by slug" do
it "sorts them by slug when all channels are read" do
visit("/")
expect(page.find("#sidebar-section-content-chat-channels li:nth-child(1)")).to have_css(
".channel-#{channel_2.id}",
)
expect(page.find("#sidebar-section-content-chat-channels li:nth-child(2)")).to have_css(
".channel-#{channel_1.id}",
)
end
it "sorts them by slug when channel has unread messages" do
Fabricate(:chat_message, chat_channel: channel_1)
visit("/")
expect(page.find("#sidebar-section-content-chat-channels li:nth-child(1)")).to have_css(