mirror of
https://github.com/Nezumi-2711/react-training.git
synced 2026-09-22 13:38:51 +00:00
Create booking hooks and update room, user hooks
This commit is contained in:
@@ -0,0 +1,71 @@
|
||||
import toast from 'react-hot-toast';
|
||||
import { useQuery, useQueryClient } from '@tanstack/react-query';
|
||||
import { useSearchParams } from 'react-router-dom';
|
||||
|
||||
// Services
|
||||
import { getAllBookings } from '@service/bookingServices';
|
||||
|
||||
// Constants
|
||||
import { DEFAULT_PAGE_SIZE } from '@constant/config';
|
||||
|
||||
/**
|
||||
* Fetch booking from database
|
||||
* @returns The status of loading bookings from database and data of bookings
|
||||
*/
|
||||
const useBookings = () => {
|
||||
const queryClient = useQueryClient();
|
||||
const [searchParams] = useSearchParams();
|
||||
|
||||
const searchValue = searchParams.get('search') || '';
|
||||
const page = searchParams.get('page') ? Number(searchParams.get('page')) : 1;
|
||||
|
||||
const {
|
||||
isLoading,
|
||||
data: { data: bookings, count } = {},
|
||||
error,
|
||||
} = useQuery({
|
||||
queryKey: ['bookings', searchValue, page],
|
||||
queryFn: () =>
|
||||
getAllBookings({
|
||||
userNameSearch: searchValue,
|
||||
page,
|
||||
}),
|
||||
});
|
||||
|
||||
if (error) {
|
||||
toast.error(error.message);
|
||||
}
|
||||
|
||||
// Pre-fetching
|
||||
const totalPage = Math.ceil(count! / DEFAULT_PAGE_SIZE);
|
||||
|
||||
if (page < totalPage) {
|
||||
const nextPage = page + 1;
|
||||
|
||||
queryClient.prefetchQuery({
|
||||
queryKey: ['bookings', searchValue, nextPage],
|
||||
queryFn: () =>
|
||||
getAllBookings({
|
||||
userNameSearch: searchValue,
|
||||
page: nextPage,
|
||||
}),
|
||||
});
|
||||
}
|
||||
|
||||
if (page > 1) {
|
||||
const previousPage = page - 1;
|
||||
|
||||
queryClient.prefetchQuery({
|
||||
queryKey: ['bookings', searchValue, previousPage],
|
||||
queryFn: () =>
|
||||
getAllBookings({
|
||||
userNameSearch: searchValue,
|
||||
page: previousPage,
|
||||
}),
|
||||
});
|
||||
}
|
||||
|
||||
return { isLoading, bookings, count };
|
||||
};
|
||||
|
||||
export { useBookings };
|
||||
@@ -0,0 +1,43 @@
|
||||
import toast from 'react-hot-toast';
|
||||
import { useMutation, useQueryClient } from '@tanstack/react-query';
|
||||
|
||||
// Constants
|
||||
import { CHECKOUT_SUCCESS } from '@constant/messages';
|
||||
|
||||
// Hooks
|
||||
import { useUserRoomAvailable } from '@hook/useUserRoomAvailable';
|
||||
|
||||
// Services
|
||||
import { checkOutBooking as checkOutBookingFn } from '@service/bookingServices';
|
||||
|
||||
const useCheckOut = () => {
|
||||
const queryClient = useQueryClient();
|
||||
const { dispatch } = useUserRoomAvailable();
|
||||
|
||||
const {
|
||||
mutate: checkOutBooking,
|
||||
isPending: isChecking,
|
||||
isSuccess,
|
||||
} = useMutation({
|
||||
mutationFn: checkOutBookingFn,
|
||||
onSuccess: (data) => {
|
||||
toast.success(CHECKOUT_SUCCESS);
|
||||
queryClient.invalidateQueries({ queryKey: ['bookings'] });
|
||||
|
||||
// Update status room, users
|
||||
dispatch!({
|
||||
type: 'updateStatusRoom',
|
||||
payload: [{ id: data.roomId, status: false }],
|
||||
});
|
||||
dispatch!({
|
||||
type: 'updateStatusUser',
|
||||
payload: [{ id: data.userId, isBooked: false }],
|
||||
});
|
||||
},
|
||||
onError: (err) => toast.error(err.message),
|
||||
});
|
||||
|
||||
return { checkOutBooking, isChecking, isSuccess };
|
||||
};
|
||||
|
||||
export default useCheckOut;
|
||||
@@ -0,0 +1,33 @@
|
||||
import { useMutation, useQueryClient } from '@tanstack/react-query';
|
||||
import toast from 'react-hot-toast';
|
||||
|
||||
// Services
|
||||
import { createBooking as createBookingFn } from '@service/bookingServices';
|
||||
|
||||
// Constants
|
||||
import { ADD_SUCCESS } from '@constant/messages';
|
||||
|
||||
/**
|
||||
* Create booking on database
|
||||
* @returns The boolean of isCreating and create booking function
|
||||
*/
|
||||
const useCreateBooking = () => {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const {
|
||||
mutate: createBooking,
|
||||
isPending: isCreating,
|
||||
isSuccess,
|
||||
} = useMutation({
|
||||
mutationFn: createBookingFn,
|
||||
onSuccess: () => {
|
||||
toast.success(ADD_SUCCESS);
|
||||
queryClient.invalidateQueries({ queryKey: ['bookings'] });
|
||||
},
|
||||
onError: (err) => toast.error(err.message),
|
||||
});
|
||||
|
||||
return { isCreating, createBooking, isSuccess };
|
||||
};
|
||||
|
||||
export { useCreateBooking };
|
||||
@@ -0,0 +1,35 @@
|
||||
import { useMutation, useQueryClient } from '@tanstack/react-query';
|
||||
import toast from 'react-hot-toast';
|
||||
|
||||
// Services
|
||||
import { deleteBooking as deleteBookingFn } from '@service/bookingServices';
|
||||
|
||||
// Constants
|
||||
import { DELETE_SUCCESS } from '@constant/messages';
|
||||
|
||||
/**
|
||||
* Delete the booking from database
|
||||
* @returns The boolean of status deleting and deleteBooking function
|
||||
*/
|
||||
const useDeleteBooking = () => {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const {
|
||||
isPending: isDeleting,
|
||||
mutate: deleteBooking,
|
||||
isSuccess,
|
||||
} = useMutation({
|
||||
mutationFn: deleteBookingFn,
|
||||
onSuccess: () => {
|
||||
toast.success(DELETE_SUCCESS);
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: ['bookings'],
|
||||
});
|
||||
},
|
||||
onError: (err) => toast.error(err.message),
|
||||
});
|
||||
|
||||
return { isDeleting, deleteBooking, isSuccess };
|
||||
};
|
||||
|
||||
export { useDeleteBooking };
|
||||
@@ -0,0 +1,33 @@
|
||||
import { useMutation, useQueryClient } from '@tanstack/react-query';
|
||||
import toast from 'react-hot-toast';
|
||||
|
||||
// Services
|
||||
import { updateBooking as updateBookingFn } from '@service/bookingServices';
|
||||
|
||||
// Constants
|
||||
import { UPDATE_SUCCESS } from '@constant/messages';
|
||||
|
||||
/**
|
||||
* Update booking from database
|
||||
* @returns The status of updating and updateBooking function
|
||||
*/
|
||||
const useUpdateBooking = () => {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const {
|
||||
mutate: updateBooking,
|
||||
isPending: isUpdating,
|
||||
isSuccess
|
||||
} = useMutation({
|
||||
mutationFn: updateBookingFn,
|
||||
onSuccess: () => {
|
||||
toast.success(UPDATE_SUCCESS);
|
||||
queryClient.invalidateQueries({ queryKey: ['bookings'] });
|
||||
},
|
||||
onError: (err) => toast.error(err.message),
|
||||
});
|
||||
|
||||
return { isUpdating, updateBooking, isSuccess };
|
||||
};
|
||||
|
||||
export { useUpdateBooking };
|
||||
@@ -31,7 +31,7 @@ const useRooms = () => {
|
||||
getAllRooms({
|
||||
sortBy: sortByValue,
|
||||
orderBy: orderByValue,
|
||||
roomName: searchValue,
|
||||
roomSearch: searchValue,
|
||||
page,
|
||||
}),
|
||||
});
|
||||
@@ -52,7 +52,7 @@ const useRooms = () => {
|
||||
getAllRooms({
|
||||
sortBy: sortByValue,
|
||||
orderBy: orderByValue,
|
||||
roomName: searchValue,
|
||||
roomSearch: searchValue,
|
||||
page: nextPage,
|
||||
}),
|
||||
});
|
||||
@@ -67,7 +67,7 @@ const useRooms = () => {
|
||||
getAllRooms({
|
||||
sortBy: sortByValue,
|
||||
orderBy: orderByValue,
|
||||
roomName: searchValue,
|
||||
roomSearch: searchValue,
|
||||
page: previousPage,
|
||||
}),
|
||||
});
|
||||
|
||||
@@ -0,0 +1,35 @@
|
||||
import { useMutation, useQueryClient } from '@tanstack/react-query';
|
||||
import toast from 'react-hot-toast';
|
||||
|
||||
// Services
|
||||
import { deleteUser as deleteUserFn } from '@service/userServices';
|
||||
|
||||
// Constants
|
||||
import * as messages from '@constant/messages';
|
||||
|
||||
/**
|
||||
* Delete the user from database
|
||||
* @returns The boolean of status deleting and deleteUser function
|
||||
*/
|
||||
const useDeleteUser = () => {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const {
|
||||
isPending: isDeleting,
|
||||
mutate: deleteUser,
|
||||
isSuccess,
|
||||
} = useMutation({
|
||||
mutationFn: deleteUserFn,
|
||||
onSuccess: () => {
|
||||
toast.success(messages.DELETE_SUCCESS);
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: ['users'],
|
||||
});
|
||||
},
|
||||
onError: (err) => toast.error(err.message),
|
||||
});
|
||||
|
||||
return { isDeleting, deleteUser, isSuccess };
|
||||
};
|
||||
|
||||
export { useDeleteUser };
|
||||
Reference in New Issue
Block a user