From ee527acca9304d9d896ff8b157a89c99396499bc Mon Sep 17 00:00:00 2001
From: NFish <douxc512@gmail.com>
Date: Tue, 3 Jun 2025 13:44:52 +0800
Subject: [PATCH] feat: add install plugin permission check at marketplace page

---
 web/app/components/plugins/card/index.tsx     |  5 ----
 .../steps/install.tsx                         | 28 +++++++++++++++++--
 web/app/components/plugins/types.ts           | 10 +++++--
 3 files changed, 34 insertions(+), 9 deletions(-)

diff --git a/web/app/components/plugins/card/index.tsx b/web/app/components/plugins/card/index.tsx
index 506c740d64..1cc18ac24f 100644
--- a/web/app/components/plugins/card/index.tsx
+++ b/web/app/components/plugins/card/index.tsx
@@ -15,7 +15,6 @@ import { renderI18nObject } from '@/i18n'
 import { useMixedTranslation } from '@/app/components/plugins/marketplace/hooks'
 import Partner from '../base/badges/partner'
 import Verified from '../base/badges/verified'
-import { RiProhibitedLine } from '@remixicon/react'
 
 export type Props = {
   className?: string
@@ -90,10 +89,6 @@ const Card = ({
         text={getLocalizedText(brief)}
         descriptionLineRows={descriptionLineRows}
       />
-      <div className='flex gap-x-2 text-text-warning'>
-        <RiProhibitedLine className='h-4 w-4' />
-        <span className='system-sm-regular text-text-warning'>{t('plugin.installModal.installWarning')}</span>
-      </div>
       {footer && <div>{footer}</div>}
     </div>
   )
diff --git a/web/app/components/plugins/install-plugin/install-from-marketplace/steps/install.tsx b/web/app/components/plugins/install-plugin/install-from-marketplace/steps/install.tsx
index 41b08838ff..13d4f88fbc 100644
--- a/web/app/components/plugins/install-plugin/install-from-marketplace/steps/install.tsx
+++ b/web/app/components/plugins/install-plugin/install-from-marketplace/steps/install.tsx
@@ -1,5 +1,6 @@
 'use client'
 import type { FC } from 'react'
+import { useState } from 'react'
 import React, { useEffect, useMemo } from 'react'
 // import { RiInformation2Line } from '@remixicon/react'
 import { type Plugin, type PluginManifestInMarket, TaskStatus } from '../../../types'
@@ -7,7 +8,7 @@ import Card from '../../../card'
 import { pluginManifestInMarketToPluginProps } from '../../utils'
 import Button from '@/app/components/base/button'
 import { useTranslation } from 'react-i18next'
-import { RiLoader2Line } from '@remixicon/react'
+import { RiLoader2Line, RiProhibitedLine } from '@remixicon/react'
 import { useInstallPackageFromMarketPlace, usePluginDeclarationFromMarketPlace, useUpdatePackageFromMarketPlace } from '@/service/use-plugins'
 import checkTaskStatus from '../../base/check-task-status'
 import useCheckInstalled from '@/app/components/plugins/install-plugin/hooks/use-check-installed'
@@ -15,6 +16,9 @@ import Version from '../../base/version'
 import { usePluginTaskList } from '@/service/use-plugins'
 import { gte } from 'semver'
 import { useAppContext } from '@/context/app-context'
+import { useGlobalPublicStore } from '@/context/global-public-context'
+import { isEmpty } from 'lodash-es'
+import { InstallationScope } from '@/types/feature'
 
 const i18nPrefix = 'plugin.installModal'
 
@@ -126,6 +130,22 @@ const Installed: FC<Props> = ({
     return gte(langeniusVersionInfo.current_version, pluginDeclaration?.manifest.meta.minimum_dify_version ?? '0.0.0')
   }, [langeniusVersionInfo.current_version, pluginDeclaration])
 
+  const systemFeatures = useGlobalPublicStore(s => s.systemFeatures)
+
+  const [canInstallPlugin, setCanInstallPlugin] = useState(true)
+
+  useEffect(() => {
+    const verification = (isEmpty(payload.verification) ? { authorized_category: 'langgenius' } : payload.verification) as { authorized_category: string }
+    if (systemFeatures.plugin_installation_permission.plugin_installation_scope === InstallationScope.ALL) setCanInstallPlugin(true)
+    else if (systemFeatures.plugin_installation_permission.plugin_installation_scope === InstallationScope.NONE) setCanInstallPlugin(false)
+    else if (systemFeatures.plugin_installation_permission.plugin_installation_scope === InstallationScope.OFFICIAL_ONLY)
+      setCanInstallPlugin(verification.authorized_category === 'langgenius')
+    else if (systemFeatures.plugin_installation_permission.plugin_installation_scope === InstallationScope.OFFICIAL_AND_PARTNER)
+      setCanInstallPlugin(verification.authorized_category === 'langgenius' || verification.authorized_category === 'partner')
+    else
+      setCanInstallPlugin(false)
+  }, [systemFeatures, payload])
+
   return (
     <>
       <div className='flex flex-col items-start justify-center gap-4 self-stretch px-6 py-3'>
@@ -148,6 +168,10 @@ const Installed: FC<Props> = ({
             />}
           />
         </div>
+        {!canInstallPlugin && <div className='flex gap-x-2 text-text-warning'>
+          <RiProhibitedLine className='h-4 w-4' />
+          <span className='system-sm-regular text-text-warning'>{t('plugin.installModal.installWarning')}</span>
+        </div>}
       </div>
       {/* Action Buttons */}
       <div className='flex items-center justify-end gap-2 self-stretch p-6 pt-5'>
@@ -159,7 +183,7 @@ const Installed: FC<Props> = ({
         <Button
           variant='primary'
           className='flex min-w-[72px] space-x-0.5'
-          disabled={isInstalling || isLoading}
+          disabled={isInstalling || isLoading || !canInstallPlugin}
           onClick={handleInstall}
         >
           {isInstalling && <RiLoader2Line className='h-4 w-4 animate-spin-slow' />}
diff --git a/web/app/components/plugins/types.ts b/web/app/components/plugins/types.ts
index f552d7c17a..c692e81ac1 100644
--- a/web/app/components/plugins/types.ts
+++ b/web/app/components/plugins/types.ts
@@ -94,7 +94,10 @@ export type PluginManifestInMarket = {
   introduction: string
   verified: boolean
   install_count: number
-  badges: string[]
+  badges: string[],
+  verification: {
+    authorized_category: 'langgenius' | 'partner' | 'community'
+  } | {}
 }
 
 export type PluginDetail = {
@@ -145,7 +148,10 @@ export type Plugin = {
     settings: CredentialFormSchemaBase[]
   }
   tags: { name: string }[]
-  badges: string[]
+  badges: string[],
+  verification: {
+    authorized_category: 'langgenius' | 'partner' | 'community'
+  }
 }
 
 export enum PermissionType {