refactor userFilesInfo query

src/app/ui/dashboard/stats-grid.tsx

@@ -2,22 +2,12 @@
 
 import { useTranslations } from 'next-intl';
 import { IconImageFile, IconVideoFile, IconAudioFile } from '@/app/ui/icons/icons';
-import { useQuery } from '@tanstack/react-query';
-import { getUserFilesInfo } from '@/app/actions/action';
-import {convertBytes} from '@/app/lib/convertBytes';
+import { convertBytes } from '@/app/lib/convertBytes';
+import { useUserFilesInfo } from '@/app/hooks/react-query/useUserFilesInfo';
 
 export default function StatsGrid() {
 	const t = useTranslations("Global");
-
-	const {
-		data: filesInfo,
-		isLoading,
-		isError,
-		error,
-	} = useQuery({
-		queryKey: ['userFilesInfo'],
-		queryFn: getUserFilesInfo,
-	});
+	const { data: filesInfo, isLoading, isError, error } = useUserFilesInfo();
 
 	return (
 		<div className="block-wrapper stats-wrapper">
@@ -46,10 +36,10 @@ export default function StatsGrid() {
 					{t('images')}
 				</div>
 				<div className="stats-item second-row">
-					{filesInfo?.images_quantity ? filesInfo?.images_quantity : 0}
+					{filesInfo?.images.quantity ? filesInfo?.images.quantity : 0}
 				</div>
 				<div className="stats-item second-row">
-					{filesInfo?.images_size ? convertBytes(filesInfo?.images_size) : 0}
+					{filesInfo?.images.size ? convertBytes(filesInfo?.images.size) : 0}
 				</div>
 				<div className="stats-item second-row">
 					0
@@ -63,10 +53,10 @@ export default function StatsGrid() {
 					{t('videos')}
 				</div>
 				<div className="stats-item">
-					{filesInfo?.videos_quantity ? filesInfo?.videos_quantity : 0}
+					{filesInfo?.videos.quantity ? filesInfo?.videos.quantity : 0}
 				</div>
 				<div className="stats-item">
-					{filesInfo?.videos_size ? convertBytes(filesInfo?.videos_size) : 0}
+					{filesInfo?.videos.size ? convertBytes(filesInfo?.videos.size) : 0}
 				</div>
 				<div className="stats-item">
 					0
@@ -80,10 +70,10 @@ export default function StatsGrid() {
 					{t('audios')}
 				</div>
 				<div className="stats-item last-row">
-					{filesInfo?.audios_quantity ? filesInfo?.audios_quantity : 0}
+					{filesInfo?.audios.quantity ? filesInfo?.audios.quantity : 0}
 				</div>
 				<div className="stats-item last-row">
-					{filesInfo?.audios_size ? convertBytes(filesInfo?.audios_size) : 0}
+					{filesInfo?.audios.size ? convertBytes(filesInfo?.audios.size) : 0}
 				</div>
 				<div className="stats-item last-row">
 					0