Merge branch 'feat/plugins' of github.com:langgenius/dify into feat/plugins

web/app/components/plugins/card/index.tsx

@@ -11,6 +11,7 @@ import Placeholder from './base/placeholder'
 import cn from '@/utils/classnames'
 import { useGetLanguage } from '@/context/i18n'
 import { getLanguage } from '@/i18n/language'
+import { useCategories } from '../hooks'
 
 export type Props = {
   className?: string
@@ -41,6 +42,7 @@ const Card = ({
 }: Props) => {
   const defaultLocale = useGetLanguage()
   const locale = localeFromProps ? getLanguage(localeFromProps) : defaultLocale
+  const { categoriesMap } = useCategories()
 
   const { type, name, org, label, brief, icon, verified } = payload
 
@@ -59,7 +61,7 @@ const Card = ({
 
   return (
     <div className={wrapClassName}>
-      {!hideCornerMark && <CornerMark text={type} />}
+      {!hideCornerMark && <CornerMark text={categoriesMap[type].label} />}
       {/* Header */}
       <div className="flex">
         <Icon src={icon} installed={installed} installFailed={installFailed} />

web/app/components/plugins/hooks.ts

@@ -100,19 +100,19 @@ export const useCategories = (translateFromOut?: TFunction) => {
   const categories = [
     {
       name: 'model',
-      label: t('pluginCategories.categories.model'),
+      label: t('plugin.category.models'),
     },
     {
       name: 'tool',
-      label: t('pluginCategories.categories.tool'),
+      label: t('plugin.category.tools'),
     },
     {
       name: 'extension',
-      label: t('pluginCategories.categories.extension'),
+      label: t('plugin.category.extensions'),
     },
     {
       name: 'bundle',
-      label: t('pluginCategories.categories.bundle'),
+      label: t('plugin.category.bundles'),
     },
   ]
 

web/app/components/plugins/plugin-item/action.tsx

@@ -23,7 +23,6 @@ type Props = {
   installationId: string
   pluginUniqueIdentifier: string
   pluginName: string
-  version: string
   usedInApps: number
   isShowFetchNewVersion: boolean
   isShowInfo: boolean
@@ -36,7 +35,6 @@ const Action: FC<Props> = ({
   installationId,
   pluginUniqueIdentifier,
   pluginName,
-  version,
   isShowFetchNewVersion,
   isShowInfo,
   isShowDelete,
@@ -63,7 +61,7 @@ const Action: FC<Props> = ({
         return
       const versions = fetchedReleases.map(release => release.tag_name)
       const latestVersion = getLatestVersion(versions)
-      if (compareVersion(latestVersion, version) === 1) {
+      if (compareVersion(latestVersion, meta!.version) === 1) {
         setShowUpdatePluginModal({
           onSaveCallback: () => {
             invalidateInstalledPluginList()

web/app/components/plugins/plugin-item/index.tsx

@@ -22,6 +22,7 @@ import cn from '@/utils/classnames'
 import { API_PREFIX, MARKETPLACE_URL_PREFIX } from '@/config'
 import { useLanguage } from '../../header/account-setting/model-provider-page/hooks'
 import { useInvalidateInstalledPluginList } from '@/service/use-plugins'
+import { useCategories } from '../hooks'
 
 type Props = {
   className?: string
@@ -34,6 +35,7 @@ const PluginItem: FC<Props> = ({
 }) => {
   const locale = useLanguage()
   const { t } = useTranslation()
+  const { categoriesMap } = useCategories()
   const currentPluginDetail = usePluginPageContext(v => v.currentPluginDetail)
   const setCurrentPluginDetail = usePluginPageContext(v => v.setCurrentPluginDetail)
   const invalidateInstalledPluginList = useInvalidateInstalledPluginList()
@@ -46,7 +48,6 @@ const PluginItem: FC<Props> = ({
     endpoints_active,
     meta,
     plugin_id,
-    version,
   } = plugin
   const { category, author, name, label, description, icon, verified } = plugin.declaration
 
@@ -67,7 +68,7 @@ const PluginItem: FC<Props> = ({
       }}
     >
       <div className={cn('relative p-4 pb-3 border-[0.5px] border-components-panel-border bg-components-panel-on-panel-item-bg hover-bg-components-panel-on-panel-item-bg rounded-xl shadow-xs', className)}>
-        <CornerMark text={t(`pluginCategories.categories.${category}`)} />
+        <CornerMark text={categoriesMap[category].label} />
         {/* Header */}
         <div className="flex">
           <div className='flex items-center justify-center w-10 h-10 overflow-hidden border-components-panel-border-subtle border-[1px] rounded-xl'>
@@ -91,7 +92,6 @@ const PluginItem: FC<Props> = ({
                   installationId={installation_id}
                   author={author}
                   pluginName={name}
-                  version={version}
                   usedInApps={5}
                   isShowFetchNewVersion={source === PluginSource.github}
                   isShowInfo={source === PluginSource.github}

web/app/components/plugins/plugin-page/filter-management/category-filter.tsx

@@ -56,7 +56,7 @@ const CategoriesFilter = ({
             'flex items-center p-1 system-sm-medium',
           )}>
             {
-              !selectedTagsLength && t('pluginCategories.allCategories')
+              !selectedTagsLength && t('plugin.allCategories')
             }
             {
               !!selectedTagsLength && value.map(val => categoriesMap[val].label).slice(0, 2).join(',')
@@ -96,7 +96,7 @@ const CategoriesFilter = ({
               showLeftIcon
               value={searchText}
               onChange={e => setSearchText(e.target.value)}
-              placeholder={t('pluginCategories.searchCategories')}
+              placeholder={t('plugin.searchCategories')}
             />
           </div>
           <div className='p-1 max-h-[448px] overflow-y-auto'>