Finish migrating user state over to MobX.

src/components/common/user/UserCheckbox.tsx

@@ -1,8 +1,9 @@
-import { User } from "revolt.js";
+import { User } from "../../../mobx";
 
 import Checkbox, { CheckboxProps } from "../../ui/Checkbox";
 
 import UserIcon from "./UserIcon";
+import { Username } from "./UserShort";
 
 type UserProps = Omit<CheckboxProps, "children"> & { user: User };
 
@@ -10,7 +11,7 @@ export default function UserCheckbox({ user, ...props }: UserProps) {
     return (
         <Checkbox {...props}>
             <UserIcon target={user} size={32} />
-            {user.username}
+            <Username user={user} />
         </Checkbox>
     );
 }

src/components/common/user/UserHeader.tsx

@@ -1,6 +1,6 @@
 import { Cog } from "@styled-icons/boxicons-solid";
+import { observer } from "mobx-react-lite";
 import { Link } from "react-router-dom";
-import { User } from "revolt.js";
 import styled from "styled-components";
 
 import { openContextMenu } from "preact-context-menu";
@@ -9,6 +9,8 @@ import { Localizer } from "preact-i18n";
 
 import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
 
+import { User } from "../../../mobx";
+
 import { useIntermediate } from "../../../context/intermediate/Intermediate";
 
 import Header from "../../ui/Header";
@@ -49,7 +51,7 @@ interface Props {
     user: User;
 }
 
-export default function UserHeader({ user }: Props) {
+export default observer(({ user }: Props) => {
     const { writeClipboard } = useIntermediate();
 
     return (
@@ -81,4 +83,4 @@ export default function UserHeader({ user }: Props) {
             )}
         </Header>
     );
-}
+});

src/components/common/user/UserShort.tsx

@@ -21,7 +21,7 @@ export const Username = observer(
         let username = user?.username;
         let color;
 
-        // ! FIXME: this must be really bad for perf.
+        /* // ! FIXME: this must be really bad for perf.
         if (user) {
             let { server } = useParams<{ server?: string }>();
             if (server) {
@@ -44,7 +44,7 @@ export const Username = observer(
                     }
                 }
             }
-        }
+        } */
 
         return (
             <span {...otherProps} style={{ color }}>