fix sheet portal (#1237)

enjoy/src/renderer/components/medias/media-bottom-panel/media-current-recording.tsx

@@ -692,6 +692,7 @@ export const MediaCurrentRecording = () => {
 
       <Sheet open={detailIsOpen} onOpenChange={(open) => setDetailIsOpen(open)}>
         <SheetContent
+          container="main-panel-content"
           aria-describedby={undefined}
           side="bottom"
           className="rounded-t-2xl shadow-lg max-h-content overflow-y-scroll"

enjoy/src/renderer/components/messages/assistant-message.tsx

@@ -295,6 +295,7 @@ export const AssistantMessageComponent = (props: {
         onOpenChange={(value) => setShadowing(value)}
       >
         <SheetContent
+          container="main-panel-content"
           aria-describedby={undefined}
           side="bottom"
           className="h-content p-0 flex flex-col gap-0"

enjoy/src/renderer/components/ui/alert-dialog.tsx

@@ -30,11 +30,15 @@ AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
 const AlertDialogContent = React.forwardRef<
   React.ElementRef<typeof AlertDialogPrimitive.Content>,
   React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Content> & {
-    container?: HTMLElement;
+    container?: HTMLElement | string;
   }
 >(({ className, container, ...props }, ref) => (
   <AlertDialogPortal
-    container={container || document.getElementById("main-panel-content")}
+    container={
+      typeof container === "string"
+        ? document.getElementById(container)
+        : container
+    }
   >
     <AlertDialogOverlay className="absolute inset-0" />
     <AlertDialogPrimitive.Content

enjoy/src/renderer/components/ui/dialog.tsx

@@ -32,11 +32,15 @@ DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
 const DialogContent = React.forwardRef<
   React.ElementRef<typeof DialogPrimitive.Content>,
   React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {
-    container?: HTMLElement;
+    container?: HTMLElement | string;
   }
 >(({ className, children, container, ...props }, ref) => (
   <DialogPortal
-    container={container || document.getElementById("main-panel-content")}
+    container={
+      typeof container === "string"
+        ? document.getElementById(container)
+        : container
+    }
   >
     <DialogOverlay />
     <DialogPrimitive.Content

enjoy/src/renderer/components/ui/sheet.tsx

@@ -53,7 +53,7 @@ interface SheetContentProps
   extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,
     VariantProps<typeof sheetVariants> {
   displayClose?: boolean;
-  container?: HTMLElement;
+  container?: HTMLElement | string;
 }
 
 const SheetContent = React.forwardRef<
@@ -72,7 +72,11 @@ const SheetContent = React.forwardRef<
     ref
   ) => (
     <SheetPortal
-      container={container || document.getElementById("main-panel-content")}
+      container={
+        typeof container === "string"
+          ? document.getElementById(container)
+          : container
+      }
     >
       <SheetOverlay className="absolute" />
       <SheetPrimitive.Content

enjoy/src/renderer/context/chat-session-provider.tsx

@@ -481,6 +481,7 @@ export const ChatSessionProvider = ({
           }}
         >
           <SheetContent
+            container="main-panel-content"
             side="bottom"
             className="h-content p-0 flex flex-col gap-0"
             displayClose={false}
@@ -506,6 +507,7 @@ export const ChatSessionProvider = ({
           }}
         >
           <SheetContent
+            container="main-panel-content"
             aria-describedby={undefined}
             side="bottom"
             className="rounded-t-2xl shadow-lg max-h-content overflow-y-scroll"

enjoy/src/renderer/context/course-provider.tsx

@@ -71,6 +71,7 @@ export const CourseProvider = ({
           }}
         >
           <SheetContent
+            container="main-panel-content"
             side="bottom"
             className="h-content p-0 flex flex-col gap-0"
             displayClose={false}