@greatapps/common 1.1.50 → 1.1.52

package/src/modules/projects/hooks/list-project-users.hook.ts

@@ -0,0 +1,26 @@
+'use client';
+
+import { useInfiniteQuery } from '@tanstack/react-query';
+import { listProjectUsersAction } from '../actions/list-project-users.action';
+
+const PAGE_SIZE = 20;
+
+export const LIST_PROJECT_USERS_BASE_KEY = (projectId: number) => ['project-users', projectId, 'in'];
+export const LIST_PROJECT_USERS_QUERY_KEY = (projectId: number, search: string = '') => [
+  ...LIST_PROJECT_USERS_BASE_KEY(projectId),
+  search,
+];
+
+export function useListProjectUsers(projectId: number, search: string = '') {
+  return useInfiniteQuery({
+    queryKey: LIST_PROJECT_USERS_QUERY_KEY(projectId, search),
+    queryFn: ({ pageParam }) =>
+      listProjectUsersAction(projectId, { search: search || undefined, page: pageParam as number, limit: PAGE_SIZE }),
+    getNextPageParam: (lastPage, allPages) => {
+      const loaded = allPages.reduce((sum, p) => sum + p.data.length, 0);
+      return loaded < lastPage.total ? allPages.length + 1 : undefined;
+    },
+    initialPageParam: 1,
+    enabled: !!projectId,
+  });
+}

package/src/modules/projects/services/project-users.service.ts

@@ -2,13 +2,16 @@ import 'server-only';
 
 import { api } from '../../../infra/api/client';
 import { ApiError } from '../../../infra/api/types';
+import { buildQueryParams } from '../../../infra/utils/params';
 import { getUserContext } from '../../auth/utils/get-user-context';
 import {
   AccountUser,
   AccountUserSchema,
   AddRemoveProjectUsersParams,
+  ListUsersParams,
   ProjectUser,
   ProjectUserSchema,
+  UsersPage,
 } from '../types';
 
 interface ApiListResponse<T> {
@@ -24,9 +27,10 @@ interface ApiActionResponse {
 }
 
 class ProjectUsersService {
-  async listInProject(id_project: number): Promise<ProjectUser[]> {
+  async listInProject(projectId: number, params: ListUsersParams = {}): Promise<UsersPage<ProjectUser>> {
     const { id_account, id_user } = await getUserContext();
-    const url = `/account/${id_account}/user/${id_user}/projects/${id_project}/users`;
+    const query = buildQueryParams(params as Record<string, string | number | boolean | undefined>);
+    const url = `/account/${id_account}/user/${id_user}/projects/${projectId}/users${query ? `?${query}` : ''}`;
 
     const response = await api.apps.get<ApiListResponse<ProjectUser>>(url);
 
@@ -38,12 +42,17 @@ class ProjectUsersService {
       );
     }
 
-    return response.data.map((item) => ProjectUserSchema.parse(item));
+    return {
+      data: response.data.map((item) => ProjectUserSchema.parse(item)),
+      total: response.total,
+      page: params.page ?? 1,
+    };
   }
 
-  async listNotInProject(id_project: number): Promise<AccountUser[]> {
+  async listNotInProject(projectId: number, params: ListUsersParams = {}): Promise<UsersPage<AccountUser>> {
     const { id_account } = await getUserContext();
-    const url = `/accounts/${id_account}/users?notInProject=${id_project}`;
+    const query = buildQueryParams({ notInProject: projectId, ...params } as Record<string, string | number | boolean | undefined>);
+    const url = `/accounts/${id_account}/users${query ? `?${query}` : ''}`;
 
     const response = await api.apps.get<ApiListResponse<AccountUser>>(url);
 
@@ -55,12 +64,16 @@ class ProjectUsersService {
       );
     }
 
-    return response.data.map((item) => AccountUserSchema.parse(item));
+    return {
+      data: response.data.map((item) => AccountUserSchema.parse(item)),
+      total: response.total,
+      page: params.page ?? 1,
+    };
   }
 
-  async addToProject({ id_project, users }: AddRemoveProjectUsersParams): Promise<void> {
+  async addToProject({ projectId, users }: AddRemoveProjectUsersParams): Promise<void> {
     const { id_account, id_user } = await getUserContext();
-    const url = `/account/${id_account}/user/${id_user}/projects/${id_project}/users`;
+    const url = `/account/${id_account}/user/${id_user}/projects/${projectId}/users`;
 
     const response = await api.apps.post<ApiActionResponse>(url, { users });
 
@@ -73,9 +86,9 @@ class ProjectUsersService {
     }
   }
 
-  async removeFromProject({ id_project, users }: AddRemoveProjectUsersParams): Promise<void> {
+  async removeFromProject({ projectId, users }: AddRemoveProjectUsersParams): Promise<void> {
     const { id_account, id_user } = await getUserContext();
-    const url = `/account/${id_account}/user/${id_user}/projects/${id_project}/users`;
+    const url = `/account/${id_account}/user/${id_user}/projects/${projectId}/users`;
 
     const response = await api.apps.delete<ApiActionResponse>(url, {
       body: JSON.stringify({ users }),

package/src/modules/projects/types.ts

@@ -23,6 +23,18 @@ export const AccountUserSchema = z.object({
 export type AccountUser = z.infer<typeof AccountUserSchema>;
 
 export interface AddRemoveProjectUsersParams {
-  id_project: number;
+  projectId: number;
   users: number[];
 }
+
+export interface ListUsersParams {
+  search?: string;
+  page?: number;
+  limit?: number;
+}
+
+export interface UsersPage<T> {
+  data: T[];
+  total: number;
+  page: number;
+}

package/dist/modules/projects/hooks/project-users.hook.mjs

@@ -1,70 +0,0 @@
-"use client";
-import { useMemo } from "react";
-import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import { addProjectUserAction } from "../actions/add-project-user.action";
-import { listAvailableUsersAction } from "../actions/list-available-users.action";
-import { listProjectUsersAction } from "../actions/list-project-users.action";
-import { removeProjectUserAction } from "../actions/remove-project-user.action";
-const DEFAULT_AVATAR = "/images/Logomark.png";
-const projectUsersQueryKey = (id_project) => ["project-users", id_project];
-function useProjectUsers(id_project) {
-  const queryClient = useQueryClient();
-  const { data: inProject = [], isLoading: isLoadingIn } = useQuery({
-    queryKey: [...projectUsersQueryKey(id_project), "in"],
-    queryFn: () => listProjectUsersAction(id_project),
-    enabled: !!id_project
-  });
-  const { data: notInProject = [], isLoading: isLoadingOut } = useQuery({
-    queryKey: [...projectUsersQueryKey(id_project), "out"],
-    queryFn: () => listAvailableUsersAction(id_project),
-    enabled: !!id_project
-  });
-  const invalidate = () => {
-    queryClient.invalidateQueries({ queryKey: projectUsersQueryKey(id_project) });
-  };
-  const addMutation = useMutation({
-    mutationFn: (user_id) => addProjectUserAction({ id_project, users: [user_id] }),
-    onSuccess: invalidate
-  });
-  const removeMutation = useMutation({
-    mutationFn: (user_id) => removeProjectUserAction({ id_project, users: [user_id] }),
-    onSuccess: invalidate
-  });
-  const users = useMemo(
-    () => [
-      ...inProject.map((u) => ({
-        id: u.id_user,
-        name: u.name,
-        avatar: u.photo ?? DEFAULT_AVATAR,
-        checked: true
-      })),
-      ...notInProject.map((u) => ({
-        id: u.id,
-        name: u.name,
-        avatar: u.photo ?? DEFAULT_AVATAR,
-        checked: false
-      }))
-    ],
-    [inProject, notInProject]
-  );
-  const toggleUser = (id) => {
-    const user = users.find((u) => u.id === id);
-    if (!user) return;
-    if (user.checked) {
-      removeMutation.mutate(id);
-    } else {
-      addMutation.mutate(id);
-    }
-  };
-  return {
-    users,
-    isLoading: isLoadingIn || isLoadingOut,
-    userCount: inProject.length,
-    toggleUser
-  };
-}
-export {
-  projectUsersQueryKey,
-  useProjectUsers
-};
-//# sourceMappingURL=project-users.hook.mjs.map

package/dist/modules/projects/hooks/project-users.hook.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/modules/projects/hooks/project-users.hook.ts"],"sourcesContent":["'use client';\r\n\r\nimport { useMemo } from 'react';\r\nimport { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';\r\n\r\nimport type { UserSelectorItem } from '../../../components/layouts/UsersSelectorPopover';\r\nimport { addProjectUserAction } from '../actions/add-project-user.action';\r\nimport { listAvailableUsersAction } from '../actions/list-available-users.action';\r\nimport { listProjectUsersAction } from '../actions/list-project-users.action';\r\nimport { removeProjectUserAction } from '../actions/remove-project-user.action';\r\n\r\nconst DEFAULT_AVATAR = '/images/Logomark.png';\r\n\r\nexport const projectUsersQueryKey = (id_project: number) => ['project-users', id_project];\r\n\r\nexport function useProjectUsers(id_project: number) {\r\n  const queryClient = useQueryClient();\r\n\r\n  const { data: inProject = [], isLoading: isLoadingIn } = useQuery({\r\n    queryKey: [...projectUsersQueryKey(id_project), 'in'],\r\n    queryFn: () => listProjectUsersAction(id_project),\r\n    enabled: !!id_project,\r\n  });\r\n\r\n  const { data: notInProject = [], isLoading: isLoadingOut } = useQuery({\r\n    queryKey: [...projectUsersQueryKey(id_project), 'out'],\r\n    queryFn: () => listAvailableUsersAction(id_project),\r\n    enabled: !!id_project,\r\n  });\r\n\r\n  const invalidate = () => {\r\n    queryClient.invalidateQueries({ queryKey: projectUsersQueryKey(id_project) });\r\n  };\r\n\r\n  const addMutation = useMutation({\r\n    mutationFn: (user_id: number) =>\r\n      addProjectUserAction({ id_project, users: [user_id] }),\r\n    onSuccess: invalidate,\r\n  });\r\n\r\n  const removeMutation = useMutation({\r\n    mutationFn: (user_id: number) =>\r\n      removeProjectUserAction({ id_project, users: [user_id] }),\r\n    onSuccess: invalidate,\r\n  });\r\n\r\n  const users: UserSelectorItem[] = useMemo(\r\n    () => [\r\n      ...inProject.map((u) => ({\r\n        id: u.id_user,\r\n        name: u.name,\r\n        avatar: u.photo ?? DEFAULT_AVATAR,\r\n        checked: true,\r\n      })),\r\n      ...notInProject.map((u) => ({\r\n        id: u.id,\r\n        name: u.name,\r\n        avatar: u.photo ?? DEFAULT_AVATAR,\r\n        checked: false,\r\n      })),\r\n    ],\r\n    [inProject, notInProject]\r\n  );\r\n\r\n  const toggleUser = (id: number) => {\r\n    const user = users.find((u) => u.id === id);\r\n    if (!user) return;\r\n    if (user.checked) {\r\n      removeMutation.mutate(id);\r\n    } else {\r\n      addMutation.mutate(id);\r\n    }\r\n  };\r\n\r\n  return {\r\n    users,\r\n    isLoading: isLoadingIn || isLoadingOut,\r\n    userCount: inProject.length,\r\n    toggleUser,\r\n  };\r\n}\r\n"],"mappings":";AAEA,SAAS,eAAe;AACxB,SAAS,aAAa,UAAU,sBAAsB;AAGtD,SAAS,4BAA4B;AACrC,SAAS,gCAAgC;AACzC,SAAS,8BAA8B;AACvC,SAAS,+BAA+B;AAExC,MAAM,iBAAiB;AAEhB,MAAM,uBAAuB,CAAC,eAAuB,CAAC,iBAAiB,UAAU;AAEjF,SAAS,gBAAgB,YAAoB;AAClD,QAAM,cAAc,eAAe;AAEnC,QAAM,EAAE,MAAM,YAAY,CAAC,GAAG,WAAW,YAAY,IAAI,SAAS;AAAA,IAChE,UAAU,CAAC,GAAG,qBAAqB,UAAU,GAAG,IAAI;AAAA,IACpD,SAAS,MAAM,uBAAuB,UAAU;AAAA,IAChD,SAAS,CAAC,CAAC;AAAA,EACb,CAAC;AAED,QAAM,EAAE,MAAM,eAAe,CAAC,GAAG,WAAW,aAAa,IAAI,SAAS;AAAA,IACpE,UAAU,CAAC,GAAG,qBAAqB,UAAU,GAAG,KAAK;AAAA,IACrD,SAAS,MAAM,yBAAyB,UAAU;AAAA,IAClD,SAAS,CAAC,CAAC;AAAA,EACb,CAAC;AAED,QAAM,aAAa,MAAM;AACvB,gBAAY,kBAAkB,EAAE,UAAU,qBAAqB,UAAU,EAAE,CAAC;AAAA,EAC9E;AAEA,QAAM,cAAc,YAAY;AAAA,IAC9B,YAAY,CAAC,YACX,qBAAqB,EAAE,YAAY,OAAO,CAAC,OAAO,EAAE,CAAC;AAAA,IACvD,WAAW;AAAA,EACb,CAAC;AAED,QAAM,iBAAiB,YAAY;AAAA,IACjC,YAAY,CAAC,YACX,wBAAwB,EAAE,YAAY,OAAO,CAAC,OAAO,EAAE,CAAC;AAAA,IAC1D,WAAW;AAAA,EACb,CAAC;AAED,QAAM,QAA4B;AAAA,IAChC,MAAM;AAAA,MACJ,GAAG,UAAU,IAAI,CAAC,OAAO;AAAA,QACvB,IAAI,EAAE;AAAA,QACN,MAAM,EAAE;AAAA,QACR,QAAQ,EAAE,SAAS;AAAA,QACnB,SAAS;AAAA,MACX,EAAE;AAAA,MACF,GAAG,aAAa,IAAI,CAAC,OAAO;AAAA,QAC1B,IAAI,EAAE;AAAA,QACN,MAAM,EAAE;AAAA,QACR,QAAQ,EAAE,SAAS;AAAA,QACnB,SAAS;AAAA,MACX,EAAE;AAAA,IACJ;AAAA,IACA,CAAC,WAAW,YAAY;AAAA,EAC1B;AAEA,QAAM,aAAa,CAAC,OAAe;AACjC,UAAM,OAAO,MAAM,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE;AAC1C,QAAI,CAAC,KAAM;AACX,QAAI,KAAK,SAAS;AAChB,qBAAe,OAAO,EAAE;AAAA,IAC1B,OAAO;AACL,kBAAY,OAAO,EAAE;AAAA,IACvB;AAAA,EACF;AAEA,SAAO;AAAA,IACL;AAAA,IACA,WAAW,eAAe;AAAA,IAC1B,WAAW,UAAU;AAAA,IACrB;AAAA,EACF;AACF;","names":[]}

package/src/modules/projects/hooks/project-users.hook.ts

@@ -1,81 +0,0 @@
-'use client';
-
-import { useMemo } from 'react';
-import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
-
-import type { UserSelectorItem } from '../../../components/layouts/UsersSelectorPopover';
-import { addProjectUserAction } from '../actions/add-project-user.action';
-import { listAvailableUsersAction } from '../actions/list-available-users.action';
-import { listProjectUsersAction } from '../actions/list-project-users.action';
-import { removeProjectUserAction } from '../actions/remove-project-user.action';
-
-const DEFAULT_AVATAR = '/images/Logomark.png';
-
-export const projectUsersQueryKey = (id_project: number) => ['project-users', id_project];
-
-export function useProjectUsers(id_project: number) {
-  const queryClient = useQueryClient();
-
-  const { data: inProject = [], isLoading: isLoadingIn } = useQuery({
-    queryKey: [...projectUsersQueryKey(id_project), 'in'],
-    queryFn: () => listProjectUsersAction(id_project),
-    enabled: !!id_project,
-  });
-
-  const { data: notInProject = [], isLoading: isLoadingOut } = useQuery({
-    queryKey: [...projectUsersQueryKey(id_project), 'out'],
-    queryFn: () => listAvailableUsersAction(id_project),
-    enabled: !!id_project,
-  });
-
-  const invalidate = () => {
-    queryClient.invalidateQueries({ queryKey: projectUsersQueryKey(id_project) });
-  };
-
-  const addMutation = useMutation({
-    mutationFn: (user_id: number) =>
-      addProjectUserAction({ id_project, users: [user_id] }),
-    onSuccess: invalidate,
-  });
-
-  const removeMutation = useMutation({
-    mutationFn: (user_id: number) =>
-      removeProjectUserAction({ id_project, users: [user_id] }),
-    onSuccess: invalidate,
-  });
-
-  const users: UserSelectorItem[] = useMemo(
-    () => [
-      ...inProject.map((u) => ({
-        id: u.id_user,
-        name: u.name,
-        avatar: u.photo ?? DEFAULT_AVATAR,
-        checked: true,
-      })),
-      ...notInProject.map((u) => ({
-        id: u.id,
-        name: u.name,
-        avatar: u.photo ?? DEFAULT_AVATAR,
-        checked: false,
-      })),
-    ],
-    [inProject, notInProject]
-  );
-
-  const toggleUser = (id: number) => {
-    const user = users.find((u) => u.id === id);
-    if (!user) return;
-    if (user.checked) {
-      removeMutation.mutate(id);
-    } else {
-      addMutation.mutate(id);
-    }
-  };
-
-  return {
-    users,
-    isLoading: isLoadingIn || isLoadingOut,
-    userCount: inProject.length,
-    toggleUser,
-  };
-}