Boards components.

src/components/common/DataGrid.tsx

@@ -76,7 +76,7 @@ export function DataGrid({
         </Row>
       )}
       <LoadingPanel
-        data={data}
+        data={data?.data}
         isLoading={isLoading}
         isFetching={isFetching}
         error={error}

src/components/common/LoadingPanel.tsx

@@ -29,6 +29,8 @@ export function LoadingPanel({
 }: LoadingPanelProps): ReactNode {
   const empty = isEmpty ?? checkEmpty(data);
 
+  console.log({ empty, isEmpty, data });
+
   // Show loading spinner only if no data exists
   if (isLoading || isFetching) {
     return (

src/components/hooks/index.ts

@@ -9,6 +9,7 @@ export * from './context/useWebsite';
 
 // Query hooks
 export * from './queries/useActiveUsersQuery';
+export * from './queries/useBoardsQuery';
 export * from './queries/useDateRangeQuery';
 export * from './queries/useDeleteQuery';
 export * from './queries/useEventDataEventsQuery';

src/components/hooks/queries/useBoardsQuery.ts

@@ -0,0 +1,17 @@
+import type { ReactQueryOptions } from '@/lib/types';
+import { useApi } from '../useApi';
+import { useModified } from '../useModified';
+import { usePagedQuery } from '../usePagedQuery';
+
+export function useBoardsQuery({ teamId }: { teamId?: string }, options?: ReactQueryOptions) {
+  const { modified } = useModified('boards');
+  const { get } = useApi();
+
+  return usePagedQuery({
+    queryKey: ['boards', { teamId, modified }],
+    queryFn: pageParams => {
+      return get(teamId ? `/teams/${teamId}/boards` : '/boards', pageParams);
+    },
+    ...options,
+  });
+}