Dialog that was triggered from Sidebar is closed when resizing window to mobile view

[tal-rofe]

In my React app, I'm using ShadCN Sidebar. One of its menu items is a button.
When I click this button, it should open a dialog.

Currently I implemented in a way where it seems like this:

<ShadCN Sidebar Provider>    
    <ShadCN Sidebar>  
      <Dialog>  
        <DialogTrigger>  
           My button
       <DialogContent>   
           My Dialog Content

My sidebar is managed in a way where it's default open for non mobile view. For mobile view - it's closed by default.
Hence, when I open the dialog on desktop view, then resize the window size whilst the dialog is open, the dialog will be closed when I resize to mobile view, because the sidebar element itself (which contains the dialog) - has been removed from the DOM.

ShadCN already wraps with portal so this does not help.

How can I keep the dialog open when resizing to mobile?