github/infisical
1
1
Fork 0
mirror of https://github.com/Infisical/infisical.git synced 2026-05-02 03:02:03 -04:00
Code Issues Packages Projects Releases Wiki Activity

feat: allow admins to delete users

Browse Source
This commit is contained in:
Sheen Capadngan
2024-07-08 15:04:08 +08:00
parent 5eba61b647
commit 6e15979672
8 changed files with 247 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
backend/src/server/routes/v1/user-router.ts
View File

@@ -4,6 +4,7 @@ import { UserEncryptionKeysSchema, UsersSchema } from "@app/db/schemas";
import { getConfig } from "@app/lib/config/env";
import { logger } from "@app/lib/logger";
import { authRateLimit, readLimit, writeLimit } from "@app/server/config/rateLimiter";
import { verifySuperAdmin } from "@app/server/plugins/auth/superAdmin";
import { verifyAuth } from "@app/server/plugins/auth/verify-auth";
import { AuthMode } from "@app/services/auth/auth-type";
@@ -91,6 +92,75 @@ export const registerUserRouter = async (server: FastifyZodProvider) => {
}
});
server.route({
method: "GET",
url: "/list",
config: {
rateLimit: readLimit
},
schema: {
response: {
200: z.object({
users: UsersSchema.pick({
username: true,
firstName: true,
lastName: true,
email: true,
id: true
}).array()
})
}
},
onRequest: (req, res, done) => {
verifyAuth([AuthMode.JWT])(req, res, () => {
verifySuperAdmin(req, res, done);
});
},
handler: async () => {
const users = await server.services.user.listUsers();
return {
users
};
}
});
server.route({
method: "DELETE",
url: "/:userId",
config: {
rateLimit: writeLimit
},
schema: {
params: z.object({
userId: z.string()
}),
response: {
200: z.object({
users: UsersSchema.pick({
username: true,
firstName: true,
lastName: true,
email: true,
id: true
})
})
}
},
onRequest: (req, res, done) => {
verifyAuth([AuthMode.JWT])(req, res, () => {
verifySuperAdmin(req, res, done);
});
},
handler: async (req) => {
const users = await server.services.user.deleteUser(req.params.userId);
return {
users
};
}
});
server.route({
method: "GET",
url: "/me/project-favorites",

2
backend/src/server/routes/v2/user-router.ts
View File

@@ -297,7 +297,7 @@ export const registerUserRouter = async (server: FastifyZodProvider) => {
},
onRequest: verifyAuth([AuthMode.JWT]),
handler: async (req) => {
const user = await server.services.user.deleteMe(req.permission.id);
const user = await server.services.user.deleteUser(req.permission.id);
return { user };
}
});

11
backend/src/services/user/user-service.ts
View File

@@ -201,7 +201,7 @@ export const userServiceFactory = ({
return user;
};
const deleteMe = async (userId: string) => {
const deleteUser = async (userId: string) => {
const user = await userDAL.deleteById(userId);
return user;
};
@@ -295,19 +295,24 @@ export const userServiceFactory = ({
return updatedOrgMembership.projectFavorites;
};
const listUsers = async () => {
return userDAL.find({});
};
return {
sendEmailVerificationCode,
verifyEmailVerificationCode,
toggleUserMfa,
updateUserName,
updateAuthMethods,
deleteMe,
deleteUser,
getMe,
createUserAction,
getUserAction,
unlockUser,
getUserPrivateKey,
getUserProjectFavorites,
updateUserProjectFavorites
updateUserProjectFavorites,
listUsers
};
};

3
frontend/src/hooks/api/users/index.tsx
View File

@@ -1,6 +1,7 @@
export {
useAddUserToWsE2EE,
useAddUserToWsNonE2EE,
useDeleteUser,
useSendEmailVerificationCode,
useVerifyEmailVerificationCode
} from "./mutation";
@@ -10,7 +11,6 @@ export {
useCreateAPIKey,
useDeleteAPIKey,
useDeleteOrgMembership,
useDeleteUser,
useGetMyAPIKeys,
useGetMyAPIKeysV2,
useGetMyIp,
@@ -19,6 +19,7 @@ export {
useGetOrgUsers,
useGetUser,
useGetUserAction,
useListUsers,
useLogoutUser,
useRegisterUserAction,
useRevokeMySessions,

14
frontend/src/hooks/api/users/mutation.tsx
View File

@@ -112,3 +112,17 @@ export const useUpdateUserProjectFavorites = () => {
}
});
};
export const useDeleteUser = () => {
const queryClient = useQueryClient();
return useMutation({
mutationFn: async (userId: string) => {
await apiRequest.delete(`/api/v1/user/${userId}`);
return {};
},
onSuccess: () => {
queryClient.invalidateQueries(userKeys.listUsers);
}
});
};

9
frontend/src/hooks/api/users/queries.tsx
View File

@@ -28,6 +28,7 @@ export const userKeys = {
myAPIKeys: ["api-keys"] as const,
myAPIKeysV2: ["api-keys-v2"] as const,
mySessions: ["sessions"] as const,
listUsers: ["user-list"] as const,
myOrganizationProjects: (orgId: string) => [{ orgId }, "organization-projects"] as const
};
@@ -40,6 +41,14 @@ export const fetchUserDetails = async () => {
export const useGetUser = () => useQuery(userKeys.getUser, fetchUserDetails);
export const fetchUsersList = async () => {
const { data } = await apiRequest.get<{ users: User[] }>("/api/v1/user/list");
return data.users;
};
export const useListUsers = () => useQuery(userKeys.listUsers, fetchUsersList);
export const useDeleteUser = () => {
const queryClient = useQueryClient();

8
frontend/src/views/admin/DashboardPage/DashboardPage.tsx
View File

@@ -26,11 +26,13 @@ import { useGetOrganizations, useUpdateServerConfig } from "@app/hooks/api";
import { AuthPanel } from "./AuthPanel";
import { RateLimitPanel } from "./RateLimitPanel";
import { UserPanel } from "./UserPanel";
enum TabSections {
Settings = "settings",
Auth = "auth",
RateLimit = "rate-limit"
RateLimit = "rate-limit",
Users = "users"
}
enum SignUpModes {
@@ -135,6 +137,7 @@ export const AdminDashboardPage = () => {
<Tab value={TabSections.Settings}>General</Tab>
<Tab value={TabSections.Auth}>Authentication</Tab>
<Tab value={TabSections.RateLimit}>Rate Limit</Tab>
<Tab value={TabSections.Users}>Users</Tab>
</div>
</TabList>
<TabPanel value={TabSections.Settings}>
@@ -320,6 +323,9 @@ export const AdminDashboardPage = () => {
<TabPanel value={TabSections.RateLimit}>
<RateLimitPanel />
</TabPanel>
<TabPanel value={TabSections.Users}>
<UserPanel />
</TabPanel>
</Tabs>
</div>
)}

136
frontend/src/views/admin/DashboardPage/UserPanel.tsx Normal file
View File

@@ -0,0 +1,136 @@
import { useMemo, useState } from "react";
import { faMagnifyingGlass, faUsers, faXmark } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { createNotification } from "@app/components/notifications";
import {
DeleteActionModal,
EmptyState,
IconButton,
Input,
Table,
TableContainer,
TableSkeleton,
TBody,
Td,
Th,
THead,
Tr
} from "@app/components/v2";
import { useUser } from "@app/context";
import { usePopUp } from "@app/hooks";
import { useDeleteUser, useListUsers } from "@app/hooks/api";
export const UserPanel = () => {
const [searchMemberFilter, setSearchMemberFilter] = useState("");
const { handlePopUpToggle, popUp, handlePopUpOpen, handlePopUpClose } = usePopUp([
"removeUser"
] as const);
const { user } = useUser();
const userId = user?.id || "";
const { data: users, isLoading } = useListUsers();
const { mutateAsync: deleteUser } = useDeleteUser();
const filterdUsers = useMemo(
() =>
users?.filter(
({ firstName, lastName, username, email }) =>
firstName?.toLowerCase().includes(searchMemberFilter.toLowerCase()) ||
lastName?.toLowerCase().includes(searchMemberFilter.toLowerCase()) ||
username?.toLowerCase().includes(searchMemberFilter.toLowerCase()) ||
email?.toLowerCase().includes(searchMemberFilter.toLowerCase())
),
[users, searchMemberFilter]
);
const handleRemoveUser = async () => {
const { id } = popUp?.removeUser?.data as { id: string; username: string };
try {
await deleteUser(id);
createNotification({
type: "success",
text: "Successfully deleted user"
});
} catch (err) {
createNotification({
type: "error",
text: "Error deleting user"
});
}
handlePopUpClose("removeUser");
};
return (
<div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
<div className="mb-4">
<p className="text-xl font-semibold text-mineshaft-100">Users</p>
</div>
<Input
value={searchMemberFilter}
onChange={(e) => setSearchMemberFilter(e.target.value)}
leftIcon={<FontAwesomeIcon icon={faMagnifyingGlass} />}
placeholder="Search members..."
/>
<div className="mt-4">
<TableContainer>
<Table>
<THead>
<Tr>
<Th>Name</Th>
<Th>Username</Th>
<Th className="w-5" />
</Tr>
</THead>
<TBody>
{isLoading && <TableSkeleton columns={4} innerKey="users" />}
{!isLoading &&
filterdUsers?.map(({ username, email, firstName, lastName, id }) => {
const name = firstName || lastName ? `${firstName} ${lastName}` : "-";
return (
<Tr key={`user-${id}`} className="w-full">
<Td>{name}</Td>
<Td>{email}</Td>
<Td>
{userId !== id && (
<div className="flex items-center space-x-2">
<IconButton
size="lg"
colorSchema="danger"
variant="plain"
ariaLabel="update"
className="ml-4"
isDisabled={userId === id}
onClick={() => handlePopUpOpen("removeUser", { username, id })}
>
<FontAwesomeIcon icon={faXmark} />
</IconButton>
</div>
)}
</Td>
</Tr>
);
})}
</TBody>
</Table>
{!isLoading && filterdUsers?.length === 0 && (
<EmptyState title="No users found" icon={faUsers} />
)}
</TableContainer>
</div>
<DeleteActionModal
isOpen={popUp.removeUser.isOpen}
deleteKey="remove"
title={`Are you sure you want to delete User with username ${
(popUp?.removeUser?.data as { id: string; username: string })?.username || ""
}?`}
onChange={(isOpen) => handlePopUpToggle("removeUser", isOpen)}
onDeleteApproved={handleRemoveUser}
/>
</div>
);
};