Update hooks and services

hotel-management/src/hooks/rooms/useCreateRoom.ts

@@ -0,0 +1,29 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import toast from 'react-hot-toast';
+
+// Services
+import { createRoom as createRoomFn } from '@service/roomServices';
+
+// Constants
+import { ADD_SUCCESS } from '@constant/messages';
+
+/**
+ * Create room on database
+ * @returns The boolean of isCreating and create room function
+ */
+const useCreateRoom = () => {
+  const queryClient = useQueryClient();
+
+  const { mutate: createRoom, isPending: isCreating } = useMutation({
+    mutationFn: createRoomFn,
+    onSuccess: () => {
+      toast.success(ADD_SUCCESS);
+      queryClient.invalidateQueries({ queryKey: ['rooms'] });
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  return { isCreating, createRoom };
+};
+
+export { useCreateRoom };

hotel-management/src/hooks/rooms/useDeleteRoom.ts

@@ -0,0 +1,31 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import toast from 'react-hot-toast';
+
+// Services
+import { deleteRoom as deleteRoomFn } from '@service/roomServices';
+
+// Constants
+import * as messages from '@constant/messages';
+
+/**
+ * Delete the room from database
+ * @returns The boolean of status deleting and deleteRoom function
+ */
+const useDeleteRoom = () => {
+  const queryClient = useQueryClient();
+
+  const { isPending: isDeleting, mutate: deleteRoom } = useMutation({
+    mutationFn: deleteRoomFn,
+    onSuccess: () => {
+      toast.success(messages.DELETE_SUCCESS);
+      queryClient.invalidateQueries({
+        queryKey: ['rooms'],
+      });
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  return { isDeleting, deleteRoom };
+};
+
+export { useDeleteRoom };

hotel-management/src/hooks/rooms/useRooms.ts

@@ -0,0 +1,34 @@
+import toast from 'react-hot-toast';
+import { useQuery } from '@tanstack/react-query';
+import { useSearchParams } from 'react-router-dom';
+
+// Services
+import { getAllRooms } from '@service/roomServices';
+
+/**
+ * Fetch room from database
+ * @returns The status of loading rooms from database and data of rooms
+ */
+const useRooms = () => {
+  const [searchParams] = useSearchParams();
+  const sortByValue = searchParams.get('sortBy') || 'id';
+  const orderByValue = searchParams.get('orderBy') || 'asc';
+  const phoneSearch = searchParams.get('search') || '';
+
+  const {
+    isLoading,
+    data: rooms,
+    error,
+  } = useQuery({
+    queryKey: ['rooms', sortByValue, orderByValue, phoneSearch],
+    queryFn: () => getAllRooms(sortByValue, orderByValue, phoneSearch),
+  });
+
+  if (error) {
+    toast.error(error.message);
+  }
+
+  return { isLoading, rooms };
+};
+
+export { useRooms };

hotel-management/src/hooks/rooms/useUpdateRoom.ts

@@ -0,0 +1,29 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import toast from 'react-hot-toast';
+
+// Services
+import { updateRoom as updateRoomFn } from '@service/roomServices';
+
+// Constants
+import { UPDATE_SUCCESS } from '@constant/messages';
+
+/**
+ * Update room from database
+ * @returns The status of updating and updateRoom function
+ */
+const useUpdateRoom = () => {
+  const queryClient = useQueryClient();
+
+  const { mutate: updateRoom, isPending: isUpdating } = useMutation({
+    mutationFn: updateRoomFn,
+    onSuccess: () => {
+      toast.success(UPDATE_SUCCESS);
+      queryClient.invalidateQueries({ queryKey: ['rooms'] });
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  return { isUpdating, updateRoom };
+};
+
+export { useUpdateRoom };

hotel-management/src/hooks/useFetch.ts

@@ -1,77 +0,0 @@
-import { useEffect, useState } from 'react';
-
-// Constants
-import { BASE_URL } from '@constant/path';
-import { DEFAULT_ORDER_BY, DEFAULT_SORT_BY } from '@constant/config';
-
-// Helpers
-import { searchQuery } from '@helper/helper';
-
-// Types
-import { Nullable } from '@type/common';
-
-/**
- * The function use to fetch data on server API.
- * @param path The path of url
- * @param columnSearch Column need to search
- * @param keyWord The key word to search
- * @param tempSortBy Sort by
- * @param tempOrderBy Order by
- * @param reload Fetch again
- * @returns data: A data after fetch, isPending: A boolean indicating whether or not the progress of fetch data is done, errorMsg: A error message from the server.
- */
-const useFetch = (
-  path: string,
-  columnSearch: string = '',
-  keyWord: string = '',
-  tempSortBy?: string,
-  tempOrderBy?: string,
-  reload?: boolean
-) => {
-  const [data, setData] = useState(null);
-  const [isPending, setIsPending] = useState(false);
-  const [errorFetchMsg, setErrorFetchMsg] = useState<Nullable<string>>(null);
-
-  useEffect(() => {
-    // Clear data
-    setData(null);
-
-    const fetchData = async () => {
-      setIsPending(true);
-
-      // Set default value
-      const sortBy = tempSortBy 
-        ? tempSortBy 
-        : DEFAULT_SORT_BY;
-      const orderBy = tempOrderBy 
-        ? tempOrderBy 
-        : DEFAULT_ORDER_BY;
-
-      // Query search
-      const query = searchQuery(columnSearch, keyWord, sortBy, orderBy);
-
-      try {
-        const response = await fetch(BASE_URL + path + '?' + query);
-        const json = await response.json();
-
-        if (!response.ok) {
-          throw new Error(
-            `Error code: ${response.status} \n Messages: ${response.text}`
-          );
-        }
-
-        setIsPending(false);
-        setData(json);
-        setErrorFetchMsg(null);
-      } catch (error) {
-        setErrorFetchMsg(`Could not fetch data.\n ${error}`);
-        setIsPending(false);
-      }
-    };
-
-    fetchData();
-  }, [path, reload, columnSearch, keyWord, tempOrderBy, tempSortBy]);
-  return { data, isPending, errorFetchMsg };
-};
-
-export { useFetch };

hotel-management/src/hooks/useForwardRef.ts

@@ -1,25 +0,0 @@
-import { ForwardedRef, useEffect, useRef } from 'react';
-
-// Types
-import { Nullable } from '@type/common';
-
-const useForwardRef = <T>(
-  ref: ForwardedRef<T>,
-  initialValue: Nullable<T> = null
-) => {
-  const targetRef = useRef<T>(initialValue);
-
-  useEffect(() => {
-    if (!ref) return;
-
-    if (typeof ref === 'function') {
-      ref(targetRef.current);
-    } else {
-      ref.current = targetRef.current;
-    }
-  }, [ref]);
-
-  return targetRef;
-};
-
-export { useForwardRef };

hotel-management/src/hooks/users/useCreateUser.ts

@@ -0,0 +1,29 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import toast from 'react-hot-toast';
+
+// Services
+import { createUser as createUserFn } from '@service/userServices';
+
+// Constants
+import { ADD_SUCCESS } from '@constant/messages';
+
+/**
+ * Create user in database
+ * @returns The status of creating users and createUser function
+ */
+const useCreateUser = () => {
+  const queryClient = useQueryClient();
+
+  const { mutate: createUser, isPending: isCreating } = useMutation({
+    mutationFn: createUserFn,
+    onSuccess: () => {
+      toast.success(ADD_SUCCESS);
+      queryClient.invalidateQueries({ queryKey: ['users'] });
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  return { isCreating, createUser };
+};
+
+export { useCreateUser };

hotel-management/src/hooks/users/useUpdateUser.ts

@@ -0,0 +1,29 @@
+import toast from 'react-hot-toast';
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+
+// Services
+import { updateUser as updateUserFn } from '@service/userServices';
+
+// Messages
+import { UPDATE_SUCCESS } from '@constant/messages';
+
+/**
+ * Update user from database
+ * @returns The status of updating user and updateUser function
+ */
+const useUpdateUser = () => {
+  const queryClient = useQueryClient();
+
+  const { mutate: updateUser, isPending: isUpdating } = useMutation({
+    mutationFn: updateUserFn,
+    onSuccess: () => {
+      toast.success(UPDATE_SUCCESS);
+      queryClient.invalidateQueries({ queryKey: ['users'] });
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  return { isUpdating, updateUser };
+};
+
+export { useUpdateUser };

hotel-management/src/hooks/users/useUsers.ts

@@ -0,0 +1,34 @@
+import toast from 'react-hot-toast';
+import { useQuery } from '@tanstack/react-query';
+import { useSearchParams } from 'react-router-dom';
+
+// Services
+import { getAllUsers } from '@service/userServices';
+
+/**
+ * Fetch data of users from database
+ * @returns The status of loading users and data of users
+ */
+const useUsers = () => {
+  const [searchParams] = useSearchParams();
+  const sortByValue = searchParams.get('sortBy') || 'id';
+  const orderByValue = searchParams.get('orderBy') || 'asc';
+  const phoneSearch = searchParams.get('search') || '';
+
+  const {
+    isLoading,
+    data: users,
+    error,
+  } = useQuery({
+    queryKey: ['users', sortByValue, orderByValue, phoneSearch],
+    queryFn: () => getAllUsers(sortByValue, orderByValue, phoneSearch),
+  });
+
+  if (error) {
+    toast.error(error.message);
+  }
+
+  return { isLoading, users };
+};
+
+export { useUsers };