implement datatable sorting on non-analytics tables. (website/board/link/pixel/team/admin)

src/components/hooks/queries/useUserTeamsQuery.ts

@@ -1,14 +1,15 @@
 import { useApi } from '../useApi';
 import { useModified } from '../useModified';
+import { usePagedQuery } from '../usePagedQuery';
 
 export function useUserTeamsQuery(userId: string) {
-  const { get, useQuery } = useApi();
+  const { get } = useApi();
   const { modified } = useModified(`teams`);
 
-  return useQuery({
+  return usePagedQuery({
     queryKey: ['teams', { userId, modified }],
-    queryFn: () => {
-      return get(`/users/${userId}/teams`);
+    queryFn: params => {
+      return get(`/users/${userId}/teams`, params);
     },
     enabled: !!userId,
   });

src/components/hooks/usePageParameters.ts

@@ -3,7 +3,7 @@ import { useNavigation } from './useNavigation';
 
 export function usePageParameters() {
   const {
-    query: { page, pageSize, search },
+    query: { page, pageSize, search, orderBy, sortDescending },
   } = useNavigation();
 
   return useMemo(() => {
@@ -11,6 +11,8 @@ export function usePageParameters() {
       page,
       pageSize,
       search,
+      orderBy,
+      sortDescending,
     };
-  }, [page, pageSize, search]);
+  }, [orderBy, page, pageSize, search, sortDescending]);
 }

src/components/hooks/usePagedQuery.ts

@@ -15,13 +15,13 @@ export function usePagedQuery<TData = any, TError = Error>({
   queryFn: (params?: object) => Promise<PageResult<TData>> | PageResult<TData>;
 }): UseQueryResult<PageResult<TData>, TError> {
   const {
-    query: { page, search },
+    query: { page, search, orderBy, sortDescending },
   } = useNavigation();
   const { useQuery } = useApi();
 
   return useQuery<PageResult<TData>, TError>({
-    queryKey: [...queryKey, page, search] as const,
-    queryFn: () => queryFn({ page, search }),
+    queryKey: [...queryKey, page, search, orderBy, sortDescending] as const,
+    queryFn: () => queryFn({ page, search, orderBy, sortDescending }),
     ...options,
   });
 }