Work on channels, render content of messages.

src/context/revoltjs/RevoltClient.tsx

@@ -4,13 +4,14 @@ import { takeError } from "./util";
 import { createContext } from "preact";
 import { Children } from "../../types/Preact";
 import { Route } from "revolt.js/dist/api/routes";
-import { useEffect, useMemo, useState } from "preact/hooks";
 import { connectState } from "../../redux/connector";
 import Preloader from "../../components/ui/Preloader";
 import { WithDispatcher } from "../../redux/reducers";
 import { AuthState } from "../../redux/reducers/auth";
 import { SyncOptions } from "../../redux/reducers/sync";
+import { useEffect, useMemo, useState } from "preact/hooks";
 import { registerEvents, setReconnectDisallowed } from "./events";
+import { SingletonMessageRenderer } from '../../lib/renderer/Singleton';
 
 export enum ClientStatus {
     INIT,
@@ -61,13 +62,15 @@ function Context({ auth, sync, children, dispatcher }: Props) {
                 console.error('Failed to open IndexedDB store, continuing without.');
             }
 
-            setClient(new Client({
+            const client = new Client({
                 autoReconnect: false,
                 apiURL: import.meta.env.VITE_API_URL,
                 debug: import.meta.env.DEV,
                 db
-            }));
+            });
 
+            setClient(client);
+            SingletonMessageRenderer.subscribe(client);
             setStatus(ClientStatus.LOADING);
         })();
     }, [ ]);
@@ -131,10 +134,7 @@ function Context({ auth, sync, children, dispatcher }: Props) {
         }
     }, [ client, auth.active ]);
 
-    useEffect(
-        () => registerEvents({ operations, dispatcher }, setStatus, client),
-        [ client ]
-    );
+    useEffect(() => registerEvents({ operations, dispatcher }, setStatus, client), [ client ]);
 
     useEffect(() => {
         (async () => {

src/context/revoltjs/util.tsx

@@ -22,14 +22,13 @@ export function takeError(
     return id;
 }
 
-export function getChannelName(client: Client, channel: Channel, users: User[], prefixType?: boolean): Children {
+export function getChannelName(client: Client, channel: Channel, prefixType?: boolean): Children {
     if (channel.channel_type === "SavedMessages")
         return <Text id="app.navigation.tabs.saved" />;
 
     if (channel.channel_type === "DirectMessage") {
         let uid = client.channels.getRecipient(channel._id);
-
-        return <>{prefixType && "@"}{users.find(x => x._id === uid)?.username}</>;
+        return <>{prefixType && "@"}{client.users.get(uid)?.username}</>;
     }
 
     if (channel.channel_type === "TextChannel" && prefixType) {