DEV: rework the chat-live-pane

This PR is introducing glimmer usage in the chat-live-pane, for components but also for models. RestModel usage has been dropped in favor of native classes.

Other changes/additions in this PR:

- sticky dates, scrolling will now keep the date separator of the current section at the top of the screen
- better unread management, marking a channel as unread will correctly mark the correct message and not mark the whole channel as read. Tracking state will also now correctly return unread count and unread mentions.
- adds an animation on bottom arrow
- better scrolling behavior, we should now always correctly keep the scroll position while loading more
- reactions are now more reactive, and will update their tooltip without needed to close/reopen it
- skeleton has been improved with placeholder images and reactions
- when making a reaction on the desktop message actions, the menu won't move anymore
- simplify logic and stop maintaining a list of unloaded messages
This commit is contained in:
Joffrey JAFFEUX
2023-03-02 16:34:25 +01:00
committed by GitHub
parent e206bd8907
commit 67c0498f64
118 changed files with 2550 additions and 2289 deletions

View File

@ -7,14 +7,6 @@ import { module, test } from "qunit";
module("Discourse Chat | Component | chat-message-reaction", function (hooks) {
setupRenderingTest(hooks);
test("accepts arbitrary class property", async function (assert) {
await render(hbs`
<ChatMessageReaction @reaction={{hash emoji="heart"}} @class="foo" />
`);
assert.true(exists(".chat-message-reaction.foo"));
});
test("adds reacted class when user reacted", async function (assert) {
await render(hbs`
<ChatMessageReaction @reaction={{hash emoji="heart" reacted=true}} />
@ -29,19 +21,6 @@ module("Discourse Chat | Component | chat-message-reaction", function (hooks) {
assert.true(exists(`.chat-message-reaction[data-emoji-name="heart"]`));
});
test("adds show class when count is positive", async function (assert) {
this.set("count", 0);
await render(hbs`
<ChatMessageReaction @reaction={{hash emoji="heart" count=this.count}} />
`);
assert.false(exists(".chat-message-reaction.show"));
this.set("count", 1);
assert.true(exists(".chat-message-reaction.show"));
});
test("title/alt attributes", async function (assert) {
await render(hbs`<ChatMessageReaction @reaction={{hash emoji="heart"}} />`);