edit tanstak-table

src/app/components/tanstakTable.tsx

@@ -19,6 +19,7 @@ import { getUserFilesData, removeUserFile } from '@/app/actions/fileEntity';
 import ModalWindow from '@/app/components/modalWindow';
 import { toast } from 'sonner';
 import { pluralize } from '@/app/lib/pluralize';
+import { convertBytes } from '@/app/lib/convertBytes';
 
 type FileType = 'image' | 'video' | 'audio';
 
@@ -27,8 +28,9 @@ type FileItem = {
 	fileName: string;
 	fileType: string;
 	violations?: number | undefined;
-	checks?: number | undefined;
-	lastCheck?: number;
+	size?: number | undefined;
+	uploadDate?: number;
+	status?: string;
 	_original?: ApiFile;
 };
 
@@ -37,8 +39,9 @@ type ApiFile = {
 	originalFileName: string;
 	mimeType: string;
 	violations: number;
-	checks: number;
+	fileSize: number;
 	updatedAt: string;
+	status: string;
 };
 
 type ApiResponse = {
@@ -95,16 +98,22 @@ const cutFileName = (fileName: string) => {
 	const extension = fileName.substring(lastDotIndex);
 
 	if (fileName.length <= MAX_FILE_NAME_LENGTH) {
-		return fileName;
+		return nameWithoutExtension;
 	}
 
 	const maxNameLength = MAX_FILE_NAME_LENGTH - extension.length - 3;
 
 	if (maxNameLength <= 0) {
-		return '...' + extension;
+		return '...' /* + extension */;
 	}
 
-	return nameWithoutExtension.substring(0, maxNameLength) + '...' + extension;
+	return nameWithoutExtension.substring(0, maxNameLength) + '...' /* + extension */;
+}
+
+const cutFileExtension = (fileName: string) => {
+	const lastDotIndex = fileName.lastIndexOf('.');
+	const extension = fileName.substring(lastDotIndex + 1);
+	return extension;
 }
 
 export default function TanstakFilesTable({ fileType }: { fileType: string }) {
@@ -131,8 +140,9 @@ export default function TanstakFilesTable({ fileType }: { fileType: string }) {
 					fileName: item.originalFileName,
 					fileType: item.mimeType.toLocaleLowerCase(),
 					violations: item.violations,
-					checks: item.checks,
-					lastCheck: newDate,
+					size: item.fileSize,
+					uploadDate: newDate,
+					status: item.status,
 					_original: item
 				};
 			});
@@ -195,48 +205,15 @@ export default function TanstakFilesTable({ fileType }: { fileType: string }) {
 							<div className="font-medium w-full truncate" title={row.original.fileName}>
 								{/* {row.original.fileName} */}
 								{cutFileName(row.original.fileName)}
+								<br />
+								{cutFileExtension(row.original.fileName)} • <span className="text-[#10b981]">{row.original?.status}</span>
 							</div>
 						</div>
 					</div>
 				),
 				enableColumnFilter: false,
 			},
-			{
-				accessorKey: 'status',
-				header: ({ column }) => (
-					<div className="column">
-						<span>
-							{t('status')}
-						</span>
-						<button
-							onClick={() => column.toggleSorting(column.getIsSorted() === 'asc')}
-							className="sort-button"
-						>
-							{
-								column.getIsSorted() === 'asc' ?
-									<span>
-										<IconArrowUp />
-									</span>
-									: column.getIsSorted() === 'desc' ?
-										<span>
-											<IconArrowDown />
-										</span>
-										: <span>
-											<IconFilter />
-										</span>
-							}
-						</button>
-					</div>
-				),
-				cell: ({ row }) => {
-					return (
-						<div className={`text-center font-semibold`}>
-							{t('status')}
-						</div>
-					)
-				},
-			},
-			{
+			/* 			{
 							accessorKey: 'violations',
 							header: ({ column }) => (
 								<div className="column">
@@ -277,13 +254,13 @@ export default function TanstakFilesTable({ fileType }: { fileType: string }) {
 									</div>
 								)
 							},
-			},
+						}, */
 			{
-				accessorKey: 'checks',
+				accessorKey: 'size',
 				header: ({ column }) => (
 					<div className="column">
 						<span>
-							{t('checks')}
+							{t('size')}
 						</span>
 						<button
 							onClick={() => column.toggleSorting(column.getIsSorted() === 'asc')}
@@ -307,16 +284,16 @@ export default function TanstakFilesTable({ fileType }: { fileType: string }) {
 				),
 				cell: ({ row }) => (
 					<div className="text-center">
-						{row.original.checks !== undefined ? row.original.checks : '-'}
+						{row.original.size !== undefined ? convertBytes(row.original.size) : '-'}
 					</div>
 				),
 			},
 			{
-				accessorKey: 'lastCheck',
+				accessorKey: 'uploadDate',
 				header: ({ column }) => (
 					<div className="column">
 						<span>
-							{t('last-check')}
+							{t('upload-date')}
 						</span>
 						<button
 							onClick={() => column.toggleSorting(column.getIsSorted() === 'asc')}
@@ -341,11 +318,11 @@ export default function TanstakFilesTable({ fileType }: { fileType: string }) {
 				cell: ({ row }) => {
 					return (
 						<div className="text-center">
-							{row.original.lastCheck ? (
+							{row.original.uploadDate ? (
 								<>
-									{formatDate(row.original.lastCheck)}
+									{formatDate(row.original.uploadDate)}
 									<br />
-									{formatDateTime(row.original.lastCheck)}
+									{formatDateTime(row.original.uploadDate)}
 								</>
 							) : (
 								<div>-</div>
@@ -355,6 +332,41 @@ export default function TanstakFilesTable({ fileType }: { fileType: string }) {
 				},
 				enableColumnFilter: false,
 			},
+			{
+				accessorKey: 'status',
+				header: ({ column }) => (
+					<div className="column">
+						<span>
+							{t('status')}
+						</span>
+						<button
+							onClick={() => column.toggleSorting(column.getIsSorted() === 'asc')}
+							className="sort-button"
+						>
+							{
+								column.getIsSorted() === 'asc' ?
+									<span>
+										<IconArrowUp />
+									</span>
+									: column.getIsSorted() === 'desc' ?
+										<span>
+											<IconArrowDown />
+										</span>
+										: <span>
+											<IconFilter />
+										</span>
+							}
+						</button>
+					</div>
+				),
+				cell: ({ row }) => {
+					return (
+						<div className={`text-center font-semibold`}>
+							{t('status')}
+						</div>
+					)
+				},
+			},
 			{
 				id: 'actions',
 				header: () => {
@@ -535,8 +547,8 @@ export default function TanstakFilesTable({ fileType }: { fileType: string }) {
 				case 'today':
 					const todayStart = new Date().setHours(0, 0, 0, 0);
 					result = result.filter(item => {
-						if (item.lastCheck) {
-							return item.lastCheck >= todayStart
+						if (item.uploadDate) {
+							return item.uploadDate >= todayStart
 						} else {
 							return 0
 						}
@@ -545,24 +557,24 @@ export default function TanstakFilesTable({ fileType }: { fileType: string }) {
 				case 'week':
 					const weekAgo = now - sevenDays;
 					result = result.filter(item => {
-						if (item.lastCheck) {
-							return item.lastCheck >= weekAgo;
+						if (item.uploadDate) {
+							return item.uploadDate >= weekAgo;
 						}
 					});
 					break;
 				case 'month':
 					const monthAgo = now - thirtyDays;
 					result = result.filter(item => {
-						if (item.lastCheck) {
-							return item.lastCheck >= monthAgo;
+						if (item.uploadDate) {
+							return item.uploadDate >= monthAgo;
 						}
 					});
 					break;
 				case 'older':
 					const monthAgo2 = now - thirtyDays;
 					result = result.filter(item => {
-						if (item.lastCheck) {
-							return item.lastCheck < monthAgo2;
+						if (item.uploadDate) {
+							return item.uploadDate < monthAgo2;
 						}
 					});
 					break;

src/i18n/messages/en.json

@@ -173,7 +173,8 @@
 		"my-content-description": "Managing protected files and copyright control",
 		"monitoring-copyright-infringements": "Monitoring copyright infringements",
 		"monitoring-copyright-infringements-description": "Monitor and manage copyright infringement of your protected content online",
-		"referral-program-description": "Invite your friends and earn up to 25% commission on every purchase! Share the link and get rewarded."
+		"referral-program-description": "Invite your friends and earn up to 25% commission on every purchase! Share the link and get rewarded.",
+		"upload-date": "Upload date"
 	},
 	"Login-register-form": {
 		"and": "and",

src/i18n/messages/ru.json

@@ -173,7 +173,8 @@
 		"my-content-description": "Управление защищенными файлами и контролем авторских прав",
 		"monitoring-copyright-infringements": "Мониторинг нарушений авторских прав",
 		"monitoring-copyright-infringements-description": "Отслеживание и управление нарушениями авторских прав на ваш защищенный контент в интернете",
-		"referral-program-description": "Приглашайте друзей и зарабатывайте до 25% комиссии с каждой их покупки! Делитесь ссылкой, получайте вознаграждение."
+		"referral-program-description": "Приглашайте друзей и зарабатывайте до 25% комиссии с каждой их покупки! Делитесь ссылкой, получайте вознаграждение.",
+		"upload-date": "Дата загрузки"
 	},
 	"Login-register-form": {
 		"and": "и",