add fileNameCut

src/app/components/tanstakTable.tsx

@@ -82,6 +82,30 @@ const formatDateTime = (timestamp: number) => {
 	return `${hours}:${minutes}`;
 };
 
+const cutFileName = (fileName: string) => {
+	const MAX_FILE_NAME_LENGHT= 26;
+	const lastDotIndex = fileName.lastIndexOf('.');
+
+	if (lastDotIndex <= 0) {
+		return fileName.length > MAX_FILE_NAME_LENGHT ? fileName.substring(0, MAX_FILE_NAME_LENGHT - 3) + '...' : fileName;
+	}
+
+	const nameWithoutExtension = fileName.substring(0, lastDotIndex);
+	const extension = fileName.substring(lastDotIndex);
+
+	if (fileName.length <= MAX_FILE_NAME_LENGHT) {
+		return fileName;
+	}
+
+	const maxNameLength = MAX_FILE_NAME_LENGHT - extension.length - 3;
+
+	if (maxNameLength <= 0) {
+		return '...' + extension;
+	}
+
+	return nameWithoutExtension.substring(0, maxNameLength) + '...' + extension;
+}
+
 export default function TanstakFilesTable({ fileType }: { fileType: string }) {
 	const {
 		data: tableData,
@@ -163,10 +187,13 @@ export default function TanstakFilesTable({ fileType }: { fileType: string }) {
 					</div>
 				),
 				cell: ({ row }) => (
-					<div className="flex items-center space-x-2 w-[250px]">
+					<div className="flex items-center space-x-2">
 						<FileTypeIcon type={row.original.fileType} />
 						<div>
-							<div className="font-medium w-full max-w-[250px] truncate" title={row.original.fileName}>{row.original.fileName}</div>
+							<div className="font-medium w-full truncate" title={row.original.fileName}>
+								{/* {row.original.fileName} */}
+								{cutFileName(row.original.fileName)}
+							</div>
 						</div>
 					</div>
 				),