tr]:last:border-b-0", className)}
+ {...props}
+ />
+ );
+}
+
+function UnstableTableRow({ className, ...props }: React.ComponentProps<"tr">) {
+ return (
+ [role=checkbox]]:translate-y-[2px]",
+ className
+ )}
+ {...props}
+ />
+ );
+}
+
+function UnstableTableCell({ className, ...props }: React.ComponentProps<"td">) {
+ return (
+ [role=checkbox]]:translate-y-[2px]",
+ className
+ )}
+ {...props}
+ />
+ );
+}
+
+function UnstableTableCaption({ className, ...props }: React.ComponentProps<"caption">) {
+ return (
+ ;
};
diff --git a/frontend/src/index.css b/frontend/src/index.css
index baa613b36..c1e564d92 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -1,4 +1,5 @@
@import "tailwindcss";
+@import "tw-animate-css";
@source not "../public";
@@ -39,7 +40,7 @@
/* Colors v2 */
--color-background: #19191c;
- --color-foreground: white;
+ --color-foreground: #ebebeb;
--color-success: #2ecc71;
--color-info: #63b0bd;
--color-warning: #f1c40f;
@@ -48,6 +49,14 @@
--color-sub-org: #96ff59;
--color-project: #e0ed34;
--color-neutral: #adaeb0;
+ --color-border: #2b2c30;
+ --color-label: #adaeb0;
+ --color-muted: #707174;
+ --color-popover: #141617;
+ --color-ring: #2d2f33;
+ --color-card: #16181a;
+ --color-accent: #7d7f80;
+ --color-container: #1a1c1e;
/*legacy color schema */
--color-org-v1: #30b3ff;
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/IdentityDetailsByIDPage.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/IdentityDetailsByIDPage.tsx
index 47428f2b8..f1533dacb 100644
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/IdentityDetailsByIDPage.tsx
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/IdentityDetailsByIDPage.tsx
@@ -17,7 +17,6 @@ import {
} from "@app/context";
import { useDeleteOrgIdentity, useGetOrgIdentityMembershipById } from "@app/hooks/api";
import { usePopUp } from "@app/hooks/usePopUp";
-import { ViewIdentityAuthModal } from "@app/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityAuthModal";
import { OrgAccessControlTabSections } from "@app/types/org";
import { IdentityAuthMethodModal } from "../AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityAuthMethodModal";
@@ -125,14 +124,16 @@ const Page = () => {
identityId={identityId}
handlePopUpOpen={handlePopUpOpen}
/>
+
+
{!isAuthHidden && (
- handlePopUpToggle("viewAuthMethod", isOpen)}
- authMethod={popUp.viewAuthMethod.data?.authMethod}
- lockedOut={popUp.viewAuthMethod.data?.lockedOut || false}
- identityId={identityId}
- onResetAllLockouts={popUp.viewAuthMethod.data?.refetchIdentity}
- />
);
};
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/IdentityAuthenticationSection/IdentityAuthenticationSection.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/IdentityAuthenticationSection/IdentityAuthenticationSection.tsx
index dd6234268..aeed2af50 100644
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/IdentityAuthenticationSection/IdentityAuthenticationSection.tsx
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/IdentityAuthenticationSection/IdentityAuthenticationSection.tsx
@@ -1,16 +1,14 @@
-import { faCog, faLock, faPlus } from "@fortawesome/free-solid-svg-icons";
+import { faPlus } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { OrgPermissionCan } from "@app/components/permissions";
-import { Button, Tooltip } from "@app/components/v2";
+import { Button } from "@app/components/v2";
import { OrgPermissionIdentityActions, OrgPermissionSubjects } from "@app/context";
-import {
- IdentityAuthMethod,
- identityAuthToNameMap,
- useGetOrgIdentityMembershipById
-} from "@app/hooks/api";
+import { IdentityAuthMethod, useGetOrgIdentityMembershipById } from "@app/hooks/api";
import { UsePopUpState } from "@app/hooks/usePopUp";
+import { ViewIdentityAuth } from "../ViewIdentityAuth";
+
type Props = {
identityId: string;
handlePopUpOpen: (
@@ -23,37 +21,42 @@ export const IdentityAuthenticationSection = ({ identityId, handlePopUpOpen }: P
const { data, refetch } = useGetOrgIdentityMembershipById(identityId);
return data ? (
-
-
+
+
Authentication
+ {!Object.values(IdentityAuthMethod).every((method) =>
+ data.identity.authMethods.includes(method)
+ ) && (
+
+ {(isAllowed) => (
+ {
+ handlePopUpOpen("identityAuthMethod", {
+ identityId,
+ name: data.identity.name,
+ allAuthMethods: data.identity.authMethods
+ });
+ }}
+ variant="outline_bg"
+ leftIcon={
+ )}
+
+ )}
{data.identity.authMethods.length > 0 ? (
-
- {data.identity.authMethods.map((authMethod) => (
-
- handlePopUpOpen("viewAuthMethod", {
- authMethod,
- lockedOut: data.identity.activeLockoutAuthMethods.includes(authMethod),
- refetchIdentity: refetch
- })
- }
- type="button"
- className="flex w-full items-center justify-between bg-mineshaft-900 px-4 py-2 text-sm hover:bg-mineshaft-700 data-[state=open]:bg-mineshaft-600"
- >
- {identityAuthToNameMap[authMethod]}
-
- {data.identity.activeLockoutAuthMethods.includes(authMethod) && (
-
-
- )}
-
-
- ))}
-
+
) : (
@@ -61,30 +64,6 @@ export const IdentityAuthenticationSection = ({ identityId, handlePopUpOpen }: P
)}
- {!Object.values(IdentityAuthMethod).every((method) =>
- data.identity.authMethods.includes(method)
- ) && (
-
- {(isAllowed) => (
- {
- handlePopUpOpen("identityAuthMethod", {
- identityId,
- name: data.identity.name,
- allAuthMethods: data.identity.authMethods
- });
- }}
- variant="outline_bg"
- className="mt-3 w-full"
- size="xs"
- leftIcon={
- )}
-
- )}
) : (
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/IdentityAuthFieldDisplay.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/IdentityAuthFieldDisplay.tsx
new file mode 100644
index 000000000..5075d9643
--- /dev/null
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/IdentityAuthFieldDisplay.tsx
@@ -0,0 +1,24 @@
+import { ReactNode } from "react";
+
+import { Detail, DetailLabel, DetailValue } from "@app/components/v3";
+
+type Props = {
+ label: string;
+ children: ReactNode;
+ className?: string;
+};
+
+export const IdentityAuthFieldDisplay = ({ label, children, className }: Props) => {
+ return (
+
+ {label}
+
+ {children ? (
+ {children}
+ ) : (
+ Not set
+ )}
+
+
+ );
+};
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/IdentityAuthLockoutFields.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/IdentityAuthLockoutFields.tsx
similarity index 100%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/IdentityAuthLockoutFields.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/IdentityAuthLockoutFields.tsx
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/IdentityTokenAuthTokensTable.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/IdentityTokenAuthTokensTable.tsx
similarity index 100%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/IdentityTokenAuthTokensTable.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/IdentityTokenAuthTokensTable.tsx
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/IdentityUniversalAuthClientSecretsTable.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/IdentityUniversalAuthClientSecretsTable.tsx
similarity index 100%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/IdentityUniversalAuthClientSecretsTable.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/IdentityUniversalAuthClientSecretsTable.tsx
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityAliCloudAuthContent.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityAliCloudAuthContent.tsx
similarity index 73%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityAliCloudAuthContent.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityAliCloudAuthContent.tsx
index 5249d7f65..30837ea27 100644
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityAliCloudAuthContent.tsx
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityAliCloudAuthContent.tsx
@@ -2,7 +2,6 @@ import { faBan } from "@fortawesome/free-solid-svg-icons";
import { EmptyState, Spinner } from "@app/components/v2";
import { useGetIdentityAliCloudAuth } from "@app/hooks/api";
-import { IdentityAliCloudAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityAliCloudAuthForm";
import { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
import { ViewAuthMethodProps } from "./types";
@@ -10,10 +9,8 @@ import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
export const ViewIdentityAliCloudAuthContent = ({
identityId,
- handlePopUpToggle,
- handlePopUpOpen,
- onDelete,
- popUp
+ onEdit,
+ onDelete
}: ViewAuthMethodProps) => {
const { data, isPending } = useGetIdentityAliCloudAuth(identityId);
@@ -34,23 +31,8 @@ export const ViewIdentityAliCloudAuthContent = ({
);
}
- if (popUp.identityAuthMethod.isOpen) {
- return (
-
- );
- }
-
return (
-
handlePopUpOpen("identityAuthMethod")}
- onDelete={onDelete}
- identityId={identityId}
- >
+
{data.accessTokenTTL}
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityAuth.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityAuth.tsx
new file mode 100644
index 000000000..d6e322487
--- /dev/null
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityAuth.tsx
@@ -0,0 +1,322 @@
+import { subject } from "@casl/ability";
+import { useParams } from "@tanstack/react-router";
+import { EllipsisIcon, LockIcon } from "lucide-react";
+
+import { UpgradePlanModal } from "@app/components/license/UpgradePlanModal";
+import { createNotification } from "@app/components/notifications";
+import { VariablePermissionCan } from "@app/components/permissions";
+import { DeleteActionModal, Modal, ModalContent, Tooltip } from "@app/components/v2";
+import {
+ Badge,
+ UnstableAccordion,
+ UnstableAccordionContent,
+ UnstableAccordionItem,
+ UnstableAccordionTrigger,
+ UnstableDropdownMenu,
+ UnstableDropdownMenuContent,
+ UnstableDropdownMenuItem,
+ UnstableDropdownMenuTrigger,
+ UnstableIconButton
+} from "@app/components/v3";
+import {
+ OrgPermissionIdentityActions,
+ OrgPermissionSubjects,
+ ProjectPermissionIdentityActions,
+ ProjectPermissionSub,
+ useOrganization
+} from "@app/context";
+import { usePopUp } from "@app/hooks";
+import {
+ IdentityAuthMethod,
+ identityAuthToNameMap,
+ useDeleteIdentityAliCloudAuth,
+ useDeleteIdentityAwsAuth,
+ useDeleteIdentityAzureAuth,
+ useDeleteIdentityGcpAuth,
+ useDeleteIdentityJwtAuth,
+ useDeleteIdentityKubernetesAuth,
+ useDeleteIdentityLdapAuth,
+ useDeleteIdentityOciAuth,
+ useDeleteIdentityOidcAuth,
+ useDeleteIdentityTlsCertAuth,
+ useDeleteIdentityTokenAuth,
+ useDeleteIdentityUniversalAuth
+} from "@app/hooks/api";
+import { IdentityAliCloudAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityAliCloudAuthForm";
+import { IdentityAwsAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityAwsAuthForm";
+import { IdentityAzureAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityAzureAuthForm";
+import { IdentityGcpAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityGcpAuthForm";
+import { IdentityJwtAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityJwtAuthForm";
+import { IdentityKubernetesAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityKubernetesAuthForm";
+import { IdentityLdapAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityLdapAuthForm";
+import { IdentityOciAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityOciAuthForm";
+import { IdentityOidcAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityOidcAuthForm";
+import { IdentityTlsCertAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityTlsCertAuthForm";
+import { IdentityTokenAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityTokenAuthForm";
+import { IdentityUniversalAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityUniversalAuthForm";
+
+import { ViewIdentityAliCloudAuthContent } from "./ViewIdentityAliCloudAuthContent";
+import { ViewIdentityAwsAuthContent } from "./ViewIdentityAwsAuthContent";
+import { ViewIdentityAzureAuthContent } from "./ViewIdentityAzureAuthContent";
+import { ViewIdentityGcpAuthContent } from "./ViewIdentityGcpAuthContent";
+import { ViewIdentityJwtAuthContent } from "./ViewIdentityJwtAuthContent";
+import { ViewIdentityKubernetesAuthContent } from "./ViewIdentityKubernetesAuthContent";
+import { ViewIdentityLdapAuthContent } from "./ViewIdentityLdapAuthContent";
+import { ViewIdentityOciAuthContent } from "./ViewIdentityOciAuthContent";
+import { ViewIdentityOidcAuthContent } from "./ViewIdentityOidcAuthContent";
+import { ViewIdentityTlsCertAuthContent } from "./ViewIdentityTlsCertAuthContent";
+import { ViewIdentityTokenAuthContent } from "./ViewIdentityTokenAuthContent";
+import { ViewIdentityUniversalAuthContent } from "./ViewIdentityUniversalAuthContent";
+
+type Props = {
+ identityId: string;
+ authMethods: IdentityAuthMethod[];
+ onResetAllLockouts: () => void;
+ activeLockoutAuthMethods: IdentityAuthMethod[];
+};
+
+const AuthMethodComponentMap = {
+ [IdentityAuthMethod.UNIVERSAL_AUTH]: ViewIdentityUniversalAuthContent,
+ [IdentityAuthMethod.TOKEN_AUTH]: ViewIdentityTokenAuthContent,
+ [IdentityAuthMethod.TLS_CERT_AUTH]: ViewIdentityTlsCertAuthContent,
+ [IdentityAuthMethod.KUBERNETES_AUTH]: ViewIdentityKubernetesAuthContent,
+ [IdentityAuthMethod.LDAP_AUTH]: ViewIdentityLdapAuthContent,
+ [IdentityAuthMethod.OCI_AUTH]: ViewIdentityOciAuthContent,
+ [IdentityAuthMethod.OIDC_AUTH]: ViewIdentityOidcAuthContent,
+ [IdentityAuthMethod.GCP_AUTH]: ViewIdentityGcpAuthContent,
+ [IdentityAuthMethod.AWS_AUTH]: ViewIdentityAwsAuthContent,
+ [IdentityAuthMethod.ALICLOUD_AUTH]: ViewIdentityAliCloudAuthContent,
+ [IdentityAuthMethod.AZURE_AUTH]: ViewIdentityAzureAuthContent,
+ [IdentityAuthMethod.JWT_AUTH]: ViewIdentityJwtAuthContent
+};
+
+const EditAuthMethodMap = {
+ [IdentityAuthMethod.KUBERNETES_AUTH]: IdentityKubernetesAuthForm,
+ [IdentityAuthMethod.GCP_AUTH]: IdentityGcpAuthForm,
+ [IdentityAuthMethod.TLS_CERT_AUTH]: IdentityTlsCertAuthForm,
+ [IdentityAuthMethod.AWS_AUTH]: IdentityAwsAuthForm,
+ [IdentityAuthMethod.AZURE_AUTH]: IdentityAzureAuthForm,
+ [IdentityAuthMethod.ALICLOUD_AUTH]: IdentityAliCloudAuthForm,
+ [IdentityAuthMethod.UNIVERSAL_AUTH]: IdentityUniversalAuthForm,
+ [IdentityAuthMethod.TOKEN_AUTH]: IdentityTokenAuthForm,
+ [IdentityAuthMethod.OCI_AUTH]: IdentityOciAuthForm,
+ [IdentityAuthMethod.OIDC_AUTH]: IdentityOidcAuthForm,
+ [IdentityAuthMethod.JWT_AUTH]: IdentityJwtAuthForm,
+ [IdentityAuthMethod.LDAP_AUTH]: IdentityLdapAuthForm
+};
+
+export const Content = ({
+ identityId,
+ authMethods,
+ onResetAllLockouts,
+ activeLockoutAuthMethods
+}: Pick<
+ Props,
+ "authMethods" | "identityId" | "onResetAllLockouts" | "activeLockoutAuthMethods"
+>) => {
+ const { currentOrg } = useOrganization();
+ const orgId = currentOrg?.id || "";
+ const { projectId } = useParams({
+ strict: false
+ });
+ const { popUp, handlePopUpOpen, handlePopUpToggle } = usePopUp([
+ "revokeAuthMethod",
+ "identityAuthMethod",
+ "upgradePlan"
+ ] as const);
+
+ const { mutateAsync: revokeUniversalAuth } = useDeleteIdentityUniversalAuth();
+ const { mutateAsync: revokeTokenAuth } = useDeleteIdentityTokenAuth();
+ const { mutateAsync: revokeKubernetesAuth } = useDeleteIdentityKubernetesAuth();
+ const { mutateAsync: revokeGcpAuth } = useDeleteIdentityGcpAuth();
+ const { mutateAsync: revokeTlsCertAuth } = useDeleteIdentityTlsCertAuth();
+ const { mutateAsync: revokeAwsAuth } = useDeleteIdentityAwsAuth();
+ const { mutateAsync: revokeAzureAuth } = useDeleteIdentityAzureAuth();
+ const { mutateAsync: revokeAliCloudAuth } = useDeleteIdentityAliCloudAuth();
+ const { mutateAsync: revokeOciAuth } = useDeleteIdentityOciAuth();
+ const { mutateAsync: revokeOidcAuth } = useDeleteIdentityOidcAuth();
+ const { mutateAsync: revokeJwtAuth } = useDeleteIdentityJwtAuth();
+ const { mutateAsync: revokeLdapAuth } = useDeleteIdentityLdapAuth();
+
+ const RemoveAuthMethodMap = {
+ [IdentityAuthMethod.KUBERNETES_AUTH]: revokeKubernetesAuth,
+ [IdentityAuthMethod.GCP_AUTH]: revokeGcpAuth,
+ [IdentityAuthMethod.TLS_CERT_AUTH]: revokeTlsCertAuth,
+ [IdentityAuthMethod.AWS_AUTH]: revokeAwsAuth,
+ [IdentityAuthMethod.AZURE_AUTH]: revokeAzureAuth,
+ [IdentityAuthMethod.ALICLOUD_AUTH]: revokeAliCloudAuth,
+ [IdentityAuthMethod.UNIVERSAL_AUTH]: revokeUniversalAuth,
+ [IdentityAuthMethod.TOKEN_AUTH]: revokeTokenAuth,
+ [IdentityAuthMethod.OCI_AUTH]: revokeOciAuth,
+ [IdentityAuthMethod.OIDC_AUTH]: revokeOidcAuth,
+ [IdentityAuthMethod.JWT_AUTH]: revokeJwtAuth,
+ [IdentityAuthMethod.LDAP_AUTH]: revokeLdapAuth
+ };
+
+ const handleDeleteAuthMethod = async (authMethod: IdentityAuthMethod) => {
+ await RemoveAuthMethodMap[authMethod]({
+ identityId,
+ ...(projectId
+ ? { projectId }
+ : {
+ organizationId: orgId
+ })
+ });
+
+ createNotification({
+ text: "Successfully removed auth method",
+ type: "success"
+ });
+ handlePopUpToggle("revokeAuthMethod", false);
+ };
+
+ const EditForm = popUp.identityAuthMethod?.data
+ ? EditAuthMethodMap[popUp.identityAuthMethod.data as IdentityAuthMethod]
+ : null;
+
+ return (
+ <>
+
+ {authMethods.map((authMethod) => {
+ const Component = AuthMethodComponentMap[authMethod];
+
+ return (
+
+
+ {identityAuthToNameMap[authMethod]}
+ {activeLockoutAuthMethods?.includes(authMethod) && (
+
+
+
+
+ )}
+
+
+
+
+
+
+
+ {(isAllowed) => (
+ {
+ e.stopPropagation();
+ handlePopUpOpen("identityAuthMethod", authMethod);
+ }}
+ >
+ Edit Auth Method
+
+ )}
+
+
+ {(isAllowed) => (
+ {
+ e.stopPropagation();
+ handlePopUpOpen("revokeAuthMethod", authMethod);
+ }}
+ variant="danger"
+ >
+ Remove Auth Method
+
+ )}
+
+
+
+
+
+ handlePopUpOpen("identityAuthMethod", authMethod)}
+ onDelete={() => handlePopUpOpen("revokeAuthMethod", authMethod)}
+ onResetAllLockouts={onResetAllLockouts}
+ lockedOut={activeLockoutAuthMethods?.includes(authMethod)}
+ />
+
+
+ );
+ })}
+
+ handlePopUpToggle("revokeAuthMethod", isOpen)}
+ deleteKey="confirm"
+ buttonText="Remove"
+ onDeleteApproved={() =>
+ handleDeleteAuthMethod(popUp?.revokeAuthMethod?.data as IdentityAuthMethod)
+ }
+ />
+ handlePopUpToggle("identityAuthMethod", isOpen)}
+ >
+
+ {EditForm && (
+
+
+ handlePopUpToggle("upgradePlan", isOpen)}
+ text={`Your current plan does not include access to ${popUp.upgradePlan.data?.featureName}. To unlock this feature, please upgrade to Infisical ${popUp.upgradePlan.data?.isEnterpriseFeature ? "Enterprise" : "Pro"} plan.`}
+ />
+
+ );
+};
+
+export const ViewIdentityAuth = ({
+ authMethods,
+ identityId,
+ onResetAllLockouts,
+ activeLockoutAuthMethods
+}: Props) => {
+ return (
+ onResetAllLockouts()}
+ />
+ );
+};
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityAwsAuthContent.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityAwsAuthContent.tsx
similarity index 77%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityAwsAuthContent.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityAwsAuthContent.tsx
index dde9f1d2a..c16a8c3a1 100644
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityAwsAuthContent.tsx
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityAwsAuthContent.tsx
@@ -2,7 +2,6 @@ import { faBan } from "@fortawesome/free-solid-svg-icons";
import { EmptyState, Spinner } from "@app/components/v2";
import { useGetIdentityAwsAuth } from "@app/hooks/api";
-import { IdentityAwsAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityAwsAuthForm";
import { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
import { ViewAuthMethodProps } from "./types";
@@ -10,10 +9,8 @@ import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
export const ViewIdentityAwsAuthContent = ({
identityId,
- handlePopUpToggle,
- handlePopUpOpen,
- onDelete,
- popUp
+ onEdit,
+ onDelete
}: ViewAuthMethodProps) => {
const { data, isPending } = useGetIdentityAwsAuth(identityId);
@@ -31,23 +28,8 @@ export const ViewIdentityAwsAuthContent = ({
);
}
- if (popUp.identityAuthMethod.isOpen) {
- return (
- handlePopUpOpen("identityAuthMethod")}
- onDelete={onDelete}
- identityId={identityId}
- >
+
{data.accessTokenTTL}
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityAzureAuthContent.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityAzureAuthContent.tsx
similarity index 76%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityAzureAuthContent.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityAzureAuthContent.tsx
index 82e4c69e0..5f25f1a50 100644
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityAzureAuthContent.tsx
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityAzureAuthContent.tsx
@@ -2,7 +2,6 @@ import { faBan } from "@fortawesome/free-solid-svg-icons";
import { EmptyState, Spinner } from "@app/components/v2";
import { useGetIdentityAzureAuth } from "@app/hooks/api";
-import { IdentityAzureAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityAzureAuthForm";
import { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
import { ViewAuthMethodProps } from "./types";
@@ -10,10 +9,8 @@ import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
export const ViewIdentityAzureAuthContent = ({
identityId,
- handlePopUpToggle,
- handlePopUpOpen,
- onDelete,
- popUp
+ onEdit,
+ onDelete
}: ViewAuthMethodProps) => {
const { data, isPending } = useGetIdentityAzureAuth(identityId);
@@ -31,23 +28,8 @@ export const ViewIdentityAzureAuthContent = ({
);
}
- if (popUp.identityAuthMethod.isOpen) {
- return (
- handlePopUpOpen("identityAuthMethod")}
- onDelete={onDelete}
- identityId={identityId}
- >
+
{data.accessTokenTTL}
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityContentWrapper.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityContentWrapper.tsx
similarity index 100%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityContentWrapper.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityContentWrapper.tsx
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityGcpAuthContent.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityGcpAuthContent.tsx
similarity index 80%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityGcpAuthContent.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityGcpAuthContent.tsx
index 296b4d764..5f24ec54c 100644
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityGcpAuthContent.tsx
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityGcpAuthContent.tsx
@@ -2,7 +2,6 @@ import { faBan } from "@fortawesome/free-solid-svg-icons";
import { EmptyState, Spinner } from "@app/components/v2";
import { useGetIdentityGcpAuth } from "@app/hooks/api";
-import { IdentityGcpAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityGcpAuthForm";
import { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
import { ViewAuthMethodProps } from "./types";
@@ -10,10 +9,8 @@ import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
export const ViewIdentityGcpAuthContent = ({
identityId,
- handlePopUpToggle,
- handlePopUpOpen,
- onDelete,
- popUp
+ onEdit,
+ onDelete
}: ViewAuthMethodProps) => {
const { data, isPending } = useGetIdentityGcpAuth(identityId);
@@ -31,23 +28,8 @@ export const ViewIdentityGcpAuthContent = ({
);
}
- if (popUp.identityAuthMethod.isOpen) {
- return (
- handlePopUpOpen("identityAuthMethod")}
- onDelete={onDelete}
- identityId={identityId}
- >
+
{data.accessTokenTTL}
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityJwtAuthContent.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityJwtAuthContent.tsx
similarity index 86%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityJwtAuthContent.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityJwtAuthContent.tsx
index 7fb81d2e1..a372491eb 100644
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityJwtAuthContent.tsx
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityJwtAuthContent.tsx
@@ -5,18 +5,15 @@ import { EmptyState, Spinner, Tooltip } from "@app/components/v2";
import { Badge } from "@app/components/v3";
import { useGetIdentityJwtAuth } from "@app/hooks/api";
import { IdentityJwtConfigurationType } from "@app/hooks/api/identities/enums";
-import { IdentityJwtAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityJwtAuthForm";
-import { ViewIdentityContentWrapper } from "@app/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityContentWrapper";
+import { ViewIdentityContentWrapper } from "@app/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityContentWrapper";
import { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
import { ViewAuthMethodProps } from "./types";
export const ViewIdentityJwtAuthContent = ({
identityId,
- handlePopUpToggle,
- handlePopUpOpen,
- onDelete,
- popUp
+ onEdit,
+ onDelete
}: ViewAuthMethodProps) => {
const { data, isPending } = useGetIdentityJwtAuth(identityId);
@@ -34,23 +31,8 @@ export const ViewIdentityJwtAuthContent = ({
);
}
- if (popUp.identityAuthMethod.isOpen) {
- return (
- handlePopUpOpen("identityAuthMethod")}
- onDelete={onDelete}
- identityId={identityId}
- >
+
{data.accessTokenTTL}
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityKubernetesAuthContent.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityKubernetesAuthContent.tsx
similarity index 86%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityKubernetesAuthContent.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityKubernetesAuthContent.tsx
index 02b0e0c88..e6992ca2e 100644
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityKubernetesAuthContent.tsx
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityKubernetesAuthContent.tsx
@@ -6,7 +6,6 @@ import { EyeIcon } from "lucide-react";
import { EmptyState, Spinner, Tooltip } from "@app/components/v2";
import { Badge } from "@app/components/v3";
import { gatewaysQueryKeys, useGetIdentityKubernetesAuth } from "@app/hooks/api";
-import { IdentityKubernetesAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityKubernetesAuthForm";
import { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
import { ViewAuthMethodProps } from "./types";
@@ -14,10 +13,8 @@ import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
export const ViewIdentityKubernetesAuthContent = ({
identityId,
- handlePopUpToggle,
- handlePopUpOpen,
- onDelete,
- popUp
+ onEdit,
+ onDelete
}: ViewAuthMethodProps) => {
const { data: gateways } = useQuery(gatewaysQueryKeys.list());
@@ -44,23 +41,8 @@ export const ViewIdentityKubernetesAuthContent = ({
);
}
- if (popUp.identityAuthMethod.isOpen) {
- return (
- handlePopUpOpen("identityAuthMethod")}
- onDelete={onDelete}
- identityId={identityId}
- >
+
{data.accessTokenTTL}
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityLdapAuthContent.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityLdapAuthContent.tsx
similarity index 83%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityLdapAuthContent.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityLdapAuthContent.tsx
index b6db96c41..c835fd97c 100644
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityLdapAuthContent.tsx
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityLdapAuthContent.tsx
@@ -4,8 +4,7 @@ import { EyeIcon } from "lucide-react";
import { EmptyState, Spinner, Tooltip } from "@app/components/v2";
import { Badge } from "@app/components/v3";
import { useClearIdentityLdapAuthLockouts, useGetIdentityLdapAuth } from "@app/hooks/api";
-import { IdentityLdapAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityLdapAuthForm";
-import { ViewIdentityContentWrapper } from "@app/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityContentWrapper";
+import { ViewIdentityContentWrapper } from "@app/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityContentWrapper";
import { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
import { LockoutFields } from "./IdentityAuthLockoutFields";
@@ -13,10 +12,8 @@ import { ViewAuthMethodProps } from "./types";
export const ViewIdentityLdapAuthContent = ({
identityId,
- handlePopUpToggle,
- handlePopUpOpen,
onDelete,
- popUp,
+ onEdit,
lockedOut,
onResetAllLockouts
}: ViewAuthMethodProps) => {
@@ -37,23 +34,8 @@ export const ViewIdentityLdapAuthContent = ({
);
}
- if (popUp.identityAuthMethod.isOpen) {
- return (
- handlePopUpOpen("identityAuthMethod")}
- onDelete={onDelete}
- identityId={identityId}
- >
+
{data.accessTokenTTL}
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityOciAuthContent.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityOciAuthContent.tsx
similarity index 75%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityOciAuthContent.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityOciAuthContent.tsx
index c577c01e0..7b7e58258 100644
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityOciAuthContent.tsx
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityOciAuthContent.tsx
@@ -2,7 +2,6 @@ import { faBan } from "@fortawesome/free-solid-svg-icons";
import { EmptyState, Spinner } from "@app/components/v2";
import { useGetIdentityOciAuth } from "@app/hooks/api";
-import { IdentityOciAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityOciAuthForm";
import { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
import { ViewAuthMethodProps } from "./types";
@@ -10,10 +9,8 @@ import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
export const ViewIdentityOciAuthContent = ({
identityId,
- handlePopUpToggle,
- handlePopUpOpen,
- onDelete,
- popUp
+ onEdit,
+ onDelete
}: ViewAuthMethodProps) => {
const { data, isPending } = useGetIdentityOciAuth(identityId);
@@ -31,23 +28,8 @@ export const ViewIdentityOciAuthContent = ({
);
}
- if (popUp.identityAuthMethod.isOpen) {
- return (
- handlePopUpOpen("identityAuthMethod")}
- onDelete={onDelete}
- identityId={identityId}
- >
+
{data.accessTokenTTL}
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityOidcAuthContent.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityOidcAuthContent.tsx
similarity index 84%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityOidcAuthContent.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityOidcAuthContent.tsx
index dc7e5b985..27b487a3f 100644
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityOidcAuthContent.tsx
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityOidcAuthContent.tsx
@@ -4,18 +4,15 @@ import { EyeIcon } from "lucide-react";
import { EmptyState, Spinner, Tooltip } from "@app/components/v2";
import { Badge } from "@app/components/v3";
import { useGetIdentityOidcAuth } from "@app/hooks/api";
-import { IdentityOidcAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityOidcAuthForm";
-import { ViewIdentityContentWrapper } from "@app/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityContentWrapper";
+import { ViewIdentityContentWrapper } from "@app/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityContentWrapper";
import { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
import { ViewAuthMethodProps } from "./types";
export const ViewIdentityOidcAuthContent = ({
identityId,
- handlePopUpToggle,
- handlePopUpOpen,
- onDelete,
- popUp
+ onEdit,
+ onDelete
}: ViewAuthMethodProps) => {
const { data, isPending } = useGetIdentityOidcAuth(identityId);
@@ -33,23 +30,8 @@ export const ViewIdentityOidcAuthContent = ({
);
}
- if (popUp.identityAuthMethod.isOpen) {
- return (
- handlePopUpOpen("identityAuthMethod")}
- onDelete={onDelete}
- identityId={identityId}
- >
+
{data.accessTokenTTL}
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityTlsCertAuthContent.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityTlsCertAuthContent.tsx
similarity index 78%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityTlsCertAuthContent.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityTlsCertAuthContent.tsx
index 03c4989a6..6ffefbeb6 100644
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityTlsCertAuthContent.tsx
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityTlsCertAuthContent.tsx
@@ -4,7 +4,6 @@ import { EyeIcon } from "lucide-react";
import { EmptyState, Spinner, Tooltip } from "@app/components/v2";
import { Badge } from "@app/components/v3";
import { useGetIdentityTlsCertAuth } from "@app/hooks/api";
-import { IdentityTlsCertAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityTlsCertAuthForm";
import { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
import { ViewAuthMethodProps } from "./types";
@@ -12,10 +11,8 @@ import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
export const ViewIdentityTlsCertAuthContent = ({
identityId,
- handlePopUpToggle,
- handlePopUpOpen,
- onDelete,
- popUp
+ onEdit,
+ onDelete
}: ViewAuthMethodProps) => {
const { data, isPending } = useGetIdentityTlsCertAuth(identityId);
@@ -36,23 +33,8 @@ export const ViewIdentityTlsCertAuthContent = ({
);
}
- if (popUp.identityAuthMethod.isOpen) {
- return (
- handlePopUpOpen("identityAuthMethod")}
- onDelete={onDelete}
- identityId={identityId}
- >
+
{data.accessTokenTTL}
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityTokenAuthContent.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityTokenAuthContent.tsx
similarity index 75%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityTokenAuthContent.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityTokenAuthContent.tsx
index d42f9d2ca..b86a4d9ad 100644
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityTokenAuthContent.tsx
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityTokenAuthContent.tsx
@@ -2,7 +2,6 @@ import { faBan } from "@fortawesome/free-solid-svg-icons";
import { EmptyState, Spinner } from "@app/components/v2";
import { useGetIdentityTokenAuth, useGetIdentityTokensTokenAuth } from "@app/hooks/api";
-import { IdentityTokenAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityTokenAuthForm";
import { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
import { IdentityTokenAuthTokensTable } from "./IdentityTokenAuthTokensTable";
@@ -11,10 +10,8 @@ import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
export const ViewIdentityTokenAuthContent = ({
identityId,
- handlePopUpToggle,
- handlePopUpOpen,
onDelete,
- popUp
+ onEdit
}: ViewAuthMethodProps) => {
const { data, isPending } = useGetIdentityTokenAuth(identityId);
const { data: tokens = [], isPending: clientSecretsPending } =
@@ -34,23 +31,8 @@ export const ViewIdentityTokenAuthContent = ({
);
}
- if (popUp.identityAuthMethod.isOpen) {
- return (
- handlePopUpOpen("identityAuthMethod")}
- onDelete={onDelete}
- identityId={identityId}
- >
+
{data.accessTokenTTL}
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityUniversalAuthContent.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityUniversalAuthContent.tsx
similarity index 86%
rename from frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityUniversalAuthContent.tsx
rename to frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityUniversalAuthContent.tsx
index e9840a28c..86a2e4fb9 100644
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityUniversalAuthContent.tsx
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/ViewIdentityUniversalAuthContent.tsx
@@ -8,7 +8,6 @@ import {
useGetIdentityUniversalAuth,
useGetIdentityUniversalAuthClientSecrets
} from "@app/hooks/api";
-import { IdentityUniversalAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityUniversalAuthForm";
import { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
import { LockoutFields } from "./IdentityAuthLockoutFields";
@@ -18,10 +17,8 @@ import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
export const ViewIdentityUniversalAuthContent = ({
identityId,
- handlePopUpToggle,
- handlePopUpOpen,
onDelete,
- popUp,
+ onEdit,
lockedOut,
onResetAllLockouts
}: ViewAuthMethodProps) => {
@@ -51,23 +48,8 @@ export const ViewIdentityUniversalAuthContent = ({
);
}
- if (popUp.identityAuthMethod.isOpen) {
- return (
- handlePopUpOpen("identityAuthMethod")}
- onDelete={onDelete}
- identityId={identityId}
- >
+
{Number(data.accessTokenPeriod) > 0 ? (
{data.accessTokenPeriod}
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/index.ts b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/index.ts
new file mode 100644
index 000000000..951c84087
--- /dev/null
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/index.ts
@@ -0,0 +1 @@
+export * from "./ViewIdentityAuth";
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/types/index.ts b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/types/index.ts
new file mode 100644
index 000000000..e4b015410
--- /dev/null
+++ b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuth/types/index.ts
@@ -0,0 +1,7 @@
+export type ViewAuthMethodProps = {
+ identityId: string;
+ onDelete: () => void;
+ onEdit: () => void;
+ lockedOut: boolean;
+ onResetAllLockouts: () => void;
+};
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/IdentityAuthFieldDisplay.tsx b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/IdentityAuthFieldDisplay.tsx
deleted file mode 100644
index eb81bbcef..000000000
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/IdentityAuthFieldDisplay.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import { ReactNode } from "react";
-
-type Props = {
- label: string;
- children: ReactNode;
- className?: string;
-};
-
-export const IdentityAuthFieldDisplay = ({ label, children, className }: Props) => {
- return (
-
-
{label}
- {children ? (
-
{children}
- ) : (
-
Not set
- )}
-
;
-
- const handleDelete = () => handlePopUpOpen("revokeAuthMethod");
-
- switch (authMethod) {
- case IdentityAuthMethod.UNIVERSAL_AUTH:
- revokeMethod = revokeUniversalAuth;
- Component = ViewIdentityUniversalAuthContent;
- break;
- case IdentityAuthMethod.TOKEN_AUTH:
- revokeMethod = revokeTokenAuth;
- Component = ViewIdentityTokenAuthContent;
- break;
- case IdentityAuthMethod.KUBERNETES_AUTH:
- revokeMethod = revokeKubernetesAuth;
- Component = ViewIdentityKubernetesAuthContent;
- break;
- case IdentityAuthMethod.GCP_AUTH:
- revokeMethod = revokeGcpAuth;
- Component = ViewIdentityGcpAuthContent;
- break;
- case IdentityAuthMethod.TLS_CERT_AUTH:
- revokeMethod = revokeTlsCertAuth;
- Component = ViewIdentityTlsCertAuthContent;
- break;
- case IdentityAuthMethod.AWS_AUTH:
- revokeMethod = revokeAwsAuth;
- Component = ViewIdentityAwsAuthContent;
- break;
- case IdentityAuthMethod.AZURE_AUTH:
- revokeMethod = revokeAzureAuth;
- Component = ViewIdentityAzureAuthContent;
- break;
- case IdentityAuthMethod.OCI_AUTH:
- revokeMethod = revokeOciAuth;
- Component = ViewIdentityOciAuthContent;
- break;
- case IdentityAuthMethod.ALICLOUD_AUTH:
- revokeMethod = revokeAliCloudAuth;
- Component = ViewIdentityAliCloudAuthContent;
- break;
- case IdentityAuthMethod.OIDC_AUTH:
- revokeMethod = revokeOidcAuth;
- Component = ViewIdentityOidcAuthContent;
- break;
- case IdentityAuthMethod.JWT_AUTH:
- revokeMethod = revokeJwtAuth;
- Component = ViewIdentityJwtAuthContent;
- break;
- case IdentityAuthMethod.LDAP_AUTH:
- revokeMethod = revokeLdapAuth;
- Component = ViewIdentityLdapAuthContent;
- break;
- default:
- throw new Error(`Unhandled Auth Method: ${authMethod}`);
- }
-
- const handleDeleteAuthMethod = async () => {
- await revokeMethod({
- identityId,
- ...(projectId
- ? { projectId }
- : {
- organizationId: orgId
- })
- });
-
- createNotification({
- text: "Successfully removed auth method",
- type: "success"
- });
- handlePopUpToggle("revokeAuthMethod", false);
- onDeleteAuthMethod();
- };
-
- return (
- <>
- handlePopUpToggle("revokeAuthMethod", isOpen)}
- deleteKey="confirm"
- buttonText="Remove"
- onDeleteApproved={handleDeleteAuthMethod}
- />
- handlePopUpToggle("upgradePlan", isOpen)}
- text={`Your current plan does not include access to ${popUp.upgradePlan.data?.featureName}. To unlock this feature, please upgrade to Infisical ${popUp.upgradePlan.data?.isEnterpriseFeature ? "Enterprise" : "Pro"} plan.`}
- />
-
- );
-};
-
-export const ViewIdentityAuthModal = ({
- isOpen,
- onOpenChange,
- authMethod,
- identityId,
- lockedOut,
- onResetAllLockouts
-}: Omit) => {
- if (!identityId || !authMethod) return null;
-
- return (
-
-
- onOpenChange(false)}
- onResetAllLockouts={() => onResetAllLockouts()}
- />
-
-
- );
-};
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/index.ts b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/index.ts
deleted file mode 100644
index 2da1344a8..000000000
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from "./ViewIdentityAuthModal";
diff --git a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/types/index.ts b/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/types/index.ts
deleted file mode 100644
index da31a233c..000000000
--- a/frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/types/index.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { UsePopUpState } from "@app/hooks/usePopUp";
-
-export type ViewAuthMethodProps = {
- identityId: string;
- onDelete: () => void;
- handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan", "identityAuthMethod"]>) => void;
- handlePopUpToggle: (
- popUpName: keyof UsePopUpState<["identityAuthMethod"]>,
- state?: boolean
- ) => void;
- popUp: UsePopUpState<["revokeAuthMethod", "upgradePlan", "identityAuthMethod"]>;
- lockedOut: boolean;
- onResetAllLockouts: () => void;
-};
diff --git a/frontend/src/pages/project/IdentityDetailsByIDPage/IdentityDetailsByIDPage.tsx b/frontend/src/pages/project/IdentityDetailsByIDPage/IdentityDetailsByIDPage.tsx
index 89b882d98..486bcdae1 100644
--- a/frontend/src/pages/project/IdentityDetailsByIDPage/IdentityDetailsByIDPage.tsx
+++ b/frontend/src/pages/project/IdentityDetailsByIDPage/IdentityDetailsByIDPage.tsx
@@ -1,24 +1,36 @@
import { Helmet } from "react-helmet";
import { useTranslation } from "react-i18next";
import { subject } from "@casl/ability";
-import { faChevronLeft } from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { DropdownMenu } from "@radix-ui/react-dropdown-menu";
import { useQuery } from "@tanstack/react-query";
import { Link, useNavigate, useParams } from "@tanstack/react-router";
-import { formatRelative } from "date-fns";
+import { ChevronLeftIcon, EllipsisIcon, InfoIcon } from "lucide-react";
import { createNotification } from "@app/components/notifications";
import { OrgPermissionCan, ProjectPermissionCan } from "@app/components/permissions";
import {
- Alert,
- AlertDescription,
- Button,
ConfirmActionModal,
DeleteActionModal,
EmptyState,
PageHeader,
- Spinner
+ Tooltip
} from "@app/components/v2";
+import {
+ OrgIcon,
+ UnstableAlert,
+ UnstableAlertDescription,
+ UnstableAlertTitle,
+ UnstableButton,
+ UnstableCard,
+ UnstableCardContent,
+ UnstableCardDescription,
+ UnstableCardHeader,
+ UnstableCardTitle,
+ UnstableDropdownMenuContent,
+ UnstableDropdownMenuItem,
+ UnstableDropdownMenuTrigger,
+ UnstablePageLoader
+} from "@app/components/v3";
import {
OrgPermissionIdentityActions,
OrgPermissionSubjects,
@@ -36,7 +48,7 @@ import {
useGetProjectIdentityMembershipV2
} from "@app/hooks/api";
import { ActorType } from "@app/hooks/api/auditLogs/enums";
-import { projectIdentityQuery } from "@app/hooks/api/projectIdentity";
+import { projectIdentityQuery, useDeleteProjectIdentity } from "@app/hooks/api/projectIdentity";
import { ProjectIdentityAuthenticationSection } from "@app/pages/project/IdentityDetailsByIDPage/components/ProjectIdentityAuthSection";
import { ProjectIdentityDetailsSection } from "@app/pages/project/IdentityDetailsByIDPage/components/ProjectIdentityDetailsSection";
import { ProjectAccessControlTabs } from "@app/types/project";
@@ -56,8 +68,7 @@ const Page = () => {
const { data: identityMembershipDetails, isPending: isMembershipDetailsLoading } =
useGetProjectIdentityMembershipV2(projectId, identityId);
- const { mutateAsync: deleteMutateAsync, isPending: isDeletingIdentity } =
- useDeleteProjectIdentityMembership();
+ const { mutateAsync: removeIdentityMutateAsync } = useDeleteProjectIdentityMembership();
const isProjectIdentity = Boolean(identityMembershipDetails?.identity.projectId);
@@ -73,7 +84,10 @@ const Page = () => {
enabled: isProjectIdentity
});
+ const { mutateAsync: deleteIdentity } = useDeleteProjectIdentity();
+
const { popUp, handlePopUpOpen, handlePopUpClose, handlePopUpToggle } = usePopUp([
+ "removeIdentity",
"deleteIdentity",
"assumePrivileges"
] as const);
@@ -102,7 +116,7 @@ const Page = () => {
};
const onRemoveIdentitySubmit = async () => {
- await deleteMutateAsync({
+ await removeIdentityMutateAsync({
identityId,
projectId
});
@@ -110,7 +124,7 @@ const Page = () => {
text: "Successfully removed machine identity from project",
type: "success"
});
- handlePopUpClose("deleteIdentity");
+ handlePopUpClose("removeIdentity");
navigate({
to: `${getProjectBaseURL(currentProject.type)}/access-management` as const,
params: {
@@ -123,16 +137,35 @@ const Page = () => {
});
};
+ const handleDeleteIdentity = async () => {
+ if (!identity) return;
+
+ try {
+ await deleteIdentity({
+ identityId: identity.id,
+ projectId: identity.projectId!
+ });
+
+ navigate({
+ to: `${getProjectBaseURL(currentProject.type)}/access-management`,
+ search: {
+ selectedTab: "identities"
+ }
+ });
+ } catch {
+ createNotification({
+ type: "error",
+ text: "Failed to delete project machine identity"
+ });
+ }
+ };
+
if (isMembershipDetailsLoading || (isProjectIdentity && isProjectIdentityPending)) {
- return (
-
-
- );
+ return
+
{identityMembershipDetails ? (
<>
{
search={{
selectedTab: ProjectAccessControlTabs.Identities
}}
- className="mb-4 flex items-center gap-x-2 text-sm text-mineshaft-400"
+ className="mb-4 flex w-fit items-center gap-x-1 text-sm text-mineshaft-400 transition duration-100 hover:text-mineshaft-400/80"
>
-
+
Project Machine Identities
-
-
{
- navigator.clipboard.writeText(identityMembershipDetails.id);
- createNotification({
- text: "Membership ID copied to clipboard",
- type: "success"
- });
- }}
- >
- Copy Membership ID
-
-
- {(isAllowed) => (
- handlePopUpOpen("assumePrivileges")}
- >
- Assume Privileges
-
- )}
-
- {!isProjectIdentity && (
+
+
+
+ Options
+
+
+
+ {
+ navigator.clipboard.writeText(identityMembershipDetails.id);
+ createNotification({
+ text: "Machine identity ID copied to clipboard",
+ type: "info"
+ });
+ }}
+ >
+ Copy Machine Identity ID
+
+
+ {(isAllowed) => (
+ handlePopUpOpen("assumePrivileges")}
+ >
+ Assume Privileges
+
+
+
+
+
+ )}
+
{(isAllowed) => (
- handlePopUpOpen("deleteIdentity")}
+ onClick={() =>
+ isProjectIdentity
+ ? handlePopUpOpen("deleteIdentity")
+ : handlePopUpOpen("removeIdentity")
+ }
>
- Remove Machine Identity
-
+ {isProjectIdentity ? "Delete Machine Identity" : "Remove From Project"}
+
)}
- )}
-
- {!isProjectIdentity && (
-
-
- This machine identity is managed by your organization.{" "}
-
- {(isAllowed) =>
- isAllowed ? (
-
- Click here to manage machine identity.
-
-
- ) : null
- }
-
-
-
- )}
-
- {identity ? (
-
-
+
+
+
+
+ {identity ? (
refetchIdentity()}
/>
-
- ) : (
-
- )}
-
+ ) : (
+
+
+ Authentication
+
+ Configure authentication methods
+
+
+
+
+
+ Machine identity managed by organization
+
+
+
+ This machine identity's authentication methods are controlled by your
+ organization. To make changes,{" "}
+
+ {(isAllowed) =>
+ isAllowed ? (
+
+ .
+
+
+
+
+
+ )}
{
handlePopUpToggle("deleteIdentity", isOpen)}
+ onChange={(isOpen) => handlePopUpToggle("removeIdentity", isOpen)}
deleteKey="remove"
onDeleteApproved={() => onRemoveIdentitySubmit()}
/>
@@ -290,6 +335,13 @@ const Page = () => {
onConfirmed={handleAssumePrivileges}
buttonText="Confirm"
/>
+ handlePopUpToggle("deleteIdentity", isOpen)}
+ deleteKey="confirm"
+ onDeleteApproved={handleDeleteIdentity}
+ />
) : (