add new marking-content layout

2026-01-14 15:01:30 +07:00
parent f790a95e71
commit ede6ad179c
11 changed files with 217 additions and 15 deletions
@@ -0,0 +1,91 @@
+'use client'
+
+import { useTranslations } from 'next-intl';
+import { useQuery } from '@tanstack/react-query';
+import { getUserFilesInfo } from '@/app/actions/action';
+import { convertBytes } from '@/app/lib/convertBytes';
+
+type FilesInfo = {
+	totalSize: number;
+	totalCount: number;
+};
+
+export default function ProtectionStatistic({ fileType }: { fileType: string }) {
+	const t = useTranslations('Global');
+
+	const getFileTypeFields = (fileType: string): { totalSize: string, totalCount: string } => {
+		switch (fileType) {
+			case 'image':
+				return {
+					totalSize: 'images_size',
+					totalCount: 'images_quantity'
+				};
+			case 'video':
+				return {
+					totalSize: 'videos_size',
+					totalCount: 'videos_quantity'
+				};
+			case 'audio':
+				return {
+					totalSize: 'audios_size',
+					totalCount: 'audios_quantity'
+				};
+			default:
+				return {
+					totalSize: 'all_files_size',
+					totalCount: 'all_files_quantity'
+				};
+		}
+	};
+
+	const {
+		data: filesInfo,
+		isLoading,
+		isError,
+		error,
+	} = useQuery<{
+		all_files_size: number,
+		all_files_quantity: number
+	}, Error, FilesInfo>({
+		queryKey: ['userFilesInfo'],
+		queryFn: getUserFilesInfo,
+		select: (data): FilesInfo => {
+			if (!data) {
+				return {
+					totalSize: 0,
+					totalCount: 0
+				}
+			}
+
+			const fields = getFileTypeFields(fileType);
+
+			return {
+				totalSize: data[fields.totalSize as keyof typeof data],
+				totalCount: data[fields.totalCount as keyof typeof data]
+			}
+		}
+	});
+
+	return (
+		<div className="protection-statistic">
+			<div className="protection-statistic-stat-card">
+				<div className="protection-statistic-stat-number">0</div>
+				<div className="protection-statistic-stat-label">Видео защищено</div>
+			</div>
+			<div className="protection-statistic-stat-card">
+				<div className="protection-statistic-stat-number">0</div>
+				<div className="protection-statistic-stat-label">Видео проверялось</div>
+			</div>
+			<div className="protection-statistic-stat-card">
+				<div className="protection-statistic-stat-number">
+					{filesInfo?.totalSize ? convertBytes(filesInfo?.totalSize) : 0}
+				</div>
+				<div className="protection-statistic-stat-label">Занимают видео</div>
+			</div>
+			<div className="protection-statistic-stat-card">
+				<div className="protection-statistic-stat-number">0</div>
+				<div className="protection-statistic-stat-label">Найдено нарушений</div>
+			</div>
+		</div>
+	)
+}
@@ -0,0 +1,16 @@
+import { useTranslations } from 'next-intl';
+
+export default function PageTitleColorFrame({ title, description }: { title: string, description: string }) {
+	const t = useTranslations('Global');
+
+	return (
+		<div className="page-title-color-frame">
+			<h1>
+				{t(title)}
+			</h1>
+			<p>
+				{t(description)}
+			</p>
+		</div>
+	)
+}