diff --git a/ui/src/features/assets/AssetsPanel.tsx b/ui/src/features/assets/AssetsPanel.tsx index a7146fbc..97cee408 100644 --- a/ui/src/features/assets/AssetsPanel.tsx +++ b/ui/src/features/assets/AssetsPanel.tsx @@ -1,18 +1,19 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react' +import type { ParseKeys } from 'i18next' import { Box, FileText, Film, Image as ImageIcon, Info, Loader2, Music2, RefreshCw, Search } from 'lucide-react' import { fetchAsset, fetchAssets, type AssetCatalogItem, type AssetKind } from '../../api/client' import { useStore } from '../../stores/useStore' import { useUiTranslation } from '../../i18n' const PAGE_SIZE = 100 -const kinds: Array<{ value: AssetKind | ''; label: string }> = [ - { value: '', label: 'Todos' }, - { value: 'image', label: 'Imágenes' }, - { value: 'video', label: 'Vídeos' }, - { value: 'audio', label: 'Audio' }, - { value: 'model3d', label: '3D' }, - { value: 'scene', label: 'Escenas' }, - { value: 'document', label: 'Documentos' }, +const KIND_FILTERS: Array<{ value: AssetKind | ''; labelKey: ParseKeys<'navigation'> }> = [ + { value: '', labelKey: 'tabs.all' }, + { value: 'image', labelKey: 'tabs.images' }, + { value: 'video', labelKey: 'tabs.videos' }, + { value: 'audio', labelKey: 'tabs.audio' }, + { value: 'model3d', labelKey: 'tabs.model3d' }, + { value: 'scene', labelKey: 'tabs.scenes' }, + { value: 'document', labelKey: 'tabs.documents' }, ] function icon(kind: AssetKind) { @@ -52,6 +53,7 @@ function AssetPreview({ asset }: { asset: AssetCatalogItem }) { export function AssetsPanel() { const { t } = useUiTranslation('navigation') const { t: tActivity } = useUiTranslation('activity') + const { t: tCommon } = useUiTranslation('common') const workspaces = useStore(state => state.workspaces) const loadWorkspaces = useStore(state => state.loadWorkspaces) const [assets, setAssets] = useState([]) @@ -84,7 +86,7 @@ export function AssetsPanel() { setTotal(result.total) } catch (reason) { if (request === requestRef.current) { - setError(reason instanceof Error ? reason.message : 'No se pudo cargar el catálogo') + setError(reason instanceof Error ? reason.message : tActivity('catalog.loadFailed')) } } finally { if (request === requestRef.current) { @@ -92,7 +94,7 @@ export function AssetsPanel() { setLoadingMore(false) } } - }, [kind, search, workspace]) + }, [kind, search, tActivity, workspace]) useEffect(() => { void loadWorkspaces() }, [loadWorkspaces]) useEffect(() => { void load(false) }, [kind, load, search, workspace]) @@ -120,7 +122,7 @@ export function AssetsPanel() {
{t('headings.assets')}
- {total} elementos en todas las ubicaciones + {tActivity('catalog.itemsAcrossLocations', { count: total })}
setDraftSearch(event.target.value)} - placeholder="Buscar prompt, modelo, herramienta…" + placeholder={tActivity('catalog.searchPlaceholder')} + aria-label={tCommon('actions.search')} className="w-52 bg-transparent py-1.5 text-xs text-text-primary outline-none" />