From af351b17232ce7ff945e01d725e591fbf3f23271 Mon Sep 17 00:00:00 2001
From: 17hz <0x149527@gmail.com>
Date: Tue, 2 Sep 2025 17:06:10 +0800
Subject: [PATCH] fix: ensure the modal closed by level (#24984)

---
 .../model-provider-page/model-modal/index.tsx     | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/web/app/components/header/account-setting/model-provider-page/model-modal/index.tsx b/web/app/components/header/account-setting/model-provider-page/model-modal/index.tsx
index e9050e483..d754d24d9 100644
--- a/web/app/components/header/account-setting/model-provider-page/model-modal/index.tsx
+++ b/web/app/components/header/account-setting/model-provider-page/model-modal/index.tsx
@@ -2,6 +2,7 @@ import type { FC } from 'react'
 import {
   memo,
   useCallback,
+  useEffect,
   useMemo,
   useRef,
 } from 'react'
@@ -188,6 +189,20 @@ const ModelModal: FC<ModelModalProps> = ({
     return null
   }, [model, provider])
 
+  useEffect(() => {
+    const handleKeyDown = (event: KeyboardEvent) => {
+      if (event.key === 'Escape') {
+        event.stopPropagation()
+        onCancel()
+      }
+    }
+
+    document.addEventListener('keydown', handleKeyDown, true)
+    return () => {
+      document.removeEventListener('keydown', handleKeyDown, true)
+    }
+  }, [onCancel])
+
   return (
     <PortalToFollowElem open>
       <PortalToFollowElemContent className='z-[60] h-full w-full'>