43 lines
1.2 KiB
TypeScript
43 lines
1.2 KiB
TypeScript
import { memo } from 'react'
|
|
|
|
import { usePath } from '@/hooks/usePath'
|
|
|
|
import { toGibibytes } from '@/utils/converter'
|
|
|
|
import Icon from '../FileUploadPreview/Icon'
|
|
|
|
const DocMessage = ({
|
|
id,
|
|
metadata,
|
|
}: {
|
|
id: string
|
|
metadata: Record<string, unknown> | undefined
|
|
}) => {
|
|
const { onViewFile } = usePath()
|
|
|
|
return (
|
|
<div className="group/file bg-secondary relative mb-2 inline-flex w-60 cursor-pointer gap-x-3 overflow-hidden rounded-lg p-4">
|
|
<div
|
|
className="absolute left-0 top-0 z-20 hidden h-full w-full bg-black/20 opacity-50 group-hover/file:inline-block"
|
|
onClick={() => onViewFile(`${id}.pdf`)}
|
|
/>
|
|
|
|
<Icon type="pdf" />
|
|
<div className="w-full">
|
|
<h6 className="line-clamp-1 w-4/5 overflow-hidden font-medium">
|
|
{metadata && 'filename' in metadata
|
|
? (metadata.filename as string)
|
|
: id}
|
|
</h6>
|
|
<p className="text-[hsla(var(--text-secondary)] line-clamp-1 overflow-hidden truncate">
|
|
{metadata && 'size' in metadata
|
|
? toGibibytes(Number(metadata.size))
|
|
: id}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default memo(DocMessage)
|