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

plugins/chat/test/javascripts/unit/helpers/format-chat-date-test.js

@@ -3,12 +3,19 @@ import hbs from "htmlbars-inline-precompile";
 import { render } from "@ember/test-helpers";
 import { setupRenderingTest } from "discourse/tests/helpers/component-test";
 import { query } from "discourse/tests/helpers/qunit-helpers";
+import fabricators from "../../helpers/fabricators";
+import ChatMessage from "discourse/plugins/chat/discourse/models/chat-message";
 
 module("Discourse Chat | Unit | Helpers | format-chat-date", function (hooks) {
   setupRenderingTest(hooks);
 
   test("link to chat message", async function (assert) {
-    this.set("message", { id: 1, chat_channel_id: 1 });
+    const channel = fabricators.chatChannel();
+    this.message = ChatMessage.create(channel, {
+      id: 1,
+      chat_channel_id: channel.id,
+    });
+
     await render(hbs`{{format-chat-date this.message}}`);
 
     assert.equal(query(".chat-time").getAttribute("href"), "/chat/c/-/1/1");