janpeter/Scrum4Me
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: move logout form outside DropdownMenuContent so requestSubmit fires

Browse source 
UserMenu's hidden logout-form zat binnen <DropdownMenuContent>. Wanneer een
DropdownMenuItem onSelect vuurt, sluit base-ui de menu en unmount het
content-portal in dezelfde tick — waardoor de form verdwijnt voordat
requestSubmit() wordt aangeroepen, en logoutFormRef.current null is.

Form naar top-level van het component verplaatsen (als sibling van DropdownMenu,
binnen Fragment) houdt de ref geldig. Geen DOM-side-effecten — form is hidden,
zat nooit visueel in het menu.

Quality gates: lint 0 errors, tsc clean.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Janpeter Visser 2026-04-27 23:33:09 +02:00
parent c87b6156ae
commit 4f9a6d2d9e
1 changed files with 8 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

12
components/shared/user-menu.tsx
View file

@ -36,8 +36,12 @@ export function UserMenu({ userId, username, email, roles }: UserMenuProps) {
const logoutFormRef = useRef<HTMLFormElement>(null)
return (
<DropdownMenu>
<DropdownMenuTrigger
<>
{/* Form buiten DropdownMenuContent — die unmount op onSelect waardoor de ref
null wordt voordat requestSubmit() vuurt. */}
<form ref={logoutFormRef} action={logoutAction} className="hidden" />
<DropdownMenu>
<DropdownMenuTrigger
className="rounded-full focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-background"
aria-label="Accountmenu openen"
>
@ -109,8 +113,8 @@ export function UserMenu({ userId, username, email, roles }: UserMenuProps) {
<LogOut className="mr-2 h-4 w-4" />
<span>Uitloggen</span>
</DropdownMenuItem>
<form ref={logoutFormRef} action={logoutAction} className="hidden" />
</DropdownMenuContent>
</DropdownMenu>
</DropdownMenu>
</>
)
}