feat: added missing remove identity, user handler, changed title to duration for access type

This commit is contained in:
=
2024-10-23 13:46:42 +05:30
parent 833398ef39
commit 7ae28596ec
9 changed files with 131 additions and 15 deletions

View File

@ -39,7 +39,8 @@ export const registerProjectMembershipRouter = async (server: FastifyZodProvider
email: true,
firstName: true,
lastName: true,
id: true
id: true,
username: true
}).merge(UserEncryptionKeysSchema.pick({ publicKey: true })),
roles: z.array(
z.object({
@ -98,7 +99,8 @@ export const registerProjectMembershipRouter = async (server: FastifyZodProvider
email: true,
firstName: true,
lastName: true,
id: true
id: true,
username: true
}).merge(UserEncryptionKeysSchema.pick({ publicKey: true })),
roles: z.array(
z.object({

View File

@ -3,11 +3,16 @@ import { faChevronLeft } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { format } from "date-fns";
import { createNotification } from "@app/components/notifications";
import { ProjectPermissionCan } from "@app/components/permissions";
import { Button, EmptyState, Spinner } from "@app/components/v2";
import { Button, DeleteActionModal, EmptyState, Spinner } from "@app/components/v2";
import { ProjectPermissionActions, ProjectPermissionSub, useWorkspace } from "@app/context";
import { withProjectPermission } from "@app/hoc";
import { useGetWorkspaceIdentityMembershipDetails } from "@app/hooks/api";
import { usePopUp } from "@app/hooks";
import {
useDeleteIdentityFromWorkspace,
useGetWorkspaceIdentityMembershipDetails
} from "@app/hooks/api";
import { IdentityProjectAdditionalPrivilegeSection } from "./components/IdentityProjectAdditionalPrivilegeSection";
import { IdentityRoleDetailsSection } from "./components/IdentityRoleDetailsSection";
@ -23,6 +28,38 @@ export const IdentityDetailsPage = withProjectPermission(
const { data: identityMembershipDetails, isLoading: isMembershipDetailsLoading } =
useGetWorkspaceIdentityMembershipDetails(workspaceId, identityId);
const { mutateAsync: deleteMutateAsync, isLoading: isDeletingIdentity } =
useDeleteIdentityFromWorkspace();
const { popUp, handlePopUpOpen, handlePopUpClose, handlePopUpToggle } = usePopUp([
"deleteIdentity",
"upgradePlan"
] as const);
const onRemoveIdentitySubmit = async () => {
try {
await deleteMutateAsync({
identityId,
workspaceId
});
createNotification({
text: "Successfully removed identity from project",
type: "success"
});
handlePopUpClose("deleteIdentity");
router.push(`/project/${workspaceId}/members?selectedTab=identities`);
} catch (err) {
console.error(err);
const error = err as any;
const text = error?.response?.data?.message ?? "Failed to remove identity from project";
createNotification({
text,
type: "error"
});
}
};
if (isMembershipDetailsLoading) {
return (
<div className="flex w-full items-center justify-center p-24">
@ -67,6 +104,8 @@ export const IdentityDetailsPage = withProjectPermission(
variant="outline_bg"
size="xs"
isDisabled={!isAllowed}
isLoading={isDeletingIdentity}
onClick={() => handlePopUpOpen("deleteIdentity")}
>
Remove Identity
</Button>
@ -98,6 +137,13 @@ export const IdentityDetailsPage = withProjectPermission(
<IdentityProjectAdditionalPrivilegeSection
identityMembershipDetails={identityMembershipDetails}
/>
<DeleteActionModal
isOpen={popUp.deleteIdentity.isOpen}
title={`Are you sure want to remove ${identityMembershipDetails?.identity?.name} from the project?`}
onChange={(isOpen) => handlePopUpToggle("deleteIdentity", isOpen)}
deleteKey="remove"
onDeleteApproved={() => onRemoveIdentitySubmit()}
/>
</>
) : (
<EmptyState title="Error: Unable to find the identity." className="py-12" />

View File

@ -274,7 +274,7 @@ export const IdentityProjectAdditionalPrivilegeModifySection = ({
<Popover>
<PopoverTrigger disabled={isIdentityEditDisabled} asChild>
<div className="w-full max-w-md flex-grow">
<FormLabel label="Access Type" />
<FormLabel label="Duration" />
<Tooltip content={toolTipText}>
<Button
variant="outline_bg"

View File

@ -128,7 +128,7 @@ export const IdentityProjectAdditionalPrivilegeSection = ({ identityMembershipDe
<THead>
<Tr>
<Th>Name</Th>
<Th>Type</Th>
<Th>Duration</Th>
<Th className="w-5" />
</Tr>
</THead>

View File

@ -95,7 +95,7 @@ export const IdentityRoleDetailsSection = ({
<THead>
<Tr>
<Th>Role</Th>
<Th>Type</Th>
<Th>Duration</Th>
<Th className="w-5" />
</Tr>
</THead>

View File

@ -3,11 +3,24 @@ import { faChevronLeft } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { format } from "date-fns";
import { createNotification } from "@app/components/notifications";
import { ProjectPermissionCan } from "@app/components/permissions";
import { Button, EmptyState, Spinner } from "@app/components/v2";
import { ProjectPermissionActions, ProjectPermissionSub, useWorkspace } from "@app/context";
import {
Button,
DeleteActionModal,
EmptyState,
Spinner,
UpgradePlanModal
} from "@app/components/v2";
import {
ProjectPermissionActions,
ProjectPermissionSub,
useOrganization,
useWorkspace
} from "@app/context";
import { withProjectPermission } from "@app/hoc";
import { useGetWorkspaceUserDetails } from "@app/hooks/api";
import { usePopUp } from "@app/hooks";
import { useDeleteUserFromWorkspace, useGetWorkspaceUserDetails } from "@app/hooks/api";
import { MemberProjectAdditionalPrivilegeSection } from "./components/MemberProjectAdditionalPrivilegeSection";
import { MemberRoleDetailsSection } from "./components/MemberRoleDetailsSection";
@ -15,6 +28,7 @@ import { MemberRoleDetailsSection } from "./components/MemberRoleDetailsSection"
export const MemberDetailsPage = withProjectPermission(
() => {
const router = useRouter();
const { currentOrg } = useOrganization();
const { currentWorkspace } = useWorkspace();
const workspaceId = currentWorkspace?.id || "";
@ -23,6 +37,38 @@ export const MemberDetailsPage = withProjectPermission(
const { data: membershipDetails, isLoading: isMembershipDetailsLoading } =
useGetWorkspaceUserDetails(workspaceId, membershipId);
const { mutateAsync: removeUserFromWorkspace, isLoading: isRemovingUserFromWorkspace } =
useDeleteUserFromWorkspace();
const { handlePopUpToggle, popUp, handlePopUpOpen, handlePopUpClose } = usePopUp([
"removeMember",
"upgradePlan"
] as const);
const handleRemoveUser = async () => {
if (!currentOrg?.id || !currentWorkspace?.id || !membershipDetails?.user?.username) return;
try {
await removeUserFromWorkspace({
workspaceId: currentWorkspace.id,
usernames: [membershipDetails?.user?.username],
orgId: currentOrg.id
});
createNotification({
text: "Successfully removed user from project",
type: "success"
});
router.push(`/project/${currentWorkspace?.id}/members`);
} catch (error) {
console.error(error);
createNotification({
text: "Failed to remove user from the project",
type: "error"
});
}
handlePopUpClose("removeMember");
};
if (isMembershipDetailsLoading) {
return (
<div className="flex w-full items-center justify-center p-24">
@ -65,6 +111,8 @@ export const MemberDetailsPage = withProjectPermission(
variant="outline_bg"
size="xs"
isDisabled={!isAllowed}
isLoading={isRemovingUserFromWorkspace}
onClick={() => handlePopUpOpen("removeMember")}
>
Remove User
</Button>
@ -100,8 +148,26 @@ export const MemberDetailsPage = withProjectPermission(
<MemberRoleDetailsSection
membershipDetails={membershipDetails}
isMembershipDetailsLoading={isMembershipDetailsLoading}
onOpenUpgradeModal={() =>
handlePopUpOpen("upgradePlan", {
description:
"You can assign custom roles to members if you upgrade your Infisical plan."
})
}
/>
<MemberProjectAdditionalPrivilegeSection membershipDetails={membershipDetails} />
<DeleteActionModal
isOpen={popUp.removeMember.isOpen}
deleteKey="remove"
title="Do you want to remove this user from the project?"
onChange={(isOpen) => handlePopUpToggle("removeMember", isOpen)}
onDeleteApproved={handleRemoveUser}
/>
<UpgradePlanModal
isOpen={popUp.upgradePlan.isOpen}
onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
text={(popUp.upgradePlan?.data as { description: string })?.description}
/>
</>
) : (
<EmptyState title="Error: Unable to find the user." className="py-12" />

View File

@ -137,7 +137,7 @@ export const MemberProjectAdditionalPrivilegeSection = ({ membershipDetails }: P
<THead>
<Tr>
<Th>Name</Th>
<Th>Type</Th>
<Th>Duration</Th>
<Th className="w-5" />
</Tr>
</THead>

View File

@ -272,7 +272,7 @@ export const MembershipProjectAdditionalPrivilegeModifySection = ({
<Popover>
<PopoverTrigger disabled={isMemberEditDisabled} asChild>
<div className="w-full max-w-md flex-grow">
<FormLabel label="Access Type" />
<FormLabel label="Duration" />
<Tooltip content={toolTipText}>
<Button
variant="outline_bg"

View File

@ -39,11 +39,13 @@ import { MemberRoleModify } from "./MemberRoleModify";
type Props = {
membershipDetails: TWorkspaceUser;
isMembershipDetailsLoading?: boolean;
onOpenUpgradeModal: () => void;
};
export const MemberRoleDetailsSection = ({
membershipDetails,
isMembershipDetailsLoading
isMembershipDetailsLoading,
onOpenUpgradeModal
}: Props) => {
const { user } = useUser();
const userId = user?.id;
@ -106,7 +108,7 @@ export const MemberRoleDetailsSection = ({
<THead>
<Tr>
<Th>Role</Th>
<Th>Type</Th>
<Th>Duration</Th>
<Th className="w-5" />
</Tr>
</THead>
@ -213,7 +215,7 @@ export const MemberRoleDetailsSection = ({
title="Roles"
subTitle="Select one or more of the pre-defined or custom roles to configure project permissions."
>
<MemberRoleModify projectMember={membershipDetails} onOpenUpgradeModal={() => {}} />
<MemberRoleModify projectMember={membershipDetails} onOpenUpgradeModal={onOpenUpgradeModal} />
</ModalContent>
</Modal>
</div>