fix: explore app add to workspace (#2160)

web/app/components/explore/app-card/index.tsx

@@ -8,24 +8,16 @@ import type { App } from '@/models/explore'
 import AppModeLabel from '@/app/(commonLayout)/apps/AppModeLabel'
 import AppIcon from '@/app/components/base/app-icon'
 
-const CustomizeBtn = (
-  <svg width="15" height="14" viewBox="0 0 15 14" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M7.5 2.33366C6.69458 2.33366 6.04167 2.98658 6.04167 3.79199C6.04167 4.59741 6.69458 5.25033 7.5 5.25033C8.30542 5.25033 8.95833 4.59741 8.95833 3.79199C8.95833 2.98658 8.30542 2.33366 7.5 2.33366ZM7.5 2.33366V1.16699M12.75 8.71385C11.4673 10.1671 9.59071 11.0837 7.5 11.0837C5.40929 11.0837 3.53265 10.1671 2.25 8.71385M6.76782 5.05298L2.25 12.8337M8.23218 5.05298L12.75 12.8337" stroke="#344054" strokeWidth="1.25" strokeLinecap="round" strokeLinejoin="round" />
-  </svg>
-)
-
 export type AppCardProps = {
   app: App
   canCreate: boolean
   onCreate: () => void
-  onAddToWorkspace: (appId: string) => void
 }
 
 const AppCard = ({
   app,
   canCreate,
   onCreate,
-  onAddToWorkspace,
 }: AppCardProps) => {
   const { t } = useTranslation()
   const { app: appBasicInfo, is_agent } = app
@@ -42,18 +34,16 @@ const AppCard = ({
         <div className={s.mode}>
           <AppModeLabel mode={appBasicInfo.mode} isAgent={is_agent} />
         </div>
-        <div className={cn(s.opWrap, 'flex items-center w-full space-x-2')}>
+        {
-          <Button type='primary' className='grow flex items-center !h-7' onClick={() => onAddToWorkspace(appBasicInfo.id)}>
+          canCreate && (
-            <PlusIcon className='w-4 h-4 mr-1' />
+            <div className={cn(s.opWrap, 'flex items-center w-full space-x-2')}>
-            <span className='text-xs'>{t('explore.appCard.addToWorkspace')}</span>
+              <Button type='primary' className='grow flex items-center !h-7' onClick={() => onCreate()}>
-          </Button>
+                <PlusIcon className='w-4 h-4 mr-1' />
-          {canCreate && (
+                <span className='text-xs'>{t('explore.appCard.addToWorkspace')}</span>
-            <Button className='grow flex items-center !h-7 space-x-1' onClick={onCreate}>
+              </Button>
-              {CustomizeBtn}
+            </div>
-              <span className='text-xs'>{t('explore.appCard.customize')}</span>
+          )
-            </Button>
+        }
-          )}
-        </div>
       </div>
     </div>
   )

web/app/components/explore/app-list/index.tsx

@@ -10,7 +10,7 @@ import ExploreContext from '@/context/explore-context'
 import type { App, AppCategory } from '@/models/explore'
 import Category from '@/app/components/explore/category'
 import AppCard from '@/app/components/explore/app-card'
-import { fetchAppDetail, fetchAppList, installApp } from '@/service/explore'
+import { fetchAppDetail, fetchAppList } from '@/service/explore'
 import { createApp } from '@/service/apps'
 import CreateAppModal from '@/app/components/explore/create-app-modal'
 import type { CreateAppModalProps } from '@/app/components/explore/create-app-modal'
@@ -23,7 +23,7 @@ const Apps: FC = () => {
   const { t } = useTranslation()
   const { isCurrentWorkspaceManager } = useAppContext()
   const router = useRouter()
-  const { setControlUpdateInstalledApps, hasEditPermission } = useContext(ExploreContext)
+  const { hasEditPermission } = useContext(ExploreContext)
   const [currCategory, setCurrCategory] = React.useState<AppCategory | ''>('')
   const [allList, setAllList] = React.useState<App[]>([])
   const [isLoaded, setIsLoaded] = React.useState(false)
@@ -44,15 +44,6 @@ const Apps: FC = () => {
     })()
   }, [])
 
-  const handleAddToWorkspace = async (appId: string) => {
-    await installApp(appId)
-    Toast.notify({
-      type: 'success',
-      message: t('common.api.success'),
-    })
-    setControlUpdateInstalledApps(Date.now())
-  }
-
   const [currApp, setCurrApp] = React.useState<App | null>(null)
   const [isShowCreateModal, setIsShowCreateModal] = React.useState(false)
   const onCreate: CreateAppModalProps['onConfirm'] = async ({ name, icon, icon_background }) => {
@@ -111,7 +102,6 @@ const Apps: FC = () => {
                 setCurrApp(app)
                 setIsShowCreateModal(true)
               }}
-              onAddToWorkspace={handleAddToWorkspace}
             />
           ))}
         </nav>