diff --git a/web/app/(commonLayout)/apps/AppCard.tsx b/web/app/(commonLayout)/apps/AppCard.tsx
index 4080ac6db6..f6e5990353 100644
--- a/web/app/(commonLayout)/apps/AppCard.tsx
+++ b/web/app/(commonLayout)/apps/AppCard.tsx
@@ -16,6 +16,7 @@ import { ToastContext } from '@/app/components/base/toast'
 import { deleteApp, fetchAppDetail, updateAppSiteConfig } from '@/service/apps'
 import AppIcon from '@/app/components/base/app-icon'
 import AppsContext, { useAppContext } from '@/context/app-context'
+import type { HtmlContentProps } from '@/app/components/base/popover'
 import CustomPopover from '@/app/components/base/popover'
 import Divider from '@/app/components/base/divider'
 import { asyncRunSafe } from '@/utils'
@@ -100,14 +101,14 @@ const AppCard = ({ app, onRefresh }: AppCardProps) => {
     [app.id],
   )
 
-  const Operations = (props: any) => {
+  const Operations = (props: HtmlContentProps) => {
     const onClickSettings = async (e: React.MouseEvent<HTMLButtonElement>) => {
-      props?.onClose()
+      props.onClick?.()
       e.preventDefault()
       await getAppDetail()
     }
     const onClickDelete = async (e: React.MouseEvent<HTMLDivElement>) => {
-      props?.onClose()
+      props.onClick?.()
       e.preventDefault()
       setShowConfirmDelete(true)
     }
@@ -157,6 +158,7 @@ const AppCard = ({ app, onRefresh }: AppCardProps) => {
               )
             }
             className={'!w-[128px] h-fit !z-20'}
+            manualClose
           />}
         </div>
         <div className={style.listItemDescription}>
diff --git a/web/app/components/base/popover/index.tsx b/web/app/components/base/popover/index.tsx
index cf8a352e16..925adc99fb 100644
--- a/web/app/components/base/popover/index.tsx
+++ b/web/app/components/base/popover/index.tsx
@@ -2,9 +2,14 @@ import { Popover, Transition } from '@headlessui/react'
 import { Fragment, cloneElement, useRef } from 'react'
 import s from './style.module.css'
 
+export type HtmlContentProps = {
+  onClose?: () => void
+  onClick?: () => void
+}
+
 type IPopover = {
   className?: string
-  htmlContent: React.ReactNode
+  htmlContent: React.ReactElement<HtmlContentProps>
   trigger?: 'click' | 'hover'
   position?: 'bottom' | 'br'
   btnElement?: string | React.ReactNode
@@ -84,7 +89,7 @@ export default function CustomPopover({
                         })
                       }
                     >
-                      {cloneElement(htmlContent as React.ReactElement, {
+                      {cloneElement(htmlContent as React.ReactElement<HtmlContentProps>, {
                         onClose: () => onMouseLeave(open),
                         ...(manualClose
                           ? {