Merge pull request #2431 from Infisical/misc/terraform-project-group-prereq

misc: setup prerequisites for terraform project group
This commit is contained in:
Maidul Islam
2024-09-23 11:21:46 -04:00
committed by GitHub
24 changed files with 556 additions and 233 deletions
+25 -9
View File
@@ -38,17 +38,17 @@ export const useUpdateGroup = () => {
const queryClient = useQueryClient();
return useMutation({
mutationFn: async ({
currentSlug,
id,
name,
slug,
role
}: {
currentSlug: string;
id: string;
name?: string;
slug?: string;
role?: string;
}) => {
const { data: group } = await apiRequest.patch<TGroup>(`/api/v1/groups/${currentSlug}`, {
const { data: group } = await apiRequest.patch<TGroup>(`/api/v1/groups/${id}`, {
name,
slug,
role
@@ -65,8 +65,8 @@ export const useUpdateGroup = () => {
export const useDeleteGroup = () => {
const queryClient = useQueryClient();
return useMutation({
mutationFn: async ({ slug }: { slug: string }) => {
const { data: group } = await apiRequest.delete<TGroup>(`/api/v1/groups/${slug}`);
mutationFn: async ({ id }: { id: string }) => {
const { data: group } = await apiRequest.delete<TGroup>(`/api/v1/groups/${id}`);
return group;
},
@@ -79,8 +79,15 @@ export const useDeleteGroup = () => {
export const useAddUserToGroup = () => {
const queryClient = useQueryClient();
return useMutation({
mutationFn: async ({ slug, username }: { slug: string; username: string }) => {
const { data } = await apiRequest.post<TGroup>(`/api/v1/groups/${slug}/users/${username}`);
mutationFn: async ({
groupId,
username
}: {
groupId: string;
username: string;
slug: string;
}) => {
const { data } = await apiRequest.post<TGroup>(`/api/v1/groups/${groupId}/users/${username}`);
return data;
},
@@ -93,8 +100,17 @@ export const useAddUserToGroup = () => {
export const useRemoveUserFromGroup = () => {
const queryClient = useQueryClient();
return useMutation({
mutationFn: async ({ slug, username }: { slug: string; username: string }) => {
const { data } = await apiRequest.delete<TGroup>(`/api/v1/groups/${slug}/users/${username}`);
mutationFn: async ({
username,
groupId
}: {
slug: string;
username: string;
groupId: string;
}) => {
const { data } = await apiRequest.delete<TGroup>(
`/api/v1/groups/${groupId}/users/${username}`
);
return data;
},
+10 -6
View File
@@ -4,7 +4,8 @@ import { apiRequest } from "@app/config/request";
export const groupKeys = {
allGroupUserMemberships: () => ["group-user-memberships"] as const,
forGroupUserMemberships: (slug: string) => [...groupKeys.allGroupUserMemberships(), slug] as const,
forGroupUserMemberships: (slug: string) =>
[...groupKeys.allGroupUserMemberships(), slug] as const,
specificGroupUserMemberships: ({
slug,
offset,
@@ -28,11 +29,13 @@ type TUser = {
};
export const useListGroupUsers = ({
id,
groupSlug,
offset = 0,
limit = 10,
username
}: {
id: string;
groupSlug: string;
offset: number;
limit: number;
@@ -52,14 +55,15 @@ export const useListGroupUsers = ({
limit: String(limit),
username
});
const { data } = await apiRequest.get<{ users: TUser[]; totalCount: number; }>(
`/api/v1/groups/${groupSlug}/users`, {
const { data } = await apiRequest.get<{ users: TUser[]; totalCount: number }>(
`/api/v1/groups/${id}/users`,
{
params
}
);
return data;
},
}
});
};
+19 -18
View File
@@ -10,23 +10,24 @@ export const useAddGroupToWorkspace = () => {
const queryClient = useQueryClient();
return useMutation({
mutationFn: async ({
groupSlug,
projectSlug,
groupId,
projectId,
role
}: {
groupSlug: string;
projectSlug: string;
groupId: string;
projectId: string;
role?: string;
}) => {
const {
data: { groupMembership }
} = await apiRequest.post(`/api/v2/workspace/${projectSlug}/groups/${groupSlug}`, {
} = await apiRequest.post(`/api/v2/workspace/${projectId}/groups/${groupId}`, {
role
});
return groupMembership;
},
onSuccess: (_, { projectSlug }) => {
queryClient.invalidateQueries(workspaceKeys.getWorkspaceGroupMemberships(projectSlug));
onSuccess: (_, { projectId }) => {
queryClient.invalidateQueries(workspaceKeys.getWorkspaceGroupMemberships(projectId));
}
});
};
@@ -34,17 +35,17 @@ export const useAddGroupToWorkspace = () => {
export const useUpdateGroupWorkspaceRole = () => {
const queryClient = useQueryClient();
return useMutation({
mutationFn: async ({ groupSlug, projectSlug, roles }: TUpdateWorkspaceGroupRoleDTO) => {
mutationFn: async ({ groupId, projectId, roles }: TUpdateWorkspaceGroupRoleDTO) => {
const {
data: { groupMembership }
} = await apiRequest.patch(`/api/v2/workspace/${projectSlug}/groups/${groupSlug}`, {
} = await apiRequest.patch(`/api/v2/workspace/${projectId}/groups/${groupId}`, {
roles
});
return groupMembership;
},
onSuccess: (_, { projectSlug }) => {
queryClient.invalidateQueries(workspaceKeys.getWorkspaceGroupMemberships(projectSlug));
onSuccess: (_, { projectId }) => {
queryClient.invalidateQueries(workspaceKeys.getWorkspaceGroupMemberships(projectId));
}
});
};
@@ -53,20 +54,20 @@ export const useDeleteGroupFromWorkspace = () => {
const queryClient = useQueryClient();
return useMutation({
mutationFn: async ({
groupSlug,
projectSlug
groupId,
projectId
}: {
groupSlug: string;
projectSlug: string;
groupId: string;
projectId: string;
username?: string;
}) => {
const {
data: { groupMembership }
} = await apiRequest.delete(`/api/v2/workspace/${projectSlug}/groups/${groupSlug}`);
} = await apiRequest.delete(`/api/v2/workspace/${projectId}/groups/${groupId}`);
return groupMembership;
},
onSuccess: (_, { projectSlug, username }) => {
queryClient.invalidateQueries(workspaceKeys.getWorkspaceGroupMemberships(projectSlug));
onSuccess: (_, { projectId, username }) => {
queryClient.invalidateQueries(workspaceKeys.getWorkspaceGroupMemberships(projectId));
if (username) {
queryClient.invalidateQueries(userKeys.listUserGroupMemberships(username));
+3 -3
View File
@@ -535,14 +535,14 @@ export const useGetWorkspaceIdentityMemberships = (
});
};
export const useListWorkspaceGroups = (projectSlug: string) => {
export const useListWorkspaceGroups = (projectId: string) => {
return useQuery({
queryKey: workspaceKeys.getWorkspaceGroupMemberships(projectSlug),
queryKey: workspaceKeys.getWorkspaceGroupMemberships(projectId),
queryFn: async () => {
const {
data: { groupMemberships }
} = await apiRequest.get<{ groupMemberships: TGroupMembership[] }>(
`/api/v2/workspace/${projectSlug}/groups`
`/api/v2/workspace/${projectId}/groups`
);
return groupMemberships;
},
+2 -2
View File
@@ -127,8 +127,8 @@ export type TUpdateWorkspaceIdentityRoleDTO = {
};
export type TUpdateWorkspaceGroupRoleDTO = {
groupSlug: string;
projectSlug: string;
groupId: string;
projectId: string;
roles: (
| {
role: string;
@@ -35,10 +35,12 @@ export const OrgGroupMembersModal = ({ popUp, handlePopUpToggle }: Props) => {
const [searchMemberFilter, setSearchMemberFilter] = useState("");
const popUpData = popUp?.groupMembers?.data as {
groupId: string;
slug: string;
};
const { data, isLoading } = useListGroupUsers({
id: popUpData?.groupId,
groupSlug: popUpData?.slug,
offset: (page - 1) * perPage,
limit: perPage,
@@ -54,11 +56,13 @@ export const OrgGroupMembersModal = ({ popUp, handlePopUpToggle }: Props) => {
if (assign) {
await assignMutateAsync({
groupId: popUpData.groupId,
username,
slug: popUpData.slug
});
} else {
await unassignMutateAsync({
groupId: popUpData.groupId,
username,
slug: popUpData.slug
});
@@ -85,7 +85,7 @@ export const OrgGroupModal = ({ popUp, handlePopUpClose, handlePopUpToggle }: Pr
if (group) {
await updateMutateAsync({
currentSlug: group.slug,
id: group.groupId,
name,
slug,
role: role || undefined
@@ -34,10 +34,10 @@ export const OrgGroupsSection = () => {
}
};
const onDeleteGroupSubmit = async ({ name, slug }: { name: string; slug: string }) => {
const onDeleteGroupSubmit = async ({ name, groupId }: { name: string; groupId: string }) => {
try {
await deleteMutateAsync({
slug
id: groupId
});
createNotification({
text: `Successfully deleted the group named ${name}`,
@@ -87,7 +87,7 @@ export const OrgGroupsSection = () => {
onChange={(isOpen) => handlePopUpToggle("deleteGroup", isOpen)}
deleteKey="confirm"
onDeleteApproved={() =>
onDeleteGroupSubmit(popUp?.deleteGroup?.data as { name: string; slug: string })
onDeleteGroupSubmit(popUp?.deleteGroup?.data as { name: string; groupId: string })
}
/>
<UpgradePlanModal
@@ -1,5 +1,5 @@
import { useState } from "react";
import { faEllipsis,faMagnifyingGlass, faUsers } from "@fortawesome/free-solid-svg-icons";
import { faEllipsis, faMagnifyingGlass, faUsers } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { twMerge } from "tailwind-merge";
@@ -52,10 +52,10 @@ export const OrgGroupsTable = ({ handlePopUpOpen }: Props) => {
const { data: roles } = useGetOrgRoles(orgId);
const handleChangeRole = async ({ currentSlug, role }: { currentSlug: string; role: string }) => {
const handleChangeRole = async ({ id, role }: { id: string; role: string }) => {
try {
await updateMutateAsync({
currentSlug,
id,
role
});
@@ -112,7 +112,7 @@ export const OrgGroupsTable = ({ handlePopUpOpen }: Props) => {
dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800"
onValueChange={(selectedRole) =>
handleChangeRole({
currentSlug: slug,
id,
role: selectedRole
})
}
@@ -135,6 +135,18 @@ export const OrgGroupsTable = ({ handlePopUpOpen }: Props) => {
</div>
</DropdownMenuTrigger>
<DropdownMenuContent align="start" className="p-1">
<DropdownMenuItem
onClick={(e) => {
e.stopPropagation();
createNotification({
text: "Copied group ID to clipboard",
type: "info"
});
navigator.clipboard.writeText(id);
}}
>
Copy Group ID
</DropdownMenuItem>
<OrgPermissionCan
I={OrgPermissionActions.Edit}
a={OrgPermissionSubjects.Identity}
@@ -147,6 +159,7 @@ export const OrgGroupsTable = ({ handlePopUpOpen }: Props) => {
onClick={(e) => {
e.stopPropagation();
handlePopUpOpen("groupMembers", {
groupId: id,
slug
});
}}
@@ -195,7 +208,7 @@ export const OrgGroupsTable = ({ handlePopUpOpen }: Props) => {
onClick={(e) => {
e.stopPropagation();
handlePopUpOpen("deleteGroup", {
slug,
groupId: id,
name
});
}}
@@ -30,6 +30,7 @@ export const UserGroupsRow = ({ group, handlePopUpOpen }: Props) => {
onClick={(e) => {
e.stopPropagation();
handlePopUpOpen("removeUserFromGroup", {
groupId: group.id,
groupSlug: group.slug
});
}}
@@ -19,9 +19,10 @@ export const UserGroupsSection = ({ orgMembership }: Props) => {
const { mutateAsync: removeUserFromGroup } = useRemoveUserFromGroup();
const handleRemoveUserFromGroup = useCallback(async (groupSlug: string) => {
const handleRemoveUserFromGroup = useCallback(async (groupId: string, groupSlug: string) => {
try {
await removeUserFromGroup({
groupId,
slug: groupSlug,
username: orgMembership.user.username
});
@@ -57,10 +58,11 @@ export const UserGroupsSection = ({ orgMembership }: Props) => {
deleteKey="confirm"
onDeleteApproved={() => {
const popupData = popUp?.removeUserFromGroup?.data as {
groupId: string;
groupSlug: string;
};
return handleRemoveUserFromGroup(popupData.groupSlug);
return handleRemoveUserFromGroup(popupData.groupId, popupData.groupSlug);
}}
/>
</>
@@ -16,7 +16,7 @@ import {
import { UsePopUpState } from "@app/hooks/usePopUp";
const schema = z.object({
slug: z.string(),
id: z.string(),
role: z.string()
});
@@ -35,7 +35,7 @@ export const GroupModal = ({ popUp, handlePopUpToggle }: Props) => {
const projectSlug = currentWorkspace?.slug || "";
const { data: groups } = useGetOrganizationGroups(orgId);
const { data: groupMemberships } = useListWorkspaceGroups(currentWorkspace?.slug || "");
const { data: groupMemberships } = useListWorkspaceGroups(currentWorkspace?.id || "");
const { data: roles } = useGetProjectRoles(projectSlug);
@@ -60,11 +60,11 @@ export const GroupModal = ({ popUp, handlePopUpToggle }: Props) => {
resolver: zodResolver(schema)
});
const onFormSubmit = async ({ slug, role }: FormData) => {
const onFormSubmit = async ({ id, role }: FormData) => {
try {
await addGroupToWorkspaceMutateAsync({
projectSlug: currentWorkspace?.slug || "",
groupSlug: slug,
projectId: currentWorkspace?.id || "",
groupId: id,
role: role || undefined
});
@@ -96,7 +96,7 @@ export const GroupModal = ({ popUp, handlePopUpToggle }: Props) => {
<form onSubmit={handleSubmit(onFormSubmit)}>
<Controller
control={control}
name="slug"
name="id"
defaultValue={filteredGroupMembershipOrgs?.[0]?.id}
render={({ field: { onChange, ...field }, fieldState: { error } }) => (
<FormControl label="Group" errorText={error?.message} isError={Boolean(error)}>
@@ -107,8 +107,8 @@ export const GroupModal = ({ popUp, handlePopUpToggle }: Props) => {
className="w-full border border-mineshaft-600"
placeholder="Select group..."
>
{filteredGroupMembershipOrgs.map(({ name, slug, id }) => (
<SelectItem value={slug} key={`org-group-${id}`} >
{filteredGroupMembershipOrgs.map(({ name, id }) => (
<SelectItem value={id} key={`org-group-${id}`}>
{name}
</SelectItem>
))}
@@ -143,7 +143,7 @@ export const GroupModal = ({ popUp, handlePopUpToggle }: Props) => {
</FormControl>
)}
/>
<div className="flex items-center mt-6">
<div className="mt-6 flex items-center">
<Button
className="mr-4"
size="sm"
@@ -153,13 +153,13 @@ export const GroupModal = ({ popUp, handlePopUpToggle }: Props) => {
>
{popUp?.group?.data ? "Update" : "Create"}
</Button>
<Button
colorSchema="secondary"
variant="plain"
onClick={() => handlePopUpToggle("group", false)}
>
Cancel
</Button>
<Button
colorSchema="secondary"
variant="plain"
onClick={() => handlePopUpToggle("group", false)}
>
Cancel
</Button>
</div>
</form>
) : (
@@ -195,13 +195,13 @@ type TForm = z.infer<typeof formSchema>;
export type TMemberRolesProp = {
disableEdit?: boolean;
groupSlug: string;
groupId: string;
roles: TGroupMembership["roles"];
};
const MAX_ROLES_TO_BE_SHOWN_IN_TABLE = 2;
export const GroupRoles = ({ roles = [], disableEdit = false, groupSlug }: TMemberRolesProp) => {
export const GroupRoles = ({ roles = [], disableEdit = false, groupId }: TMemberRolesProp) => {
const { currentWorkspace } = useWorkspace();
const { popUp, handlePopUpToggle } = usePopUp(["editRole"] as const);
const [searchRoles, setSearchRoles] = useState("");
@@ -248,8 +248,8 @@ export const GroupRoles = ({ roles = [], disableEdit = false, groupSlug }: TMemb
try {
await updateGroupWorkspaceRole.mutateAsync({
projectSlug: currentWorkspace?.slug || "",
groupSlug,
projectId: currentWorkspace?.id || "",
groupId,
roles: selectedRoles
});
createNotification({ text: "Successfully updated group role", type: "success" });
@@ -39,11 +39,11 @@ export const GroupsSection = () => {
}
};
const onRemoveGroupSubmit = async (groupSlug: string) => {
const onRemoveGroupSubmit = async (groupId: string) => {
try {
await deleteMutateAsync({
groupSlug,
projectSlug: currentWorkspace?.slug || ""
groupId,
projectId: currentWorkspace?.id || ""
});
createNotification({
@@ -92,7 +92,7 @@ export const GroupsSection = () => {
onChange={(isOpen) => handlePopUpToggle("deleteGroup", isOpen)}
deleteKey="confirm"
onDeleteApproved={() =>
onRemoveGroupSubmit((popUp?.deleteGroup?.data as { slug: string })?.slug)
onRemoveGroupSubmit((popUp?.deleteGroup?.data as { id: string })?.id)
}
/>
<UpgradePlanModal
@@ -26,7 +26,7 @@ type Props = {
handlePopUpOpen: (
popUpName: keyof UsePopUpState<["deleteGroup", "group"]>,
data?: {
slug?: string;
id?: string;
name?: string;
}
) => void;
@@ -34,7 +34,7 @@ type Props = {
export const GroupTable = ({ handlePopUpOpen }: Props) => {
const { currentWorkspace } = useWorkspace();
const { data, isLoading } = useListWorkspaceGroups(currentWorkspace?.slug || "");
const { data, isLoading } = useListWorkspaceGroups(currentWorkspace?.id || "");
return (
<TableContainer>
<Table>
@@ -51,7 +51,7 @@ export const GroupTable = ({ handlePopUpOpen }: Props) => {
{!isLoading &&
data &&
data.length > 0 &&
data.map(({ group: { id, name, slug }, roles, createdAt }) => {
data.map(({ group: { id, name }, roles, createdAt }) => {
return (
<Tr className="group h-10" key={`st-v3-${id}`}>
<Td>{name}</Td>
@@ -61,7 +61,7 @@ export const GroupTable = ({ handlePopUpOpen }: Props) => {
a={ProjectPermissionSub.Groups}
>
{(isAllowed) => (
<GroupRoles roles={roles} disableEdit={!isAllowed} groupSlug={slug} />
<GroupRoles roles={roles} disableEdit={!isAllowed} groupId={id} />
)}
</ProjectPermissionCan>
</Td>
@@ -77,7 +77,7 @@ export const GroupTable = ({ handlePopUpOpen }: Props) => {
<IconButton
onClick={() => {
handlePopUpOpen("deleteGroup", {
slug,
id,
name
});
}}