remove clicking outside to close recipe warning (#4502)

ui/desktop/src/components/ui/RecipeWarningModal.tsx

@@ -1,13 +1,16 @@
 import {
   Dialog,
-  DialogContent,
   DialogDescription,
   DialogFooter,
   DialogHeader,
   DialogTitle,
+  DialogPortal,
+  DialogOverlay,
 } from './dialog';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { Button } from './button';
 import MarkdownContent from '../MarkdownContent';
+import { cn } from '../../utils';
 
 interface RecipeWarningModalProps {
   isOpen: boolean;
@@ -29,8 +32,16 @@ export function RecipeWarningModal({
   hasSecurityWarnings = false,
 }: RecipeWarningModalProps) {
   return (
-    <Dialog open={isOpen} onOpenChange={(open) => !open && onCancel()}>
+    <Dialog open={isOpen}>
-      <DialogContent className="sm:max-w-[80vw] max-h-[80vh] flex flex-col p-0">
+      <DialogPortal>
+        <DialogOverlay />
+        <DialogPrimitive.Content
+          className={cn(
+            'bg-background-default data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-[80vw] max-h-[80vh] flex flex-col p-0'
+          )}
+          onPointerDownOutside={(e) => e.preventDefault()}
+          onEscapeKeyDown={(e) => e.preventDefault()}
+        >
           <DialogHeader className="flex-shrink-0 p-6 pb-0">
             <DialogTitle>
               {hasSecurityWarnings ? '⚠️ Security Warning' : '⚠️ New Recipe Warning'}
@@ -89,7 +100,8 @@ export function RecipeWarningModal({
             </Button>
             <Button onClick={onConfirm}>Trust and Execute</Button>
           </DialogFooter>
-      </DialogContent>
+        </DialogPrimitive.Content>
+      </DialogPortal>
     </Dialog>
   );
 }