feat(ui): api hooks for new org settings page

frontend/src/hooks/api/users/index.tsx

@@ -1,7 +1,10 @@
 export {
   fetchOrgUsers,
+  useAddUserToOrg,
   useAddUserToWs,
+  useDeleteOrgMembership,
   useGetOrgUsers,
   useGetUser,
-  useLogoutUser
+  useLogoutUser,
+  useUpdateOrgUserRole
 } from './queries';

frontend/src/hooks/api/users/queries.tsx

@@ -1,4 +1,4 @@
-import { useMutation, useQuery } from '@tanstack/react-query';
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 
 import {
   decryptAssymmetric,
@@ -8,7 +8,15 @@ import { apiRequest } from '@app/config/request';
 import { setAuthToken } from '@app/reactQuery';
 
 import { useUploadWsKey } from '../keys/queries';
-import { AddUserToWsDTO, AddUserToWsRes, OrgUser, User } from './types';
+import {
+  AddUserToOrgDTO,
+  AddUserToWsDTO,
+  AddUserToWsRes,
+  DeletOrgMembershipDTO,
+  OrgUser,
+  UpdateOrgUserRoleDTO,
+  User
+} from './types';
 
 const userKeys = {
   getUser: ['user'] as const,
@@ -32,7 +40,11 @@ export const fetchOrgUsers = async (orgId: string) => {
 };
 
 export const useGetOrgUsers = (orgId: string) =>
-  useQuery(userKeys.getOrgUsers(orgId), () => fetchOrgUsers(orgId));
+  useQuery({
+    queryKey: userKeys.getOrgUsers(orgId),
+    queryFn: () => fetchOrgUsers(orgId),
+    enabled: Boolean(orgId)
+  });
 
 // mutation
 export const useAddUserToWs = () => {
@@ -69,6 +81,46 @@ export const useAddUserToWs = () => {
   });
 };
 
+export const useAddUserToOrg = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation<{}, {}, AddUserToOrgDTO>({
+    mutationFn: (dto) => apiRequest.post(`/api/v1/invite-org/signup`, dto),
+    onSuccess: (_, { organizationId }) => {
+      queryClient.invalidateQueries(userKeys.getOrgUsers(organizationId));
+    }
+  });
+};
+
+export const useDeleteOrgMembership = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation<{}, {}, DeletOrgMembershipDTO>({
+    mutationFn: ({ membershipId }) => apiRequest.delete(`/api/v1/membership-org/${membershipId}`),
+    onSuccess: (_, { orgId }) => {
+      queryClient.invalidateQueries(userKeys.getOrgUsers(orgId));
+    }
+  });
+};
+
+export const useUpdateOrgUserRole = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation<{}, {}, UpdateOrgUserRoleDTO>({
+    mutationFn: ({ organizationId, membershipId, role }) =>
+      apiRequest.patch(`/api/v2/organizations/${organizationId}/memberships/${membershipId}`, {
+        role
+      }),
+    onSuccess: (_, { organizationId }) => {
+      queryClient.invalidateQueries(userKeys.getOrgUsers(organizationId));
+    },
+    // to remove old states
+    onError: (_, { organizationId }) => {
+      queryClient.invalidateQueries(userKeys.getOrgUsers(organizationId));
+    }
+  });
+};
+
 export const useLogoutUser = () =>
   useMutation({
     mutationFn: () => apiRequest.post('/api/v1/auth/logout'),

frontend/src/hooks/api/users/types.ts

@@ -32,7 +32,7 @@ export type OrgUser = {
   inviteEmail: string;
   organization: string;
   role: 'owner' | 'admin' | 'member';
-  status: 'invited' | 'accepted';
+  status: 'invited' | 'accepted' | 'verified' | 'completed';
   deniedPermissions: any[];
 };
 
@@ -45,3 +45,19 @@ export type AddUserToWsRes = {
   invitee: OrgUser['user'];
   latestKey: UserWsKeyPair;
 };
+
+export type UpdateOrgUserRoleDTO = {
+  organizationId: string;
+  membershipId: string;
+  role: string;
+};
+
+export type DeletOrgMembershipDTO = {
+  membershipId: string;
+  orgId: string;
+};
+
+export type AddUserToOrgDTO = {
+  inviteeEmail: string;
+  organizationId: string;
+};