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

add my content layout

Browse Source
This commit is contained in:
smanylov
2026-01-15 12:27:39 +07:00
parent 719a3e3582
commit 7213e40b96
13 changed files with 257 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/ui/dashboard/protection-overview.tsx
+5 -4
View File
@@ -2,7 +2,7 @@
import { useState, useRef, useEffect } from 'react';
import { PieChartComponent } from '@/app/components/PieChartComponent';
import { useTranslations } from 'next-intl';
import {useTranslations, useLocale} from 'next-intl';
import Link from 'next/link';
import { useClickOutside } from '@/app/hooks/useClickOutside';
import { useQuery } from '@tanstack/react-query';
@@ -30,6 +30,7 @@ export default function ProtectionOverview() {
{ name: 'videos', value: 0, color: '#2f9e44' },
{ name: 'audios', value: 0, color: '#1971c2' },
]);
const locale = useLocale();
const t = useTranslations('Global');
const [openDropDownList, setOpenDropDownList] = useState(false);
const dropDownList = useRef(null);
@@ -106,17 +107,17 @@ export default function ProtectionOverview() {
const pluralizeFiles = (number: number) => {
const translate = [t('file'), t('files-few'), t('files')];
return pluralize(number, translate[0], translate[1], translate[2]);
return pluralize(number, translate[0], translate[1], translate[2], locale);
};
const pluralizeCheks = (number: number) => {
const translate = [t('check'), t('checks-few'), t('checks')];
return pluralize(number, translate[0], translate[1], translate[2]);
return pluralize(number, translate[0], translate[1], translate[2], locale);
};
const pluralizeViolations = (number: number) => {
const translate = [t('violation'), t('violations-few'), t('violations')];
return pluralize(number, translate[0], translate[1], translate[2]);
return pluralize(number, translate[0], translate[1], translate[2], locale);
};
const CHECKS = 6;
src/app/ui/marking-page/protection-summary.tsx
+6 -4
View File
@@ -1,6 +1,6 @@
'use client'
import { useTranslations } from 'next-intl';
import {useTranslations, useLocale} from 'next-intl';
import { useQuery } from '@tanstack/react-query';
import { getUserFilesInfo } from '@/app/actions/action';
import { convertBytes } from '@/app/lib/convertBytes';
@@ -72,19 +72,21 @@ export default function ProtectionSummary({ fileType }: { fileType: string }) {
}
});
const locale = useLocale();
const pluralizeFilesName = (number: number) => {
const translate = [t(`${fileType}`), t(`${fileType}s-few`), t(`${fileType}s`)];
return pluralize(number, translate[0], translate[1], translate[2]);
return pluralize(number, translate[0], translate[1], translate[2], locale);
};
const pluralizeCheks = (number: number) => {
const translate = [t('check'), t('checks-few'), t('checks')];
return pluralize(number, translate[0], translate[1], translate[2]);
return pluralize(number, translate[0], translate[1], translate[2], locale);
};
const pluralizeViolations = (number: number) => {
const translate = [t('violation'), t('violations-few'), t('violations')];
return pluralize(number, translate[0], translate[1], translate[2]);
return pluralize(number, translate[0], translate[1], translate[2], locale);
};
return (
src/app/ui/my-content/my-content-info-block.tsx
+3 -2
View File
@@ -3,11 +3,12 @@
import { IconDocument, IconImageFile, IconVideoFile, IconAudioFile } from '@/app/ui/icons/icons';
import { useQuery } from '@tanstack/react-query';
import { getUserFilesInfo } from '@/app/actions/action';
import { useTranslations } from 'next-intl';
import {useTranslations, useLocale} from 'next-intl';
import { convertBytes } from '@/app/lib/convertBytes';
import { pluralize } from '@/app/lib/pluralize';
export default function MyContentInfoBlock() {
const locale = useLocale();
const t = useTranslations('Global');
const {
@@ -70,7 +71,7 @@ export default function MyContentInfoBlock() {
const pluralizeFiles = (number: number) => {
const translate = [t('file'), t('files-few'), t('files')];
return pluralize(number, translate[0], translate[1], translate[2]);
return pluralize(number, translate[0], translate[1], translate[2], locale);
};
return (
src/app/ui/my-content/new/my-content-page-title.tsx
+50
View File
@@ -0,0 +1,50 @@
'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';
export default function MyContentPageTitleColorFrame({ title, description }: { title: string, description: string }) {
const t = useTranslations('Global');
const {
data: filesInfo,
isLoading,
isError,
error,
} = useQuery({
queryKey: ['userFilesInfo'],
queryFn: getUserFilesInfo,
});
return (
<div className="page-title-color-frame">
<div className="header-content">
<div className="header-main">
<h1>
{t(title)}
</h1>
<p>
{t(description)}
</p>
</div>
<div className="header-stats">
<div className="header-stat-item">
<div className="header-stat-value">{filesInfo?.all_files_quantity}</div>
<div className="header-stat-label">Файлов</div>
</div>
<div className="header-stat-divider"></div>
<div className="header-stat-item">
<div className="header-stat-value">0</div>
<div className="header-stat-label">Защищено</div>
</div>
<div className="header-stat-divider"></div>
<div className="header-stat-item">
<div className="header-stat-value">{filesInfo.all_files_size ? convertBytes(filesInfo.all_files_size) : 0}</div>
<div className="header-stat-label">Хранилище</div>
</div>
</div>
</div>
</div>
)
}
src/app/ui/my-content/new/my-content-stats-overview.tsx
+59
View File
@@ -0,0 +1,59 @@
'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';
export default function MyContentStatsOverview() {
const t = useTranslations('Global');
const {
data: filesInfo,
isLoading,
isError,
error,
} = useQuery({
queryKey: ['userFilesInfo'],
queryFn: getUserFilesInfo,
});
return (
<div className="my-content-stats-overview">
<div className="stat-card files" data-icon="📄">
<div className="stat-header">
<div className="stat-icon">📄</div>
<div className="stat-trend">+0%</div>
</div>
<div className="stat-value">{filesInfo?.all_files_quantity}</div>
<div className="stat-label">Всего файлов</div>
</div>
<div className="stat-card protected" data-icon="🛡">
<div className="stat-header">
<div className="stat-icon">🛡</div>
<div className="stat-trend">+0%</div>
</div>
<div className="stat-value">0</div>
<div className="stat-label">Защищено файлов</div>
</div>
<div className="stat-card checks" data-icon="🔍">
<div className="stat-header">
<div className="stat-icon">🔍</div>
<div className="stat-trend">+0%</div>
</div>
<div className="stat-value">0</div>
<div className="stat-label">Проверок защиты</div>
</div>
<div className="stat-card storage" data-icon="💾">
<div className="stat-header">
<div className="stat-icon">💾</div>
<div className="stat-trend">+0%</div>
</div>
<div className="stat-value">{filesInfo.all_files_size ? convertBytes(filesInfo.all_files_size) : 0}</div>
<div className="stat-label">Хранилище</div>
</div>
</div>
)
}