'use client'

import { useTranslations } from 'next-intl';
import { IconEyeDashed } from '@/app/ui/icons/icons';
import { FileDetails } from '@/app/[locale]/pages/file/[id]/page';

export default function FilePageTitle({ fileInfo }: { fileInfo: FileDetails }) {
	const t = useTranslations('Global');

	return (
		<div className="page-title-color-frame violation-page">
			{/* <div
				className="violation-page-icon"
			>

				{fileInfo.thumbnailFileUrl ? (
					<img src={fileInfo.thumbnailFileUrl} alt={fileInfo.fileName} />
				) : (
					<IconEyeDashed />
				)}

			</div> */}
			<h1>
				{t('file-name')}: {fileInfo?.fileName ? fileInfo.fileName : '#'}
			</h1>
		</div>
	)
}