Refactor to use @tanstack/react-query for data fetching in various components

src/queries/ResourceQueries.jsx

@@ -1,9 +1,11 @@
-import { useQuery } from 'react-query'
+import { useQuery } from '@tanstack/react-query'
 import { GetResource } from '../utils/Fetcher'
 
 export const useResource = () => {
-  const { data, isLoading, error } = useQuery('resource', GetResource, {
-    cacheTime: 1000 * 60 * 10, // 1 minute
+  const { data, isLoading, error } = useQuery({
+    queryKey: ['resource'],
+    queryFn: GetResource,
+    cacheTime: 1000 * 60 * 10, // 10 minutes
   })
   return { data, isLoading, error }
 }