Error: DialogPortal must be used within Dialog

[devpedro-dias]

I'm working on a barbershop website using Next.JS, NextAuth and other tools. The problem is when I was making the Header component, this error appears. I'm new to projects that use NextJs, if anyone could help I would be very grateful.

Repo: https://github.com/devpedro-dias/devbarber
Error image:

[Syammed2429]

Is it ShadCn dialog??m if it is
You must wrap the DialogContent within the Dialog

example

<Dialog>
      <DialogTrigger asChild>
        <Button variant="outline">Trigger dialog</Button>
      </DialogTrigger>
      <DialogContent className="sm:max-w-[425px]">
        <DialogHeader>
          <DialogTitle>Some Title</DialogTitle>
          <DialogDescription>
            Some Des
          </DialogDescription>
        </DialogHeader>
        <div>
       your content
       </div>
          <DialogFooter>
          <Button type="submit">Save changes</Button>
        </DialogFooter>
      </DialogContent>
    </Dialog>

[devpedro-dias]

I've already solved it, after 1 hour searching the code I found it, it's in the implementation of SidebarSheet in the Header. It's outside the Sheet tag :/.
And yes, I'm using the ShadCN components
Thanks for the help

[Syammed2429]

I've already solved it, after 1 hour searching the code I found it, it's in the implementation of SidebarSheet in the Header. It's outside the Sheet tag :/. And yes, I'm using the ShadCN components Thanks for the help

Just remember wherever you use, it must be wrap the main content, suppose

somewhere on your component

<DialogContent>
your data
</DialogContent>

'another component`

<Dialog>
<SomeOtherDialogComponentFromAbove/>
</Dialog>

That's it