diff --git a/web/app/components/base/modal/modal.tsx b/web/app/components/base/modal/modal.tsx
index 63c7e02cf0..49be4f2f54 100644
--- a/web/app/components/base/modal/modal.tsx
+++ b/web/app/components/base/modal/modal.tsx
@@ -1,13 +1,14 @@
-import { memo } from 'react'
-import { useTranslation } from 'react-i18next'
-import { RiCloseLine } from '@remixicon/react'
+import type { ButtonProps } from '@/app/components/base/button'
+import Button from '@/app/components/base/button'
 import {
   PortalToFollowElem,
   PortalToFollowElemContent,
 } from '@/app/components/base/portal-to-follow-elem'
-import Button from '@/app/components/base/button'
-import type { ButtonProps } from '@/app/components/base/button'
 import cn from '@/utils/classnames'
+import { RiCloseLine } from '@remixicon/react'
+import { noop } from 'lodash-es'
+import { memo } from 'react'
+import { useTranslation } from 'react-i18next'
 
 type ModalProps = {
   onClose?: () => void
@@ -27,6 +28,7 @@ type ModalProps = {
   bottomSlot?: React.ReactNode
   disabled?: boolean
   containerClassName?: string
+  wrapperClassName?: string
   clickOutsideNotClose?: boolean
 }
 const Modal = ({
@@ -47,6 +49,7 @@ const Modal = ({
   bottomSlot,
   disabled,
   containerClassName,
+  wrapperClassName,
   clickOutsideNotClose = false,
 }: ModalProps) => {
   const { t } = useTranslation()
@@ -54,8 +57,8 @@ const Modal = ({
   return (
     <PortalToFollowElem open>
       <PortalToFollowElemContent
-        className='z-[9998] flex h-full w-full items-center justify-center bg-background-overlay'
-        onClick={clickOutsideNotClose ? undefined : onClose}
+        className={cn('z-[9998] flex h-full w-full items-center justify-center bg-background-overlay', wrapperClassName)}
+        onClick={clickOutsideNotClose ? noop : onClose}
       >
         <div
           className={cn(
diff --git a/web/app/components/plugins/plugin-auth/authorize/api-key-modal.tsx b/web/app/components/plugins/plugin-auth/authorize/api-key-modal.tsx
index bd0f4e6130..51c4f65604 100644
--- a/web/app/components/plugins/plugin-auth/authorize/api-key-modal.tsx
+++ b/web/app/components/plugins/plugin-auth/authorize/api-key-modal.tsx
@@ -142,6 +142,7 @@ const ApiKeyModal = ({
       onExtraButtonClick={onRemove}
       disabled={disabled || isLoading || doingAction}
       clickOutsideNotClose={true}
+      wrapperClassName='!z-[101]'
     >
       <ReadmeEntrance pluginDetail={pluginPayload.detail} showType={ReadmeShowType.modal} />
       {
diff --git a/web/app/components/plugins/plugin-auth/authorize/oauth-client-settings.tsx b/web/app/components/plugins/plugin-auth/authorize/oauth-client-settings.tsx
index 2db595ea72..c1c44928b3 100644
--- a/web/app/components/plugins/plugin-auth/authorize/oauth-client-settings.tsx
+++ b/web/app/components/plugins/plugin-auth/authorize/oauth-client-settings.tsx
@@ -157,6 +157,7 @@ const OAuthClientSettings = ({
         )
       }
       containerClassName='pt-0'
+      wrapperClassName='!z-[101]'
       clickOutsideNotClose={true}
     >
       <ReadmeEntrance pluginDetail={pluginPayload.detail} showType={ReadmeShowType.modal} />
diff --git a/web/app/components/plugins/plugin-detail-panel/detail-header.tsx b/web/app/components/plugins/plugin-detail-panel/detail-header.tsx
index be19c343f9..ab979a79a5 100644
--- a/web/app/components/plugins/plugin-detail-panel/detail-header.tsx
+++ b/web/app/components/plugins/plugin-detail-panel/detail-header.tsx
@@ -85,7 +85,8 @@ const DetailHeader = ({
     deprecated_reason,
     alternative_plugin_id,
   } = detail
-  const { author, category, name, label, description, icon, verified, tool } = detail.declaration
+
+  const { author, category, name, label, description, icon, verified, tool } = detail.declaration || detail
   const isTool = category === PluginCategoryEnum.tool
   const providerBriefInfo = tool?.identity
   const providerKey = `${plugin_id}/${providerBriefInfo?.name}`
@@ -213,13 +214,13 @@ const DetailHeader = ({
     <div className={cn('shrink-0 border-b border-divider-subtle bg-components-panel-bg p-4 pb-3', isReadmeView && 'border-b-0 bg-transparent p-0')}>
       <div className="flex">
         <div className={cn('overflow-hidden rounded-xl border border-components-panel-border-subtle', isReadmeView && 'bg-components-panel-bg')}>
-          <Icon src={`${API_PREFIX}/workspaces/current/plugin/icon?tenant_id=${tenant_id}&filename=${icon}`} />
+          <Icon src={icon.startsWith('http') ? icon : `${API_PREFIX}/workspaces/current/plugin/icon?tenant_id=${tenant_id}&filename=${icon}`} />
         </div>
         <div className="ml-3 w-0 grow">
           <div className="flex h-5 items-center">
             <Title title={label[locale]} />
             {verified && !isReadmeView && <RiVerifiedBadgeLine className="ml-0.5 h-4 w-4 shrink-0 text-text-accent" />}
-            <PluginVersionPicker
+            {version && <PluginVersionPicker
               disabled={!isFromMarketplace || isReadmeView}
               isShow={isShow}
               onShowChange={setIsShow}
@@ -246,7 +247,7 @@ const DetailHeader = ({
                   hasRedCornerMark={hasNewVersion}
                 />
               }
-            />
+            />}
             {/* Auto update info */}
             {isAutoUpgradeEnabled && !isReadmeView && (
               <Tooltip popupContent={t('plugin.autoUpdate.nextUpdateTime', { time: timeOfDayToDayjs(convertUTCDaySecondsToLocalSeconds(autoUpgradeInfo?.upgrade_time_of_day || 0, timezone!)).format('hh:mm A') })}>
@@ -276,36 +277,38 @@ const DetailHeader = ({
               <OrgInfo
                 packageNameClassName='w-auto'
                 orgName={author}
-                packageName={name}
+                packageName={name?.includes('/') ? (name.split('/').pop() || '') : name}
               />
-              <div className='system-xs-regular ml-1 mr-0.5 text-text-quaternary'>·</div>
-              {detail.source === PluginSource.marketplace && (
-                <Tooltip popupContent={t('plugin.detailPanel.categoryTip.marketplace')} >
-                  <div><BoxSparkleFill className='h-3.5 w-3.5 text-text-tertiary hover:text-text-accent' /></div>
-                </Tooltip>
-              )}
-              {detail.source === PluginSource.github && (
-                <Tooltip popupContent={t('plugin.detailPanel.categoryTip.github')} >
-                  <div><Github className='h-3.5 w-3.5 text-text-secondary hover:text-text-primary' /></div>
-                </Tooltip>
-              )}
-              {detail.source === PluginSource.local && (
-                <Tooltip popupContent={t('plugin.detailPanel.categoryTip.local')} >
-                  <div><RiHardDrive3Line className='h-3.5 w-3.5 text-text-tertiary' /></div>
-                </Tooltip>
-              )}
-              {detail.source === PluginSource.debugging && (
-                <Tooltip popupContent={t('plugin.detailPanel.categoryTip.debugging')} >
-                  <div><RiBugLine className='h-3.5 w-3.5 text-text-tertiary hover:text-text-warning' /></div>
-                </Tooltip>
-              )}
+              {source && <>
+                <div className='system-xs-regular ml-1 mr-0.5 text-text-quaternary'>·</div>
+                {source === PluginSource.marketplace && (
+                  <Tooltip popupContent={t('plugin.detailPanel.categoryTip.marketplace')} >
+                    <div><BoxSparkleFill className='h-3.5 w-3.5 text-text-tertiary hover:text-text-accent' /></div>
+                  </Tooltip>
+                )}
+                {source === PluginSource.github && (
+                  <Tooltip popupContent={t('plugin.detailPanel.categoryTip.github')} >
+                    <div><Github className='h-3.5 w-3.5 text-text-secondary hover:text-text-primary' /></div>
+                  </Tooltip>
+                )}
+                {source === PluginSource.local && (
+                  <Tooltip popupContent={t('plugin.detailPanel.categoryTip.local')} >
+                    <div><RiHardDrive3Line className='h-3.5 w-3.5 text-text-tertiary' /></div>
+                  </Tooltip>
+                )}
+                {source === PluginSource.debugging && (
+                  <Tooltip popupContent={t('plugin.detailPanel.categoryTip.debugging')} >
+                    <div><RiBugLine className='h-3.5 w-3.5 text-text-tertiary hover:text-text-warning' /></div>
+                  </Tooltip>
+                )}
+              </>}
             </div>
           </div>
         </div>
         {!isReadmeView && (
           <div className='flex gap-1'>
             <OperationDropdown
-              source={detail.source}
+              source={source}
               onInfo={showPluginInfo}
               onCheckVersion={handleUpdate}
               onRemove={showDeleteConfirm}
diff --git a/web/app/components/plugins/readme-panel/index.tsx b/web/app/components/plugins/readme-panel/index.tsx
index 8257d848f7..369f6538e4 100644
--- a/web/app/components/plugins/readme-panel/index.tsx
+++ b/web/app/components/plugins/readme-panel/index.tsx
@@ -1,9 +1,9 @@
 'use client'
 import ActionButton from '@/app/components/base/action-button'
-import Drawer from '@/app/components/base/drawer'
 import Loading from '@/app/components/base/loading'
 import { Markdown } from '@/app/components/base/markdown'
 import Modal from '@/app/components/base/modal'
+import Drawer from '@/app/components/base/drawer'
 import { useLanguage } from '@/app/components/header/account-setting/model-provider-page/hooks'
 import { usePluginReadme } from '@/service/use-plugins'
 import cn from '@/utils/classnames'
@@ -95,13 +95,13 @@ const ReadmePanel: FC = () => {
         positionCenter={false}
         showClose={false}
         panelClassName={cn(
-          'mb-2 ml-2 mt-16 !w-[600px] !max-w-[600px] justify-start rounded-2xl border-[0.5px] border-components-panel-border !bg-components-panel-bg !p-0 shadow-xl',
+          '!pointer-events-auto mb-2 ml-2 mt-16 !w-[600px] !max-w-[600px] justify-start rounded-2xl border-[0.5px] border-components-panel-border !bg-components-panel-bg !p-0 shadow-xl',
           '!z-[9999]',
         )}
-        dialogClassName={cn('!z-[9998]')}
+        dialogClassName={cn('!pointer-events-none')}
         containerClassName='!justify-start'
         noOverlay
-        clickOutsideNotOpen={false}
+        clickOutsideNotOpen={true}
       >
         {children}
       </Drawer>
@@ -111,7 +111,7 @@ const ReadmePanel: FC = () => {
         onClose={onClose}
         overlayOpacity={true}
         className='h-[calc(100vh-16px)] max-w-[800px] p-0'
-        wrapperClassName='!z-[10000]'
+        wrapperClassName='!z-[102]'
         containerClassName='p-2'
         clickOutsideNotClose={true}
       >