Remove useServer and useServers.

src/components/common/ServerHeader.tsx

@@ -1,26 +1,30 @@
 import { Cog } from "@styled-icons/boxicons-solid";
+import { observer } from "mobx-react-lite";
 import { Link } from "react-router-dom";
-import { Server } from "revolt.js/dist/api/objects";
 import { ServerPermission } from "revolt.js/dist/api/permissions";
 import styled from "styled-components";
 
-import { HookContext, useServerPermission } from "../../context/revoltjs/hooks";
+import { Server } from "../../mobx";
+
+import { useClient } from "../../context/revoltjs/RevoltClient";
+import { useServerPermission } from "../../context/revoltjs/hooks";
 
 import Header from "../ui/Header";
 import IconButton from "../ui/IconButton";
 
 interface Props {
     server: Server;
-    ctx: HookContext;
 }
 
 const ServerName = styled.div`
     flex-grow: 1;
 `;
 
-export default function ServerHeader({ server, ctx }: Props) {
-    const permissions = useServerPermission(server._id, ctx);
-    const bannerURL = ctx.client.servers.getBannerURL(
+export default observer(({ server }: Props) => {
+    const permissions = useServerPermission(server._id);
+    const client = useClient();
+
+    const bannerURL = client.servers.getBannerURL(
         server._id,
         { width: 480 },
         true,
@@ -46,4 +50,4 @@ export default function ServerHeader({ server, ctx }: Props) {
             )}
         </Header>
     );
-}
+});

src/components/common/ServerIcon.tsx

@@ -1,8 +1,10 @@
-import { Server } from "revolt.js/dist/api/objects";
+import { observer } from "mobx-react-lite";
 import styled from "styled-components";
 
 import { useContext } from "preact/hooks";
 
+import { Server } from "../../mobx";
+
 import { AppContext } from "../../context/revoltjs/RevoltClient";
 
 import { IconBaseProps, ImageIconBase } from "./IconBase";
@@ -22,48 +24,50 @@ const ServerText = styled.div`
 `;
 
 const fallback = "/assets/group.png";
-export default function ServerIcon(
-    props: Props & Omit<JSX.HTMLAttributes<HTMLImageElement>, keyof Props>,
-) {
-    const client = useContext(AppContext);
+export default observer(
+    (
+        props: Props & Omit<JSX.HTMLAttributes<HTMLImageElement>, keyof Props>,
+    ) => {
+        const client = useContext(AppContext);
 
-    const {
-        target,
-        attachment,
-        size,
-        animate,
-        server_name,
-        children,
-        as,
-        ...imgProps
-    } = props;
-    const iconURL = client.generateFileURL(
-        target?.icon ?? attachment,
-        { max_side: 256 },
-        animate,
-    );
+        const {
+            target,
+            attachment,
+            size,
+            animate,
+            server_name,
+            children,
+            as,
+            ...imgProps
+        } = props;
+        const iconURL = client.generateFileURL(
+            target?.icon ?? attachment,
+            { max_side: 256 },
+            animate,
+        );
 
-    if (typeof iconURL === "undefined") {
-        const name = target?.name ?? server_name ?? "";
+        if (typeof iconURL === "undefined") {
+            const name = target?.name ?? server_name ?? "";
+
+            return (
+                <ServerText style={{ width: size, height: size }}>
+                    {name
+                        .split(" ")
+                        .map((x) => x[0])
+                        .filter((x) => typeof x !== "undefined")}
+                </ServerText>
+            );
+        }
 
         return (
-            <ServerText style={{ width: size, height: size }}>
-                {name
-                    .split(" ")
-                    .map((x) => x[0])
-                    .filter((x) => typeof x !== "undefined")}
-            </ServerText>
+            <ImageIconBase
+                {...imgProps}
+                width={size}
+                height={size}
+                src={iconURL}
+                loading="lazy"
+                aria-hidden="true"
+            />
         );
-    }
-
-    return (
-        <ImageIconBase
-            {...imgProps}
-            width={size}
-            height={size}
-            src={iconURL}
-            loading="lazy"
-            aria-hidden="true"
-        />
-    );
-}
+    },
+);

src/components/common/user/UserShort.tsx

@@ -1,16 +1,9 @@
 import { observer } from "mobx-react-lite";
-import { useParams } from "react-router-dom";
 
 import { Text } from "preact-i18n";
 
 import { User } from "../../../mobx";
 
-import {
-    useForceUpdate,
-    useMember,
-    useServer,
-} from "../../../context/revoltjs/hooks";
-
 import UserIcon from "./UserIcon";
 
 export const Username = observer(