48 lines
1.5 KiB
TypeScript
48 lines
1.5 KiB
TypeScript
import React from 'react';
|
|||
|
|
import { useTranslation } from 'react-i18next';
|
||
|
|
import './styles.css';
|
||
|
|
import FieldBlock from './FieldBlock';
|
||
|
|
|
||
|
|
const formatDate = (value?: string | null) => {
|
||
|
|
if (!value) return '--';
|
||
|
|
const parsed = Date.parse(value);
|
||
|
|
if (!Number.isNaN(parsed)) {
|
||
|
|
return new Date(parsed).toLocaleString();
|
||
|
|
}
|
||
|
|
return value;
|
||
|
|
};
|
||
|
|
|
||
|
|
const formatFileSize = (bytes?: number | null) => {
|
||
|
|
if (bytes === undefined || bytes === null) return '--';
|
||
|
|
if (bytes === 0) return '0 B';
|
||
|
|
const units = ['B', 'KB', 'MB', 'GB', 'TB'];
|
||
|
|
const exponent = Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), units.length - 1);
|
||
|
|
const size = bytes / Math.pow(1024, exponent);
|
||
|
|
return `${size.toFixed(exponent === 0 ? 0 : 1)} ${units[exponent]}`;
|
||
|
|
};
|
||
|
|
|
||
|
|
const FileSummaryHeader = ({
|
||
|
|
fileSize,
|
||
|
|
createdAt,
|
||
|
|
totalSignatures,
|
||
|
|
lastSignatureDate,
|
||
|
|
}: {
|
||
|
|
fileSize?: number | null;
|
||
|
|
createdAt?: string | null;
|
||
|
|
totalSignatures: number;
|
||
|
|
lastSignatureDate?: string | null;
|
||
|
|
}) => {
|
||
|
|
const { t } = useTranslation();
|
||
|
|
const infoBlocks = [
|
||
|
|
FieldBlock(t('files.size', 'File Size'), formatFileSize(fileSize ?? null)),
|
||
|
|
FieldBlock(t('files.created', 'Created'), createdAt || '-'),
|
||
|
|
FieldBlock(t('validateSignature.signatureDate', 'Signature Date'), formatDate(lastSignatureDate)),
|
||
|
|
FieldBlock(t('validateSignature.totalSignatures', 'Total Signatures'), totalSignatures.toString()),
|
||
|
|
];
|
||
|
|
|
||
|
|
return <div className="grid-container">{infoBlocks}</div>;
|
||
|
|
};
|
||
|
|
|
||
|
|
export default FileSummaryHeader;
|
||
|
|
|