src/context/intermediate/modals/Prompt.tsx

 import { observer } from "mobx-react-lite";
 import { useHistory } from "react-router-dom";
-import { Channels, Servers, Users } from "revolt.js/dist/api/objects";
+import { Channel } from "revolt.js/dist/maps/Channels";
+import { Message as MessageI } from "revolt.js/dist/maps/Messages";
+import { Server } from "revolt.js/dist/maps/Servers";
+import { User } from "revolt.js/dist/maps/Users";
 import { ulid } from "ulid";
 
 import styles from "./Prompt.module.scss";
@@ -9,9 +12,6 @@ import { useContext, useEffect, useState } from "preact/hooks";
 
 import { TextReact } from "../../../lib/i18n";
 
-import { User } from "../../../mobx";
-import { useData } from "../../../mobx/State";
-
 import Message from "../../../components/common/messaging/Message";
 import UserIcon from "../../../components/common/user/UserIcon";
 import InputBox from "../../../components/ui/InputBox";
@@ -21,7 +21,7 @@ import Radio from "../../../components/ui/Radio";
 
 import { Children } from "../../../types/Preact";
 import { AppContext } from "../../revoltjs/RevoltClient";
-import { mapMessage, takeError } from "../../revoltjs/util";
+import { takeError } from "../../revoltjs/util";
 import { useIntermediate } from "../Intermediate";
 
 interface Props {
@@ -55,21 +55,21 @@ export function PromptModal({
 }
 
 type SpecialProps = { onClose: () => void } & (
-    | { type: "leave_group"; target: Channels.GroupChannel }
-    | { type: "close_dm"; target: Channels.DirectMessageChannel }
-    | { type: "leave_server"; target: Servers.Server }
-    | { type: "delete_server"; target: Servers.Server }
-    | { type: "delete_channel"; target: Channels.TextChannel }
-    | { type: "delete_message"; target: Channels.Message }
+    | { type: "leave_group"; target: Channel }
+    | { type: "close_dm"; target: Channel }
+    | { type: "leave_server"; target: Server }
+    | { type: "delete_server"; target: Server }
+    | { type: "delete_channel"; target: Channel }
+    | { type: "delete_message"; target: MessageI }
     | {
           type: "create_invite";
-          target: Channels.TextChannel | Channels.GroupChannel;
+          target: Channel;
       }
-    | { type: "kick_member"; target: Servers.Server; user: User }
-    | { type: "ban_member"; target: Servers.Server; user: User }
+    | { type: "kick_member"; target: Server; user: User }
+    | { type: "ban_member"; target: Server; user: User }
     | { type: "unfriend_user"; target: User }
     | { type: "block_user"; target: User }
-    | { type: "create_channel"; target: Servers.Server }
+    | { type: "create_channel"; target: Server }
 );
 
 export const SpecialPromptModal = observer((props: SpecialProps) => {
@@ -104,9 +104,7 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
                     name = props.target.username;
                     break;
                 case "close_dm":
-                    name = client.users.get(
-                        client.channels.getRecipient(props.target._id),
-                    )?.username;
+                    name = props.target.recipient?.username;
                     break;
                 default:
                     name = props.target.name;
@@ -137,27 +135,19 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
                                 try {
                                     switch (props.type) {
                                         case "unfriend_user":
-                                            await client.users.removeFriend(
-                                                props.target._id,
-                                            );
+                                            await props.target.removeFriend();
                                             break;
                                         case "block_user":
-                                            await client.users.blockUser(
-                                                props.target._id,
-                                            );
+                                            await props.target.blockUser();
                                             break;
                                         case "leave_group":
                                         case "close_dm":
                                         case "delete_channel":
-                                            await client.channels.delete(
-                                                props.target._id,
-                                            );
+                                            props.target.delete();
                                             break;
                                         case "leave_server":
                                         case "delete_server":
-                                            await client.servers.delete(
-                                                props.target._id,
-                                            );
+                                            props.target.delete();
                                             break;
                                     }
 
@@ -203,11 +193,7 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
                                 setProcessing(true);
 
                                 try {
-                                    await client.channels.deleteMessage(
-                                        props.target.channel,
-                                        props.target._id,
-                                    );
-
+                                    props.target.delete();
                                     onClose();
                                 } catch (err) {
                                     setError(takeError(err));
@@ -229,7 +215,7 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
                                 id={`app.special.modals.prompt.confirm_delete_message_long`}
                             />
                             <Message
-                                message={mapMessage(props.target)}
+                                message={props.target}
                                 head={true}
                                 contrast
                             />
@@ -247,12 +233,12 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
             useEffect(() => {
                 setProcessing(true);
 
-                client.channels
-                    .createInvite(props.target._id)
+                props.target
+                    .createInvite()
                     .then((code) => setCode(code))
                     .catch((err) => setError(takeError(err)))
                     .finally(() => setProcessing(false));
-            }, []);
+            }, [props.target]);
 
             return (
                 <PromptModal
@@ -306,10 +292,13 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
                                 setProcessing(true);
 
                                 try {
-                                    await client.members.kickMember(
-                                        props.target._id,
-                                        props.user._id,
-                                    );
+                                    client.members
+                                        .getKey({
+                                            server: props.target._id,
+                                            user: props.user._id,
+                                        })
+                                        ?.kick();
+
                                     onClose();
                                 } catch (err) {
                                     setError(takeError(err));
@@ -357,11 +346,9 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
                                 setProcessing(true);
 
                                 try {
-                                    await client.servers.banUser(
-                                        props.target._id,
-                                        props.user._id,
-                                        { reason },
-                                    );
+                                    await props.target.banUser(props.user._id, {
+                                        reason,
+                                    });
                                     onClose();
                                 } catch (err) {
                                     setError(takeError(err));
@@ -420,14 +407,11 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
 
                                 try {
                                     const channel =
-                                        await client.servers.createChannel(
-                                            props.target._id,
-                                            {
-                                                type,
-                                                name,
-                                                nonce: ulid(),
-                                            },
-                                        );
+                                        await props.target.createChannel({
+                                            type,
+                                            name,
+                                            nonce: ulid(),
+                                        });
 
                                     history.push(
                                         `/server/${props.target._id}/channel/${channel._id}`,

src/context/intermediate/popovers/ChannelInfo.tsx

 import { X } from "@styled-icons/boxicons-regular";
+import { observer } from "mobx-react-lite";
+import { Channel } from "revolt.js/dist/maps/Channels";
 
 import styles from "./ChannelInfo.module.scss";
 
 import Modal from "../../../components/ui/Modal";
 
 import Markdown from "../../../components/markdown/Markdown";
-import { useChannel, useForceUpdate } from "../../revoltjs/hooks";
 import { getChannelName } from "../../revoltjs/util";
 
 interface Props {
-    channel_id: string;
+    channel: Channel;
     onClose: () => void;
 }
 
-export function ChannelInfo({ channel_id, onClose }: Props) {
-    const ctx = useForceUpdate();
-    const channel = useChannel(channel_id, ctx);
-    if (!channel) return null;
-
+export const ChannelInfo = observer(({ channel, onClose }: Props) => {
     if (
         channel.channel_type === "DirectMessage" ||
         channel.channel_type === "SavedMessages"
@@ -30,15 +27,15 @@ export function ChannelInfo({ channel_id, onClose }: Props) {
         <Modal visible={true} onClose={onClose}>
             <div className={styles.info}>
                 <div className={styles.header}>
-                    <h1>{getChannelName(ctx.client, channel, true)}</h1>
+                    <h1>{getChannelName(channel, true)}</h1>
                     <div onClick={onClose}>
                         <X size={36} />
                     </div>
                 </div>
                 <p>
-                    <Markdown content={channel.description} />
+                    <Markdown content={channel.description!} />
                 </p>
             </div>
         </Modal>
     );
-}
+});

src/context/intermediate/popovers/ImageViewer.tsx

-import {
-    Attachment,
-    AttachmentMetadata,
-    EmbedImage,
-} from "revolt.js/dist/api/objects";
+/* eslint-disable react-hooks/rules-of-hooks */
+import { Attachment, AttachmentMetadata } from "revolt-api/types/Autumn";
+import { EmbedImage } from "revolt-api/types/January";
 
 import styles from "./ImageViewer.module.scss";
-import { useContext, useEffect } from "preact/hooks";
 
 import AttachmentActions from "../../../components/common/messaging/attachments/AttachmentActions";
 import EmbedMediaActions from "../../../components/common/messaging/embed/EmbedMediaActions";

src/context/intermediate/popovers/ModifyAccount.tsx

@@ -85,11 +85,13 @@ export function ModifyAccountModal({ onClose, field }: Props) {
             ]}>
             {/* Preact / React typing incompatabilities */}
             <form
-                onSubmit={
+                onSubmit={(e) => {
+                    e.preventDefault();
                     handleSubmit(
                         onSubmit,
-                    ) as JSX.GenericEventHandler<HTMLFormElement>
-                }>
+                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    )(e as any);
+                }}>
                 {field === "email" && (
                     <FormField
                         type="email"

src/context/intermediate/popovers/PendingRequests.tsx

 import { observer } from "mobx-react-lite";
+import { User } from "revolt.js/dist/maps/Users";
 
 import styles from "./UserPicker.module.scss";
 import { Text } from "preact-i18n";
 
-import { User } from "../../../mobx";
-
 import Modal from "../../../components/ui/Modal";
 
 import { Friend } from "../../../pages/friends/Friend";

src/context/intermediate/popovers/UserPicker.module.scss

@@ -4,7 +4,6 @@
     max-height: 360px;
     overflow-y: scroll;
 
-    // ! FIXME: very temporary code
     > label {
         > span {
             align-items: flex-start !important;
@@ -18,4 +17,4 @@
             }
         }
     }
-}
\ No newline at end of file
+}

src/context/intermediate/popovers/UserPicker.tsx

-import { User, Users } from "revolt.js/dist/api/objects";
+import { RelationshipStatus } from "revolt-api/types/Users";
 
 import styles from "./UserPicker.module.scss";
 import { Text } from "preact-i18n";
@@ -7,7 +7,7 @@ import { useState } from "preact/hooks";
 import UserCheckbox from "../../../components/common/user/UserCheckbox";
 import Modal from "../../../components/ui/Modal";
 
-import { useUsers } from "../../revoltjs/hooks";
+import { useClient } from "../../revoltjs/RevoltClient";
 
 interface Props {
     omit?: string[];
@@ -19,7 +19,7 @@ export function UserPicker(props: Props) {
     const [selected, setSelected] = useState<string[]>([]);
     const omit = [...(props.omit || []), "00000000000000000000000000"];
 
-    const users = useUsers();
+    const client = useClient();
 
     return (
         <Modal
@@ -33,24 +33,18 @@ export function UserPicker(props: Props) {
                 },
             ]}>
             <div className={styles.list}>
-                {(
-                    users.filter(
+                {[...client.users.values()]
+                    .filter(
                         (x) =>
                             x &&
-                            x.relationship === Users.Relationship.Friend &&
+                            x.relationship === RelationshipStatus.Friend &&
                             !omit.includes(x._id),
-                    ) as User[]
-                )
-                    .map((x) => {
-                        return {
-                            ...x,
-                            selected: selected.includes(x._id),
-                        };
-                    })
+                    )
                     .map((x) => (
                         <UserCheckbox
+                            key={x._id}
                             user={x}
-                            checked={x.selected}
+                            checked={selected.includes(x._id)}
                             onChange={(v) => {
                                 if (v) {
                                     setSelected([...selected, x._id]);