frontdev/no-copy-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add animations

Browse Source
This commit is contained in:
smanylov
2026-04-09 16:11:57 +07:00
parent 1eff2d2c0a
commit 62cd597994
9 changed files with 209 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/ui/dashboard/new/dashboard-user-stats.tsx
+65 -7
View File
@@ -5,12 +5,12 @@ 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';
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();
const { data: violationStatistic, isLoading: violationStatisticLoading } = useViolationStatistic();
return (
<>
@@ -22,7 +22,19 @@ export default function DashboardUserStats() {
<IconShield />
</div>
</div>
<div className="stat-value">{filesInfo?.total.protected ? filesInfo?.total.protected : 0}</div>
<div className="stat-value">
<div
className="loading-placeholder start"
>
{isLoading ? (
<div className="loading-animation">
<div className="global-spinner" />
</div>
) : (
filesInfo?.total.protected ? filesInfo?.total.protected : 0
)}
</div>
</div>
<div className="stat-label">
{t('files-under-protection')}
</div>
@@ -34,7 +46,19 @@ export default function DashboardUserStats() {
<IconSearch />
</div>
</div>
<div className="stat-value">{filesInfo?.total.check ? filesInfo?.total.check : 0}</div>
<div className="stat-value">
<div
className="loading-placeholder start"
>
{isLoading ? (
<div className="loading-animation">
<div className="global-spinner" />
</div>
) : (
filesInfo?.total.check ? filesInfo?.total.check : 0
)}
</div>
</div>
<div className="stat-label">
{t('matches-found')}
</div>
@@ -46,7 +70,19 @@ export default function DashboardUserStats() {
<IconWarning />
</div>
</div>
<div className="stat-value">{violationStatistic?.total_violations ?? 0}</div>
<div className="stat-value">
<div
className="loading-placeholder start"
>
{violationStatisticLoading ? (
<div className="loading-animation">
<div className="global-spinner" />
</div>
) : (
violationStatistic?.total_violations ?? 0
)}
</div>
</div>
<div className="stat-label">
{t('violations')}
</div>
@@ -59,7 +95,17 @@ export default function DashboardUserStats() {
</div>
</div>
<div className="stat-value">
{filesInfo?.total.size ? convertBytes(filesInfo?.total.size) : 0}
<div
className="loading-placeholder start"
>
{isLoading ? (
<div className="loading-animation">
<div className="global-spinner" />
</div>
) : (
filesInfo?.total.size ? convertBytes(filesInfo?.total.size) : 0
)}
</div>
</div>
<div className="stat-label">
{t('disk-space-used')}
@@ -72,7 +118,19 @@ export default function DashboardUserStats() {
<IconDocument />
</div>
</div>
<div className="stat-value">{violationStatistic?.in_progress_violations ?? 0}</div>
<div className="stat-value">
<div
className="loading-placeholder start"
>
{violationStatisticLoading ? (
<div className="loading-animation">
<div className="global-spinner" />
</div>
) : (
violationStatistic?.in_progress_violations ?? 0
)}
</div>
</div>
<div className="stat-label">
{t('violations-in-progress')}
</div>