Refactored useQuery functions.

src/app/(main)/settings/websites/WebsiteSettings.js

@@ -1,6 +1,6 @@
 'use client';
 import { useEffect, useState } from 'react';
-import { Item, Tabs, useToasts, Button, Text, Icon, Icons } from 'react-basics';
+import { Item, Tabs, useToasts, Button, Text, Icon, Icons, Loading } from 'react-basics';
 import { useRouter } from 'next/navigation';
 import Link from 'next/link';
 import PageHeader from 'components/layout/PageHeader';
@@ -16,7 +16,9 @@ export function WebsiteSettings({ websiteId, openExternal = false, analyticsUrl
   const { formatMessage, labels, messages } = useMessages();
   const { get, useQuery } = useApi();
   const { showToast } = useToasts();
-  const { data } = useQuery(['website', websiteId], () => get(`/websites/${websiteId}`), {
+  const { data, isLoading } = useQuery({
+    queryKey: ['website', websiteId],
+    queryFn: () => get(`/websites/${websiteId}`),
     enabled: !!websiteId,
     cacheTime: 0,
   });
@@ -46,6 +48,10 @@ export function WebsiteSettings({ websiteId, openExternal = false, analyticsUrl
     }
   }, [data]);
 
+  if (isLoading || !values) {
+    return <Loading />;
+  }
+
   return (
     <>
       <PageHeader title={values?.name}>

src/app/(main)/settings/websites/WebsitesDataTable.tsx

@@ -21,17 +21,17 @@ function useWebsites(userId: string, { includeTeams, onlyTeams }) {
   const { get } = useApi();
   const modified = useCache((state: any) => state?.websites);
 
-  return useFilterQuery(
-    ['websites', { includeTeams, onlyTeams, modified }],
-    (params: any) => {
+  return useFilterQuery({
+    queryKey: ['websites', { includeTeams, onlyTeams, modified }],
+    queryFn: (params: any) => {
       return get(`/users/${userId}/websites`, {
         includeTeams,
         onlyTeams,
         ...params,
       });
     },
-    { enabled: !!userId },
-  );
+    enabled: !!userId,
+  });
 }
 
 export function WebsitesDataTable({