✨(app-desk) add useTeamAccesses react-query hook

Add the hook useTeamAccesses, it queries the accesses
if a team. It is paginated.

src/frontend/apps/desk/src/features/teams/api/index.ts

@@ -1,3 +1,5 @@
+export * from './types';
 export * from './useCreateTeam';
 export * from './useTeam';
 export * from './useTeams';
+export * from './useTeamsAccesses';

src/frontend/apps/desk/src/features/teams/api/types.tsx

@@ -7,7 +7,7 @@ enum Role {
 export interface Access {
   id: string;
   role: Role;
-  user: string;
+  user: User;
 }
 
 export interface Team {
@@ -17,3 +17,9 @@ export interface Team {
   created_at: string;
   updated_at: string;
 }
+
+export interface User {
+  id: string;
+  email: string;
+  name?: string;
+}

src/frontend/apps/desk/src/features/teams/api/useTeamsAccesses.tsx

@@ -0,0 +1,41 @@
+import { UseQueryOptions, useQuery } from '@tanstack/react-query';
+
+import { APIError, APIList, errorCauses, fetchAPI } from '@/api';
+
+import { Access } from './types';
+
+export type TeamAccessesAPIParams = {
+  page: number;
+  teamId: string;
+};
+
+type AccessesResponse = APIList<Access>;
+
+export const getTeamAccesses = async ({
+  page,
+  teamId,
+}: TeamAccessesAPIParams): Promise<AccessesResponse> => {
+  const response = await fetchAPI(`teams/${teamId}/accesses/?page=${page}`);
+
+  if (!response.ok) {
+    throw new APIError(
+      'Failed to get the team accesses',
+      await errorCauses(response),
+    );
+  }
+
+  return response.json() as Promise<AccessesResponse>;
+};
+
+export const KEY_LIST_TEAM_ACCESSES = 'teams-accesses';
+
+export function useTeamAccesses(
+  params: TeamAccessesAPIParams,
+  queryConfig?: UseQueryOptions<AccessesResponse, APIError, AccessesResponse>,
+) {
+  return useQuery<AccessesResponse, APIError, AccessesResponse>({
+    queryKey: [KEY_LIST_TEAM_ACCESSES, params],
+    queryFn: () => getTeamAccesses(params),
+    ...queryConfig,
+  });
+}