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

update files date between modules

Browse Source
This commit is contained in:
smanylov
2025-12-29 16:08:38 +07:00
parent 198a01d026
commit bd0169bd61
10 changed files with 153 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/[locale]/pages/dashboard/page.tsx
+1 -1
View File
@@ -22,7 +22,7 @@ export default function Page() {
<ProtectionOverview />
<StatsGrid />
</div>
<FilesTable />
<FilesTable fileType={'all'}/>
</Suspense>
</div>
);
src/app/[locale]/pages/marking-audio/page.tsx
+1 -1
View File
@@ -57,7 +57,7 @@ export default async function Page() {
</div>
</div>
<UploadSectionFile fileType={FILE_TYPE} allowedExtensions={file_extension} maxFileSize={max_file_size} />
<FilesTable />
<FilesTable fileType={FILE_TYPE} />
</div>
)
}
src/app/[locale]/pages/marking-photo/page.tsx
+1 -1
View File
@@ -57,7 +57,7 @@ export default async function Page() {
</div>
</div>
<UploadSectionFile fileType={FILE_TYPE} allowedExtensions={file_extension} maxFileSize={max_file_size} />
<FilesTable />
<FilesTable fileType={FILE_TYPE} />
</div>
)
}
src/app/[locale]/pages/marking-video/page.tsx
+1 -1
View File
@@ -57,7 +57,7 @@ export default async function Page() {
</div>
</div>
<UploadSectionFile fileType={FILE_TYPE} allowedExtensions={file_extension} maxFileSize={max_file_size} />
<FilesTable />
<FilesTable fileType={FILE_TYPE} />
</div>
)
}
src/app/components/tanstakTable.tsx
+43 -36
View File
@@ -82,7 +82,7 @@ const formatDateTime = (timestamp: number) => {
return `${hours}:${minutes}`;
};
export default function TanstakFilesTable() {
export default function TanstakFilesTable({ fileType }: { fileType: string }) {
const {
data: tableData,
isLoading,
@@ -120,7 +120,7 @@ export default function TanstakFilesTable() {
const [sorting, setSorting] = useState<SortingState>([]);
const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([]);
const [dateFilter, setDateFilter] = useState<string>('all');
const [typeFilter, setTypeFilter] = useState<string>('all');
const [typeFilter, setTypeFilter] = useState<string>(fileType);
const [pagination, setPagination] = useState({
pageIndex: 0,
pageSize: 10,
@@ -436,6 +436,11 @@ export default function TanstakFilesTable() {
onSuccess: (response, fileId) => {
if (response === fileId) {
queryClient.invalidateQueries({
queryKey: ['userFilesData'],
refetchType: 'active'
});
setOpenWindow(false);
setOpenWindowChildren(null);
toast.success(t('file-has-been-deleted'));
@@ -580,40 +585,42 @@ export default function TanstakFilesTable() {
</DropDownList>
</div>
<div className="flex flex-col w-50">
<div className="text-sm font-medium mb-1">{t('type-filter')}:</div>
<DropDownList
value={typeFilter}
translatedValue={
(() => {
switch (typeFilter) {
case 'image':
return t('images')
case 'video':
return t('videos')
case 'audio':
return t('audios')
default:
return t('all-types')
}
})()
}
callBack={setTypeFilter}
>
<li value="all">
{t('all-types')}
</li>
<li value="image">
{t('images')}
</li>
<li value="video">
{t('videos')}
</li>
<li value="audio">
{t('audios')}
</li>
</DropDownList>
</div>
{fileType === "all" && (
<div className="flex flex-col w-50">
<div className="text-sm font-medium mb-1">{t('type-filter')}:</div>
<DropDownList
value={typeFilter}
translatedValue={
(() => {
switch (typeFilter) {
case 'image':
return t('images')
case 'video':
return t('videos')
case 'audio':
return t('audios')
default:
return t('all-types')
}
})()
}
callBack={setTypeFilter}
>
<li value="all">
{t('all-types')}
</li>
<li value="image">
{t('images')}
</li>
<li value="video">
{t('videos')}
</li>
<li value="audio">
{t('audios')}
</li>
</DropDownList>
</div>
)}
</div>
<div className="flex flex-col w-full md:w-auto">
src/app/lib/prefetch-queries.ts
+4 -1
View File
@@ -10,7 +10,10 @@ export async function prefetchLayoutQueries(queryClient: QueryClient) {
}),
queryClient.prefetchQuery({
queryKey: ['userFilesData'],
queryFn: () => getUserFilesData(),
queryFn: () => {
console.log('make prefetch userFilesData');
return getUserFilesData();
},
staleTime: 30 * 1000
}),
]);
src/app/styles/pages-styles.scss
+16
View File
@@ -95,6 +95,15 @@
}
}
&.total-files.add-content {
display: flex;
justify-content: center;
.protection-stat-value {
margin-bottom: 0;
}
}
&-row {
display: flex;
align-items: center;
@@ -110,6 +119,13 @@
&.btn {
user-select: none;
transition: all 0.3s ease-in;
padding: 5px;
margin-top: 10px;
&:hover {
background: v.$shadow-1;
}
}
}
src/app/ui/dashboard/files-table.tsx
+7 -2
View File
@@ -1,8 +1,13 @@
import TanstakFilesTable from '@/app/components/tanstakTable';
export default function FilesTable() {
type FilesTable = {
fileType: string
}
export default function FilesTable({ fileType }: FilesTable) {
return (
<div className="block-wrapper">
<TanstakFilesTable/>
<TanstakFilesTable fileType={fileType} />
</div>
)
}
src/app/ui/dashboard/protection-overview.tsx
+42 -19
View File
@@ -5,6 +5,8 @@ import { PieChartComponent } from '@/app/components/PieChartComponent';
import { useTranslations } from 'next-intl';
import Link from 'next/link';
import { useClickOutside } from '@/app/hooks/useClickOutside';
import { useQuery } from '@tanstack/react-query';
import { getUserFilesData } from '@/app/actions/fileEntity';
const data = [
@@ -13,8 +15,12 @@ const data = [
{ name: 'audios', value: 25, color: '#1971c2' },
];
/* нужно что бы включать выключать кнопки добавления маркировок */
const totalFiles = 1;
type FilesInfo = {
totalSize: string;
totalCount: number;
};
export default function ProtectionOverview() {
const [isOpen, setIsOpen] = useState(false);
@@ -25,6 +31,32 @@ export default function ProtectionOverview() {
setOpenDropDownList(false)
});
const {
data: filesInfo,
isLoading,
isError,
error,
} = useQuery<{
formattedTotalSize: string,
totalCount: number
}, Error, FilesInfo>({
queryKey: ['userFilesData'],
queryFn: getUserFilesData,
select: (data): FilesInfo => {
if (!data) {
return {
totalSize: '0',
totalCount: 0
}
}
return {
totalSize: data.formattedTotalSize,
totalCount: (data.totalCount)
}
},
});
return (
<div className="protection-overview grow">
<h3>{t('protecting-your-content')}</h3>
@@ -32,33 +64,24 @@ export default function ProtectionOverview() {
<div className={`protection-stats ${isOpen ? "opened" : ""}`}>
{totalFiles ? (
{filesInfo?.totalCount ? (
<>
<div className="protection-stat total-files">
<div className="protection-stat-value">0</div>
<div className="protection-stat-value">
{filesInfo?.totalCount ? filesInfo?.totalCount : 0}
</div>
<div className="protection-stat-label">{t('total-files')}</div>
</div>
{/* <div className="protection-stat total-checks">
<div className="protection-stat-row">
<div className="protection-stat-value">0</div>
<div className="protection-stat-label">{t('check')}</div>
</div>
<div className="protection-stat-row">
<div className="protection-stat-value">0</div>
<div className="protection-stat-label">{t('violations')}</div>
</div>
</div> */}
<div className="protection-stat total-checks">
<div className="protection-stat-value">0</div>
<div className="protection-stat-label">{t('check')}</div>
<div className="protection-stat-value">0</div>
<div className="protection-stat-label">{t('violations')}</div>
</div>
</>
) : (
<div className="protection-stat total-files relative">
<div className="protection-stat total-files add-content relative">
<div className="protection-stat-label">
{t('there-are-no-files-yet')}
</div>
@@ -96,14 +119,14 @@ export default function ProtectionOverview() {
</div>
) : (
<div className="protection-stat total-usage">
<div className="protection-stat-value">0 / 0</div>
<div className="protection-stat-value">{filesInfo?.totalSize ? filesInfo?.totalSize : 0} / 0</div>
<div className="protection-stat-label">
{t('disk-space-used')}
</div>
</div>
)}
</div>
{!!totalFiles && (
{!!filesInfo?.totalCount && (
<button
className="protection-overview-switch cursor-pointer"
onClick={() => {
src/app/ui/marking-page/protection-summary.tsx
+37 -2
View File
@@ -1,17 +1,52 @@
'use client'
import { useTranslations } from 'next-intl';
import { useQuery } from '@tanstack/react-query';
import { getUserFilesData } from '@/app/actions/fileEntity';
type FilesInfo = {
totalSize: string;
totalCount: number;
};
export default function ProtectionSummary() {
const t = useTranslations('Global');
const {
data: filesInfo,
isLoading,
isError,
error,
} = useQuery<{
formattedTotalSize: string,
totalCount: number
}, Error, FilesInfo>({
queryKey: ['userFilesData'],
queryFn: getUserFilesData,
select: (data): FilesInfo => {
if (!data) {
return {
totalSize: '0',
totalCount: 0
}
}
return {
totalSize: data.formattedTotalSize,
totalCount: (data.totalCount)
}
},
});
return (
<div className="protection-overview grow">
<h3>{t('protecting-your-content')}</h3>
<p>{t('current-status-of')}</p>
<div className="protection-stats">
<div className="protection-stat total-files">
<div className="protection-stat-value">0</div>
<div className="protection-stat-value">{filesInfo?.totalCount ? filesInfo?.totalCount : 0}</div>
<div className="protection-stat-label">{t('total-files')}</div>
</div>
<div className="protection-stat total-checks">
@@ -21,7 +56,7 @@ export default function ProtectionSummary() {
<div className="protection-stat-label">{t('violations')}</div>
</div>
<div className="protection-stat total-usage">
<div className="protection-stat-value">0 / 0</div>
<div className="protection-stat-value">{filesInfo?.totalSize ? filesInfo?.totalSize : 0} / 0</div>
<div className="protection-stat-label">
{t('disk-space-used')}
</div>