Remove useServer and useServers.

src/components/navigation/left/ServerListSidebar.tsx

@@ -17,7 +17,6 @@ import { Unreads } from "../../../redux/reducers/unreads";
 
 import { useIntermediate } from "../../../context/intermediate/Intermediate";
 import { useClient } from "../../../context/revoltjs/RevoltClient";
-import { useForceUpdate, useServers } from "../../../context/revoltjs/hooks";
 
 import logoSVG from "../../../assets/logo.svg";
 import ServerIcon from "../../common/ServerIcon";
@@ -180,8 +179,9 @@ export const ServerListSidebar = observer(({ unreads, lastOpened }: Props) => {
     const client = useClient();
     const self = store.users.get(client.user!._id);
 
-    const ctx = useForceUpdate();
-    const activeServers = useServers(undefined, ctx) as Servers.Server[];
+    const { server: server_id } = useParams<{ server?: string }>();
+    const server = server_id ? store.servers.get(server_id) : undefined;
+    const activeServers = [...store.servers.values()];
     const channels = [...store.channels.values()].map((x) =>
         mapChannelWithUnread(x, unreads),
     );
@@ -200,7 +200,7 @@ export const ServerListSidebar = observer(({ unreads, lastOpened }: Props) => {
         }
 
         return {
-            ...server,
+            server,
             unread: (typeof server.channels.find((x) =>
                 unreadChannels.includes(x),
             ) !== "undefined"
@@ -213,9 +213,6 @@ export const ServerListSidebar = observer(({ unreads, lastOpened }: Props) => {
     });
 
     const path = useLocation().pathname;
-    const { server: server_id } = useParams<{ server?: string }>();
-    const server = servers.find((x) => x!._id == server_id);
-
     const { openScreen } = useIntermediate();
 
     let homeUnread: "mention" | "unread" | undefined;
@@ -267,24 +264,29 @@ export const ServerListSidebar = observer(({ unreads, lastOpened }: Props) => {
                 </ConditionalLink>
                 <LineDivider />
                 {servers.map((entry) => {
-                    const active = entry!._id === server?._id;
-                    const id = lastOpened[entry!._id];
+                    const active = entry.server._id === server?._id;
+                    const id = lastOpened[entry.server._id];
 
                     return (
                         <ConditionalLink
                             active={active}
-                            to={`/server/${entry!._id}${
+                            to={`/server/${entry.server._id}${
                                 id ? `/channel/${id}` : ""
                             }`}>
                             <ServerEntry
                                 active={active}
                                 onContextMenu={attachContextMenu("Menu", {
-                                    server: entry!._id,
+                                    server: entry.server._id,
                                 })}>
                                 <Swoosh />
-                                <Tooltip content={entry.name} placement="right">
+                                <Tooltip
+                                    content={entry.server.name}
+                                    placement="right">
                                     <Icon size={42} unread={entry.unread}>
-                                        <ServerIcon size={32} target={entry} />
+                                        <ServerIcon
+                                            size={32}
+                                            target={entry.server}
+                                        />
                                     </Icon>
                                 </Tooltip>
                             </ServerEntry>

src/components/navigation/left/ServerSidebar.tsx

@@ -14,8 +14,6 @@ import { dispatch } from "../../../redux";
 import { connectState } from "../../../redux/connector";
 import { Unreads } from "../../../redux/reducers/unreads";
 
-import { useForceUpdate, useServer } from "../../../context/revoltjs/hooks";
-
 import CollapsibleSection from "../../common/CollapsibleSection";
 import ServerHeader from "../../common/ServerHeader";
 import Category from "../../ui/Category";
@@ -52,18 +50,16 @@ const ServerList = styled.div`
 `;
 
 const ServerSidebar = observer((props: Props) => {
-    const { server: server_id, channel: channel_id } =
-        useParams<{ server?: string; channel?: string }>();
-    const ctx = useForceUpdate();
-
-    const server = useServer(server_id, ctx);
-    if (!server) return <Redirect to="/" />;
-
     const store = useData();
+    const { server: server_id, channel: channel_id } =
+        useParams<{ server: string; channel?: string }>();
+
+    const server = store.servers.get(server_id);
+    if (!server) return <Redirect to="/" />;
 
     const channel = channel_id ? store.channels.get(channel_id) : undefined;
     if (channel_id && !channel) return <Redirect to={`/server/${server_id}`} />;
-    if (channel) useUnreads({ ...props, channel }, ctx);
+    if (channel) useUnreads({ ...props, channel });
 
     useEffect(() => {
         if (!channel_id) return;
@@ -125,7 +121,7 @@ const ServerSidebar = observer((props: Props) => {
 
     return (
         <ServerBase>
-            <ServerHeader server={server} ctx={ctx} />
+            <ServerHeader server={server} />
             <ConnectionStatus />
             <ServerList
                 onContextMenu={attachContextMenu("Menu", {

src/components/navigation/left/common.ts

@@ -4,6 +4,7 @@ import { Channel } from "../../../mobx";
 import { dispatch } from "../../../redux";
 import { Unreads } from "../../../redux/reducers/unreads";
 
+import { useClient } from "../../../context/revoltjs/RevoltClient";
 import { HookContext, useForceUpdate } from "../../../context/revoltjs/hooks";
 
 type UnreadProps = {
@@ -11,11 +12,8 @@ type UnreadProps = {
     unreads: Unreads;
 };
 
-export function useUnreads(
-    { channel, unreads }: UnreadProps,
-    context?: HookContext,
-) {
-    const ctx = useForceUpdate(context);
+export function useUnreads({ channel, unreads }: UnreadProps) {
+    const client = useClient();
 
     useLayoutEffect(() => {
         function checkUnread(target?: Channel) {
@@ -40,7 +38,7 @@ export function useUnreads(
                         message,
                     });
 
-                    ctx.client.req(
+                    client.req(
                         "PUT",
                         `/channels/${channel._id}/ack/${message}` as "/channels/id/ack/id",
                     );
@@ -50,9 +48,8 @@ export function useUnreads(
 
         checkUnread(channel);
 
-        ctx.client.channels.addListener("mutation", checkUnread);
-        return () =>
-            ctx.client.channels.removeListener("mutation", checkUnread);
+        client.channels.addListener("mutation", checkUnread);
+        return () => client.channels.removeListener("mutation", checkUnread);
     }, [channel, unreads]);
 }