Work towards removing useUsers.

src/components/navigation/left/HomeSidebar.tsx

@@ -4,6 +4,7 @@ import {
     Wrench,
     Notepad,
 } from "@styled-icons/boxicons-solid";
+import { observer } from "mobx-react-lite";
 import { Link, Redirect, useLocation, useParams } from "react-router-dom";
 import { Channels } from "revolt.js/dist/api/objects";
 import { Users as UsersNS } from "revolt.js/dist/api/objects";
@@ -15,6 +16,7 @@ import ConditionalLink from "../../../lib/ConditionalLink";
 import PaintCounter from "../../../lib/PaintCounter";
 import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
 
+import { useData } from "../../../mobx/State";
 import { dispatch } from "../../../redux";
 import { connectState } from "../../../redux/connector";
 import { Unreads } from "../../../redux/reducers/unreads";
@@ -39,7 +41,7 @@ type Props = {
     unreads: Unreads;
 };
 
-function HomeSidebar(props: Props) {
+const HomeSidebar = observer((props: Props) => {
     const { pathname } = useLocation();
     const client = useContext(AppContext);
     const { channel } = useParams<{ channel: string }>();
@@ -66,7 +68,7 @@ function HomeSidebar(props: Props) {
         .filter((x) => x.channel_type !== "SavedMessages")
         .map((x) => mapChannelWithUnread(x, props.unreads));
 
-    const users = useUsers(undefined, ctx);
+    const store = useData();
     channelsArr.sort((b, a) => a.timestamp.localeCompare(b.timestamp));
 
     return (
@@ -89,7 +91,7 @@ function HomeSidebar(props: Props) {
                             <ButtonItem
                                 active={pathname === "/friends"}
                                 alert={
-                                    typeof users.find(
+                                    typeof [...store.users.values()].find(
                                         (user) =>
                                             user?.relationship ===
                                             UsersNS.Relationship.Incoming,
@@ -143,7 +145,7 @@ function HomeSidebar(props: Props) {
                         if (!x.active) return null;
 
                         const recipient = client.channels.getRecipient(x._id);
-                        user = users.find((x) => x?._id === recipient);
+                        user = store.users.get(recipient);
 
                         if (!user) {
                             console.warn(
@@ -171,7 +173,7 @@ function HomeSidebar(props: Props) {
             </GenericSidebarList>
         </GenericSidebarBase>
     );
-}
+});
 
 export default connectState(
     HomeSidebar,

src/components/navigation/left/ServerListSidebar.tsx

@@ -1,4 +1,5 @@
 import { Plus } from "@styled-icons/boxicons-regular";
+import { observer } from "mobx-react-lite";
 import { useLocation, useParams } from "react-router-dom";
 import { Channel, Servers, Users } from "revolt.js/dist/api/objects";
 import styled, { css } from "styled-components";
@@ -9,17 +10,17 @@ import ConditionalLink from "../../../lib/ConditionalLink";
 import PaintCounter from "../../../lib/PaintCounter";
 import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
 
+import { useData } from "../../../mobx/State";
 import { connectState } from "../../../redux/connector";
 import { LastOpened } from "../../../redux/reducers/last_opened";
 import { Unreads } from "../../../redux/reducers/unreads";
 
 import { useIntermediate } from "../../../context/intermediate/Intermediate";
+import { useClient } from "../../../context/revoltjs/RevoltClient";
 import {
     useChannels,
     useForceUpdate,
-    useSelf,
     useServers,
-    useUsers,
 } from "../../../context/revoltjs/hooks";
 
 import logoSVG from "../../../assets/logo.svg";
@@ -178,14 +179,16 @@ interface Props {
     lastOpened: LastOpened;
 }
 
-export function ServerListSidebar({ unreads, lastOpened }: Props) {
+export const ServerListSidebar = observer(({ unreads, lastOpened }: Props) => {
+    const store = useData();
+    const client = useClient();
+    const self = store.users.get(client.user!._id);
+
     const ctx = useForceUpdate();
-    const self = useSelf(ctx);
     const activeServers = useServers(undefined, ctx) as Servers.Server[];
     const channels = (useChannels(undefined, ctx) as Channel[]).map((x) =>
         mapChannelWithUnread(x, unreads),
     );
-    const users = useUsers(undefined, ctx);
 
     const unreadChannels = channels.filter((x) => x.unread).map((x) => x._id);
 
@@ -230,7 +233,11 @@ export function ServerListSidebar({ unreads, lastOpened }: Props) {
         }
     }
 
-    if (users.find((x) => x?.relationship === Users.Relationship.Incoming)) {
+    if (
+        [...store.users.values()].find(
+            (x) => x.relationship === Users.Relationship.Incoming,
+        )
+    ) {
         alertCount++;
     }
 
@@ -298,7 +305,7 @@ export function ServerListSidebar({ unreads, lastOpened }: Props) {
             </ServerList>
         </ServersBase>
     );
-}
+});
 
 export default connectState(ServerListSidebar, (state) => {
     return {