diff --git a/web/app/(commonLayout)/plugins/test/card/page.tsx b/web/app/(commonLayout)/plugins/test/card/page.tsx
index fb75397182..534789c00c 100644
--- a/web/app/(commonLayout)/plugins/test/card/page.tsx
+++ b/web/app/(commonLayout)/plugins/test/card/page.tsx
@@ -44,12 +44,12 @@ const PluginList = () => {
                 github_plugin_unique_identifier: 'wtw0313/dify-test:0.0.1@1633daa043b47155d4228e2db7734245fd6d3e20ba812e5c02ce69fc1e3038f4',
               },
             },
-            // {
-            //   type: 'marketplace',
-            //   value: {
-            //     plugin_unique_identifier: 'langgenius/openai:0.0.1@f88fdb98d104466db16a425bfe3af8c1bcad45047a40fb802d98a989ac57a5a3',
-            //   },
-            // },
+            {
+              type: 'marketplace',
+              value: {
+                plugin_unique_identifier: 'langgenius/openai:0.0.1@f88fdb98d104466db16a425bfe3af8c1bcad45047a40fb802d98a989ac57a5a3',
+              },
+            },
           ]} />
       )
       }
diff --git a/web/app/components/plugins/install-plugin/install-bundle/item/loaded-item.tsx b/web/app/components/plugins/install-plugin/install-bundle/item/loaded-item.tsx
index ef083b6924..1fff28b5fc 100644
--- a/web/app/components/plugins/install-plugin/install-bundle/item/loaded-item.tsx
+++ b/web/app/components/plugins/install-plugin/install-bundle/item/loaded-item.tsx
@@ -5,6 +5,7 @@ import type { Plugin } from '../../../types'
 import Card from '../../../card'
 import Checkbox from '@/app/components/base/checkbox'
 import Badge, { BadgeState } from '@/app/components/base/badge/index'
+import useGetIcon from '../../base/use-get-icon'
 
 type Props = {
   checked: boolean
@@ -17,6 +18,7 @@ const LoadedItem: FC<Props> = ({
   onCheckedChange,
   payload,
 }) => {
+  const { getIconUrl } = useGetIcon()
   return (
     <div className='flex items-center space-x-2'>
       <Checkbox
@@ -26,7 +28,10 @@ const LoadedItem: FC<Props> = ({
       />
       <Card
         className='grow'
-        payload={payload}
+        payload={{
+          ...payload,
+          icon: getIconUrl(payload.icon),
+        }}
         titleLeft={payload.version ? <Badge className='mx-1' size="s" state={BadgeState.Default}>{payload.version}</Badge> : null}
       />
     </div>
diff --git a/web/app/components/plugins/install-plugin/install-bundle/steps/installed.tsx b/web/app/components/plugins/install-plugin/install-bundle/steps/installed.tsx
index d6bb96ab2e..f8f058f2fa 100644
--- a/web/app/components/plugins/install-plugin/install-bundle/steps/installed.tsx
+++ b/web/app/components/plugins/install-plugin/install-bundle/steps/installed.tsx
@@ -6,6 +6,7 @@ import Card from '@/app/components/plugins/card'
 import Button from '@/app/components/base/button'
 import { useTranslation } from 'react-i18next'
 import Badge, { BadgeState } from '@/app/components/base/badge/index'
+import useGetIcon from '../../base/use-get-icon'
 
 type Props = {
   list: Plugin[]
@@ -19,6 +20,7 @@ const Installed: FC<Props> = ({
   onCancel,
 }) => {
   const { t } = useTranslation()
+  const { getIconUrl } = useGetIcon()
   return (
     <>
       <div className='flex flex-col px-6 py-3 justify-center items-start gap-4 self-stretch'>
@@ -29,7 +31,10 @@ const Installed: FC<Props> = ({
               <Card
                 key={plugin.plugin_id}
                 className='w-full'
-                payload={plugin}
+                payload={{
+                  ...plugin,
+                  icon: getIconUrl(plugin.icon),
+                }}
                 installed={installStatus[index].success}
                 installFailed={!installStatus[index].success}
                 titleLeft={plugin.version ? <Badge className='mx-1' size="s" state={BadgeState.Default}>{plugin.version}</Badge> : null}