How to have Dialog with Tooltip where the tooltip does not reopen when I close the Dialog

[DevDeepakBhattarai]

I am currently using the code below for the tooltip dialog combo

<Dialog
      open={isModalOpen}
      onOpenChange={async (open) => {
        setIsModalOpen(open);
        closeTooltip();
      }}
    >
      <TooltipProvider>
        <Tooltip>
          <DialogTrigger asChild>
            <TooltipTrigger asChild>
              <Button
                variant="ghost"
                id="browse-prompt"
                ref={triggerRef}
                className="grid aspect-square h-9 w-9 place-items-center rounded-full p-0 hover:bg-accent"
              >
                <Chrome className="h-5 w-5 text-white" />
                <span className="sr-only">Browse Prompts</span>
              </Button>
            </TooltipTrigger>
          </DialogTrigger>
          <TooltipContent>
            <h3 className="text-base font-semibold">Browse Prompt</h3>
            <p>Find useful prompts from others</p>
            <Arrow color="white" fill="white"></Arrow>
          </TooltipContent>
           // Dialog Content
        
             </Tooltip>
      </TooltipProvider>
    </Dialog>

But when ever I close the dialog the tooltip reopens , I don't want that behavior.
I tried to use seperate state for the tooltip , and set the tooltip closed when ever my dialog was open but , it did not work as I had set
the onOpenChange of the tooltip to setIsTooltipOpen. It seems like the tooltip is opened after some time

I also tired to dispach a mouseout event in the button but that also did not work.
I tried clicking on the document after I closed the dialog and even that did not work
How can i fix it ?