Files
dify/web/app/components/workflow/skill/viewer/media-file-preview.tsx
yyh 8326b9e3e5 refactor(skill): remove React.FC type annotations from all components
Replace FC<Props> pattern with direct props typing in function parameters
for better TypeScript inference and modern React best practices.
2026-01-28 23:34:08 +08:00

43 lines
967 B
TypeScript

import * as React from 'react'
import { useTranslation } from 'react-i18next'
type MediaFilePreviewProps = {
type: 'image' | 'video'
src: string
}
const MediaFilePreview = ({ type, src }: MediaFilePreviewProps) => {
const { t } = useTranslation('workflow')
if (!src) {
return (
<div className="flex h-full w-full items-center justify-center text-text-tertiary">
<span className="system-sm-regular">
{t('skillEditor.previewUnavailable')}
</span>
</div>
)
}
return (
<div className="flex h-full w-full items-center justify-center p-6">
{type === 'image' && (
<img
src={src}
alt=""
className="max-h-full max-w-full object-contain"
/>
)}
{type === 'video' && (
<video
src={src}
controls
className="max-h-full max-w-full"
/>
)}
</div>
)
}
export default React.memo(MediaFilePreview)