Harden form auth and submission handling

components/dropdown-menu-avatar.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useState, useMemo } from "react";
+import { useState } from "react";
 import { usePathname } from "next/navigation";
 import Image from "next/image";
 import { LogOut } from "lucide-react";
@@ -12,7 +12,7 @@ import {
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { Button } from "@/components/ui/button";
-import { DiscordRole } from "@/app/actions/discord";
+import type { DiscordRole } from "@/lib/discord";
 
 export interface DiscordMemberProfile {
   id: string;
@@ -60,20 +60,15 @@ export function DropdownMenuAvatar({
   const displayName = profile?.globalName || userName;
   const username = profile?.username || userName;
 
-  const bannerStyle = useMemo(
-    () => ({
-      height: 100,
-      backgroundColor: profile?.accentColor
-        ? toHex(profile.accentColor)
-        : "hsl(var(--muted))",
-      backgroundImage: profile?.bannerUrl
-        ? `url(${profile.bannerUrl})`
-        : "none",
-      backgroundSize: "cover" as const,
-      backgroundPosition: "center" as const,
-    }),
-    [profile?.accentColor, profile?.bannerUrl]
-  );
+  const bannerStyle = {
+    height: 100,
+    backgroundColor: profile?.accentColor
+      ? toHex(profile.accentColor)
+      : "hsl(var(--muted))",
+    backgroundImage: profile?.bannerUrl ? `url(${profile.bannerUrl})` : "none",
+    backgroundSize: "cover" as const,
+    backgroundPosition: "center" as const,
+  };
 
   return (
     <DropdownMenu>
@@ -163,4 +158,4 @@ export function DropdownMenuAvatar({
       </DropdownMenuContent>
     </DropdownMenu>
   );
-}
+}