add users list

src/app/hooks/react-query/useUsersData.ts

@@ -1,58 +1,107 @@
 import { useQuery } from '@tanstack/react-query';
 import { fetchUsesData } from '@/app/actions/usersActions';
 
-interface ApiResponse {
-	files: ApiUser[];
+export interface ApiResponse {
+	content: ApiUser[];
+	totalElements: number;
+	totalPages: number;
+	number: number;
+	size: number;
 }
 
-interface ApiUser {
-	id: string;
-	mimeType: string;
-	userEmail: number;
-	userCompany: number;
-	updatedAt: string;
-};
+export interface ApiUser {
+	id: number;
+	fullName: string;
+	email: string;
+	verificationStatus: string;
+	createdAt: string;
+	tariff: string;
+	tokens: number;
+}
 
-export const useUsersData = (page: number, size: number) => {
-	return useQuery<ApiResponse, Error, any>({
-		queryKey: ['usersData'],
+export interface TransformedUser {
+	id: number;
+	userName: string;
+	userEmail: string;
+	userCompany: string;
+	userSubscription: number;
+	userRole: string;
+	userContent: number;
+	tariff: string;
+	tokens: number;
+	verificationStatus: string;
+	_original: ApiUser;
+}
+export interface UsersDataWithPagination {
+	users: TransformedUser[];
+	pagination: {
+		totalElements: number;
+		totalPages: number;
+		currentPage: number;
+		pageSize: number;
+	};
+}
+
+export const useUsersData = (page: number, size: number, sortBy?: string, sortDirection?: 'asc' | 'desc' | string, nameQuery?: string) => {
+	return useQuery<ApiResponse, Error, UsersDataWithPagination>({
+		queryKey: ['usersData', page, size, sortBy, sortDirection, nameQuery],
 		queryFn: () => {
-			return fetchUsesData(page, size)
+			return fetchUsesData(page, size, sortBy, sortDirection, nameQuery);
 		},
+		select: (data: ApiResponse): UsersDataWithPagination => {
+			if (!data?.content || data.content.length === 0) {
+				return {
+					users: [{
+						id: 1,
+						userName: 'userName',
+						userEmail: 'userEmail',
+						userCompany: 'userCompany',
+						userSubscription: Date.now(),
+						userRole: 'role',
+						userContent: 0,
+						tariff: 'EXPIRED',
+						tokens: 0,
+						verificationStatus: 'UNVERIFIED',
+						_original: {} as ApiUser
+					}],
+					pagination: {
+						totalElements: data?.totalElements || 0,
+						totalPages: data?.totalPages || 0,
+						currentPage: data?.number || 0,
+						pageSize: data?.size || size
+					}
+				};
+			}
 
-		select: (data: ApiResponse): any => {
-			if (!data?.files) return [
-				{
-					id: 1,
-					userId: 1,
-					userName: 'userName',
-					userEmail: 'userEmail',
-					userCompany: 'userCompany',
-					userSubscription: 'userSubscription',
-					userRole: 'role',
-					userContent: 0,
-				}
-			];
-
-			return data.files.map((item: ApiUser) => {
-				const [datePart, timePart] = item.updatedAt.split(' ');
-				const [day, month, year] = datePart.split('-').map(Number);
-				const [hours, minutes, seconds] = timePart.split(':').map(Number);
-				const newDate = new Date(year, month - 1, day, hours, minutes, seconds).getTime();
+			const transformedUsers = data.content.map((item: ApiUser) => {
+				const createdAtTimestamp = new Date(item.createdAt).getTime();
 
 				return {
 					id: item.id,
-					userName: item.mimeType.toLocaleLowerCase(),
-					userEmail: item.userEmail,
-					userCompany: item.userCompany,
-					userSubscription: newDate,
-					userRole: 'role',
+					userName: item.fullName,
+					userEmail: item.email,
+					userCompany: '',
+					userSubscription: createdAtTimestamp,
+					userRole: 'user',
 					userContent: 0,
+					tariff: item.tariff,
+					tokens: item.tokens,
+					verificationStatus: item.verificationStatus,
 					_original: item
 				};
 			});
+
+			return {
+				users: transformedUsers,
+				pagination: {
+					totalElements: data.totalElements || 0,
+					totalPages: data.totalPages || 0,
+					currentPage: data.number || 0,
+					pageSize: data.size || size
+				}
+			};
 		},
 		retry: false,
-		placeholderData: (previousData) => previousData // для оптимистичных обновлений
+		placeholderData: (previousData) => previousData
 	});
 };