Block editing username and avatar on DMs

reminder-dashboard/src/components/Sidebar/index.tsx

@@ -4,16 +4,19 @@ import { MobileSidebar } from "./MobileSidebar";
 import { Brand } from "./Brand";
 import { Wave } from "./Wave";
 import { GuildEntry } from "./GuildEntry";
-import { fetchUserGuilds, GuildInfo } from "../../api";
+import { fetchUserGuilds, fetchUserInfo, GuildInfo } from "../../api";
 import { TimezonePicker } from "../TimezonePicker";
 import "./styles.scss";
+import { Link, useLocation } from "wouter";
 
 type ContentProps = {
     guilds: GuildInfo[];
 };
 
 const SidebarContent = ({ guilds }: ContentProps) => {
-    const guildEntries = guilds.map((guild) => <GuildEntry guild={guild}></GuildEntry>);
+    const guildEntries = guilds.map((guild) => <GuildEntry guild={guild} />);
+    const [loc] = useLocation();
+    const { data: userInfo } = useQuery({ ...fetchUserInfo() });
 
     return (
         <>
@@ -22,6 +25,19 @@ const SidebarContent = ({ guilds }: ContentProps) => {
             </a>
             <Wave />
             <aside class="menu">
+                <ul class="menu-list">
+                    <li>
+                        <Link
+                            class={loc.startsWith("/@me") ? "is-active switch-pane" : "switch-pane"}
+                            data-pane="guild"
+                            href={"/@me/reminders"}
+                        >
+                            <>
+                                <span class="guild-name">@{userInfo?.name || "unknown"}</span>
+                            </>
+                        </Link>
+                    </li>
+                </ul>
                 <p class="menu-label">Servers</p>
                 <ul class="menu-list guildList">{guildEntries}</ul>
                 <div