github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-05-26 03:41:50 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

UX: chat drawer increase unread channel visibility (#28731)

Browse Source 
This change increases the visibility of unread channels to make them stand out more in drawer mode (desktop).

When a channel is unread:

- it floats to the top;
- when multiple channels are unread, they are sorted alphabetically (equal to how it’s done on mobile)
- the unread indicator blue dot moves to directly right of the channel name
This commit is contained in:
David Battersby
2024-09-05 13:36:50 +04:00
committed by GitHub
parent 67ce50c141
commit e991574389
12 changed files with 95 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
plugins/chat/test/javascripts/components/channel-name-test.gjs
View File

@ -66,4 +66,23 @@ module("Discourse Chat | Component | <ChannelName />", function (hooks) {
users.mapBy("username").join(", ")
);
});
test("unreadIndicator", async function (assert) {
const channel = new ChatFabricators(getOwner(this)).directMessageChannel();
channel.tracking.unreadCount = 1;
let unreadIndicator = true;
await render(
<template><ChannelName @channel={{channel}} @unreadIndicator={{unreadIndicator}}/></template>
);
assert.true(exists(".chat-channel-unread-indicator"));
unreadIndicator = false;
await render(
<template><ChannelName @channel={{channel}} @unreadIndicator={{unreadIndicator}}/></template>
);
assert.false(exists(".chat-channel-unread-indicator"));
});
});

20
plugins/chat/test/javascripts/components/chat-channel-metadata-test.js
View File

@ -3,7 +3,6 @@ import { render } from "@ember/test-helpers";
import hbs from "htmlbars-inline-precompile";
import { module, test } from "qunit";
import { setupRenderingTest } from "discourse/tests/helpers/component-test";
import { exists } from "discourse/tests/helpers/qunit-helpers";
import ChatFabricators from "discourse/plugins/chat/discourse/lib/fabricators";
module("Discourse Chat | Component | chat-channel-metadata", function (hooks) {
@ -29,23 +28,4 @@ module("Discourse Chat | Component | chat-channel-metadata", function (hooks) {
.dom(".chat-channel__metadata-date")
.hasText(lastMessageSentAt.format("LT"));
});
test("unreadIndicator", async function (assert) {
this.channel = new ChatFabricators(getOwner(this)).directMessageChannel();
this.channel.tracking.unreadCount = 1;
this.unreadIndicator = true;
await render(
hbs`<ChatChannelMetadata @channel={{this.channel}} @unreadIndicator={{this.unreadIndicator}}/>`
);
assert.true(exists(".chat-channel-unread-indicator"));
this.unreadIndicator = false;
await render(
hbs`<ChatChannelMetadata @channel={{this.channel}} @unreadIndicator={{this.unreadIndicator}}/>`
);
assert.false(exists(".chat-channel-unread-indicator"));
});
});