Next.js Discord

Discord Forum

Shadcn alert menu disappears instantly when clicked

Answered
aa55h posted this in #help-forum
Open in Discord
This is the tsx:
<DropdownMenu>
        <DropdownMenuTrigger asChild>
          <Avatar className='ml-auto cursor-pointer'>
            <AvatarImage src={iconUrl} />
            <AvatarFallback>
              <UserIcon className='stroke-black' />
            </AvatarFallback>
          </Avatar>
        </DropdownMenuTrigger>
        <DropdownMenuContent>
          <DropdownMenuItem>Nastavení</DropdownMenuItem>
          <AlertDialog>
            <AlertDialogTrigger asChild>
              <DropdownMenuItem>Odhlásit se</DropdownMenuItem>
            </AlertDialogTrigger>
            <AlertDialogContent>
              <AlertDialogHeader>
                <AlertDialogTitle>Are you absolutely sure?</AlertDialogTitle>
                <AlertDialogDescription>
                  This action cannot be undone. This will permanently delete your account
                  and remove your data from our servers.
                </AlertDialogDescription>
              </AlertDialogHeader>
              <AlertDialogFooter>
                <AlertDialogCancel>Cancel</AlertDialogCancel>
                <AlertDialogAction>Continue</AlertDialogAction>
              </AlertDialogFooter>
            </AlertDialogContent>
          </AlertDialog>
        </DropdownMenuContent>
      </DropdownMenu>


it would just disappear when clicked, any idea why?
Answered by chisto
you can make the DropdownMenu not close on click or dont make Alert a child of Dropdown
View full answer

5 Replies

maybe because the alert is a child of dropdown and if you close the dropdown it kills the child
you can make the DropdownMenu not close on click or dont make Alert a child of Dropdown
Answer
yay it works
Asian black bear
This behavior is documented here: https://ui.shadcn.com/docs/components/dialog#notes
Additionally I have opened a PR a few days ago to suggest a hook for more ergonomic handling of dialogs or multiple ones from menus and you might want to check the same rewritten section over here: https://ui-git-fork-christianivicevic-contextmenu-dia-0a4afd-shadcn-pro.vercel.app/docs/components/dialog#notes