feat: update plugin category labels and improve internationalization support

This commit is contained in:
twwu
2024-11-13 18:30:38 +08:00
parent 6298332950
commit 61eb655823
25 changed files with 20 additions and 101 deletions

View File

@ -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} />

View File

@ -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'),
},
]

View File

@ -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()
@ -67,7 +69,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'>

View File

@ -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'>