update dashboard statisctic

src/app/ui/dashboard/new/dashboard-user-files.tsx

@@ -8,7 +8,6 @@ import { convertBytes } from '@/app/lib/convertBytes';
 import { useTranslations } from 'next-intl';
 import { useClickOutside } from '@/app/hooks/useClickOutside';
 import Link from 'next/link';
-import { getSessionData } from '@/app/actions/session';
 
 type FileItem = {
 	id: string;
@@ -86,7 +85,9 @@ export default function DashboardUserFiles() {
 	return (
 		<div className="content-section">
 			<div className="section-header">
-				<h3 className="section-title">Ваши файлы</h3>
+				<h3 className="section-title">
+					{t('your-files')}
+				</h3>
 				<div
 					className="section-add-file btn view-all-link"
 					onClick={() => {

src/app/ui/dashboard/new/dashboard-user-stats.tsx

@@ -1,52 +1,83 @@
 'use client'
 
 import { useTranslations } from 'next-intl';
-import {convertBytes} from '@/app/lib/convertBytes';
-import {useUserFilesInfo} from '@/app/hooks/react-query/useUserFilesInfo';
+import { convertBytes } from '@/app/lib/convertBytes';
+import { useUserFilesInfo } from '@/app/hooks/react-query/useUserFilesInfo';
+import { useEffect } from 'react';
+import { useViolationStatistic } from '@/app/hooks/react-query/useViolationStatistic';
+import {IconDocument, IconSearch, IconWarning, IconGraph, IconDiscet, IconShield} from '@/app/ui/icons/icons';
 
 export default function DashboardUserStats() {
 	const t = useTranslations("Global");
 	const { data: filesInfo, isLoading, isError, error } = useUserFilesInfo();
+	const { data: violationStatistic } = useViolationStatistic();
 
 	return (
-		<div className="dashboard-user-stats">
+		<>
+			<div className="dashboard-user-stats">
 
-			<div className="stat-card projects">
-				<div className="stat-type">ЗАЩИЩЁННЫЕ ФАЙЛЫ</div>
-				<div className="stat-value">{filesInfo?.total.protected ? filesInfo?.total.protected : 0}</div>
-				<div className="stat-label">Файлов под защитой</div>
-				<div className="stat-icon">🛡️</div>
-			</div>
-
-			<div className="stat-card matches">
-				<div className="stat-type">СОВПАДЕНИЯ</div>
-				<div className="stat-value">0</div>
-				<div className="stat-label">Найдено совпадений</div>
-				<div className="stat-icon">🔍</div>
-			</div>
-
-			<div className="stat-card violations">
-				<div className="stat-type">НАРУШЕНИЯ</div>
-				<div className="stat-value">{filesInfo?.total.violation ? filesInfo?.total.violation : 0}</div>
-				<div className="stat-label">Требуют внимания</div>
-				<div className="stat-icon">⚠️</div>
-			</div>
-
-			<div className="stat-card storage">
-				<div className="stat-type">ХРАНИЛИЩЕ</div>
-				<div className="stat-value">
-					{filesInfo?.total.size ? convertBytes(filesInfo?.total.size) : 0}
+				<div className="stat-card projects">
+					<div className="stat-header">
+						<div className="stat-icon">
+							<IconShield />
+						</div>
+					</div>
+					<div className="stat-value">{filesInfo?.total.protected ? filesInfo?.total.protected : 0}</div>
+					<div className="stat-label">
+						{t('files-under-protection')}
+					</div>
 				</div>
-				<div className="stat-label">Использовано места</div>
-				<div className="stat-icon">💾</div>
-			</div>
 
-			<div className="stat-card legal">
-				<div className="stat-type">ЖАЛОБЫ</div>
-				<div className="stat-value">0</div>
-				<div className="stat-label">Отправлено юристам</div>
-				<div className="stat-icon">⚖️</div>
+				<div className="stat-card matches">
+					<div className="stat-header">
+						<div className="stat-icon">
+							<IconSearch />
+						</div>
+					</div>
+					<div className="stat-value">{filesInfo?.total.check ? filesInfo?.total.check : 0}</div>
+					<div className="stat-label">
+						{t('matches-found')}
+					</div>
+				</div>
+
+				<div className="stat-card violations">
+					<div className="stat-header">
+						<div className="stat-icon">
+							<IconWarning />
+						</div>
+					</div>
+					<div className="stat-value">{violationStatistic?.total_violations ?? 0}</div>
+					<div className="stat-label">
+						{t('violations')}
+					</div>
+				</div>
+
+				<div className="stat-card storage">
+					<div className="stat-header">
+						<div className="stat-icon">
+							<IconDiscet />
+						</div>
+					</div>
+					<div className="stat-value">
+						{filesInfo?.total.size ? convertBytes(filesInfo?.total.size) : 0}
+					</div>
+					<div className="stat-label">
+						{t('disk-space-used')}
+					</div>
+				</div>
+
+				<div className="stat-card legal">
+					<div className="stat-header">
+						<div className="stat-icon">
+							<IconDocument />
+						</div>
+					</div>
+					<div className="stat-value">{violationStatistic?.in_progress_violations ?? 0}</div>
+					<div className="stat-label">
+						{t('violations-in-progress')}
+					</div>
+				</div>
 			</div>
-		</div>
+		</>
 	)
 }

src/app/ui/dashboard/new/dashboard-user-violations.tsx

@@ -0,0 +1,104 @@
+'use client'
+
+import { useQuery } from '@tanstack/react-query';
+import { getUserFilesData } from '@/app/actions/fileEntity';
+import { useEffect, useState, useRef } from 'react';
+import { FileTypeIcon } from '@/app/components/FileTypeIcon';
+import { convertBytes } from '@/app/lib/convertBytes';
+import { useTranslations } from 'next-intl';
+import { useClickOutside } from '@/app/hooks/useClickOutside';
+import Link from 'next/link';
+import { getViolationFilesArray } from '@/app/actions/violationActions';
+import { IconEye } from '@/app/ui/icons/icons';
+
+interface ViolationFile {
+	createdAt: string;
+	fileId: string;
+	fileName: string;
+	fileSize: number;
+	latestViolationDate: string;
+	mimeType: string;
+	status: string;
+	supportId: number;
+	violationCount: number;
+}
+
+export default function DashboardUserViolations() {
+	const {
+		data: violationData,
+		isLoading,
+		isError,
+		error,
+	} = useQuery<ViolationFile[]>({
+		queryKey: ['violationData'],
+		queryFn: () => getViolationFilesArray(),
+
+		select: (data) => {
+			return data?.slice(0, 5) || [];
+		},
+		/* refetchInterval: 30000 */
+	});
+
+	const t = useTranslations('Global');
+	const formatDate = (timestamp: number | string) => {
+		const date = new Date(timestamp);
+		const day = date.getDate().toString().padStart(2, '0');
+		const month = (date.getMonth() + 1).toString().padStart(2, '0');
+		const year = date.getFullYear();
+
+		return `${day}.${month}.${year}`;
+	};
+
+	return (
+		<div className="content-section">
+			<div className="section-header">
+				<h3 className="section-title">
+					{t('violation')}
+				</h3>
+				<div
+					className="section-add-file btn view-all-link"
+				>
+					<Link href='/pages/violations'>
+						{t('add')}
+					</Link>
+				</div>
+			</div>
+
+			<div className="user-files-list">
+
+				{violationData?.length ? (
+					violationData?.map((file) => {
+						return (
+							<div
+								key={file.fileId}
+								className="file-item"
+							>
+								<div className="file-icon violent">
+									<Link
+										href={`/pages/violations/${file.fileId}`}
+										className="bg-violet-500 hover:bg-violet-600"
+										title={t('view')}
+									>
+										<IconEye />
+									</Link>
+								</div>
+								<div className="file-info">
+									<div className="file-name" title={file.fileName}>
+										{file.fileName}
+									</div>
+									<div className="file-meta">
+										{file.createdAt ? formatDate(file.createdAt) : 0} • {t('violations-found')}: {file.violationCount ? file.violationCount : 0}
+									</div>
+								</div>
+							</div>
+						)
+					})
+				) : (
+					<div>
+						{t('there-are-no-files-yet')}
+					</div>
+				)}
+			</div>
+		</div>
+	)
+}

src/app/ui/dashboard/new/violations-carousel.tsx

@@ -6,18 +6,50 @@ import Image from 'next/image';
 import 'swiper/css';
 import 'swiper/css/pagination';
 import testImage from '@/app/src/image-preview.png'
-import { useRef } from 'react';
+import { useEffect, useRef } from 'react';
 import { useTranslations } from 'next-intl';
 import Link from 'next/link';
+import { useQuery } from '@tanstack/react-query';
+import { getViolationFilesArray } from '@/app/actions/violationActions';
+
+interface ViolationFile {
+	createdAt: string;
+	fileId: string;
+	fileName: string;
+	fileSize: number;
+	latestViolationDate: string;
+	mimeType: string;
+	status: string;
+	supportId: number;
+	violationCount: number;
+}
 
 export default function ViolationsCarousel() {
+	const {
+		data: violationData,
+		isLoading,
+		isError,
+		error,
+	} = useQuery<ViolationFile[]>({
+		queryKey: ['violationData'],
+		queryFn: () => getViolationFilesArray(),
+
+		select: (data) => {
+			return data;
+		},
+		/* refetchInterval: 30000 */
+	});
 	const paginationRef = useRef(null);
 	const t = useTranslations('Global');
 
+	useEffect(() => {
+		console.log(violationData);
+	}, [violationData])
+
 	return (
 		<div className="content-section">
 			<div className="section-header">
-				<h3 className="section-title">Нарушения</h3>
+				<h3 className="section-title">{t('violation')}</h3>
 				<Link
 					href="violations"
 					className="view-all-link"
@@ -28,7 +60,7 @@ export default function ViolationsCarousel() {
 			<div>
 				{t('are-no-violations')}
 			</div>
-			{/* 			<div className="violations-carousel">
+			<div className="violations-carousel">
 				<Swiper
 					spaceBetween={50}
 					slidesPerView={1}
@@ -43,7 +75,18 @@ export default function ViolationsCarousel() {
 						disableOnInteraction: false,
 					}}
 				>
-					<SwiperSlide>
+					{/* {violationData?.map(item => {
+						return (
+							<SwiperSlide>
+								<div
+									className="violation-slide"
+								>
+
+								</div>
+							</SwiperSlide>
+						)
+					})} */}
+{/* 					<SwiperSlide>
 						<div className="violation-slide">
 							<div className="violation-image-container">
 								<Image src={testImage} alt="Preview" className="violation-image" />
@@ -113,151 +156,7 @@ export default function ViolationsCarousel() {
 								</div>
 							</div>
 						</div>
-					</SwiperSlide>
-					<SwiperSlide>
-						<div className="violation-slide">
-							<div className="violation-image-container">
-								<Image src={testImage} alt="Preview" className="violation-image" />
-
-								<div className="violation-badge">НАРУШЕНИЕ</div>
-								<div className="violation-status-badge">ОБРАБОТАНО</div>
-							</div>
-
-							<div className="violation-content">
-								<div className="violation-title-row">
-									<div className="violation-filename">
-										🖼️banner111.png</div>
-									<div className="violation-type-badge photo">
-										Фото
-									</div>
-								</div>
-
-								<div className="violation-info-grid">
-									<div className="violation-info-item">
-										<div className="violation-info-label">
-											🌍 Регион
-										</div>
-										<div className="violation-info-value">
-											<span className="region-flag">🇺🇸</span>
-											<span>США</span>
-										</div>
-									</div>
-
-									<div className="violation-info-item">
-										<div className="violation-info-label">📅 Обнаружено</div>
-										<div className="violation-info-value">
-											17.10.2025</div>
-									</div>
-
-									<div className="violation-info-item">
-										<div className="violation-info-label">🌐 Домен</div>
-										<div className="violation-info-value">
-											m.apkpure.com    </div>
-									</div>
-
-									<div className="violation-info-item">
-										<div className="violation-info-label">📊 Категория</div>
-										<div className="violation-info-value">
-											Единичное
-										</div>
-									</div>
-
-									<div className="violation-info-item">
-										<div className="violation-info-label">📁 Тип</div>
-										<div className="violation-info-value">
-											Изображение</div>
-									</div>
-
-									<div className="violation-info-item">
-										<div className="violation-info-label">⚡ Статус</div>
-										<div className="violation-info-value">
-											✅ Обработано</div>
-									</div>
-								</div>
-
-								<div className="violation-actions-row">
-									<button className="btn-visit-site">
-										🔗 Перейти на сайт
-									</button>
-									<button className="violation-action">
-										🚨 Открыть дело
-									</button>
-								</div>
-							</div>
-						</div>
-					</SwiperSlide>
-					<SwiperSlide>
-						<div className="violation-slide">
-							<div className="violation-image-container">
-								<Image src={testImage} alt="Preview" className="violation-image" />
-
-								<div className="violation-badge">НАРУШЕНИЕ</div>
-								<div className="violation-status-badge">ОБРАБОТАНО</div>
-							</div>
-
-							<div className="violation-content">
-								<div className="violation-title-row">
-									<div className="violation-filename">
-										🖼️banner111.png</div>
-									<div className="violation-type-badge photo">
-										Фото
-									</div>
-								</div>
-
-								<div className="violation-info-grid">
-									<div className="violation-info-item">
-										<div className="violation-info-label">
-											🌍 Регион
-										</div>
-										<div className="violation-info-value">
-											<span className="region-flag">🇺🇸</span>
-											<span>США</span>
-										</div>
-									</div>
-
-									<div className="violation-info-item">
-										<div className="violation-info-label">📅 Обнаружено</div>
-										<div className="violation-info-value">
-											17.10.2025</div>
-									</div>
-
-									<div className="violation-info-item">
-										<div className="violation-info-label">🌐 Домен</div>
-										<div className="violation-info-value">
-											m.apkpure.com    </div>
-									</div>
-
-									<div className="violation-info-item">
-										<div className="violation-info-label">📊 Категория</div>
-										<div className="violation-info-value">
-											Единичное
-										</div>
-									</div>
-
-									<div className="violation-info-item">
-										<div className="violation-info-label">📁 Тип</div>
-										<div className="violation-info-value">
-											Изображение</div>
-									</div>
-
-									<div className="violation-info-item">
-										<div className="violation-info-label">⚡ Статус</div>
-										<div className="violation-info-value">
-											✅ Обработано</div>
-									</div>
-								</div>
-
-								<div className="violation-actions-row">
-									<button className="btn-visit-site">
-										🔗 Перейти на сайт
-									</button>
-									<button className="violation-action">
-										🚨 Открыть дело
-									</button>
-								</div>
-							</div>
-						</div>
-					</SwiperSlide>
+					</SwiperSlide> */}
 				</Swiper>
 				<div
 					className="flex justify-center mt-6"
@@ -268,7 +167,7 @@ export default function ViolationsCarousel() {
 					>
 					</div>
 				</div>
-			</div> */}
+			</div>
 		</div>
 	)
 }