Refactored queries.

src/components/hooks/queries/useReports.ts

@@ -1,23 +1,23 @@
-import { useState } from 'react';
 import useApi from './useApi';
 import useFilterQuery from './useFilterQuery';
+import useCache from 'store/cache';
 
-export function useReports(websiteId?: string) {
-  const [modified, setModified] = useState(Date.now());
+export function useReports({ websiteId, teamId }: { websiteId?: string; teamId?: string }) {
+  const modified = useCache((state: any) => state?.reports);
   const { get, del, useMutation } = useApi();
-  const { mutate } = useMutation({ mutationFn: (reportId: string) => del(`/reports/${reportId}`) });
   const queryResult = useFilterQuery({
     queryKey: ['reports', { websiteId, modified }],
     queryFn: (params: any) => {
-      return get(websiteId ? `/websites/${websiteId}/reports` : `/reports`, params);
+      const url = websiteId ? `/websites/${websiteId}/reports` : `/reports`;
+
+      return get(teamId ? `/teams/${teamId}${url}` : url, params);
     },
   });
+  const { mutate } = useMutation({ mutationFn: (reportId: string) => del(`/reports/${reportId}`) });
 
-  const deleteReport = (id: any) => {
-    mutate(id, {
-      onSuccess: () => {
-        setModified(Date.now());
-      },
+  const deleteReport = (reportId: any) => {
+    mutate(reportId, {
+      onSuccess: () => {},
     });
   };
 

src/components/hooks/queries/useTeamMembers.ts

@@ -0,0 +1,16 @@
+import useApi from './useApi';
+import useFilterQuery from './useFilterQuery';
+
+export function useTeamMembers(teamId: string) {
+  const { get } = useApi();
+
+  return useFilterQuery({
+    queryKey: ['teams:users', { teamId }],
+    queryFn: (params: any) => {
+      return get(`/teams/${teamId}/users`, params);
+    },
+    enabled: !!teamId,
+  });
+}
+
+export default useTeamMembers;

src/components/hooks/useLocale.ts

@@ -10,7 +10,7 @@ const messages = {
   'en-US': enUS,
 };
 
-const selector = state => state.locale;
+const selector = (state: { locale: any }) => state.locale;
 
 export function useLocale() {
   const locale = useStore(selector);
@@ -18,7 +18,7 @@ export function useLocale() {
   const dir = getTextDirection(locale);
   const dateLocale = getDateLocale(locale);
 
-  async function loadMessages(locale) {
+  async function loadMessages(locale: string) {
     const { ok, data } = await httpGet(`${process.env.basePath}/intl/messages/${locale}.json`);
 
     if (ok) {
@@ -26,7 +26,7 @@ export function useLocale() {
     }
   }
 
-  async function saveLocale(value) {
+  async function saveLocale(value: string) {
     if (!messages[value]) {
       await loadMessages(value);
     }

src/components/hooks/useNavigation.ts

@@ -6,11 +6,14 @@ export function useNavigation(): {
   pathname: string;
   query: { [key: string]: string };
   router: any;
-  makeUrl: (params: any, reset?: boolean) => string;
+  renderUrl: (params: any, reset?: boolean) => string;
+  renderTeamUrl: (url: string) => string;
+  teamId?: string;
 } {
   const router = useRouter();
   const pathname = usePathname();
   const params = useSearchParams();
+  const [, teamId] = pathname.match(/^\/teams\/([a-f0-9-]+)/) || [];
 
   const query = useMemo(() => {
     const obj = {};
@@ -22,11 +25,15 @@ export function useNavigation(): {
     return obj;
   }, [params]);
 
-  function makeUrl(params: any, reset?: boolean) {
+  function renderUrl(params: any, reset?: boolean) {
     return reset ? pathname : buildUrl(pathname, { ...query, ...params });
   }
 
-  return { pathname, query, router, makeUrl };
+  function renderTeamUrl(url: string) {
+    return teamId ? `/teams/${teamId}${url}` : url;
+  }
+
+  return { pathname, query, router, renderUrl, renderTeamUrl, teamId };
 }
 
 export default useNavigation;