75 lines
1.8 KiB
TypeScript
75 lines
1.8 KiB
TypeScript
'use client'
|
|
|
|
import { useUserFilesTopStatistic } from '@/app/hooks/react-query/dashboard/useUserFilesTopStatistic';
|
|
import { convertBytes } from '@/app/lib/convertBytes';
|
|
|
|
export default function UsersTop() {
|
|
const { data, isLoading, isError } = useUserFilesTopStatistic();
|
|
|
|
if (isLoading) {
|
|
return (
|
|
<div className="admin-content users-top">
|
|
<div className="content-header">
|
|
<h3>Топ пользователей</h3>
|
|
</div>
|
|
<div className="content-body">
|
|
<div>Загрузка...</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
if (isError) {
|
|
return (
|
|
<div className="admin-content users-top">
|
|
<div className="content-header">
|
|
<h3>Топ пользователей</h3>
|
|
</div>
|
|
<div className="content-body">
|
|
<div>Ошибка при загрузке данных</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="admin-content users-top">
|
|
<div className="content-header">
|
|
<h3>Топ пользователей</h3>
|
|
</div>
|
|
<div className="content-body">
|
|
<table className="admin-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Пользователь</th>
|
|
<th>Файлов</th>
|
|
<th>Размер</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{Array.isArray(data) && data.length > 0 ? (
|
|
data.map((user, index) => (
|
|
<tr key={user.user_id || index}>
|
|
<td>
|
|
<div className="users-top-user">{user.full_name}</div>
|
|
<div className="users-top-mail">
|
|
ID: {user.user_id}
|
|
</div>
|
|
</td>
|
|
<td>{user.count}</td>
|
|
<td>{convertBytes(user.files_size)}</td>
|
|
</tr>
|
|
))
|
|
) : (
|
|
<tr>
|
|
<td colSpan={3} style={{ textAlign: 'center' }}>
|
|
Нет данных
|
|
</td>
|
|
</tr>
|
|
)}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
);
|
|
} |