Merge remote-tracking branch 'origin/main' into feat/gcp-secret-sync

.env.example

@@ -26,7 +26,8 @@ SITE_URL=http://localhost:8080
 # Mail/SMTP 
 SMTP_HOST=
 SMTP_PORT=
-SMTP_NAME=
+SMTP_FROM_ADDRESS=
+SMTP_FROM_NAME=
 SMTP_USERNAME=
 SMTP_PASSWORD=
 

backend/src/server/routes/v1/identity-aws-iam-auth-router.ts

@@ -79,7 +79,8 @@ export const registerIdentityAwsAuthRouter = async (server: FastifyZodProvider)
       params: z.object({
         identityId: z.string().trim().describe(AWS_AUTH.ATTACH.identityId)
       }),
-      body: z.object({
+      body: z
+        .object({
           stsEndpoint: z
             .string()
             .trim()
@@ -99,24 +100,23 @@ export const registerIdentityAwsAuthRouter = async (server: FastifyZodProvider)
           accessTokenTTL: z
             .number()
             .int()
-          .min(1)
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenTTL must have a non zero number"
-          })
             .default(2592000)
             .describe(AWS_AUTH.ATTACH.accessTokenTTL),
           accessTokenMaxTTL: z
             .number()
             .int()
+            .min(1)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenMaxTTL must have a non zero number"
-          })
             .default(2592000)
             .describe(AWS_AUTH.ATTACH.accessTokenMaxTTL),
           accessTokenNumUsesLimit: z.number().int().min(0).default(0).describe(AWS_AUTH.ATTACH.accessTokenNumUsesLimit)
-      }),
+        })
+        .refine(
+          (val) => val.accessTokenTTL <= val.accessTokenMaxTTL,
+          "Access Token TTL cannot be greater than Access Token Max TTL."
+        ),
       response: {
         200: z.object({
           identityAwsAuth: IdentityAwsAuthsSchema
@@ -172,7 +172,8 @@ export const registerIdentityAwsAuthRouter = async (server: FastifyZodProvider)
       params: z.object({
         identityId: z.string().describe(AWS_AUTH.UPDATE.identityId)
       }),
-      body: z.object({
+      body: z
+        .object({
           stsEndpoint: z.string().trim().min(1).optional().describe(AWS_AUTH.UPDATE.stsEndpoint),
           allowedPrincipalArns: validatePrincipalArns.describe(AWS_AUTH.UPDATE.allowedPrincipalArns),
           allowedAccountIds: validateAccountIds.describe(AWS_AUTH.UPDATE.allowedAccountIds),
@@ -190,12 +191,14 @@ export const registerIdentityAwsAuthRouter = async (server: FastifyZodProvider)
             .number()
             .int()
             .max(315360000)
-          .refine((value) => value !== 0, {
+            .min(0)
-            message: "accessTokenMaxTTL must have a non zero number"
-          })
             .optional()
             .describe(AWS_AUTH.UPDATE.accessTokenMaxTTL)
-      }),
+        })
+        .refine(
+          (val) => (val.accessTokenMaxTTL && val.accessTokenTTL ? val.accessTokenTTL <= val.accessTokenMaxTTL : true),
+          "Access Token TTL cannot be greater than Access Token Max TTL."
+        ),
       response: {
         200: z.object({
           identityAwsAuth: IdentityAwsAuthsSchema

backend/src/server/routes/v1/identity-azure-auth-router.ts

@@ -76,7 +76,8 @@ export const registerIdentityAzureAuthRouter = async (server: FastifyZodProvider
       params: z.object({
         identityId: z.string().trim().describe(AZURE_AUTH.LOGIN.identityId)
       }),
-      body: z.object({
+      body: z
+        .object({
           tenantId: z.string().trim().describe(AZURE_AUTH.ATTACH.tenantId),
           resource: z.string().trim().describe(AZURE_AUTH.ATTACH.resource),
           allowedServicePrincipalIds: validateAzureAuthField.describe(AZURE_AUTH.ATTACH.allowedServicePrincipalIds),
@@ -91,24 +92,28 @@ export const registerIdentityAzureAuthRouter = async (server: FastifyZodProvider
           accessTokenTTL: z
             .number()
             .int()
-          .min(1)
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenTTL must have a non zero number"
-          })
             .default(2592000)
             .describe(AZURE_AUTH.ATTACH.accessTokenTTL),
           accessTokenMaxTTL: z
             .number()
             .int()
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenMaxTTL must have a non zero number"
-          })
             .default(2592000)
             .describe(AZURE_AUTH.ATTACH.accessTokenMaxTTL),
-        accessTokenNumUsesLimit: z.number().int().min(0).default(0).describe(AZURE_AUTH.ATTACH.accessTokenNumUsesLimit)
+          accessTokenNumUsesLimit: z
-      }),
+            .number()
+            .int()
+            .min(0)
+            .default(0)
+            .describe(AZURE_AUTH.ATTACH.accessTokenNumUsesLimit)
+        })
+        .refine(
+          (val) => val.accessTokenTTL <= val.accessTokenMaxTTL,
+          "Access Token TTL cannot be greater than Access Token Max TTL."
+        ),
       response: {
         200: z.object({
           identityAzureAuth: IdentityAzureAuthsSchema
@@ -163,7 +168,8 @@ export const registerIdentityAzureAuthRouter = async (server: FastifyZodProvider
       params: z.object({
         identityId: z.string().trim().describe(AZURE_AUTH.UPDATE.identityId)
       }),
-      body: z.object({
+      body: z
+        .object({
           tenantId: z.string().trim().optional().describe(AZURE_AUTH.UPDATE.tenantId),
           resource: z.string().trim().optional().describe(AZURE_AUTH.UPDATE.resource),
           allowedServicePrincipalIds: validateAzureAuthField
@@ -178,17 +184,24 @@ export const registerIdentityAzureAuthRouter = async (server: FastifyZodProvider
             .optional()
             .describe(AZURE_AUTH.UPDATE.accessTokenTrustedIps),
           accessTokenTTL: z.number().int().min(0).max(315360000).optional().describe(AZURE_AUTH.UPDATE.accessTokenTTL),
-        accessTokenNumUsesLimit: z.number().int().min(0).optional().describe(AZURE_AUTH.UPDATE.accessTokenNumUsesLimit),
+          accessTokenNumUsesLimit: z
+            .number()
+            .int()
+            .min(0)
+            .optional()
+            .describe(AZURE_AUTH.UPDATE.accessTokenNumUsesLimit),
           accessTokenMaxTTL: z
             .number()
             .int()
             .max(315360000)
-          .refine((value) => value !== 0, {
+            .min(0)
-            message: "accessTokenMaxTTL must have a non zero number"
-          })
             .optional()
             .describe(AZURE_AUTH.UPDATE.accessTokenMaxTTL)
-      }),
+        })
+        .refine(
+          (val) => (val.accessTokenMaxTTL && val.accessTokenTTL ? val.accessTokenTTL <= val.accessTokenMaxTTL : true),
+          "Access Token TTL cannot be greater than Access Token Max TTL."
+        ),
       response: {
         200: z.object({
           identityAzureAuth: IdentityAzureAuthsSchema

backend/src/server/routes/v1/identity-gcp-auth-router.ts

@@ -74,7 +74,8 @@ export const registerIdentityGcpAuthRouter = async (server: FastifyZodProvider)
       params: z.object({
         identityId: z.string().trim().describe(GCP_AUTH.ATTACH.identityId)
       }),
-      body: z.object({
+      body: z
+        .object({
           type: z.enum(["iam", "gce"]),
           allowedServiceAccounts: validateGcpAuthField.describe(GCP_AUTH.ATTACH.allowedServiceAccounts),
           allowedProjects: validateGcpAuthField.describe(GCP_AUTH.ATTACH.allowedProjects),
@@ -90,24 +91,23 @@ export const registerIdentityGcpAuthRouter = async (server: FastifyZodProvider)
           accessTokenTTL: z
             .number()
             .int()
-          .min(1)
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenTTL must have a non zero number"
-          })
             .default(2592000)
             .describe(GCP_AUTH.ATTACH.accessTokenTTL),
           accessTokenMaxTTL: z
             .number()
             .int()
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenMaxTTL must have a non zero number"
-          })
             .default(2592000)
             .describe(GCP_AUTH.ATTACH.accessTokenMaxTTL),
           accessTokenNumUsesLimit: z.number().int().min(0).default(0).describe(GCP_AUTH.ATTACH.accessTokenNumUsesLimit)
-      }),
+        })
+        .refine(
+          (val) => val.accessTokenTTL <= val.accessTokenMaxTTL,
+          "Access Token TTL cannot be greater than Access Token Max TTL."
+        ),
       response: {
         200: z.object({
           identityGcpAuth: IdentityGcpAuthsSchema
@@ -164,7 +164,8 @@ export const registerIdentityGcpAuthRouter = async (server: FastifyZodProvider)
       params: z.object({
         identityId: z.string().trim().describe(GCP_AUTH.UPDATE.identityId)
       }),
-      body: z.object({
+      body: z
+        .object({
           type: z.enum(["iam", "gce"]).optional(),
           allowedServiceAccounts: validateGcpAuthField.optional().describe(GCP_AUTH.UPDATE.allowedServiceAccounts),
           allowedProjects: validateGcpAuthField.optional().describe(GCP_AUTH.UPDATE.allowedProjects),
@@ -182,13 +183,15 @@ export const registerIdentityGcpAuthRouter = async (server: FastifyZodProvider)
           accessTokenMaxTTL: z
             .number()
             .int()
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenMaxTTL must have a non zero number"
-          })
             .optional()
             .describe(GCP_AUTH.UPDATE.accessTokenMaxTTL)
-      }),
+        })
+        .refine(
+          (val) => (val.accessTokenMaxTTL && val.accessTokenTTL ? val.accessTokenTTL <= val.accessTokenMaxTTL : true),
+          "Access Token TTL cannot be greater than Access Token Max TTL."
+        ),
       response: {
         200: z.object({
           identityGcpAuth: IdentityGcpAuthsSchema

backend/src/server/routes/v1/identity-jwt-auth-router.ts

@@ -34,23 +34,12 @@ const CreateBaseSchema = z.object({
     .min(1)
     .default([{ ipAddress: "0.0.0.0/0" }, { ipAddress: "::/0" }])
     .describe(JWT_AUTH.ATTACH.accessTokenTrustedIps),
-  accessTokenTTL: z
+  accessTokenTTL: z.number().int().min(0).max(315360000).default(2592000).describe(JWT_AUTH.ATTACH.accessTokenTTL),
-    .number()
-    .int()
-    .min(1)
-    .max(315360000)
-    .refine((value) => value !== 0, {
-      message: "accessTokenTTL must have a non zero number"
-    })
-    .default(2592000)
-    .describe(JWT_AUTH.ATTACH.accessTokenTTL),
   accessTokenMaxTTL: z
     .number()
     .int()
+    .min(0)
     .max(315360000)
-    .refine((value) => value !== 0, {
-      message: "accessTokenMaxTTL must have a non zero number"
-    })
     .default(2592000)
     .describe(JWT_AUTH.ATTACH.accessTokenMaxTTL),
   accessTokenNumUsesLimit: z.number().int().min(0).default(0).describe(JWT_AUTH.ATTACH.accessTokenNumUsesLimit)
@@ -70,23 +59,12 @@ const UpdateBaseSchema = z
       .min(1)
       .default([{ ipAddress: "0.0.0.0/0" }, { ipAddress: "::/0" }])
       .describe(JWT_AUTH.UPDATE.accessTokenTrustedIps),
-    accessTokenTTL: z
+    accessTokenTTL: z.number().int().min(0).max(315360000).default(2592000).describe(JWT_AUTH.UPDATE.accessTokenTTL),
-      .number()
-      .int()
-      .min(1)
-      .max(315360000)
-      .refine((value) => value !== 0, {
-        message: "accessTokenTTL must have a non zero number"
-      })
-      .default(2592000)
-      .describe(JWT_AUTH.UPDATE.accessTokenTTL),
     accessTokenMaxTTL: z
       .number()
       .int()
+      .min(0)
       .max(315360000)
-      .refine((value) => value !== 0, {
-        message: "accessTokenMaxTTL must have a non zero number"
-      })
       .default(2592000)
       .describe(JWT_AUTH.UPDATE.accessTokenMaxTTL),
     accessTokenNumUsesLimit: z.number().int().min(0).default(0).describe(JWT_AUTH.UPDATE.accessTokenNumUsesLimit)

backend/src/server/routes/v1/identity-kubernetes-auth-router.ts

@@ -87,7 +87,8 @@ export const registerIdentityKubernetesRouter = async (server: FastifyZodProvide
       params: z.object({
         identityId: z.string().trim().describe(KUBERNETES_AUTH.ATTACH.identityId)
       }),
-      body: z.object({
+      body: z
+        .object({
           kubernetesHost: z.string().trim().min(1).describe(KUBERNETES_AUTH.ATTACH.kubernetesHost),
           caCert: z.string().trim().default("").describe(KUBERNETES_AUTH.ATTACH.caCert),
           tokenReviewerJwt: z.string().trim().min(1).describe(KUBERNETES_AUTH.ATTACH.tokenReviewerJwt),
@@ -105,20 +106,15 @@ export const registerIdentityKubernetesRouter = async (server: FastifyZodProvide
           accessTokenTTL: z
             .number()
             .int()
-          .min(1)
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenTTL must have a non zero number"
-          })
             .default(2592000)
             .describe(KUBERNETES_AUTH.ATTACH.accessTokenTTL),
           accessTokenMaxTTL: z
             .number()
             .int()
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenMaxTTL must have a non zero number"
-          })
             .default(2592000)
             .describe(KUBERNETES_AUTH.ATTACH.accessTokenMaxTTL),
           accessTokenNumUsesLimit: z
@@ -127,7 +123,11 @@ export const registerIdentityKubernetesRouter = async (server: FastifyZodProvide
             .min(0)
             .default(0)
             .describe(KUBERNETES_AUTH.ATTACH.accessTokenNumUsesLimit)
-      }),
+        })
+        .refine(
+          (val) => val.accessTokenTTL <= val.accessTokenMaxTTL,
+          "Access Token TTL cannot be greater than Access Token Max TTL."
+        ),
       response: {
         200: z.object({
           identityKubernetesAuth: IdentityKubernetesAuthResponseSchema
@@ -183,7 +183,8 @@ export const registerIdentityKubernetesRouter = async (server: FastifyZodProvide
       params: z.object({
         identityId: z.string().describe(KUBERNETES_AUTH.UPDATE.identityId)
       }),
-      body: z.object({
+      body: z
+        .object({
           kubernetesHost: z.string().trim().min(1).optional().describe(KUBERNETES_AUTH.UPDATE.kubernetesHost),
           caCert: z.string().trim().optional().describe(KUBERNETES_AUTH.UPDATE.caCert),
           tokenReviewerJwt: z.string().trim().min(1).optional().describe(KUBERNETES_AUTH.UPDATE.tokenReviewerJwt),
@@ -214,13 +215,15 @@ export const registerIdentityKubernetesRouter = async (server: FastifyZodProvide
           accessTokenMaxTTL: z
             .number()
             .int()
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenMaxTTL must have a non zero number"
-          })
             .optional()
             .describe(KUBERNETES_AUTH.UPDATE.accessTokenMaxTTL)
-      }),
+        })
+        .refine(
+          (val) => (val.accessTokenMaxTTL && val.accessTokenTTL ? val.accessTokenTTL <= val.accessTokenMaxTTL : true),
+          "Access Token TTL cannot be greater than Access Token Max TTL."
+        ),
       response: {
         200: z.object({
           identityKubernetesAuth: IdentityKubernetesAuthResponseSchema

backend/src/server/routes/v1/identity-oidc-auth-router.ts

@@ -87,7 +87,8 @@ export const registerIdentityOidcAuthRouter = async (server: FastifyZodProvider)
       params: z.object({
         identityId: z.string().trim().describe(OIDC_AUTH.ATTACH.identityId)
       }),
-      body: z.object({
+      body: z
+        .object({
           oidcDiscoveryUrl: z.string().url().min(1).describe(OIDC_AUTH.ATTACH.oidcDiscoveryUrl),
           caCert: z.string().trim().default("").describe(OIDC_AUTH.ATTACH.caCert),
           boundIssuer: z.string().min(1).describe(OIDC_AUTH.ATTACH.boundIssuer),
@@ -105,24 +106,23 @@ export const registerIdentityOidcAuthRouter = async (server: FastifyZodProvider)
           accessTokenTTL: z
             .number()
             .int()
-          .min(1)
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenTTL must have a non zero number"
-          })
             .default(2592000)
             .describe(OIDC_AUTH.ATTACH.accessTokenTTL),
           accessTokenMaxTTL: z
             .number()
             .int()
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenMaxTTL must have a non zero number"
-          })
             .default(2592000)
             .describe(OIDC_AUTH.ATTACH.accessTokenMaxTTL),
           accessTokenNumUsesLimit: z.number().int().min(0).default(0).describe(OIDC_AUTH.ATTACH.accessTokenNumUsesLimit)
-      }),
+        })
+        .refine(
+          (val) => val.accessTokenTTL <= val.accessTokenMaxTTL,
+          "Access Token TTL cannot be greater than Access Token Max TTL."
+        ),
       response: {
         200: z.object({
           identityOidcAuth: IdentityOidcAuthResponseSchema
@@ -202,26 +202,24 @@ export const registerIdentityOidcAuthRouter = async (server: FastifyZodProvider)
           accessTokenTTL: z
             .number()
             .int()
-            .min(1)
+            .min(0)
             .max(315360000)
-            .refine((value) => value !== 0, {
-              message: "accessTokenTTL must have a non zero number"
-            })
             .default(2592000)
             .describe(OIDC_AUTH.UPDATE.accessTokenTTL),
           accessTokenMaxTTL: z
             .number()
             .int()
+            .min(0)
             .max(315360000)
-            .refine((value) => value !== 0, {
-              message: "accessTokenMaxTTL must have a non zero number"
-            })
             .default(2592000)
             .describe(OIDC_AUTH.UPDATE.accessTokenMaxTTL),
-
           accessTokenNumUsesLimit: z.number().int().min(0).default(0).describe(OIDC_AUTH.UPDATE.accessTokenNumUsesLimit)
         })
-        .partial(),
+        .partial()
+        .refine(
+          (val) => (val.accessTokenMaxTTL && val.accessTokenTTL ? val.accessTokenTTL <= val.accessTokenMaxTTL : true),
+          "Access Token TTL cannot be greater than Access Token Max TTL."
+        ),
       response: {
         200: z.object({
           identityOidcAuth: IdentityOidcAuthResponseSchema

backend/src/server/routes/v1/identity-token-auth-router.ts

@@ -26,7 +26,8 @@ export const registerIdentityTokenAuthRouter = async (server: FastifyZodProvider
       params: z.object({
         identityId: z.string().trim().describe(TOKEN_AUTH.ATTACH.identityId)
       }),
-      body: z.object({
+      body: z
+        .object({
           accessTokenTrustedIps: z
             .object({
               ipAddress: z.string().trim()
@@ -38,24 +39,28 @@ export const registerIdentityTokenAuthRouter = async (server: FastifyZodProvider
           accessTokenTTL: z
             .number()
             .int()
-          .min(1)
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenTTL must have a non zero number"
-          })
             .default(2592000)
             .describe(TOKEN_AUTH.ATTACH.accessTokenTTL),
           accessTokenMaxTTL: z
             .number()
             .int()
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenMaxTTL must have a non zero number"
-          })
             .default(2592000)
             .describe(TOKEN_AUTH.ATTACH.accessTokenMaxTTL),
-        accessTokenNumUsesLimit: z.number().int().min(0).default(0).describe(TOKEN_AUTH.ATTACH.accessTokenNumUsesLimit)
+          accessTokenNumUsesLimit: z
-      }),
+            .number()
+            .int()
+            .min(0)
+            .default(0)
+            .describe(TOKEN_AUTH.ATTACH.accessTokenNumUsesLimit)
+        })
+        .refine(
+          (val) => val.accessTokenTTL <= val.accessTokenMaxTTL,
+          "Access Token TTL cannot be greater than Access Token Max TTL."
+        ),
       response: {
         200: z.object({
           identityTokenAuth: IdentityTokenAuthsSchema
@@ -110,7 +115,8 @@ export const registerIdentityTokenAuthRouter = async (server: FastifyZodProvider
       params: z.object({
         identityId: z.string().trim().describe(TOKEN_AUTH.UPDATE.identityId)
       }),
-      body: z.object({
+      body: z
+        .object({
           accessTokenTrustedIps: z
             .object({
               ipAddress: z.string().trim()
@@ -120,17 +126,24 @@ export const registerIdentityTokenAuthRouter = async (server: FastifyZodProvider
             .optional()
             .describe(TOKEN_AUTH.UPDATE.accessTokenTrustedIps),
           accessTokenTTL: z.number().int().min(0).max(315360000).optional().describe(TOKEN_AUTH.UPDATE.accessTokenTTL),
-        accessTokenNumUsesLimit: z.number().int().min(0).optional().describe(TOKEN_AUTH.UPDATE.accessTokenNumUsesLimit),
+          accessTokenNumUsesLimit: z
+            .number()
+            .int()
+            .min(0)
+            .optional()
+            .describe(TOKEN_AUTH.UPDATE.accessTokenNumUsesLimit),
           accessTokenMaxTTL: z
             .number()
             .int()
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenMaxTTL must have a non zero number"
-          })
             .optional()
             .describe(TOKEN_AUTH.UPDATE.accessTokenMaxTTL)
-      }),
+        })
+        .refine(
+          (val) => (val.accessTokenMaxTTL && val.accessTokenTTL ? val.accessTokenTTL <= val.accessTokenMaxTTL : true),
+          "Access Token TTL cannot be greater than Access Token Max TTL."
+        ),
       response: {
         200: z.object({
           identityTokenAuth: IdentityTokenAuthsSchema

backend/src/server/routes/v1/identity-universal-auth-router.ts

@@ -86,7 +86,8 @@ export const registerIdentityUaRouter = async (server: FastifyZodProvider) => {
       params: z.object({
         identityId: z.string().trim().describe(UNIVERSAL_AUTH.ATTACH.identityId)
       }),
-      body: z.object({
+      body: z
+        .object({
           clientSecretTrustedIps: z
             .object({
               ipAddress: z.string().trim()
@@ -106,20 +107,15 @@ export const registerIdentityUaRouter = async (server: FastifyZodProvider) => {
           accessTokenTTL: z
             .number()
             .int()
-          .min(1)
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenTTL must have a non zero number"
-          })
             .default(2592000)
             .describe(UNIVERSAL_AUTH.ATTACH.accessTokenTTL), // 30 days
           accessTokenMaxTTL: z
             .number()
             .int()
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenMaxTTL must have a non zero number"
-          })
             .default(2592000)
             .describe(UNIVERSAL_AUTH.ATTACH.accessTokenMaxTTL), // 30 days
           accessTokenNumUsesLimit: z
@@ -128,7 +124,11 @@ export const registerIdentityUaRouter = async (server: FastifyZodProvider) => {
             .min(0)
             .default(0)
             .describe(UNIVERSAL_AUTH.ATTACH.accessTokenNumUsesLimit)
-      }),
+        })
+        .refine(
+          (val) => val.accessTokenTTL <= val.accessTokenMaxTTL,
+          "Access Token TTL cannot be greater than Access Token Max TTL."
+        ),
       response: {
         200: z.object({
           identityUniversalAuth: IdentityUniversalAuthsSchema
@@ -181,7 +181,8 @@ export const registerIdentityUaRouter = async (server: FastifyZodProvider) => {
       params: z.object({
         identityId: z.string().describe(UNIVERSAL_AUTH.UPDATE.identityId)
       }),
-      body: z.object({
+      body: z
+        .object({
           clientSecretTrustedIps: z
             .object({
               ipAddress: z.string().trim()
@@ -214,13 +215,15 @@ export const registerIdentityUaRouter = async (server: FastifyZodProvider) => {
           accessTokenMaxTTL: z
             .number()
             .int()
+            .min(0)
             .max(315360000)
-          .refine((value) => value !== 0, {
-            message: "accessTokenMaxTTL must have a non zero number"
-          })
             .optional()
             .describe(UNIVERSAL_AUTH.UPDATE.accessTokenMaxTTL)
-      }),
+        })
+        .refine(
+          (val) => (val.accessTokenMaxTTL && val.accessTokenTTL ? val.accessTokenTTL <= val.accessTokenMaxTTL : true),
+          "Access Token TTL cannot be greater than Access Token Max TTL."
+        ),
       response: {
         200: z.object({
           identityUniversalAuth: IdentityUniversalAuthsSchema

backend/src/services/identity-aws-auth/identity-aws-auth-service.ts

@@ -126,11 +126,11 @@ export const identityAwsAuthServiceFactory = ({
         authTokenType: AuthTokenType.IDENTITY_ACCESS_TOKEN
       } as TIdentityAccessTokenJwtPayload,
       appCfg.AUTH_SECRET,
-      {
+      // akhilmhdh: for non-expiry tokens you should not even set the value, including undefined. Even for undefined jsonwebtoken throws error
-        expiresIn:
+      Number(identityAccessToken.accessTokenTTL) === 0
-          Number(identityAccessToken.accessTokenMaxTTL) === 0
         ? undefined
-            : Number(identityAccessToken.accessTokenMaxTTL)
+        : {
+            expiresIn: Number(identityAccessToken.accessTokenTTL)
           }
     );
 

backend/src/services/identity-azure-auth/identity-azure-auth-service.ts

@@ -99,11 +99,11 @@ export const identityAzureAuthServiceFactory = ({
         authTokenType: AuthTokenType.IDENTITY_ACCESS_TOKEN
       } as TIdentityAccessTokenJwtPayload,
       appCfg.AUTH_SECRET,
-      {
+      // akhilmhdh: for non-expiry tokens you should not even set the value, including undefined. Even for undefined jsonwebtoken throws error
-        expiresIn:
+      Number(identityAccessToken.accessTokenTTL) === 0
-          Number(identityAccessToken.accessTokenMaxTTL) === 0
         ? undefined
-            : Number(identityAccessToken.accessTokenMaxTTL)
+        : {
+            expiresIn: Number(identityAccessToken.accessTokenTTL)
           }
     );
 

backend/src/services/identity-gcp-auth/identity-gcp-auth-service.ts

@@ -138,11 +138,11 @@ export const identityGcpAuthServiceFactory = ({
         authTokenType: AuthTokenType.IDENTITY_ACCESS_TOKEN
       } as TIdentityAccessTokenJwtPayload,
       appCfg.AUTH_SECRET,
-      {
+      // akhilmhdh: for non-expiry tokens you should not even set the value, including undefined. Even for undefined jsonwebtoken throws error
-        expiresIn:
+      Number(identityAccessToken.accessTokenTTL) === 0
-          Number(identityAccessToken.accessTokenMaxTTL) === 0
         ? undefined
-            : Number(identityAccessToken.accessTokenMaxTTL)
+        : {
+            expiresIn: Number(identityAccessToken.accessTokenTTL)
           }
     );
 

backend/src/services/identity-jwt-auth/identity-jwt-auth-service.ts

@@ -212,11 +212,11 @@ export const identityJwtAuthServiceFactory = ({
         authTokenType: AuthTokenType.IDENTITY_ACCESS_TOKEN
       } as TIdentityAccessTokenJwtPayload,
       appCfg.AUTH_SECRET,
-      {
+      // akhilmhdh: for non-expiry tokens you should not even set the value, including undefined. Even for undefined jsonwebtoken throws error
-        expiresIn:
+      Number(identityAccessToken.accessTokenTTL) === 0
-          Number(identityAccessToken.accessTokenMaxTTL) === 0
         ? undefined
-            : Number(identityAccessToken.accessTokenMaxTTL)
+        : {
+            expiresIn: Number(identityAccessToken.accessTokenTTL)
           }
     );
 

backend/src/services/identity-kubernetes-auth/identity-kubernetes-auth-service.ts

@@ -229,11 +229,11 @@ export const identityKubernetesAuthServiceFactory = ({
         authTokenType: AuthTokenType.IDENTITY_ACCESS_TOKEN
       } as TIdentityAccessTokenJwtPayload,
       appCfg.AUTH_SECRET,
-      {
+      // akhilmhdh: for non-expiry tokens you should not even set the value, including undefined. Even for undefined jsonwebtoken throws error
-        expiresIn:
+      Number(identityAccessToken.accessTokenTTL) === 0
-          Number(identityAccessToken.accessTokenMaxTTL) === 0
         ? undefined
-            : Number(identityAccessToken.accessTokenMaxTTL)
+        : {
+            expiresIn: Number(identityAccessToken.accessTokenTTL)
           }
     );
 

backend/src/services/identity-oidc-auth/identity-oidc-auth-service.ts

@@ -194,11 +194,11 @@ export const identityOidcAuthServiceFactory = ({
         authTokenType: AuthTokenType.IDENTITY_ACCESS_TOKEN
       } as TIdentityAccessTokenJwtPayload,
       appCfg.AUTH_SECRET,
-      {
+      // akhilmhdh: for non-expiry tokens you should not even set the value, including undefined. Even for undefined jsonwebtoken throws error
-        expiresIn:
+      Number(identityAccessToken.accessTokenTTL) === 0
-          Number(identityAccessToken.accessTokenMaxTTL) === 0
         ? undefined
-            : Number(identityAccessToken.accessTokenMaxTTL)
+        : {
+            expiresIn: Number(identityAccessToken.accessTokenTTL)
           }
     );
 

backend/src/services/identity-token-auth/identity-token-auth-service.ts

@@ -328,11 +328,11 @@ export const identityTokenAuthServiceFactory = ({
         authTokenType: AuthTokenType.IDENTITY_ACCESS_TOKEN
       } as TIdentityAccessTokenJwtPayload,
       appCfg.AUTH_SECRET,
-      {
+      // akhilmhdh: for non-expiry tokens you should not even set the value, including undefined. Even for undefined jsonwebtoken throws error
-        expiresIn:
+      Number(identityAccessToken.accessTokenTTL) === 0
-          Number(identityAccessToken.accessTokenMaxTTL) === 0
         ? undefined
-            : Number(identityAccessToken.accessTokenMaxTTL)
+        : {
+            expiresIn: Number(identityAccessToken.accessTokenTTL)
           }
     );
 

backend/src/services/identity-ua/identity-ua-service.ts

@@ -129,11 +129,11 @@ export const identityUaServiceFactory = ({
         authTokenType: AuthTokenType.IDENTITY_ACCESS_TOKEN
       } as TIdentityAccessTokenJwtPayload,
       appCfg.AUTH_SECRET,
-      {
+      // akhilmhdh: for non-expiry tokens you should not even set the value, including undefined. Even for undefined jsonwebtoken throws error
-        expiresIn:
+      Number(identityAccessToken.accessTokenTTL) === 0
-          Number(identityAccessToken.accessTokenMaxTTL) === 0
         ? undefined
-            : Number(identityAccessToken.accessTokenMaxTTL)
+        : {
+            expiresIn: Number(identityAccessToken.accessTokenTTL)
           }
     );
 

docker-swarm/.env-example

@@ -20,7 +20,8 @@ SITE_URL=http://localhost:8080
 # Mail/SMTP 
 SMTP_HOST=
 SMTP_PORT=
-SMTP_NAME=
+SMTP_FROM_ADDRESS=
+SMTP_FROM_NAME=
 SMTP_USERNAME=
 SMTP_PASSWORD=
 

docs/documentation/guides/node.mdx

@@ -5,7 +5,7 @@ title: "Node"
 This guide demonstrates how to use Infisical to manage secrets for your Node stack from local development to production. It uses:
 
 - Infisical (you can use [Infisical Cloud](https://app.infisical.com) or a [self-hosted instance of Infisical](https://infisical.com/docs/self-hosting/overview)) to store your secrets.
-- The [@infisical/sdk](https://github.com/Infisical/sdk/tree/main/languages/node) Node.js client SDK to fetch secrets back to your Node application on demand.
+- The [@infisical/sdk](https://github.com/Infisical/node-sdk-v2) Node.js client SDK to fetch secrets back to your Node application on demand.
 
 ## Project Setup
 
@@ -46,29 +46,43 @@ Finally, create an index.js file containing the application code.
 
 ```js
 const express = require('express');
-const { InfisicalClient } = require("@infisical/sdk");
+const { InfisicalSDK } = require("@infisical/sdk");
+
 
 const app = express();
 
 const PORT = 3000;
 
-const client = new InfisicalClient({
+let client;
-    auth: {
+
-      universalAuth: {
+const setupClient = () => {  
-        clientId: "YOUR_CLIENT_ID",
+
-        clientSecret: "YOUR_CLIENT_SECRET",
+  if (client) {
+    return;
   }
-    }
+
-});
+  const infisicalSdk = new InfisicalSDK({
+      siteUrl: "your-infisical-instance.com" // Optional, defaults to https://app.infisical.com
+  });
+
+  await infisicalSdk.auth().universalAuth.login({
+    clientId: "<machine-identity-client-id>",
+    clientSecret: "<machine-identity-client-secret>"
+  });
+
+  // If authentication was successful, assign the client
+  client = infisicalSdk;
+}
+
+
 
 app.get("/", async (req, res) => {
-    // access value
     
-    const name = await client.getSecret({
+
-        environment: "dev",
+    const name = await client.secrets().getSecret({
-        projectId: "PROJECT_ID",
+      environment: "dev", // dev, staging, prod, etc.
-        path: "/",
+      projectId: "<project-id>",
-        type: "shared",
+      secretPath: "/",
       secretName: "NAME"
     });
     
@@ -76,13 +90,13 @@ app.get("/", async (req, res) => {
 });
 
 app.listen(PORT, async () => {
-    // initialize client
+  // initialize http server and Infisical
-
+    await setupClient();
-    console.log(`App listening on port ${PORT}`);
+    console.log(`Server listening on port ${PORT}`);
 });
 ```
 
-Here, we initialized a `client` instance of the Infisical Node SDK with the Infisical Token
+Here, we initialized a `client` instance of the Infisical Node SDK with the [Machine Identity](/documentation/platform/identities/overview)
 that we created earlier, giving access to the secrets in the development environment of the
 project in Infisical that we created earlier.
 
@@ -94,16 +108,12 @@ node index.js
 
 The client fetched the secret with the key `NAME` from Infisical that we returned in the response of the endpoint.
 
-At this stage, you know how to fetch secrets from Infisical back to your Node application. By using Infisical Tokens scoped to different environments, you can easily manage secrets across various stages of your project in Infisical, from local development to production.
+At this stage, you know how to fetch secrets from Infisical back to your Node application.
+By using Machine Identities scoped to different projects and environments, you can easily manage secrets across various stages of your project in Infisical, from local development to production.
 
 ## FAQ
 
 <AccordionGroup>
-    <Accordion title="Isn't it inefficient if my app makes a request every time it needs a secret?">
-        The client SDK caches every secret and implements a 5-minute waiting period before
-        re-requesting it. The waiting period can be controlled by setting the `cacheTTL` parameter at
-        the time of initializing the client.
-    </Accordion>
     <Accordion title="What if a request for a secret fails?">
         The SDK caches every secret and falls back to the cached value if a request fails. If no cached
         value ever-existed, the SDK falls back to whatever value is on `process.env`.
@@ -124,4 +134,4 @@ At this stage, you know how to fetch secrets from Infisical back to your Node ap
 
 See also:
 
-- Explore the [Node SDK](https://github.com/Infisical/sdk/tree/main/languages/node)
+- Explore the [Node SDK](https://github.com/Infisical/node-sdk-v2)

docs/integrations/platforms/kubernetes/infisical-secret-crd.mdx

@@ -26,8 +26,8 @@ spec:
         name: <service-account-name>
         namespace: <service-account-namespace>
 
-  managedSecretReference:
+  managedKubeSecretReferences:
-    secretName: managed-secret
+    - secretName: managed-secret
       secretNamespace: default
       creationPolicy: "Orphan"
       template:
@@ -541,18 +541,32 @@ The managed secret properties specify where to store the secrets retrieved from
 This includes defining the name and namespace of the Kubernetes secret that will hold these secrets.
 The Infisical operator will automatically create the Kubernetes secret in the specified name/namespace and ensure it stays up-to-date.
 
-<Accordion title="managedSecretReference">
+<Note>
+
+The `managedSecretReference` field is deprecated and will be removed in a future release.
+Replace it with `managedKubeSecretReferences`, which now accepts an array of references to support multiple managed secrets in a single InfisicalSecret CRD.
+
+Example:
+```yaml
+  managedKubeSecretReferences:
+    - secretName: managed-secret
+      secretNamespace: default
+      creationPolicy: "Orphan"
+```
+</Note>
+
+<Accordion title="managedKubeSecretReferences">
 </Accordion>
-<Accordion title="managedSecretReference.secretName">
+<Accordion title="managedKubeSecretReferences[].secretName">
 The name of the managed Kubernetes secret to be created
 </Accordion>
-<Accordion title="managedSecretReference.secretNamespace">
+<Accordion title="managedKubeSecretReferences[].secretNamespace">
 The namespace of the managed Kubernetes secret to be created. 
 </Accordion>
-<Accordion title="managedSecretReference.secretType">
+<Accordion title="managedKubeSecretReferences[].secretType">
 Override the default Opaque type for managed secrets with this field. Useful for creating kubernetes.io/dockerconfigjson secrets.
 </Accordion>
-<Accordion title="managedSecretReference.creationPolicy">
+<Accordion title="managedKubeSecretReferences[].creationPolicy">
 Creation polices allow you to control whether or not owner references should be added to the managed Kubernetes secret that is generated by the Infisical operator. 
 This is useful for tools such as ArgoCD, where every resource requires an owner reference; otherwise, it will be pruned automatically.
 
@@ -573,18 +587,18 @@ This is useful for tools such as ArgoCD, where every resource requires an owner
 Fetching secrets from Infisical as is via the operator may not be enough. This is where templating functionality may be helpful.
 Using Go templates, you can format, combine, and create new key-value pairs from secrets fetched from Infisical before storing them as Kubernetes Secrets.
 
-<Accordion title="managedSecretReference.template">
+<Accordion title="managedKubeSecretReferences[].template">
 </Accordion>
-<Accordion title="managedSecretReference.template.includeAllSecrets">
+<Accordion title="managedKubeSecretReferences[].template.includeAllSecrets">
   This property controls what secrets are included in your managed secret when using templates. 
   When set to `true`, all secrets fetched from your Infisical project will be added into your managed Kubernetes secret resource. 
   **Use this option when you would like to sync all secrets from Infisical to Kubernetes but want to template a subset of them.**
 
-When set to `false`, only secrets defined in the `managedSecretReference.template.data` field of the template will be included in the managed secret.
+When set to `false`, only secrets defined in the `managedKubeSecretReferences[].template.data` field of the template will be included in the managed secret.
 Use this option when you would like to sync **only** a subset of secrets from Infisical to Kubernetes.
 
 </Accordion>
-<Accordion title="managedSecretReference.template.data">
+<Accordion title="managedKubeSecretReferences[].template.data">
 Define secret keys and their corresponding templates. 
 Each data value uses a Golang template with access to all secrets retrieved from the specified scope.
 
@@ -600,8 +614,8 @@ type TemplateSecret struct {
 #### Example template configuration:
 
 ```yaml
-managedSecretReference:
+managedKubeSecretReferences:
-  secretName: managed-secret
+  - secretName: managed-secret
     secretNamespace: default
     template:
       includeAllSecrets: true
@@ -652,10 +666,10 @@ The example below assumes that the `BINARY_KEY_BASE64` secret is stored as a bas
 The resulting managed secret will contain the decoded value of `BINARY_KEY_BASE64`.
 
 ```yaml
-managedSecretReference:
+  managedKubeSecretReferences:
-secretName: managed-secret
+  secretName: managed-secret
-secretNamespace: default
+  secretNamespace: default
-template:
+  template:
     includeAllSecrets: true
     data:
       BINARY_KEY: "{{ decodeBase64ToBytes .BINARY_KEY_BASE64.Value }}"
@@ -913,7 +927,7 @@ spec:
   ..
   authentication:
     ...
-  managedSecretReference:
+  managedKubeSecretReferences:
     ...
 ```
 

docs/mint.json

@@ -301,7 +301,8 @@
           "group": "Reference architectures",
           "pages": [
             "self-hosting/reference-architectures/aws-ecs",
-            "self-hosting/reference-architectures/linux-deployment-ha"
+            "self-hosting/reference-architectures/linux-deployment-ha",
+            "self-hosting/reference-architectures/on-prem-k8s-ha"
           ]
         },
         "self-hosting/ee",

docs/sdks/overview.mdx

@@ -34,12 +34,6 @@ From local development to production, Infisical SDKs provide the easiest way for
 ## FAQ
 
 <AccordionGroup>
-    <Accordion title="Isn't it inefficient if my app makes a request every time it needs a secret?">
-        The client SDK caches every secret and implements a 5-minute waiting period before re-requesting it. The waiting period can be controlled by
-        setting the `cacheTTL` parameter at the time of initializing the client.
-        
-        Note: The exact parameter name may differ depending on the language.
-    </Accordion>
     <Accordion title="What if a request for a secret fails?">
         The SDK caches every secret and falls back to the cached value if a request fails. If no cached
         value ever-existed, the SDK falls back to whatever value is on the process environment.

docs/self-hosting/reference-architectures/on-prem-k8s-ha.mdx

@@ -0,0 +1,231 @@
+---
+title: "Kubernetes (HA)"
+description: "Reference architecture for self-hosting Infisical on Kubernetes (HA)"
+---
+Deploying Infisical on-premise with high availability requires expertise in networking, container orchestration, and database management. 
+This guide serves as a reference architecture and a starting point. Actual deployments may vary depending on your organization's existing infrastructure and capabilities.
+
+
+## Architecture Overview
+{/* ![On premise architecture](/images/self-hosting/reference-architectures/on-premise-architecture.png) */}
+```mermaid
+flowchart TB
+    subgraph GLB["Global LB (HAProxy/NGINX)"]
+    end
+
+    subgraph OS["Object Storage"]
+        direction LR
+        store["S3/MinIO/Enterprise Storage"]
+        subgraph store_contents["Storage Contents"]
+            wal["PostgreSQL WAL"]
+            pgbackup["PostgreSQL Backups"]
+            redisbackup["Redis Backups"]
+        end
+    end
+
+    subgraph DC1["Active Data Center"]
+        direction TB
+        subgraph k8s1["Kubernetes Cluster"]
+            ing1["Ingress Controller"]
+            app1["Infisical Deployment"]
+            
+            subgraph db1["CloudNativePG"]
+                pg1p["PostgreSQL Primary"]
+                pg1r["PostgreSQL Replicas"]
+            end
+            
+            subgraph red1["Redis (Bitnami)"]
+                rp1["Redis Primary"]
+            end
+        end
+    end
+
+    subgraph DC2["Passive Data Center"]
+        direction TB
+        subgraph k8s2["Kubernetes Cluster"]
+            ing2["Ingress Controller"]
+            app2["Infisical Deployment"]
+            
+            subgraph db2["CloudNativePG"]
+                pg2["PostgreSQL Replicas"]
+            end
+            
+            subgraph red2["Redis (Bitnami)"]
+                r2["Redis Standby"]
+            end
+        end
+    end
+
+    %% Connections
+    GLB --> ing1
+    GLB -.-> ing2
+    
+    %% Database connections
+    pg1p --> store
+    store --> pg2
+    
+    %% Redis backup flow
+    rp1 --> store
+    store -.-> r2
+    
+    %% Intra-DC connections
+    ing1 --> app1
+    app1 --> db1
+    app1 --> red1
+    
+    ing2 --> app2
+    app2 --> db2
+    app2 --> red2
+
+    classDef primary fill:#f96,stroke:#333
+    classDef replica fill:#69f,stroke:#333
+    classDef storage fill:#9c6,stroke:#333
+    classDef lb fill:#c9f,stroke:#333
+    
+    class pg1p,rp1 primary
+    class pg1r,pg2,r2 replica
+    class store,wal,pgbackup,redisbackup storage
+    class GLB,ing1,ing2 lb
+```
+The architecture above makes use of Kubernetes for orchestrating both stateless and stateful components.
+The architecture spans multiple data centers for increased redundancy, availability and disaster recovery capabilities using an active-passive configuration.
+
+### Stateful vs stateless workloads
+While managing databases within Kubernetes has typically been complex, modern operators like [CloudNativePG](https://cloudnative-pg.io/) simplify this process by handling storage provisioning, persistent volume management, and backup/recovery processes. 
+However, if you lack deep expertise in Kubernetes operators or database management, we recommend a hybrid approach where the database is on a managed service for production deployments.
+
+<Warning>
+    Managing stateful components like databases can be challenging without deep expertise or a dedicated in-house database management team. 
+    To simplify operations and reduce complexity, we recommend offloading databases to managed services from AWS/GCP. 
+    These managed services automatically handle provisioning, scaling, failover, backups and rollbacks.
+</Warning>
+
+## Core Components
+### Kubernetes Cluster
+Infisical is deployed on a Kubernetes cluster, which allows for container management, auto-scaling, and self-healing capabilities. 
+A load balancer sits in front of the Kubernetes cluster, directing traffic and making sure there is an even load distribution across the application nodes.
+This is the entry point where all other services will interact with Infisical.
+
+### Object Storage
+The architecture requires S3-compatible object storage for database backups and cross-datacenter replication. This can be provided by:
+- Existing enterprise object storage solution
+- Dedicated MinIO deployment
+- In-cluster MinIO deployment if neither option above is available
+
+The object storage must be accessible from all Kubernetes clusters and provides:
+- Storage for PostgreSQL WAL archiving and backups
+- Storage for Redis backups
+
+### CloudNativePG for High Availability PostgreSQL
+The database layer is powered by PostgreSQL, managed by CloudNativePG operator for high availability:
+- **Redundancy:** CloudNativePG manages a primary-replica setup where the primary handles write operations and replicas handle read operations
+- **Failover:** The operator automatically handles failover within a cluster by promoting a replica to primary when needed
+- **Backup and Recovery:** Built-in support for backup to S3-compatible storage with point-in-time recovery capabilities
+
+### Redis High Availability
+Redis is deployed using the [Bitnami Helm chart](https://github.com/bitnami/charts/tree/main/bitnami/redis) in a simple primary configuration:
+- Single Redis instance per cluster without streaming replication
+- Regular backups to object storage
+- Restore from backup during failover
+
+<Note>
+Infisical does not support Redis cluster mode, and since this is an active-passive setup, we use a simple Redis deployment with backup/restore for failover.
+</Note>
+
+#### PostgreSQL Backup and Restore
+PostgreSQL is the single source of truth for nearly all application data on Infisical.
+
+CloudNativePG provides well defined backup and restore capabilities:
+- **Continuous Backup:** The operator continuously archives WAL files to object storage
+- **Point-in-Time Recovery:** Supports restoring to any point in time using WAL archiving
+- **Regular Testing:** Periodically test backup restoration to exercise the full lifecycle of this process
+
+#### Redis Backup and Restore
+Each Redis instance is backed up through a Kubernetes CronJob that:
+1. Executes the Redis `SAVE` command
+2. Copies the resulting `dump.rdb` to object storage
+3. Manages backup retention
+
+<Accordion title="Example Redis backup CronJob">
+    ```yaml
+    apiVersion: batch/v1
+    kind: CronJob
+    metadata:
+    name: redis-backup
+    spec:
+    schedule: "0 * * * *"  # Every hour
+    jobTemplate:
+        spec:
+        template:
+            spec:
+            containers:
+            - name: redis-backup
+                image: bitnami/redis
+                command:
+                - /bin/sh
+                - -c
+                - |
+                redis-cli -a $REDIS_PASSWORD save
+                mc cp /data/dump.rdb object-store/redis-backups/
+            volumes:
+            - name: redis-data
+                persistentVolumeClaim:
+                claimName: redis-data
+    ```
+</Accordion>
+
+During failover, the latest Redis backup is restored from object storage to the passive data center. This process is manual and requires operator intervention.
+
+## Multi Data Center Deployment
+Infisical can be deployed across multiple data centers in an active-passive configuration for disaster recovery. In this setup, one data center serves as the active site while others remain as passive standbys.
+
+### Active Data Center 
+The active data center contains:
+- The primary PostgreSQL cluster managed by CloudNativePG handling all write operations
+- The active Redis instance handling all traffic
+- The active Infisical deployment serving all user traffic
+
+### Passive Data Centers
+Passive data centers act as disaster recovery sites. Each contains:
+- A replica PostgreSQL cluster that replicates from the active site's primary cluster
+- A standby Redis instance (not receiving traffic)
+- A standby Infisical deployment (not receiving traffic)
+
+### Traffic Management and Failover
+Traffic routing between data centers requires:
+1. A global load balancer for traffic management. For on-premises deployments, this can be implemented using:
+   - HAProxy or NGINX configured as a global load balancer
+   - Any enterprise network routing solutions you may already have in place
+2. Each data center should have its own ingress or load balancer
+
+The global load balancer should be deployed in a highly available configuration across multiple locations to avoid it becoming a single point of failure.
+
+During normal operation:
+- The global load balancer routes all traffic to the active data center
+- Replica PostgreSQL clusters continuously replicate from the primary cluster
+- Redis backups are regularly created and stored in object storage
+
+During failover:
+- A human operator must initiate the failover process
+- The operator promotes a replica PostgreSQL cluster in the target passive data center to become primary using CloudNativePG's promotion process
+- The latest Redis backup is restored from object storage to the passive data center's Redis instance
+- Once database failover is complete, the global load balancer is updated to direct traffic to the new active data center
+
+<Note>
+This is an active-passive setup where failover must be initiated manually by an operator. Automatic failover between data centers is not recommended as it can lead to split-brain scenarios. The operator should verify the state of both data centers before initiating failover.
+</Note>
+
+## Data Replication Across Data Centers
+
+### PostgreSQL Replication
+CloudNativePG manages replication across data centers:
+- **Replica Clusters:** Each data center runs a replica cluster that replicates from the primary cluster
+- **WAL Shipping:** Changes are replicated via WAL shipping to object storage
+- **Failover:** The operator can promote a replica cluster to primary during planned switchovers or failures
+
+### Object Storage Configuration
+If using MinIO for object storage, ensure:
+- High availability deployment if running dedicated MinIO cluster
+- Proper access controls and encryption for data at rest
+- Regular monitoring of storage capacity and performance
+- Backup of object storage data itself if running your own MinIO deployment

frontend/src/hooks/api/identities/mutations.tsx

@@ -923,7 +923,7 @@ export const useAddIdentityTokenAuth = () => {
       });
       queryClient.invalidateQueries({ queryKey: identitiesKeys.getIdentityById(identityId) });
       queryClient.invalidateQueries({
-        queryKey: identitiesKeys.getIdentityUniversalAuth(identityId)
+        queryKey: identitiesKeys.getIdentityTokenAuth(identityId)
       });
     }
   });
@@ -959,7 +959,7 @@ export const useUpdateIdentityTokenAuth = () => {
       });
       queryClient.invalidateQueries({ queryKey: identitiesKeys.getIdentityById(identityId) });
       queryClient.invalidateQueries({
-        queryKey: identitiesKeys.getIdentityUniversalAuth(identityId)
+        queryKey: identitiesKeys.getIdentityTokenAuth(identityId)
       });
     }
   });

frontend/src/hooks/api/reactQuery.tsx

@@ -182,7 +182,7 @@ export const queryClient = new QueryClient({
         createNotification({
           title: "Bad Request",
           type: "error",
-          text: `${serverResponse.message}${serverResponse.message.endsWith(".") ? "" : "."}`,
+          text: `${serverResponse.message}${serverResponse.message?.endsWith(".") ? "" : "."}`,
           copyActions: [
             {
               value: serverResponse.reqId,

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityAuthMethodModal.tsx

@@ -7,10 +7,10 @@ import { UsePopUpState } from "@app/hooks/usePopUp";
 import { IdentityAuthMethodModalContent } from "./IdentityAuthMethodModalContent";
 
 type Props = {
-  popUp: UsePopUpState<["identityAuthMethod", "upgradePlan", "revokeAuthMethod"]>;
+  popUp: UsePopUpState<["identityAuthMethod", "upgradePlan"]>;
   handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan"]>) => void;
   handlePopUpToggle: (
-    popUpName: keyof UsePopUpState<["identityAuthMethod", "upgradePlan", "revokeAuthMethod"]>,
+    popUpName: keyof UsePopUpState<["identityAuthMethod", "upgradePlan"]>,
     state?: boolean
   ) => void;
 };
@@ -34,7 +34,7 @@ export const IdentityAuthMethodModal = ({ popUp, handlePopUpOpen, handlePopUpTog
         title={
           isSelectedAuthAlreadyConfigured
             ? `Edit ${identityAuthToNameMap[selectedAuthMethod!] ?? ""}`
-            : `Create new ${identityAuthToNameMap[selectedAuthMethod!] ?? ""}`
+            : `Add ${identityAuthToNameMap[selectedAuthMethod!] ?? ""}`
         }
       >
         <IdentityAuthMethodModalContent

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityAuthMethodModalContent.tsx

@@ -4,30 +4,8 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 
 import { UpgradePlanModal } from "@app/components/license/UpgradePlanModal";
-import { createNotification } from "@app/components/notifications";
+import { Badge, FormControl, Select, SelectItem, Tooltip } from "@app/components/v2";
-import {
+import { IdentityAuthMethod } from "@app/hooks/api/identities";
-  Badge,
-  DeleteActionModal,
-  FormControl,
-  Select,
-  SelectItem,
-  Tooltip
-} from "@app/components/v2";
-import { useOrganization } from "@app/context";
-import {
-  useDeleteIdentityAwsAuth,
-  useDeleteIdentityAzureAuth,
-  useDeleteIdentityGcpAuth,
-  useDeleteIdentityKubernetesAuth,
-  useDeleteIdentityOidcAuth,
-  useDeleteIdentityTokenAuth,
-  useDeleteIdentityUniversalAuth
-} from "@app/hooks/api";
-import {
-  IdentityAuthMethod,
-  identityAuthToNameMap,
-  useDeleteIdentityJwtAuth
-} from "@app/hooks/api/identities";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
 import { IdentityAwsAuthForm } from "./IdentityAwsAuthForm";
@@ -40,10 +18,10 @@ import { IdentityTokenAuthForm } from "./IdentityTokenAuthForm";
 import { IdentityUniversalAuthForm } from "./IdentityUniversalAuthForm";
 
 type Props = {
-  popUp: UsePopUpState<["identityAuthMethod", "upgradePlan", "revokeAuthMethod"]>;
+  popUp: UsePopUpState<["identityAuthMethod", "upgradePlan"]>;
   handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan"]>) => void;
   handlePopUpToggle: (
-    popUpName: keyof UsePopUpState<["identityAuthMethod", "upgradePlan", "revokeAuthMethod"]>,
+    popUpName: keyof UsePopUpState<["identityAuthMethod", "upgradePlan"]>,
     state?: boolean
   ) => void;
 
@@ -56,13 +34,7 @@ type Props = {
   setSelectedAuthMethod: (authMethod: IdentityAuthMethod) => void;
 };
 
-type TRevokeOptions = {
-  identityId: string;
-  organizationId: string;
-};
-
 type TRevokeMethods = {
-  revokeMethod: (revokeOptions: TRevokeOptions) => Promise<any>;
   render: () => JSX.Element;
 };
 
@@ -96,18 +68,6 @@ export const IdentityAuthMethodModalContent = ({
   initialAuthMethod,
   setSelectedAuthMethod
 }: Props) => {
-  const { currentOrg } = useOrganization();
-  const orgId = currentOrg?.id || "";
-
-  const { mutateAsync: revokeUniversalAuth } = useDeleteIdentityUniversalAuth();
-  const { mutateAsync: revokeTokenAuth } = useDeleteIdentityTokenAuth();
-  const { mutateAsync: revokeKubernetesAuth } = useDeleteIdentityKubernetesAuth();
-  const { mutateAsync: revokeGcpAuth } = useDeleteIdentityGcpAuth();
-  const { mutateAsync: revokeAwsAuth } = useDeleteIdentityAwsAuth();
-  const { mutateAsync: revokeAzureAuth } = useDeleteIdentityAzureAuth();
-  const { mutateAsync: revokeOidcAuth } = useDeleteIdentityOidcAuth();
-  const { mutateAsync: revokeJwtAuth } = useDeleteIdentityJwtAuth();
-
   const { control, watch } = useForm<FormData>({
     resolver: zodResolver(schema),
     defaultValues: async () => {
@@ -149,10 +109,9 @@ export const IdentityAuthMethodModalContent = ({
 
   const methodMap: Record<IdentityAuthMethod, TRevokeMethods | undefined> = {
     [IdentityAuthMethod.UNIVERSAL_AUTH]: {
-      revokeMethod: revokeUniversalAuth,
       render: () => (
         <IdentityUniversalAuthForm
-          identityAuthMethodData={identityAuthMethodData}
+          identityId={identityAuthMethodData.identityId}
           handlePopUpOpen={handlePopUpOpen}
           handlePopUpToggle={handlePopUpToggle}
         />
@@ -160,10 +119,9 @@ export const IdentityAuthMethodModalContent = ({
     },
 
     [IdentityAuthMethod.OIDC_AUTH]: {
-      revokeMethod: revokeOidcAuth,
       render: () => (
         <IdentityOidcAuthForm
-          identityAuthMethodData={identityAuthMethodData}
+          identityId={identityAuthMethodData.identityId}
           handlePopUpOpen={handlePopUpOpen}
           handlePopUpToggle={handlePopUpToggle}
         />
@@ -171,10 +129,9 @@ export const IdentityAuthMethodModalContent = ({
     },
 
     [IdentityAuthMethod.TOKEN_AUTH]: {
-      revokeMethod: revokeTokenAuth,
       render: () => (
         <IdentityTokenAuthForm
-          identityAuthMethodData={identityAuthMethodData}
+          identityId={identityAuthMethodData.identityId}
           handlePopUpOpen={handlePopUpOpen}
           handlePopUpToggle={handlePopUpToggle}
         />
@@ -182,10 +139,9 @@ export const IdentityAuthMethodModalContent = ({
     },
 
     [IdentityAuthMethod.AZURE_AUTH]: {
-      revokeMethod: revokeAzureAuth,
       render: () => (
         <IdentityAzureAuthForm
-          identityAuthMethodData={identityAuthMethodData}
+          identityId={identityAuthMethodData.identityId}
           handlePopUpOpen={handlePopUpOpen}
           handlePopUpToggle={handlePopUpToggle}
         />
@@ -193,10 +149,9 @@ export const IdentityAuthMethodModalContent = ({
     },
 
     [IdentityAuthMethod.GCP_AUTH]: {
-      revokeMethod: revokeGcpAuth,
       render: () => (
         <IdentityGcpAuthForm
-          identityAuthMethodData={identityAuthMethodData}
+          identityId={identityAuthMethodData.identityId}
           handlePopUpOpen={handlePopUpOpen}
           handlePopUpToggle={handlePopUpToggle}
         />
@@ -204,10 +159,9 @@ export const IdentityAuthMethodModalContent = ({
     },
 
     [IdentityAuthMethod.KUBERNETES_AUTH]: {
-      revokeMethod: revokeKubernetesAuth,
       render: () => (
         <IdentityKubernetesAuthForm
-          identityAuthMethodData={identityAuthMethodData}
+          identityId={identityAuthMethodData.identityId}
           handlePopUpOpen={handlePopUpOpen}
           handlePopUpToggle={handlePopUpToggle}
         />
@@ -215,10 +169,9 @@ export const IdentityAuthMethodModalContent = ({
     },
 
     [IdentityAuthMethod.AWS_AUTH]: {
-      revokeMethod: revokeAwsAuth,
       render: () => (
         <IdentityAwsAuthForm
-          identityAuthMethodData={identityAuthMethodData}
+          identityId={identityAuthMethodData.identityId}
           handlePopUpOpen={handlePopUpOpen}
           handlePopUpToggle={handlePopUpToggle}
         />
@@ -226,10 +179,9 @@ export const IdentityAuthMethodModalContent = ({
     },
 
     [IdentityAuthMethod.JWT_AUTH]: {
-      revokeMethod: revokeJwtAuth,
       render: () => (
         <IdentityJwtAuthForm
-          identityAuthMethodData={identityAuthMethodData}
+          identityId={identityAuthMethodData.identityId}
           handlePopUpOpen={handlePopUpOpen}
           handlePopUpToggle={handlePopUpToggle}
         />
@@ -294,42 +246,6 @@ export const IdentityAuthMethodModalContent = ({
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
         text="You can use IP allowlisting if you switch to Infisical's Pro plan."
       />
-      <DeleteActionModal
-        isOpen={popUp?.revokeAuthMethod?.isOpen}
-        title={`Are you sure want to remove ${
-          identityAuthMethodData?.authMethod
-            ? identityAuthToNameMap[identityAuthMethodData.authMethod]
-            : "the auth method"
-        } on ${identityAuthMethodData?.name ?? ""}?`}
-        onChange={(isOpen) => handlePopUpToggle("revokeAuthMethod", isOpen)}
-        deleteKey="confirm"
-        buttonText="Remove"
-        onDeleteApproved={async () => {
-          if (!identityAuthMethodData.authMethod || !orgId || !selectedMethodItem) {
-            return;
-          }
-
-          try {
-            await selectedMethodItem.revokeMethod({
-              identityId: identityAuthMethodData.identityId,
-              organizationId: orgId
-            });
-
-            createNotification({
-              text: "Successfully removed auth method",
-              type: "success"
-            });
-
-            handlePopUpToggle("revokeAuthMethod", false);
-            handlePopUpToggle("identityAuthMethod", false);
-          } catch {
-            createNotification({
-              text: "Failed to remove auth method",
-              type: "error"
-            });
-          }
-        }}
-      />
     </>
   );
 };

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityAwsAuthForm.tsx

@@ -1,4 +1,4 @@
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { Controller, useFieldArray, useForm } from "react-hook-form";
 import { faPlus, faXmark } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -6,17 +6,27 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 
 import { createNotification } from "@app/components/notifications";
-import { Button, FormControl, IconButton, Input } from "@app/components/v2";
+import {
+  Button,
+  FormControl,
+  IconButton,
+  Input,
+  Tab,
+  TabList,
+  TabPanel,
+  Tabs
+} from "@app/components/v2";
 import { useOrganization, useSubscription } from "@app/context";
 import {
   useAddIdentityAwsAuth,
   useGetIdentityAwsAuth,
   useUpdateIdentityAwsAuth
 } from "@app/hooks/api";
-import { IdentityAuthMethod } from "@app/hooks/api/identities";
 import { IdentityTrustedIp } from "@app/hooks/api/identities/types";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
+import { IdentityFormTab } from "./types";
+
 const schema = z
   .object({
     stsEndpoint: z.string(),
@@ -49,21 +59,18 @@ export type FormData = z.infer<typeof schema>;
 type Props = {
   handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan"]>) => void;
   handlePopUpToggle: (
-    popUpName: keyof UsePopUpState<["identityAuthMethod", "revokeAuthMethod"]>,
+    popUpName: keyof UsePopUpState<["identityAuthMethod"]>,
     state?: boolean
   ) => void;
-  identityAuthMethodData: {
+  identityId?: string;
-    identityId: string;
+  isUpdate?: boolean;
-    name: string;
-    configuredAuthMethods?: IdentityAuthMethod[];
-    authMethod?: IdentityAuthMethod;
-  };
 };
 
 export const IdentityAwsAuthForm = ({
   handlePopUpOpen,
   handlePopUpToggle,
-  identityAuthMethodData
+  identityId,
+  isUpdate
 }: Props) => {
   const { currentOrg } = useOrganization();
   const orgId = currentOrg?.id || "";
@@ -71,11 +78,9 @@ export const IdentityAwsAuthForm = ({
 
   const { mutateAsync: addMutateAsync } = useAddIdentityAwsAuth();
   const { mutateAsync: updateMutateAsync } = useUpdateIdentityAwsAuth();
+  const [tabValue, setTabValue] = useState<IdentityFormTab>(IdentityFormTab.Configuration);
 
-  const isUpdate = identityAuthMethodData?.configuredAuthMethods?.includes(
+  const { data } = useGetIdentityAwsAuth(identityId ?? "", {
-    identityAuthMethodData.authMethod! || ""
-  );
-  const { data } = useGetIdentityAwsAuth(identityAuthMethodData?.identityId ?? "", {
     enabled: isUpdate
   });
 
@@ -143,7 +148,7 @@ export const IdentityAwsAuthForm = ({
     accessTokenTrustedIps
   }: FormData) => {
     try {
-      if (!identityAuthMethodData) return;
+      if (!identityId) return;
 
       if (data) {
         await updateMutateAsync({
@@ -151,7 +156,7 @@ export const IdentityAwsAuthForm = ({
           stsEndpoint,
           allowedPrincipalArns,
           allowedAccountIds,
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           accessTokenTTL: Number(accessTokenTTL),
           accessTokenMaxTTL: Number(accessTokenMaxTTL),
           accessTokenNumUsesLimit: Number(accessTokenNumUsesLimit),
@@ -160,7 +165,7 @@ export const IdentityAwsAuthForm = ({
       } else {
         await addMutateAsync({
           organizationId: orgId,
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           stsEndpoint: stsEndpoint || "",
           allowedPrincipalArns: allowedPrincipalArns || "",
           allowedAccountIds: allowedAccountIds || "",
@@ -188,7 +193,21 @@ export const IdentityAwsAuthForm = ({
   };
 
   return (
-    <form onSubmit={handleSubmit(onFormSubmit)}>
+    <form
+      onSubmit={handleSubmit(onFormSubmit, (fields) => {
+        setTabValue(
+          ["accessTokenTrustedIps"].includes(Object.keys(fields)[0])
+            ? IdentityFormTab.Advanced
+            : IdentityFormTab.Configuration
+        );
+      })}
+    >
+      <Tabs value={tabValue} onValueChange={(value) => setTabValue(value as IdentityFormTab)}>
+        <TabList>
+          <Tab value={IdentityFormTab.Configuration}>Configuration</Tab>
+          <Tab value={IdentityFormTab.Advanced}>Advanced</Tab>
+        </TabList>
+        <TabPanel value={IdentityFormTab.Configuration}>
           <Controller
             control={control}
             defaultValue="2592000"
@@ -240,7 +259,7 @@ export const IdentityAwsAuthForm = ({
                 isError={Boolean(error)}
                 errorText={error?.message}
               >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
               </FormControl>
             )}
           />
@@ -254,7 +273,7 @@ export const IdentityAwsAuthForm = ({
                 isError={Boolean(error)}
                 errorText={error?.message}
               >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
               </FormControl>
             )}
           />
@@ -272,6 +291,8 @@ export const IdentityAwsAuthForm = ({
               </FormControl>
             )}
           />
+        </TabPanel>
+        <TabPanel value={IdentityFormTab.Advanced}>
           {accessTokenTrustedIpsFields.map(({ id }, index) => (
             <div className="mb-3 flex items-end space-x-2" key={id}>
               <Controller
@@ -340,7 +361,8 @@ export const IdentityAwsAuthForm = ({
               Add IP Address
             </Button>
           </div>
-      <div className="flex justify-between">
+        </TabPanel>
+      </Tabs>
       <div className="flex items-center">
         <Button
           className="mr-4"
@@ -349,7 +371,7 @@ export const IdentityAwsAuthForm = ({
           isLoading={isSubmitting}
           isDisabled={isSubmitting}
         >
-            {!isUpdate ? "Create" : "Edit"}
+          {isUpdate ? "Update" : "Add"}
         </Button>
 
         <Button
@@ -360,18 +382,6 @@ export const IdentityAwsAuthForm = ({
           Cancel
         </Button>
       </div>
-        {isUpdate && (
-          <Button
-            size="sm"
-            colorSchema="danger"
-            isLoading={isSubmitting}
-            isDisabled={isSubmitting}
-            onClick={() => handlePopUpToggle("revokeAuthMethod", true)}
-          >
-            Remove Auth Method
-          </Button>
-        )}
-      </div>
     </form>
   );
 };

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityAzureAuthForm.tsx

@@ -1,4 +1,4 @@
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { Controller, useFieldArray, useForm } from "react-hook-form";
 import { faPlus, faXmark } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -6,17 +6,27 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 
 import { createNotification } from "@app/components/notifications";
-import { Button, FormControl, IconButton, Input } from "@app/components/v2";
+import {
+  Button,
+  FormControl,
+  IconButton,
+  Input,
+  Tab,
+  TabList,
+  TabPanel,
+  Tabs
+} from "@app/components/v2";
 import { useOrganization, useSubscription } from "@app/context";
 import {
   useAddIdentityAzureAuth,
   useGetIdentityAzureAuth,
   useUpdateIdentityAzureAuth
 } from "@app/hooks/api";
-import { IdentityAuthMethod } from "@app/hooks/api/identities";
 import { IdentityTrustedIp } from "@app/hooks/api/identities/types";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
+import { IdentityFormTab } from "./types";
+
 const schema = z
   .object({
     tenantId: z.string().min(1),
@@ -44,21 +54,18 @@ export type FormData = z.infer<typeof schema>;
 type Props = {
   handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan"]>) => void;
   handlePopUpToggle: (
-    popUpName: keyof UsePopUpState<["identityAuthMethod", "revokeAuthMethod"]>,
+    popUpName: keyof UsePopUpState<["identityAuthMethod"]>,
     state?: boolean
   ) => void;
-  identityAuthMethodData: {
+  identityId?: string;
-    identityId: string;
+  isUpdate?: boolean;
-    name: string;
-    configuredAuthMethods?: IdentityAuthMethod[];
-    authMethod?: IdentityAuthMethod;
-  };
 };
 
 export const IdentityAzureAuthForm = ({
   handlePopUpOpen,
   handlePopUpToggle,
-  identityAuthMethodData
+  identityId,
+  isUpdate
 }: Props) => {
   const { currentOrg } = useOrganization();
   const orgId = currentOrg?.id || "";
@@ -66,11 +73,9 @@ export const IdentityAzureAuthForm = ({
 
   const { mutateAsync: addMutateAsync } = useAddIdentityAzureAuth();
   const { mutateAsync: updateMutateAsync } = useUpdateIdentityAzureAuth();
+  const [tabValue, setTabValue] = useState<IdentityFormTab>(IdentityFormTab.Configuration);
 
-  const isUpdate = identityAuthMethodData?.configuredAuthMethods?.includes(
+  const { data } = useGetIdentityAzureAuth(identityId ?? "", {
-    identityAuthMethodData.authMethod! || ""
-  );
-  const { data } = useGetIdentityAzureAuth(identityAuthMethodData?.identityId ?? "", {
     enabled: isUpdate
   });
 
@@ -139,12 +144,12 @@ export const IdentityAzureAuthForm = ({
     accessTokenTrustedIps
   }: FormData) => {
     try {
-      if (!identityAuthMethodData) return;
+      if (!identityId) return;
 
       if (data) {
         await updateMutateAsync({
           organizationId: orgId,
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           tenantId,
           resource,
           allowedServicePrincipalIds,
@@ -156,7 +161,7 @@ export const IdentityAzureAuthForm = ({
       } else {
         await addMutateAsync({
           organizationId: orgId,
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           tenantId: tenantId || "",
           resource: resource || "",
           allowedServicePrincipalIds: allowedServicePrincipalIds || "",
@@ -184,7 +189,21 @@ export const IdentityAzureAuthForm = ({
   };
 
   return (
-    <form onSubmit={handleSubmit(onFormSubmit)}>
+    <form
+      onSubmit={handleSubmit(onFormSubmit, (fields) => {
+        setTabValue(
+          ["accessTokenTrustedIps"].includes(Object.keys(fields)[0])
+            ? IdentityFormTab.Advanced
+            : IdentityFormTab.Configuration
+        );
+      })}
+    >
+      <Tabs value={tabValue} onValueChange={(value) => setTabValue(value as IdentityFormTab)}>
+        <TabList>
+          <Tab value={IdentityFormTab.Configuration}>Configuration</Tab>
+          <Tab value={IdentityFormTab.Advanced}>Advanced</Tab>
+        </TabList>
+        <TabPanel value={IdentityFormTab.Configuration}>
           <Controller
             control={control}
             defaultValue="2592000"
@@ -236,7 +255,7 @@ export const IdentityAzureAuthForm = ({
                 isError={Boolean(error)}
                 errorText={error?.message}
               >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
               </FormControl>
             )}
           />
@@ -250,7 +269,7 @@ export const IdentityAzureAuthForm = ({
                 isError={Boolean(error)}
                 errorText={error?.message}
               >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
               </FormControl>
             )}
           />
@@ -268,6 +287,8 @@ export const IdentityAzureAuthForm = ({
               </FormControl>
             )}
           />
+        </TabPanel>
+        <TabPanel value={IdentityFormTab.Advanced}>
           {accessTokenTrustedIpsFields.map(({ id }, index) => (
             <div className="mb-3 flex items-end space-x-2" key={id}>
               <Controller
@@ -336,7 +357,8 @@ export const IdentityAzureAuthForm = ({
               Add IP Address
             </Button>
           </div>
-      <div className="flex justify-between">
+        </TabPanel>
+      </Tabs>
       <div className="flex items-center">
         <Button
           className="mr-4"
@@ -345,7 +367,7 @@ export const IdentityAzureAuthForm = ({
           isLoading={isSubmitting}
           isDisabled={isSubmitting}
         >
-            {!isUpdate ? "Create" : "Edit"}
+          {isUpdate ? "Update" : "Add"}
         </Button>
 
         <Button
@@ -356,18 +378,6 @@ export const IdentityAzureAuthForm = ({
           Cancel
         </Button>
       </div>
-        {isUpdate && (
-          <Button
-            size="sm"
-            colorSchema="danger"
-            isLoading={isSubmitting}
-            isDisabled={isSubmitting}
-            onClick={() => handlePopUpToggle("revokeAuthMethod", true)}
-          >
-            Remove Auth Method
-          </Button>
-        )}
-      </div>
     </form>
   );
 };

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityGcpAuthForm.tsx

@@ -1,4 +1,4 @@
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { Controller, useFieldArray, useForm } from "react-hook-form";
 import { faPlus, faXmark } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -6,17 +6,29 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 
 import { createNotification } from "@app/components/notifications";
-import { Button, FormControl, IconButton, Input, Select, SelectItem } from "@app/components/v2";
+import {
+  Button,
+  FormControl,
+  IconButton,
+  Input,
+  Select,
+  SelectItem,
+  Tab,
+  TabList,
+  TabPanel,
+  Tabs
+} from "@app/components/v2";
 import { useOrganization, useSubscription } from "@app/context";
 import {
   useAddIdentityGcpAuth,
   useGetIdentityGcpAuth,
   useUpdateIdentityGcpAuth
 } from "@app/hooks/api";
-import { IdentityAuthMethod } from "@app/hooks/api/identities";
 import { IdentityTrustedIp } from "@app/hooks/api/identities/types";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
+import { IdentityFormTab } from "./types";
+
 const schema = z
   .object({
     type: z.enum(["iam", "gce"]),
@@ -45,21 +57,18 @@ export type FormData = z.infer<typeof schema>;
 type Props = {
   handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan"]>) => void;
   handlePopUpToggle: (
-    popUpName: keyof UsePopUpState<["identityAuthMethod", "revokeAuthMethod"]>,
+    popUpName: keyof UsePopUpState<["identityAuthMethod"]>,
     state?: boolean
   ) => void;
-  identityAuthMethodData: {
+  identityId?: string;
-    identityId: string;
+  isUpdate?: boolean;
-    name: string;
-    configuredAuthMethods?: IdentityAuthMethod[];
-    authMethod?: IdentityAuthMethod;
-  };
 };
 
 export const IdentityGcpAuthForm = ({
   handlePopUpOpen,
   handlePopUpToggle,
-  identityAuthMethodData
+  identityId,
+  isUpdate
 }: Props) => {
   const { currentOrg } = useOrganization();
   const orgId = currentOrg?.id || "";
@@ -67,11 +76,9 @@ export const IdentityGcpAuthForm = ({
 
   const { mutateAsync: addMutateAsync } = useAddIdentityGcpAuth();
   const { mutateAsync: updateMutateAsync } = useUpdateIdentityGcpAuth();
+  const [tabValue, setTabValue] = useState<IdentityFormTab>(IdentityFormTab.Configuration);
 
-  const isUpdate = identityAuthMethodData?.configuredAuthMethods?.includes(
+  const { data } = useGetIdentityGcpAuth(identityId ?? "", {
-    identityAuthMethodData.authMethod! || ""
-  );
-  const { data } = useGetIdentityGcpAuth(identityAuthMethodData?.identityId ?? "", {
     enabled: isUpdate
   });
 
@@ -146,11 +153,11 @@ export const IdentityGcpAuthForm = ({
     accessTokenTrustedIps
   }: FormData) => {
     try {
-      if (!identityAuthMethodData) return;
+      if (!identityId) return;
 
       if (data) {
         await updateMutateAsync({
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           organizationId: orgId,
           type,
           allowedServiceAccounts,
@@ -163,7 +170,7 @@ export const IdentityGcpAuthForm = ({
         });
       } else {
         await addMutateAsync({
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           organizationId: orgId,
           type,
           allowedServiceAccounts: allowedServiceAccounts || "",
@@ -193,7 +200,21 @@ export const IdentityGcpAuthForm = ({
   };
 
   return (
-    <form onSubmit={handleSubmit(onFormSubmit)}>
+    <form
+      onSubmit={handleSubmit(onFormSubmit, (fields) => {
+        setTabValue(
+          ["accessTokenTrustedIps"].includes(Object.keys(fields)[0])
+            ? IdentityFormTab.Advanced
+            : IdentityFormTab.Configuration
+        );
+      })}
+    >
+      <Tabs value={tabValue} onValueChange={(value) => setTabValue(value as IdentityFormTab)}>
+        <TabList>
+          <Tab value={IdentityFormTab.Configuration}>Configuration</Tab>
+          <Tab value={IdentityFormTab.Advanced}>Advanced</Tab>
+        </TabList>
+        <TabPanel value={IdentityFormTab.Configuration}>
           <Controller
             control={control}
             name="type"
@@ -253,7 +274,11 @@ export const IdentityGcpAuthForm = ({
               control={control}
               name="allowedZones"
               render={({ field, fieldState: { error } }) => (
-            <FormControl label="Allowed Zones" isError={Boolean(error)} errorText={error?.message}>
+                <FormControl
+                  label="Allowed Zones"
+                  isError={Boolean(error)}
+                  errorText={error?.message}
+                >
                   <Input {...field} placeholder="us-west2-a, us-central1-a, ..." />
                 </FormControl>
               )}
@@ -269,7 +294,7 @@ export const IdentityGcpAuthForm = ({
                 isError={Boolean(error)}
                 errorText={error?.message}
               >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
               </FormControl>
             )}
           />
@@ -283,7 +308,7 @@ export const IdentityGcpAuthForm = ({
                 isError={Boolean(error)}
                 errorText={error?.message}
               >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
               </FormControl>
             )}
           />
@@ -301,6 +326,8 @@ export const IdentityGcpAuthForm = ({
               </FormControl>
             )}
           />
+        </TabPanel>
+        <TabPanel value={IdentityFormTab.Advanced}>
           {accessTokenTrustedIpsFields.map(({ id }, index) => (
             <div className="mb-3 flex items-end space-x-2" key={id}>
               <Controller
@@ -369,7 +396,8 @@ export const IdentityGcpAuthForm = ({
               Add IP Address
             </Button>
           </div>
-      <div className="flex justify-between">
+        </TabPanel>
+      </Tabs>
       <div className="flex items-center">
         <Button
           className="mr-4"
@@ -378,7 +406,7 @@ export const IdentityGcpAuthForm = ({
           isLoading={isSubmitting}
           isDisabled={isSubmitting}
         >
-            {!isUpdate ? "Create" : "Edit"}
+          {isUpdate ? "Update" : "Add"}
         </Button>
 
         <Button
@@ -389,18 +417,6 @@ export const IdentityGcpAuthForm = ({
           Cancel
         </Button>
       </div>
-        {isUpdate && (
-          <Button
-            size="sm"
-            colorSchema="danger"
-            isLoading={isSubmitting}
-            isDisabled={isSubmitting}
-            onClick={() => handlePopUpToggle("revokeAuthMethod", true)}
-          >
-            Remove Auth Method
-          </Button>
-        )}
-      </div>
     </form>
   );
 };

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityJwtAuthForm.tsx

@@ -1,4 +1,4 @@
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { Controller, useFieldArray, useForm } from "react-hook-form";
 import { faQuestionCircle } from "@fortawesome/free-regular-svg-icons";
 import { faPlus, faXmark } from "@fortawesome/free-solid-svg-icons";
@@ -14,17 +14,22 @@ import {
   Input,
   Select,
   SelectItem,
+  Tab,
+  TabList,
+  TabPanel,
+  Tabs,
   TextArea,
   Tooltip
 } from "@app/components/v2";
 import { useOrganization, useSubscription } from "@app/context";
 import { useAddIdentityJwtAuth, useUpdateIdentityJwtAuth } from "@app/hooks/api";
-import { IdentityAuthMethod } from "@app/hooks/api/identities";
 import { IdentityJwtConfigurationType } from "@app/hooks/api/identities/enums";
 import { useGetIdentityJwtAuth } from "@app/hooks/api/identities/queries";
 import { IdentityTrustedIp } from "@app/hooks/api/identities/types";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
+import { IdentityFormTab } from "./types";
+
 const commonSchema = z.object({
   accessTokenTrustedIps: z
     .array(
@@ -85,21 +90,18 @@ export type FormData = z.infer<typeof schema>;
 type Props = {
   handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan"]>) => void;
   handlePopUpToggle: (
-    popUpName: keyof UsePopUpState<["identityAuthMethod", "revokeAuthMethod"]>,
+    popUpName: keyof UsePopUpState<["identityAuthMethod"]>,
     state?: boolean
   ) => void;
-  identityAuthMethodData: {
+  identityId?: string;
-    identityId: string;
+  isUpdate?: boolean;
-    name: string;
-    configuredAuthMethods?: IdentityAuthMethod[];
-    authMethod?: IdentityAuthMethod;
-  };
 };
 
 export const IdentityJwtAuthForm = ({
   handlePopUpOpen,
   handlePopUpToggle,
-  identityAuthMethodData
+  identityId,
+  isUpdate
 }: Props) => {
   const { currentOrg } = useOrganization();
   const orgId = currentOrg?.id || "";
@@ -107,11 +109,9 @@ export const IdentityJwtAuthForm = ({
 
   const { mutateAsync: addMutateAsync } = useAddIdentityJwtAuth();
   const { mutateAsync: updateMutateAsync } = useUpdateIdentityJwtAuth();
+  const [tabValue, setTabValue] = useState<IdentityFormTab>(IdentityFormTab.Configuration);
 
-  const isUpdate = identityAuthMethodData?.configuredAuthMethods?.includes(
+  const { data } = useGetIdentityJwtAuth(identityId ?? "", {
-    identityAuthMethodData.authMethod! || ""
-  );
-  const { data } = useGetIdentityJwtAuth(identityAuthMethodData?.identityId ?? "", {
     enabled: isUpdate
   });
 
@@ -218,13 +218,13 @@ export const IdentityJwtAuthForm = ({
     boundSubject
   }: FormData) => {
     try {
-      if (!identityAuthMethodData) {
+      if (!identityId) {
         return;
       }
 
       if (data) {
         await updateMutateAsync({
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           organizationId: orgId,
           configurationType,
           jwksUrl,
@@ -241,7 +241,7 @@ export const IdentityJwtAuthForm = ({
         });
       } else {
         await addMutateAsync({
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           configurationType,
           jwksUrl,
           jwksCaCert,
@@ -275,7 +275,21 @@ export const IdentityJwtAuthForm = ({
   };
 
   return (
-    <form onSubmit={handleSubmit(onFormSubmit)}>
+    <form
+      onSubmit={handleSubmit(onFormSubmit, (fields) => {
+        setTabValue(
+          ["accessTokenTrustedIps"].includes(Object.keys(fields)[0])
+            ? IdentityFormTab.Advanced
+            : IdentityFormTab.Configuration
+        );
+      })}
+    >
+      <Tabs value={tabValue} onValueChange={(value) => setTabValue(value as IdentityFormTab)}>
+        <TabList>
+          <Tab value={IdentityFormTab.Configuration}>Configuration</Tab>
+          <Tab value={IdentityFormTab.Advanced}>Advanced</Tab>
+        </TabList>
+        <TabPanel value={IdentityFormTab.Configuration}>
           <Controller
             control={control}
             name="configurationType"
@@ -345,7 +359,6 @@ export const IdentityJwtAuthForm = ({
               />
             </>
           )}
-
           {selectedConfigurationType === IdentityJwtConfigurationType.STATIC && (
             <>
               {publicKeyFields.map(({ id }, index) => (
@@ -410,7 +423,6 @@ export const IdentityJwtAuthForm = ({
               </div>
             </>
           )}
-
           <Controller
             control={control}
             name="boundIssuer"
@@ -551,7 +563,7 @@ export const IdentityJwtAuthForm = ({
                 isError={Boolean(error)}
                 errorText={error?.message}
               >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
               </FormControl>
             )}
           />
@@ -565,7 +577,7 @@ export const IdentityJwtAuthForm = ({
                 isError={Boolean(error)}
                 errorText={error?.message}
               >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
               </FormControl>
             )}
           />
@@ -583,6 +595,8 @@ export const IdentityJwtAuthForm = ({
               </FormControl>
             )}
           />
+        </TabPanel>
+        <TabPanel value={IdentityFormTab.Advanced}>
           {accessTokenTrustedIpsFields.map(({ id }, index) => (
             <div className="mb-3 flex items-end space-x-2" key={id}>
               <Controller
@@ -651,7 +665,8 @@ export const IdentityJwtAuthForm = ({
               Add IP Address
             </Button>
           </div>
-      <div className="flex justify-between">
+        </TabPanel>
+      </Tabs>
       <div className="flex items-center">
         <Button
           className="mr-4"
@@ -671,18 +686,6 @@ export const IdentityJwtAuthForm = ({
           Cancel
         </Button>
       </div>
-        {isUpdate && (
-          <Button
-            size="sm"
-            colorSchema="danger"
-            isLoading={isSubmitting}
-            isDisabled={isSubmitting}
-            onClick={() => handlePopUpToggle("revokeAuthMethod", true)}
-          >
-            Remove Auth Method
-          </Button>
-        )}
-      </div>
     </form>
   );
 };

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityKubernetesAuthForm.tsx

@@ -1,4 +1,4 @@
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { Controller, useFieldArray, useForm } from "react-hook-form";
 import { faPlus, faXmark } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -6,17 +6,28 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 
 import { createNotification } from "@app/components/notifications";
-import { Button, FormControl, IconButton, Input, TextArea } from "@app/components/v2";
+import {
+  Button,
+  FormControl,
+  IconButton,
+  Input,
+  Tab,
+  TabList,
+  TabPanel,
+  Tabs,
+  TextArea
+} from "@app/components/v2";
 import { useOrganization, useSubscription } from "@app/context";
 import {
   useAddIdentityKubernetesAuth,
   useGetIdentityKubernetesAuth,
   useUpdateIdentityKubernetesAuth
 } from "@app/hooks/api";
-import { IdentityAuthMethod } from "@app/hooks/api/identities";
 import { IdentityTrustedIp } from "@app/hooks/api/identities/types";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
+import { IdentityFormTab } from "./types";
+
 const schema = z
   .object({
     kubernetesHost: z.string().min(1),
@@ -47,21 +58,18 @@ export type FormData = z.infer<typeof schema>;
 type Props = {
   handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan"]>) => void;
   handlePopUpToggle: (
-    popUpName: keyof UsePopUpState<["identityAuthMethod", "revokeAuthMethod"]>,
+    popUpName: keyof UsePopUpState<["identityAuthMethod"]>,
     state?: boolean
   ) => void;
-  identityAuthMethodData: {
+  identityId?: string;
-    identityId: string;
+  isUpdate?: boolean;
-    name: string;
-    configuredAuthMethods?: IdentityAuthMethod[];
-    authMethod?: IdentityAuthMethod;
-  };
 };
 
 export const IdentityKubernetesAuthForm = ({
   handlePopUpOpen,
   handlePopUpToggle,
-  identityAuthMethodData
+  identityId,
+  isUpdate
 }: Props) => {
   const { currentOrg } = useOrganization();
   const orgId = currentOrg?.id || "";
@@ -69,11 +77,9 @@ export const IdentityKubernetesAuthForm = ({
 
   const { mutateAsync: addMutateAsync } = useAddIdentityKubernetesAuth();
   const { mutateAsync: updateMutateAsync } = useUpdateIdentityKubernetesAuth();
+  const [tabValue, setTabValue] = useState<IdentityFormTab>(IdentityFormTab.Configuration);
 
-  const isUpdate = identityAuthMethodData?.configuredAuthMethods?.includes(
+  const { data } = useGetIdentityKubernetesAuth(identityId ?? "", {
-    identityAuthMethodData.authMethod! || ""
-  );
-  const { data } = useGetIdentityKubernetesAuth(identityAuthMethodData?.identityId ?? "", {
     enabled: isUpdate
   });
 
@@ -154,7 +160,7 @@ export const IdentityKubernetesAuthForm = ({
     accessTokenTrustedIps
   }: FormData) => {
     try {
-      if (!identityAuthMethodData) return;
+      if (!identityId) return;
 
       if (data) {
         await updateMutateAsync({
@@ -165,7 +171,7 @@ export const IdentityKubernetesAuthForm = ({
           allowedNamespaces,
           allowedAudience,
           caCert,
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           accessTokenTTL: Number(accessTokenTTL),
           accessTokenMaxTTL: Number(accessTokenMaxTTL),
           accessTokenNumUsesLimit: Number(accessTokenNumUsesLimit),
@@ -174,7 +180,7 @@ export const IdentityKubernetesAuthForm = ({
       } else {
         await addMutateAsync({
           organizationId: orgId,
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           kubernetesHost: kubernetesHost || "",
           tokenReviewerJwt,
           allowedNames: allowedNames || "",
@@ -205,7 +211,29 @@ export const IdentityKubernetesAuthForm = ({
   };
 
   return (
-    <form onSubmit={handleSubmit(onFormSubmit)}>
+    <form
+      onSubmit={handleSubmit(onFormSubmit, (fields) => {
+        setTabValue(
+          [
+            "kubernetesHost",
+            "tokenReviewerJwt",
+            "accessTokenTTL",
+            "accessTokenMaxTTL",
+            "accessTokenNumUsesLimit",
+            "allowedNames",
+            "allowedNamespaces"
+          ].includes(Object.keys(fields)[0])
+            ? IdentityFormTab.Configuration
+            : IdentityFormTab.Advanced
+        );
+      })}
+    >
+      <Tabs value={tabValue} onValueChange={(value) => setTabValue(value as IdentityFormTab)}>
+        <TabList>
+          <Tab value={IdentityFormTab.Configuration}>Configuration</Tab>
+          <Tab value={IdentityFormTab.Advanced}>Advanced</Tab>
+        </TabList>
+        <TabPanel value={IdentityFormTab.Configuration}>
           <Controller
             control={control}
             defaultValue="2592000"
@@ -237,6 +265,21 @@ export const IdentityKubernetesAuthForm = ({
               </FormControl>
             )}
           />
+          <Controller
+            control={control}
+            defaultValue=""
+            name="allowedNamespaces"
+            render={({ field, fieldState: { error } }) => (
+              <FormControl
+                label="Allowed Namespaces"
+                isError={Boolean(error)}
+                errorText={error?.message}
+                tooltipText="A comma-separated list of trusted namespaces that service accounts must belong to authenticate with Infisical."
+              >
+                <Input {...field} placeholder="namespaceA, namespaceB" type="text" />
+              </FormControl>
+            )}
+          />
           <Controller
             control={control}
             name="allowedNames"
@@ -253,19 +296,51 @@ export const IdentityKubernetesAuthForm = ({
           />
           <Controller
             control={control}
-        defaultValue=""
+            defaultValue="2592000"
-        name="allowedNamespaces"
+            name="accessTokenTTL"
             render={({ field, fieldState: { error } }) => (
               <FormControl
-            label="Allowed Namespaces"
+                label="Access Token TTL (seconds)"
+                tooltipText="The lifetime for an acccess token in seconds. This value will be referenced at renewal time."
                 isError={Boolean(error)}
                 errorText={error?.message}
-            tooltipText="A comma-separated list of trusted namespaces that service accounts must belong to authenticate with Infisical."
               >
-            <Input {...field} placeholder="namespaceA, namespaceB" type="text" />
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
               </FormControl>
             )}
           />
+          <Controller
+            control={control}
+            defaultValue="2592000"
+            name="accessTokenMaxTTL"
+            render={({ field, fieldState: { error } }) => (
+              <FormControl
+                label="Access Token Max TTL (seconds)"
+                isError={Boolean(error)}
+                errorText={error?.message}
+                tooltipText="The maximum lifetime for an access token in seconds. This value will be referenced at renewal time."
+              >
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
+              </FormControl>
+            )}
+          />
+          <Controller
+            control={control}
+            defaultValue="0"
+            name="accessTokenNumUsesLimit"
+            render={({ field, fieldState: { error } }) => (
+              <FormControl
+                label="Access Token Max Number of Uses"
+                isError={Boolean(error)}
+                errorText={error?.message}
+                tooltipText="The maximum number of times that an access token can be used; a value of 0 implies infinite number of uses."
+              >
+                <Input {...field} placeholder="0" type="number" min="0" step="1" />
+              </FormControl>
+            )}
+          />
+        </TabPanel>
+        <TabPanel value={IdentityFormTab.Advanced}>
           <Controller
             control={control}
             defaultValue=""
@@ -295,51 +370,6 @@ export const IdentityKubernetesAuthForm = ({
               </FormControl>
             )}
           />
-      <Controller
-        control={control}
-        defaultValue="2592000"
-        name="accessTokenTTL"
-        render={({ field, fieldState: { error } }) => (
-          <FormControl
-            label="Access Token TTL (seconds)"
-            tooltipText="The lifetime for an acccess token in seconds. This value will be referenced at renewal time."
-            isError={Boolean(error)}
-            errorText={error?.message}
-          >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
-          </FormControl>
-        )}
-      />
-      <Controller
-        control={control}
-        defaultValue="2592000"
-        name="accessTokenMaxTTL"
-        render={({ field, fieldState: { error } }) => (
-          <FormControl
-            label="Access Token Max TTL (seconds)"
-            isError={Boolean(error)}
-            errorText={error?.message}
-            tooltipText="The maximum lifetime for an access token in seconds. This value will be referenced at renewal time."
-          >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
-          </FormControl>
-        )}
-      />
-      <Controller
-        control={control}
-        defaultValue="0"
-        name="accessTokenNumUsesLimit"
-        render={({ field, fieldState: { error } }) => (
-          <FormControl
-            label="Access Token Max Number of Uses"
-            isError={Boolean(error)}
-            errorText={error?.message}
-            tooltipText="The maximum number of times that an access token can be used; a value of 0 implies infinite number of uses."
-          >
-            <Input {...field} placeholder="0" type="number" min="0" step="1" />
-          </FormControl>
-        )}
-      />
           {accessTokenTrustedIpsFields.map(({ id }, index) => (
             <div className="mb-3 flex items-end space-x-2" key={id}>
               <Controller
@@ -409,7 +439,8 @@ export const IdentityKubernetesAuthForm = ({
               Add IP Address
             </Button>
           </div>
-      <div className="flex justify-between">
+        </TabPanel>
+      </Tabs>
       <div className="flex items-center">
         <Button
           className="mr-4"
@@ -418,7 +449,7 @@ export const IdentityKubernetesAuthForm = ({
           isLoading={isSubmitting}
           isDisabled={isSubmitting}
         >
-            {isUpdate ? "Update" : "Create"}
+          {isUpdate ? "Update" : "Add"}
         </Button>
 
         <Button
@@ -429,18 +460,6 @@ export const IdentityKubernetesAuthForm = ({
           Cancel
         </Button>
       </div>
-        {isUpdate && (
-          <Button
-            size="sm"
-            colorSchema="danger"
-            isLoading={isSubmitting}
-            isDisabled={isSubmitting}
-            onClick={() => handlePopUpToggle("revokeAuthMethod", true)}
-          >
-            Remove Auth Method
-          </Button>
-        )}
-      </div>
     </form>
   );
 };

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityOidcAuthForm.tsx

@@ -1,4 +1,4 @@
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { Controller, useFieldArray, useForm } from "react-hook-form";
 import { faQuestionCircle } from "@fortawesome/free-regular-svg-icons";
 import { faPlus, faXmark } from "@fortawesome/free-solid-svg-icons";
@@ -7,14 +7,26 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 
 import { createNotification } from "@app/components/notifications";
-import { Button, FormControl, IconButton, Input, TextArea, Tooltip } from "@app/components/v2";
+import {
+  Button,
+  FormControl,
+  IconButton,
+  Input,
+  Tab,
+  TabList,
+  TabPanel,
+  Tabs,
+  TextArea,
+  Tooltip
+} from "@app/components/v2";
 import { useOrganization, useSubscription } from "@app/context";
 import { useAddIdentityOidcAuth, useUpdateIdentityOidcAuth } from "@app/hooks/api";
-import { IdentityAuthMethod } from "@app/hooks/api/identities";
 import { useGetIdentityOidcAuth } from "@app/hooks/api/identities/queries";
 import { IdentityTrustedIp } from "@app/hooks/api/identities/types";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
+import { IdentityFormTab } from "./types";
+
 const schema = z.object({
   accessTokenTrustedIps: z
     .array(
@@ -48,21 +60,18 @@ export type FormData = z.infer<typeof schema>;
 type Props = {
   handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan"]>) => void;
   handlePopUpToggle: (
-    popUpName: keyof UsePopUpState<["identityAuthMethod", "revokeAuthMethod"]>,
+    popUpName: keyof UsePopUpState<["identityAuthMethod"]>,
     state?: boolean
   ) => void;
-  identityAuthMethodData: {
+  identityId?: string;
-    identityId: string;
+  isUpdate?: boolean;
-    name: string;
-    configuredAuthMethods?: IdentityAuthMethod[];
-    authMethod?: IdentityAuthMethod;
-  };
 };
 
 export const IdentityOidcAuthForm = ({
   handlePopUpOpen,
   handlePopUpToggle,
-  identityAuthMethodData
+  identityId,
+  isUpdate
 }: Props) => {
   const { currentOrg } = useOrganization();
   const orgId = currentOrg?.id || "";
@@ -70,11 +79,9 @@ export const IdentityOidcAuthForm = ({
 
   const { mutateAsync: addMutateAsync } = useAddIdentityOidcAuth();
   const { mutateAsync: updateMutateAsync } = useUpdateIdentityOidcAuth();
+  const [tabValue, setTabValue] = useState<IdentityFormTab>(IdentityFormTab.Configuration);
 
-  const isUpdate = identityAuthMethodData?.configuredAuthMethods?.includes(
+  const { data } = useGetIdentityOidcAuth(identityId ?? "", {
-    identityAuthMethodData.authMethod! || ""
-  );
-  const { data } = useGetIdentityOidcAuth(identityAuthMethodData?.identityId ?? "", {
     enabled: isUpdate
   });
 
@@ -160,13 +167,13 @@ export const IdentityOidcAuthForm = ({
     boundSubject
   }: FormData) => {
     try {
-      if (!identityAuthMethodData) {
+      if (!identityId) {
         return;
       }
 
       if (data) {
         await updateMutateAsync({
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           organizationId: orgId,
           oidcDiscoveryUrl,
           caCert,
@@ -181,7 +188,7 @@ export const IdentityOidcAuthForm = ({
         });
       } else {
         await addMutateAsync({
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           oidcDiscoveryUrl,
           caCert,
           boundIssuer,
@@ -213,7 +220,21 @@ export const IdentityOidcAuthForm = ({
   };
 
   return (
-    <form onSubmit={handleSubmit(onFormSubmit)}>
+    <form
+      onSubmit={handleSubmit(onFormSubmit, (fields) => {
+        setTabValue(
+          ["accessTokenTrustedIps", "caCert", "boundClaims"].includes(Object.keys(fields)[0])
+            ? IdentityFormTab.Advanced
+            : IdentityFormTab.Configuration
+        );
+      })}
+    >
+      <Tabs value={tabValue} onValueChange={(value) => setTabValue(value as IdentityFormTab)}>
+        <TabList>
+          <Tab value={IdentityFormTab.Configuration}>Configuration</Tab>
+          <Tab value={IdentityFormTab.Advanced}>Advanced</Tab>
+        </TabList>
+        <TabPanel value={IdentityFormTab.Configuration}>
           <Controller
             control={control}
             name="oidcDiscoveryUrl"
@@ -250,15 +271,6 @@ export const IdentityOidcAuthForm = ({
               </FormControl>
             )}
           />
-      <Controller
-        control={control}
-        name="caCert"
-        render={({ field, fieldState: { error } }) => (
-          <FormControl label="CA Certificate" errorText={error?.message} isError={Boolean(error)}>
-            <TextArea {...field} placeholder="-----BEGIN CERTIFICATE----- ..." />
-          </FormControl>
-        )}
-      />
           <Controller
             control={control}
             name="boundSubject"
@@ -301,6 +313,63 @@ export const IdentityOidcAuthForm = ({
               </FormControl>
             )}
           />
+          <Controller
+            control={control}
+            defaultValue="2592000"
+            name="accessTokenTTL"
+            render={({ field, fieldState: { error } }) => (
+              <FormControl
+                label="Access Token TTL (seconds)"
+                isError={Boolean(error)}
+                errorText={error?.message}
+              >
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
+              </FormControl>
+            )}
+          />
+          <Controller
+            control={control}
+            defaultValue="2592000"
+            name="accessTokenMaxTTL"
+            render={({ field, fieldState: { error } }) => (
+              <FormControl
+                label="Access Token Max TTL (seconds)"
+                isError={Boolean(error)}
+                errorText={error?.message}
+              >
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
+              </FormControl>
+            )}
+          />
+          <Controller
+            control={control}
+            defaultValue="0"
+            name="accessTokenNumUsesLimit"
+            render={({ field, fieldState: { error } }) => (
+              <FormControl
+                label="Access Token Max Number of Uses"
+                isError={Boolean(error)}
+                errorText={error?.message}
+              >
+                <Input {...field} placeholder="0" type="number" min="0" step="1" />
+              </FormControl>
+            )}
+          />
+        </TabPanel>
+        <TabPanel value={IdentityFormTab.Advanced}>
+          <Controller
+            control={control}
+            name="caCert"
+            render={({ field, fieldState: { error } }) => (
+              <FormControl
+                label="CA Certificate"
+                errorText={error?.message}
+                isError={Boolean(error)}
+              >
+                <TextArea {...field} placeholder="-----BEGIN CERTIFICATE----- ..." />
+              </FormControl>
+            )}
+          />
           {boundClaimsFields.map(({ id }, index) => (
             <div className="mb-3 flex items-end space-x-2" key={id}>
               <Controller
@@ -380,48 +449,6 @@ export const IdentityOidcAuthForm = ({
               Add Claims
             </Button>
           </div>
-      <Controller
-        control={control}
-        defaultValue="2592000"
-        name="accessTokenTTL"
-        render={({ field, fieldState: { error } }) => (
-          <FormControl
-            label="Access Token TTL (seconds)"
-            isError={Boolean(error)}
-            errorText={error?.message}
-          >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
-          </FormControl>
-        )}
-      />
-      <Controller
-        control={control}
-        defaultValue="2592000"
-        name="accessTokenMaxTTL"
-        render={({ field, fieldState: { error } }) => (
-          <FormControl
-            label="Access Token Max TTL (seconds)"
-            isError={Boolean(error)}
-            errorText={error?.message}
-          >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
-          </FormControl>
-        )}
-      />
-      <Controller
-        control={control}
-        defaultValue="0"
-        name="accessTokenNumUsesLimit"
-        render={({ field, fieldState: { error } }) => (
-          <FormControl
-            label="Access Token Max Number of Uses"
-            isError={Boolean(error)}
-            errorText={error?.message}
-          >
-            <Input {...field} placeholder="0" type="number" min="0" step="1" />
-          </FormControl>
-        )}
-      />
           {accessTokenTrustedIpsFields.map(({ id }, index) => (
             <div className="mb-3 flex items-end space-x-2" key={id}>
               <Controller
@@ -490,7 +517,8 @@ export const IdentityOidcAuthForm = ({
               Add IP Address
             </Button>
           </div>
-      <div className="flex justify-between">
+        </TabPanel>
+      </Tabs>
       <div className="flex items-center">
         <Button
           className="mr-4"
@@ -499,7 +527,7 @@ export const IdentityOidcAuthForm = ({
           isLoading={isSubmitting}
           isDisabled={isSubmitting}
         >
-            {isUpdate ? "Update" : "Create"}
+          {isUpdate ? "Update" : "Add"}
         </Button>
 
         <Button
@@ -510,18 +538,6 @@ export const IdentityOidcAuthForm = ({
           Cancel
         </Button>
       </div>
-        {isUpdate && (
-          <Button
-            size="sm"
-            colorSchema="danger"
-            isLoading={isSubmitting}
-            isDisabled={isSubmitting}
-            onClick={() => handlePopUpToggle("revokeAuthMethod", true)}
-          >
-            Remove Auth Method
-          </Button>
-        )}
-      </div>
     </form>
   );
 };

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityTokenAuthForm.tsx

@@ -1,3 +1,4 @@
+import { useEffect, useState } from "react";
 import { Controller, useFieldArray, useForm } from "react-hook-form";
 import { faPlus, faXmark } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -5,16 +6,27 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 
 import { createNotification } from "@app/components/notifications";
-import { Button, FormControl, IconButton, Input } from "@app/components/v2";
+import {
+  Button,
+  FormControl,
+  IconButton,
+  Input,
+  Tab,
+  TabList,
+  TabPanel,
+  Tabs
+} from "@app/components/v2";
 import { useOrganization, useSubscription } from "@app/context";
 import {
   useAddIdentityTokenAuth,
   useGetIdentityTokenAuth,
   useUpdateIdentityTokenAuth
 } from "@app/hooks/api";
-import { IdentityAuthMethod } from "@app/hooks/api/identities";
+import { IdentityTrustedIp } from "@app/hooks/api/identities/types";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
+import { IdentityFormTab } from "./types";
+
 const schema = z
   .object({
     accessTokenTTL: z.string().refine((val) => Number(val) <= 315360000, {
@@ -39,21 +51,18 @@ export type FormData = z.infer<typeof schema>;
 type Props = {
   handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan"]>) => void;
   handlePopUpToggle: (
-    popUpName: keyof UsePopUpState<["identityAuthMethod", "revokeAuthMethod"]>,
+    popUpName: keyof UsePopUpState<["identityAuthMethod"]>,
     state?: boolean
   ) => void;
-  identityAuthMethodData?: {
+  identityId?: string;
-    identityId: string;
+  isUpdate?: boolean;
-    name: string;
-    configuredAuthMethods?: IdentityAuthMethod[];
-    authMethod?: IdentityAuthMethod;
-  };
 };
 
 export const IdentityTokenAuthForm = ({
   handlePopUpOpen,
   handlePopUpToggle,
-  identityAuthMethodData
+  identityId,
+  isUpdate
 }: Props) => {
   const { currentOrg } = useOrganization();
   const orgId = currentOrg?.id || "";
@@ -61,12 +70,9 @@ export const IdentityTokenAuthForm = ({
 
   const { mutateAsync: addMutateAsync } = useAddIdentityTokenAuth();
   const { mutateAsync: updateMutateAsync } = useUpdateIdentityTokenAuth();
+  const [tabValue, setTabValue] = useState<IdentityFormTab>(IdentityFormTab.Configuration);
 
-  const isUpdate = identityAuthMethodData?.configuredAuthMethods?.includes(
+  const { data } = useGetIdentityTokenAuth(identityId ?? "", {
-    identityAuthMethodData.authMethod! || ""
-  );
-
-  const { data } = useGetIdentityTokenAuth(identityAuthMethodData?.identityId ?? "", {
     enabled: isUpdate
   });
 
@@ -91,6 +97,30 @@ export const IdentityTokenAuthForm = ({
     remove: removeAccessTokenTrustedIp
   } = useFieldArray({ control, name: "accessTokenTrustedIps" });
 
+  useEffect(() => {
+    if (data) {
+      reset({
+        accessTokenTTL: String(data.accessTokenTTL),
+        accessTokenMaxTTL: String(data.accessTokenMaxTTL),
+        accessTokenNumUsesLimit: String(data.accessTokenNumUsesLimit),
+        accessTokenTrustedIps: data.accessTokenTrustedIps.map(
+          ({ ipAddress, prefix }: IdentityTrustedIp) => {
+            return {
+              ipAddress: `${ipAddress}${prefix !== undefined ? `/${prefix}` : ""}`
+            };
+          }
+        )
+      });
+    } else {
+      reset({
+        accessTokenTTL: "2592000",
+        accessTokenMaxTTL: "2592000",
+        accessTokenNumUsesLimit: "0",
+        accessTokenTrustedIps: [{ ipAddress: "0.0.0.0/0" }, { ipAddress: "::/0" }]
+      });
+    }
+  }, [data]);
+
   const onFormSubmit = async ({
     accessTokenTTL,
     accessTokenMaxTTL,
@@ -98,12 +128,12 @@ export const IdentityTokenAuthForm = ({
     accessTokenTrustedIps
   }: FormData) => {
     try {
-      if (!identityAuthMethodData) return;
+      if (!identityId) return;
 
       if (data) {
         await updateMutateAsync({
           organizationId: orgId,
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           accessTokenTTL: Number(accessTokenTTL),
           accessTokenMaxTTL: Number(accessTokenMaxTTL),
           accessTokenNumUsesLimit: Number(accessTokenNumUsesLimit),
@@ -112,7 +142,7 @@ export const IdentityTokenAuthForm = ({
       } else {
         await addMutateAsync({
           organizationId: orgId,
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           accessTokenTTL: Number(accessTokenTTL),
           accessTokenMaxTTL: Number(accessTokenMaxTTL),
           accessTokenNumUsesLimit: Number(accessTokenNumUsesLimit),
@@ -137,7 +167,21 @@ export const IdentityTokenAuthForm = ({
   };
 
   return (
-    <form onSubmit={handleSubmit(onFormSubmit)}>
+    <form
+      onSubmit={handleSubmit(onFormSubmit, (fields) => {
+        setTabValue(
+          ["accessTokenTrustedIps"].includes(Object.keys(fields)[0])
+            ? IdentityFormTab.Advanced
+            : IdentityFormTab.Configuration
+        );
+      })}
+    >
+      <Tabs value={tabValue} onValueChange={(value) => setTabValue(value as IdentityFormTab)}>
+        <TabList>
+          <Tab value={IdentityFormTab.Configuration}>Configuration</Tab>
+          <Tab value={IdentityFormTab.Advanced}>Advanced</Tab>
+        </TabList>
+        <TabPanel value={IdentityFormTab.Configuration}>
           <Controller
             control={control}
             defaultValue="2592000"
@@ -148,7 +192,7 @@ export const IdentityTokenAuthForm = ({
                 isError={Boolean(error)}
                 errorText={error?.message}
               >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
               </FormControl>
             )}
           />
@@ -162,7 +206,7 @@ export const IdentityTokenAuthForm = ({
                 isError={Boolean(error)}
                 errorText={error?.message}
               >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
               </FormControl>
             )}
           />
@@ -180,6 +224,8 @@ export const IdentityTokenAuthForm = ({
               </FormControl>
             )}
           />
+        </TabPanel>
+        <TabPanel value={IdentityFormTab.Advanced}>
           {accessTokenTrustedIpsFields.map(({ id }, index) => (
             <div className="mb-3 flex items-end space-x-2" key={id}>
               <Controller
@@ -248,7 +294,8 @@ export const IdentityTokenAuthForm = ({
               Add IP Address
             </Button>
           </div>
-      <div className="flex justify-between">
+        </TabPanel>
+      </Tabs>
       <div className="flex items-center">
         <Button
           className="mr-4"
@@ -257,7 +304,7 @@ export const IdentityTokenAuthForm = ({
           isLoading={isSubmitting}
           isDisabled={isSubmitting}
         >
-            {isUpdate ? "Update" : "Create"}
+          {isUpdate ? "Update" : "Add"}
         </Button>
 
         <Button
@@ -268,18 +315,6 @@ export const IdentityTokenAuthForm = ({
           Cancel
         </Button>
       </div>
-        {isUpdate && (
-          <Button
-            size="sm"
-            colorSchema="danger"
-            isLoading={isSubmitting}
-            isDisabled={isSubmitting}
-            onClick={() => handlePopUpToggle("revokeAuthMethod", true)}
-          >
-            Remove Auth Method
-          </Button>
-        )}
-      </div>
     </form>
   );
 };

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityUniversalAuthClientSecretModal.tsx

@@ -1,344 +0,0 @@
-import { useEffect, useState } from "react";
-import { Controller, useForm } from "react-hook-form";
-import { useTranslation } from "react-i18next";
-import { faCheck, faCopy, faKey, faXmark } from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { zodResolver } from "@hookform/resolvers/zod";
-import { format } from "date-fns";
-import { z } from "zod";
-
-import { createNotification } from "@app/components/notifications";
-import {
-  Button,
-  // DeleteActionModal,
-  EmptyState,
-  FormControl,
-  IconButton,
-  Input,
-  Modal,
-  ModalContent,
-  Table,
-  TableContainer,
-  TableSkeleton,
-  TBody,
-  Td,
-  Th,
-  THead,
-  Tr
-} from "@app/components/v2";
-import { useToggle } from "@app/hooks";
-import {
-  useCreateIdentityUniversalAuthClientSecret,
-  useGetIdentityUniversalAuth,
-  useGetIdentityUniversalAuthClientSecrets
-} from "@app/hooks/api";
-import { UsePopUpState } from "@app/hooks/usePopUp";
-
-const schema = z.object({
-  description: z.string(),
-  ttl: z
-    .string()
-    .refine((value) => Number(value) <= 315360000, "TTL cannot be greater than 315360000"),
-  numUsesLimit: z.string()
-});
-
-export type FormData = z.infer<typeof schema>;
-
-type Props = {
-  popUp: UsePopUpState<["universalAuthClientSecret", "revokeClientSecret"]>;
-  handlePopUpOpen: (
-    popUpName: keyof UsePopUpState<["revokeClientSecret"]>,
-    data?: {
-      clientSecretPrefix: string;
-      clientSecretId: string;
-    }
-  ) => void;
-  handlePopUpToggle: (
-    popUpName: keyof UsePopUpState<["universalAuthClientSecret", "revokeClientSecret"]>,
-    state?: boolean
-  ) => void;
-};
-
-export const IdentityUniversalAuthClientSecretModal = ({
-  popUp,
-  handlePopUpOpen,
-  handlePopUpToggle
-}: Props) => {
-  const { t } = useTranslation();
-
-  const [token, setToken] = useState("");
-  const [isClientSecretCopied, setIsClientSecretCopied] = useToggle(false);
-  const [isClientIdCopied, setIsClientIdCopied] = useToggle(false);
-
-  const popUpData = popUp?.universalAuthClientSecret?.data as {
-    identityId?: string;
-    name?: string;
-  };
-
-  const { data, isPending } = useGetIdentityUniversalAuthClientSecrets(popUpData?.identityId ?? "");
-  const { data: identityUniversalAuth } = useGetIdentityUniversalAuth(popUpData?.identityId ?? "");
-
-  const { mutateAsync: createClientSecretMutateAsync } =
-    useCreateIdentityUniversalAuthClientSecret();
-
-  const {
-    control,
-    handleSubmit,
-    reset,
-    formState: { isSubmitting }
-  } = useForm<FormData>({
-    resolver: zodResolver(schema),
-    defaultValues: {
-      description: "",
-      ttl: "",
-      numUsesLimit: ""
-    }
-  });
-
-  useEffect(() => {
-    let timer: NodeJS.Timeout;
-    if (isClientSecretCopied) {
-      timer = setTimeout(() => setIsClientSecretCopied.off(), 2000);
-    }
-
-    return () => clearTimeout(timer);
-  }, [isClientSecretCopied]);
-
-  useEffect(() => {
-    let timer: NodeJS.Timeout;
-    if (isClientIdCopied) {
-      timer = setTimeout(() => setIsClientIdCopied.off(), 2000);
-    }
-
-    return () => clearTimeout(timer);
-  }, [isClientIdCopied]);
-
-  const onFormSubmit = async ({ description, ttl, numUsesLimit }: FormData) => {
-    try {
-      if (!popUpData?.identityId) return;
-
-      const { clientSecret } = await createClientSecretMutateAsync({
-        identityId: popUpData.identityId,
-        description,
-        ttl: Number(ttl),
-        numUsesLimit: Number(numUsesLimit)
-      });
-
-      setToken(clientSecret);
-
-      createNotification({
-        text: "Successfully created client secret",
-        type: "success"
-      });
-    } catch (err) {
-      console.error(err);
-      createNotification({
-        text: "Failed to create client secret",
-        type: "error"
-      });
-    }
-  };
-
-  const hasToken = Boolean(token);
-
-  return (
-    <Modal
-      isOpen={popUp?.universalAuthClientSecret?.isOpen}
-      onOpenChange={(isOpen) => {
-        handlePopUpToggle("universalAuthClientSecret", isOpen);
-        reset();
-        setToken("");
-      }}
-    >
-      <ModalContent title={`Manage Client ID/Secrets for ${popUpData?.name ?? ""}`}>
-        <h2 className="mb-4">Client ID</h2>
-        <div className="mb-8 flex items-center justify-between rounded-md bg-white/[0.07] p-2 text-base text-gray-400">
-          <p className="mr-4 break-all">{identityUniversalAuth?.clientId ?? ""}</p>
-          <IconButton
-            ariaLabel="copy icon"
-            colorSchema="secondary"
-            className="group relative"
-            onClick={() => {
-              navigator.clipboard.writeText(identityUniversalAuth?.clientId ?? "");
-              setIsClientIdCopied.on();
-            }}
-          >
-            <FontAwesomeIcon icon={isClientIdCopied ? faCheck : faCopy} />
-            <span className="absolute -left-8 -top-20 hidden w-28 translate-y-full rounded-md bg-bunker-800 py-2 pl-3 text-center text-sm text-gray-400 group-hover:flex group-hover:animate-fadeIn">
-              {t("common.click-to-copy")}
-            </span>
-          </IconButton>
-        </div>
-        <h2 className="mb-4">New Client Secret</h2>
-        {hasToken ? (
-          <div>
-            <div className="mb-4 flex items-center justify-between">
-              <p>We will only show this secret once</p>
-              <Button
-                colorSchema="secondary"
-                type="submit"
-                onClick={() => {
-                  reset();
-                  setToken("");
-                }}
-              >
-                Got it
-              </Button>
-            </div>
-            <div className="mb-8 flex items-center justify-between rounded-md bg-white/[0.07] p-2 text-base text-gray-400">
-              <p className="mr-4 break-all">{token}</p>
-              <IconButton
-                ariaLabel="copy icon"
-                colorSchema="secondary"
-                className="group relative"
-                onClick={() => {
-                  navigator.clipboard.writeText(token);
-                  setIsClientSecretCopied.on();
-                }}
-              >
-                <FontAwesomeIcon icon={isClientSecretCopied ? faCheck : faCopy} />
-                <span className="absolute -left-8 -top-20 hidden w-28 translate-y-full rounded-md bg-bunker-800 py-2 pl-3 text-center text-sm text-gray-400 group-hover:flex group-hover:animate-fadeIn">
-                  {t("common.click-to-copy")}
-                </span>
-              </IconButton>
-            </div>
-          </div>
-        ) : (
-          <form onSubmit={handleSubmit(onFormSubmit)} className="mb-8">
-            <Controller
-              control={control}
-              defaultValue=""
-              name="description"
-              render={({ field, fieldState: { error } }) => (
-                <FormControl
-                  label="Description (optional)"
-                  isError={Boolean(error)}
-                  errorText={error?.message}
-                >
-                  <Input {...field} placeholder="Description" />
-                </FormControl>
-              )}
-            />
-            <div className="flex">
-              <Controller
-                control={control}
-                defaultValue=""
-                name="ttl"
-                render={({ field, fieldState: { error } }) => (
-                  <FormControl
-                    label="TTL (seconds - optional)"
-                    isError={Boolean(error)}
-                    errorText={error?.message}
-                  >
-                    <div className="flex">
-                      <Input {...field} placeholder="0" type="number" min="0" step="1" />
-                    </div>
-                  </FormControl>
-                )}
-              />
-              <Controller
-                control={control}
-                defaultValue="0"
-                name="numUsesLimit"
-                render={({ field, fieldState: { error } }) => (
-                  <FormControl
-                    label="Max Number of Uses"
-                    isError={Boolean(error)}
-                    errorText={error?.message}
-                    className="ml-4"
-                  >
-                    <div className="flex">
-                      <Input {...field} placeholder="0" type="number" min="0" step="1" />
-                      <Button
-                        className="ml-4"
-                        size="sm"
-                        type="submit"
-                        isLoading={isSubmitting}
-                        isDisabled={isSubmitting}
-                      >
-                        Create
-                      </Button>
-                    </div>
-                  </FormControl>
-                )}
-              />
-            </div>
-          </form>
-        )}
-        <h2 className="mb-4">Client Secrets</h2>
-        <TableContainer>
-          <Table>
-            <THead>
-              <Tr>
-                <Th>Description</Th>
-                <Th>Num Uses</Th>
-                <Th>Expires At</Th>
-                <Th>Client Secret</Th>
-                <Th className="w-5" />
-              </Tr>
-            </THead>
-            <TBody>
-              {isPending && <TableSkeleton columns={5} innerKey="org-identities-client-secrets" />}
-              {!isPending &&
-                data &&
-                data.length > 0 &&
-                data.map(
-                  ({
-                    id,
-                    description,
-                    clientSecretTTL,
-                    clientSecretPrefix,
-                    clientSecretNumUses,
-                    clientSecretNumUsesLimit,
-                    createdAt
-                  }) => {
-                    let expiresAt;
-                    if (clientSecretTTL > 0) {
-                      expiresAt = new Date(new Date(createdAt).getTime() + clientSecretTTL * 1000);
-                    }
-
-                    return (
-                      <Tr className="h-10 items-center" key={`mi-client-secret-${id}`}>
-                        <Td>{description === "" ? "-" : description}</Td>
-                        <Td>{`${clientSecretNumUses}${
-                          clientSecretNumUsesLimit ? `/${clientSecretNumUsesLimit}` : ""
-                        }`}</Td>
-                        <Td>{expiresAt ? format(expiresAt, "yyyy-MM-dd") : "-"}</Td>
-                        <Td>{`${clientSecretPrefix}****`}</Td>
-                        <Td>
-                          <IconButton
-                            onClick={() => {
-                              handlePopUpOpen("revokeClientSecret", {
-                                clientSecretPrefix,
-                                clientSecretId: id
-                              });
-                            }}
-                            size="lg"
-                            colorSchema="primary"
-                            variant="plain"
-                            ariaLabel="update"
-                          >
-                            <FontAwesomeIcon icon={faXmark} />
-                          </IconButton>
-                        </Td>
-                      </Tr>
-                    );
-                  }
-                )}
-              {!isPending && data && data?.length === 0 && (
-                <Tr>
-                  <Td colSpan={5}>
-                    <EmptyState
-                      title="No client secrets have been created for this identity yet"
-                      icon={faKey}
-                    />
-                  </Td>
-                </Tr>
-              )}
-            </TBody>
-          </Table>
-        </TableContainer>
-      </ModalContent>
-    </Modal>
-  );
-};

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityUniversalAuthForm.tsx

@@ -1,4 +1,4 @@
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { Controller, useFieldArray, useForm } from "react-hook-form";
 import { faPlus, faXmark } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -6,17 +6,27 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 
 import { createNotification } from "@app/components/notifications";
-import { Button, FormControl, IconButton, Input } from "@app/components/v2";
+import {
+  Button,
+  FormControl,
+  IconButton,
+  Input,
+  Tab,
+  TabList,
+  TabPanel,
+  Tabs
+} from "@app/components/v2";
 import { useOrganization, useSubscription } from "@app/context";
 import {
   useAddIdentityUniversalAuth,
   useGetIdentityUniversalAuth,
   useUpdateIdentityUniversalAuth
 } from "@app/hooks/api";
-import { IdentityAuthMethod } from "@app/hooks/api/identities";
 import { IdentityTrustedIp } from "@app/hooks/api/identities/types";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
+import { IdentityFormTab } from "./types";
+
 const schema = z
   .object({
     accessTokenTTL: z
@@ -52,33 +62,27 @@ export type FormData = z.infer<typeof schema>;
 type Props = {
   handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan"]>) => void;
   handlePopUpToggle: (
-    popUpName: keyof UsePopUpState<["identityAuthMethod", "revokeAuthMethod"]>,
+    popUpName: keyof UsePopUpState<["identityAuthMethod"]>,
     state?: boolean
   ) => void;
-  identityAuthMethodData?: {
+  identityId?: string;
-    identityId: string;
+  isUpdate?: boolean;
-    name: string;
-    configuredAuthMethods?: IdentityAuthMethod[];
-    authMethod?: IdentityAuthMethod;
-  };
 };
 
 export const IdentityUniversalAuthForm = ({
   handlePopUpOpen,
   handlePopUpToggle,
-  identityAuthMethodData
+  identityId,
+  isUpdate
 }: Props) => {
   const { currentOrg } = useOrganization();
   const orgId = currentOrg?.id || "";
   const { subscription } = useSubscription();
   const { mutateAsync: addMutateAsync } = useAddIdentityUniversalAuth();
   const { mutateAsync: updateMutateAsync } = useUpdateIdentityUniversalAuth();
+  const [tabValue, setTabValue] = useState<IdentityFormTab>(IdentityFormTab.Configuration);
 
-  const isUpdate = identityAuthMethodData?.configuredAuthMethods?.includes(
+  const { data } = useGetIdentityUniversalAuth(identityId ?? "", {
-    identityAuthMethodData.authMethod! || ""
-  );
-
-  const { data } = useGetIdentityUniversalAuth(identityAuthMethodData?.identityId ?? "", {
     enabled: isUpdate
   });
 
@@ -149,13 +153,13 @@ export const IdentityUniversalAuthForm = ({
     accessTokenTrustedIps
   }: FormData) => {
     try {
-      if (!identityAuthMethodData) return;
+      if (!identityId) return;
 
       if (data) {
         // update universal auth configuration
         await updateMutateAsync({
           organizationId: orgId,
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           clientSecretTrustedIps,
           accessTokenTTL: Number(accessTokenTTL),
           accessTokenMaxTTL: Number(accessTokenMaxTTL),
@@ -167,7 +171,7 @@ export const IdentityUniversalAuthForm = ({
 
         await addMutateAsync({
           organizationId: orgId,
-          identityId: identityAuthMethodData.identityId,
+          identityId,
           clientSecretTrustedIps,
           accessTokenTTL: Number(accessTokenTTL),
           accessTokenMaxTTL: Number(accessTokenMaxTTL),
@@ -195,7 +199,21 @@ export const IdentityUniversalAuthForm = ({
   };
 
   return (
-    <form onSubmit={handleSubmit(onFormSubmit)}>
+    <form
+      onSubmit={handleSubmit(onFormSubmit, (fields) => {
+        setTabValue(
+          ["accessTokenTrustedIps", "clientSecretTrustedIps"].includes(Object.keys(fields)[0])
+            ? IdentityFormTab.Advanced
+            : IdentityFormTab.Configuration
+        );
+      })}
+    >
+      <Tabs value={tabValue} onValueChange={(value) => setTabValue(value as IdentityFormTab)}>
+        <TabList>
+          <Tab value={IdentityFormTab.Configuration}>Configuration</Tab>
+          <Tab value={IdentityFormTab.Advanced}>Advanced</Tab>
+        </TabList>
+        <TabPanel value={IdentityFormTab.Configuration}>
           <Controller
             control={control}
             defaultValue="2592000"
@@ -206,7 +224,7 @@ export const IdentityUniversalAuthForm = ({
                 isError={Boolean(error)}
                 errorText={error?.message}
               >
-            <Input {...field} placeholder="2592000" type="number" min="1" step="1" />
+                <Input {...field} placeholder="2592000" type="number" min="0" step="1" />
               </FormControl>
             )}
           />
@@ -238,6 +256,8 @@ export const IdentityUniversalAuthForm = ({
               </FormControl>
             )}
           />
+        </TabPanel>
+        <TabPanel value={IdentityFormTab.Advanced}>
           {clientSecretTrustedIpsFields.map(({ id }, index) => (
             <div className="mb-3 flex items-end space-x-2" key={id}>
               <Controller
@@ -374,7 +394,8 @@ export const IdentityUniversalAuthForm = ({
               Add IP Address
             </Button>
           </div>
-      <div className="flex justify-between">
+        </TabPanel>
+      </Tabs>
       <div className="flex items-center">
         <Button
           className="mr-4"
@@ -383,7 +404,7 @@ export const IdentityUniversalAuthForm = ({
           isLoading={isSubmitting}
           isDisabled={isSubmitting}
         >
-            {isUpdate ? "Edit" : "Create"}
+          {isUpdate ? "Update" : "Add"}
         </Button>
         <Button
           colorSchema="secondary"
@@ -393,18 +414,6 @@ export const IdentityUniversalAuthForm = ({
           Cancel
         </Button>
       </div>
-        {isUpdate && (
-          <Button
-            size="sm"
-            colorSchema="danger"
-            isLoading={isSubmitting}
-            isDisabled={isSubmitting}
-            onClick={() => handlePopUpToggle("revokeAuthMethod", true)}
-          >
-            Delete Auth Method
-          </Button>
-        )}
-      </div>
     </form>
   );
 };

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/types/index.ts

@@ -0,0 +1,4 @@
+export enum IdentityFormTab {
+  Advanced = "advanced",
+  Configuration = "configuration"
+}

frontend/src/pages/organization/IdentityDetailsByIDPage/IdentityDetailsByIDPage.tsx

@@ -1,45 +1,24 @@
-import { useState } from "react";
 import { Helmet } from "react-helmet";
 import { useTranslation } from "react-i18next";
 import { useNavigate, useParams } from "@tanstack/react-router";
-import { twMerge } from "tailwind-merge";
 
 import { UpgradePlanModal } from "@app/components/license/UpgradePlanModal";
 import { createNotification } from "@app/components/notifications";
 import { OrgPermissionCan } from "@app/components/permissions";
-import {
+import { DeleteActionModal, PageHeader } from "@app/components/v2";
-  Button,
-  DeleteActionModal,
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-  PageHeader,
-  Tooltip
-} from "@app/components/v2";
 import { ROUTE_PATHS } from "@app/const/routes";
 import { OrgPermissionActions, OrgPermissionSubjects, useOrganization } from "@app/context";
-import {
+import { useDeleteIdentity, useGetIdentityById } from "@app/hooks/api";
-  IdentityAuthMethod,
-  useDeleteIdentity,
-  useGetIdentityById,
-  useRevokeIdentityTokenAuthToken,
-  useRevokeIdentityUniversalAuthClientSecret
-} from "@app/hooks/api";
-import { Identity } from "@app/hooks/api/identities/types";
 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";
 import { IdentityModal } from "../AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityModal";
-import { IdentityUniversalAuthClientSecretModal } from "../AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityUniversalAuthClientSecretModal";
 import {
   IdentityAuthenticationSection,
-  IdentityClientSecretModal,
   IdentityDetailsSection,
-  IdentityProjectsSection,
+  IdentityProjectsSection
-  IdentityTokenListModal,
-  IdentityTokenModal
 } from "./components";
 
 const Page = () => {
@@ -52,25 +31,13 @@ const Page = () => {
   const orgId = currentOrg?.id || "";
   const { data } = useGetIdentityById(identityId);
   const { mutateAsync: deleteIdentity } = useDeleteIdentity();
-  const { mutateAsync: revokeToken } = useRevokeIdentityTokenAuthToken();
-  const { mutateAsync: revokeClientSecret } = useRevokeIdentityUniversalAuthClientSecret();
-
-  const [selectedAuthMethod, setSelectedAuthMethod] = useState<
-    Identity["authMethods"][number] | null
-  >(null);
 
   const { popUp, handlePopUpOpen, handlePopUpClose, handlePopUpToggle } = usePopUp([
     "identity",
     "deleteIdentity",
     "identityAuthMethod",
-    "revokeAuthMethod",
+    "upgradePlan",
-    "token",
+    "viewAuthMethod"
-    "tokenList",
-    "revokeToken",
-    "clientSecret",
-    "revokeClientSecret",
-    "universalAuthClientSecret", // list of client secrets
-    "upgradePlan"
   ] as const);
 
   const onDeleteIdentitySubmit = async (id: string) => {
@@ -104,148 +71,15 @@ const Page = () => {
     }
   };
 
-  const onRevokeTokenSubmit = async ({
-    identityId: parentIdentityId,
-    tokenId,
-    name
-  }: {
-    identityId: string;
-    tokenId: string;
-    name: string;
-  }) => {
-    try {
-      await revokeToken({
-        identityId: parentIdentityId,
-        tokenId
-      });
-
-      handlePopUpClose("revokeToken");
-
-      createNotification({
-        text: `Successfully revoked token ${name ?? ""}`,
-        type: "success"
-      });
-    } catch (err) {
-      console.error(err);
-      const error = err as any;
-      const text = error?.response?.data?.message ?? "Failed to delete identity";
-
-      createNotification({
-        text,
-        type: "error"
-      });
-    }
-  };
-
-  const onDeleteClientSecretSubmit = async ({ clientSecretId }: { clientSecretId: string }) => {
-    try {
-      if (!data?.identity.id || selectedAuthMethod !== IdentityAuthMethod.UNIVERSAL_AUTH) return;
-
-      await revokeClientSecret({
-        identityId: data?.identity.id,
-        clientSecretId
-      });
-
-      handlePopUpToggle("revokeClientSecret", false);
-
-      createNotification({
-        text: "Successfully deleted client secret",
-        type: "success"
-      });
-    } catch (err) {
-      console.error(err);
-      createNotification({
-        text: "Failed to delete client secret",
-        type: "error"
-      });
-    }
-  };
-
   return (
     <div className="container mx-auto flex flex-col justify-between bg-bunker-800 text-white">
       {data && (
         <div className="mx-auto mb-6 w-full max-w-7xl">
-          <PageHeader title={data.identity.name}>
+          <PageHeader title={data.identity.name} />
-            <DropdownMenu>
-              <DropdownMenuTrigger asChild className="rounded-lg">
-                <div className="hover:text-primary-400 data-[state=open]:text-primary-400">
-                  <Tooltip content="More options">
-                    <Button variant="outline_bg">More</Button>
-                  </Tooltip>
-                </div>
-              </DropdownMenuTrigger>
-              <DropdownMenuContent align="start" className="p-1">
-                <OrgPermissionCan I={OrgPermissionActions.Edit} a={OrgPermissionSubjects.Identity}>
-                  {(isAllowed) => (
-                    <DropdownMenuItem
-                      className={twMerge(
-                        !isAllowed && "pointer-events-none cursor-not-allowed opacity-50"
-                      )}
-                      onClick={async () => {
-                        handlePopUpOpen("identity", {
-                          identityId,
-                          name: data.identity.name,
-                          role: data.role,
-                          customRole: data.customRole
-                        });
-                      }}
-                      disabled={!isAllowed}
-                    >
-                      Edit Identity
-                    </DropdownMenuItem>
-                  )}
-                </OrgPermissionCan>
-                <OrgPermissionCan I={OrgPermissionActions.Edit} a={OrgPermissionSubjects.Identity}>
-                  {(isAllowed) => (
-                    <DropdownMenuItem
-                      className={twMerge(
-                        !isAllowed && "pointer-events-none cursor-not-allowed opacity-50"
-                      )}
-                      onClick={async () => {
-                        handlePopUpOpen("identityAuthMethod", {
-                          identityId,
-                          name: data.identity.name,
-                          allAuthMethods: data.identity.authMethods
-                        });
-                      }}
-                      disabled={!isAllowed}
-                    >
-                      Add new auth method
-                    </DropdownMenuItem>
-                  )}
-                </OrgPermissionCan>
-                <OrgPermissionCan
-                  I={OrgPermissionActions.Delete}
-                  a={OrgPermissionSubjects.Identity}
-                >
-                  {(isAllowed) => (
-                    <DropdownMenuItem
-                      className={twMerge(
-                        isAllowed
-                          ? "hover:!bg-red-500 hover:!text-white"
-                          : "pointer-events-none cursor-not-allowed opacity-50"
-                      )}
-                      onClick={async () => {
-                        handlePopUpOpen("deleteIdentity", {
-                          identityId,
-                          name: data.identity.name
-                        });
-                      }}
-                      disabled={!isAllowed}
-                    >
-                      Delete Identity
-                    </DropdownMenuItem>
-                  )}
-                </OrgPermissionCan>
-              </DropdownMenuContent>
-            </DropdownMenu>
-          </PageHeader>
           <div className="flex">
             <div className="mr-4 w-96">
               <IdentityDetailsSection identityId={identityId} handlePopUpOpen={handlePopUpOpen} />
               <IdentityAuthenticationSection
-                selectedAuthMethod={selectedAuthMethod}
-                setSelectedAuthMethod={setSelectedAuthMethod}
                 identityId={identityId}
                 handlePopUpOpen={handlePopUpOpen}
               />
@@ -260,18 +94,6 @@ const Page = () => {
         handlePopUpOpen={handlePopUpOpen}
         handlePopUpToggle={handlePopUpToggle}
       />
-      <IdentityTokenModal popUp={popUp} handlePopUpToggle={handlePopUpToggle} />
-      <IdentityTokenListModal
-        popUp={popUp}
-        handlePopUpOpen={handlePopUpOpen}
-        handlePopUpToggle={handlePopUpToggle}
-      />
-      <IdentityClientSecretModal popUp={popUp} handlePopUpToggle={handlePopUpToggle} />
-      <IdentityUniversalAuthClientSecretModal
-        popUp={popUp}
-        handlePopUpOpen={handlePopUpOpen}
-        handlePopUpToggle={handlePopUpToggle}
-      />
       <UpgradePlanModal
         isOpen={popUp.upgradePlan.isOpen}
         onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
@@ -290,41 +112,11 @@ const Page = () => {
           )
         }
       />
-      <DeleteActionModal
+      <ViewIdentityAuthModal
-        isOpen={popUp.revokeToken.isOpen}
+        isOpen={popUp.viewAuthMethod.isOpen}
-        title={`Are you sure want to revoke ${
+        onOpenChange={(isOpen) => handlePopUpToggle("viewAuthMethod", isOpen)}
-          (popUp?.revokeToken?.data as { name: string })?.name || ""
+        authMethod={popUp.viewAuthMethod.data}
-        }?`}
+        identityId={identityId}
-        onChange={(isOpen) => handlePopUpToggle("revokeToken", isOpen)}
-        deleteKey="confirm"
-        onDeleteApproved={() => {
-          const revokeTokenData = popUp?.revokeToken?.data as {
-            identityId: string;
-            tokenId: string;
-            name: string;
-          };
-
-          return onRevokeTokenSubmit(revokeTokenData);
-        }}
-      />
-      <DeleteActionModal
-        isOpen={popUp.revokeClientSecret.isOpen}
-        title={`Are you sure want to delete the client secret ${
-          (popUp?.revokeClientSecret?.data as { clientSecretPrefix: string })?.clientSecretPrefix ||
-          ""
-        }************?`}
-        onChange={(isOpen) => handlePopUpToggle("revokeClientSecret", isOpen)}
-        deleteKey="confirm"
-        onDeleteApproved={() => {
-          const deleteClientSecretData = popUp?.revokeClientSecret?.data as {
-            clientSecretId: string;
-            clientSecretPrefix: string;
-          };
-
-          return onDeleteClientSecretSubmit({
-            clientSecretId: deleteClientSecretData.clientSecretId
-          });
-        }}
       />
     </div>
   );

frontend/src/pages/organization/IdentityDetailsByIDPage/components/IdentityAuthenticationSection/IdentityAuthenticationSection.tsx

@@ -1,140 +1,56 @@
-import { useEffect } from "react";
+import { faCog, faPlus } from "@fortawesome/free-solid-svg-icons";
-import { faPencil, faPlus } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 
 import { OrgPermissionCan } from "@app/components/permissions";
-import { Button, IconButton, Select, SelectItem, Tooltip } from "@app/components/v2";
+import { Button } from "@app/components/v2";
 import { OrgPermissionActions, OrgPermissionSubjects } from "@app/context";
-import { useGetIdentityById } from "@app/hooks/api";
+import { IdentityAuthMethod, identityAuthToNameMap, useGetIdentityById } from "@app/hooks/api";
-import { IdentityAuthMethod, identityAuthToNameMap } from "@app/hooks/api/identities";
-import { Identity } from "@app/hooks/api/identities/types";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
-import { IdentityClientSecrets } from "./IdentityClientSecrets";
-import { IdentityTokens } from "./IdentityTokens";
-
 type Props = {
   identityId: string;
-  setSelectedAuthMethod: (authMethod: Identity["authMethods"][number] | null) => void;
-  selectedAuthMethod: Identity["authMethods"][number] | null;
   handlePopUpOpen: (
-    popUpName: keyof UsePopUpState<
+    popUpName: keyof UsePopUpState<["identityAuthMethod", "viewAuthMethod"]>,
-      [
+    data?: object | IdentityAuthMethod
-        "clientSecret",
-        "identityAuthMethod",
-        "revokeClientSecret",
-        "token",
-        "revokeToken",
-        "universalAuthClientSecret",
-        "tokenList"
-      ]
-    >,
-    data?: object
   ) => void;
 };
 
-export const IdentityAuthenticationSection = ({
+export const IdentityAuthenticationSection = ({ identityId, handlePopUpOpen }: Props) => {
-  identityId,
-  setSelectedAuthMethod,
-  selectedAuthMethod,
-  handlePopUpOpen
-}: Props) => {
   const { data } = useGetIdentityById(identityId);
 
-  useEffect(() => {
-    if (!data?.identity) return;
-
-    if (data.identity.authMethods?.length) {
-      setSelectedAuthMethod(data.identity.authMethods[0]);
-    }
-
-    // eslint-disable-next-line consistent-return
-    return () => setSelectedAuthMethod(null);
-  }, [data?.identity]);
-
   return data ? (
     <div className="mt-4 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
       <div className="flex items-center justify-between border-b border-mineshaft-400 pb-4">
         <h3 className="text-lg font-semibold text-mineshaft-100">Authentication</h3>
-
-        <OrgPermissionCan I={OrgPermissionActions.Edit} a={OrgPermissionSubjects.Identity}>
-          {(isAllowed) => {
-            return (
-              <Tooltip content="Add new auth method">
-                <IconButton
-                  isDisabled={!isAllowed}
-                  ariaLabel="copy icon"
-                  variant="plain"
-                  className="group relative"
-                  onClick={() =>
-                    handlePopUpOpen("identityAuthMethod", {
-                      identityId,
-                      name: data.identity.name,
-                      allAuthMethods: data.identity.authMethods
-                    })
-                  }
-                >
-                  <FontAwesomeIcon icon={faPlus} />
-                </IconButton>
-              </Tooltip>
-            );
-          }}
-        </OrgPermissionCan>
       </div>
       {data.identity.authMethods.length > 0 ? (
-        <>
+        <div className="flex flex-col divide-y divide-mineshaft-400/50">
-          <div className="py-4">
+          {data.identity.authMethods.map((authMethod) => (
-            <div className="flex justify-between">
+            <button
-              <p className="mb-0.5 ml-px text-sm font-semibold text-mineshaft-300">Auth Method</p>
+              key={authMethod}
-            </div>
+              onClick={() => handlePopUpOpen("viewAuthMethod", authMethod)}
-            <div className="flex items-center gap-2">
+              type="button"
-              <div className="w-full">
+              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"
-                <Select
-                  className="w-full"
-                  value={selectedAuthMethod as string}
-                  onValueChange={(value) => setSelectedAuthMethod(value as IdentityAuthMethod)}
             >
-                  {(data.identity?.authMethods || []).map((authMethod) => (
+              <span>{identityAuthToNameMap[authMethod]}</span>
-                    <SelectItem key={authMethod || authMethod} value={authMethod}>
+              <FontAwesomeIcon icon={faCog} size="xs" className="text-mineshaft-400" />
-                      {identityAuthToNameMap[authMethod]}
+            </button>
-                    </SelectItem>
           ))}
-                </Select>
         </div>
-              <div>
-                <Tooltip content="Edit auth method">
-                  <IconButton
-                    onClick={() => {
-                      handlePopUpOpen("identityAuthMethod", {
-                        identityId,
-                        name: data.identity.name,
-                        authMethod: selectedAuthMethod,
-                        allAuthMethods: data.identity.authMethods
-                      });
-                    }}
-                    ariaLabel="copy icon"
-                    variant="plain"
-                    className="group relative"
-                  >
-                    <FontAwesomeIcon icon={faPencil} />
-                  </IconButton>
-                </Tooltip>{" "}
-              </div>
-            </div>
-          </div>
-          {selectedAuthMethod === IdentityAuthMethod.UNIVERSAL_AUTH && (
-            <IdentityClientSecrets identityId={identityId} handlePopUpOpen={handlePopUpOpen} />
-          )}
-          {selectedAuthMethod === IdentityAuthMethod.TOKEN_AUTH && (
-            <IdentityTokens identityId={identityId} handlePopUpOpen={handlePopUpOpen} />
-          )}
-        </>
       ) : (
         <div className="w-full space-y-2 pt-2">
           <p className="text-sm text-mineshaft-300">
             No authentication methods configured. Get started by creating a new auth method.
           </p>
+        </div>
+      )}
+      {!Object.values(IdentityAuthMethod).every((method) =>
+        data.identity.authMethods.includes(method)
+      ) && (
+        <OrgPermissionCan I={OrgPermissionActions.Edit} a={OrgPermissionSubjects.Identity}>
+          {(isAllowed) => (
             <Button
+              isDisabled={!isAllowed}
               onClick={() => {
                 handlePopUpOpen("identityAuthMethod", {
                   identityId,
@@ -143,12 +59,14 @@ export const IdentityAuthenticationSection = ({
                 });
               }}
               variant="outline_bg"
-            className="w-full"
+              className="mt-3 w-full"
               size="xs"
+              leftIcon={<FontAwesomeIcon icon={faPlus} />}
             >
-            Create Auth Method
+              {data.identity.authMethods.length ? "Add" : "Create"} Auth Method
             </Button>
-        </div>
+          )}
+        </OrgPermissionCan>
       )}
     </div>
   ) : (

frontend/src/pages/organization/IdentityDetailsByIDPage/components/IdentityAuthenticationSection/IdentityTokens.tsx

@@ -1,4 +1,4 @@
-import { faEllipsis, faKey } from "@fortawesome/free-solid-svg-icons";
+import { faEllipsisVertical, faKey } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { format } from "date-fns";
 
@@ -8,6 +8,7 @@ import {
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuTrigger,
+  IconButton,
   Tooltip
 } from "@app/components/v2";
 import { useGetIdentityById, useGetIdentityTokensTokenAuth } from "@app/hooks/api";
@@ -27,10 +28,13 @@ export const IdentityTokens = ({ identityId, handlePopUpOpen }: Props) => {
   return (
     <div>
       {tokens?.length ? (
-        <div className="flex justify-between">
+        <div className="flex items-center justify-between border-b border-bunker-400 pb-1">
-          <p className="text-sm font-semibold text-mineshaft-300">{`Access Tokens (${tokens.length})`}</p>
+          <p className="text-sm font-medium text-bunker-300">{`Access Tokens (${tokens.length})`}</p>
           <Button
-            variant="link"
+            size="xs"
+            className="underline"
+            variant="plain"
+            colorSchema="secondary"
             onClick={() => {
               handlePopUpOpen("tokenList", {
                 identityId,
@@ -50,16 +54,16 @@ export const IdentityTokens = ({ identityId, handlePopUpOpen }: Props) => {
         );
         return (
           <div
-            className="group flex items-center justify-between py-2 last:pb-0"
+            className="group flex items-center justify-between border-b border-mineshaft-500 px-2 py-2 last:pb-0"
             key={`identity-token-${token.id}`}
           >
             <div className="flex items-center">
-              <FontAwesomeIcon size="1x" icon={faKey} />
+              <FontAwesomeIcon size="xs" className="text-mineshaft-400" icon={faKey} />
-              <div className="ml-4">
+              <div className="ml-3">
-                <p className="text-sm font-semibold text-mineshaft-300">
+                <p className="text-sm font-medium text-mineshaft-300">
                   {token.name ? token.name : "-"}
                 </p>
-                <p className="text-sm text-mineshaft-300">
+                <p className="text-xs text-mineshaft-400">
                   {token.isAccessTokenRevoked
                     ? "Revoked"
                     : `Expires on ${format(expiresAt, "yyyy-MM-dd")}`}
@@ -67,14 +71,19 @@ export const IdentityTokens = ({ identityId, handlePopUpOpen }: Props) => {
               </div>
             </div>
             <DropdownMenu>
-              <DropdownMenuTrigger asChild className="rounded-lg">
+              <DropdownMenuTrigger asChild>
-                <div className="opacity-0 transition-opacity duration-300 hover:text-primary-400 group-hover:opacity-100 data-[state=open]:text-primary-400">
+                <Tooltip side="right" content="More options">
-                  <Tooltip content="More options">
+                  <IconButton
-                    <FontAwesomeIcon size="sm" icon={faEllipsis} />
+                    colorSchema="secondary"
+                    variant="plain"
+                    size="xs"
+                    ariaLabel="More options"
+                  >
+                    <FontAwesomeIcon icon={faEllipsisVertical} />
+                  </IconButton>
                 </Tooltip>
-                </div>
               </DropdownMenuTrigger>
-              <DropdownMenuContent align="start" className="p-1">
+              <DropdownMenuContent align="start" className="z-[101] p-1">
                 <DropdownMenuItem
                   onClick={async () => {
                     handlePopUpOpen("token", {
@@ -106,8 +115,9 @@ export const IdentityTokens = ({ identityId, handlePopUpOpen }: Props) => {
       })}
       <Button
         className="mr-4 mt-4 w-full"
-        colorSchema="primary"
+        colorSchema="secondary"
         type="submit"
+        size="xs"
         onClick={() => {
           handlePopUpOpen("token", {
             identityId

frontend/src/pages/organization/IdentityDetailsByIDPage/components/IdentityDetailsSection.tsx

@@ -1,8 +1,25 @@
-import { faCheck, faCopy, faKey, faPencil } from "@fortawesome/free-solid-svg-icons";
+import {
+  faCheck,
+  faChevronDown,
+  faCopy,
+  faEdit,
+  faKey,
+  faTrash
+} from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { twMerge } from "tailwind-merge";
 
 import { OrgPermissionCan } from "@app/components/permissions";
-import { IconButton, Tag, Tooltip } from "@app/components/v2";
+import {
+  Button,
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+  IconButton,
+  Tag,
+  Tooltip
+} from "@app/components/v2";
 import { OrgPermissionActions, OrgPermissionSubjects } from "@app/context";
 import { useTimedReset } from "@app/hooks";
 import { useGetIdentityById } from "@app/hooks/api";
@@ -11,7 +28,7 @@ import { UsePopUpState } from "@app/hooks/usePopUp";
 type Props = {
   identityId: string;
   handlePopUpOpen: (
-    popUpName: keyof UsePopUpState<["identity", "identityAuthMethod", "token", "clientSecret"]>,
+    popUpName: keyof UsePopUpState<["identity", "identityAuthMethod", "deleteIdentity"]>,
     data?: object
   ) => void;
 };
@@ -26,31 +43,61 @@ export const IdentityDetailsSection = ({ identityId, handlePopUpOpen }: Props) =
     <div className="rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
       <div className="flex items-center justify-between border-b border-mineshaft-400 pb-4">
         <h3 className="text-lg font-semibold text-mineshaft-100">Identity Details</h3>
+        <DropdownMenu>
+          <DropdownMenuTrigger asChild>
+            <Button
+              size="xs"
+              rightIcon={<FontAwesomeIcon className="ml-1" icon={faChevronDown} />}
+              colorSchema="secondary"
+            >
+              Options
+            </Button>
+          </DropdownMenuTrigger>
+          <DropdownMenuContent className="min-w-[120px]" align="end">
             <OrgPermissionCan I={OrgPermissionActions.Edit} a={OrgPermissionSubjects.Identity}>
-          {(isAllowed) => {
+              {(isAllowed) => (
-            return (
+                <DropdownMenuItem
-              <Tooltip content="Edit Identity">
+                  className={twMerge(
-                <IconButton
+                    !isAllowed && "pointer-events-none cursor-not-allowed opacity-50"
-                  isDisabled={!isAllowed}
+                  )}
-                  ariaLabel="copy icon"
+                  icon={<FontAwesomeIcon icon={faEdit} />}
-                  variant="plain"
+                  onClick={async () => {
-                  className="group relative"
-                  onClick={() => {
                     handlePopUpOpen("identity", {
                       identityId,
                       name: data.identity.name,
                       role: data.role,
-                      customRole: data.customRole,
+                      customRole: data.customRole
-                      metadata: data.metadata
                     });
                   }}
+                  disabled={!isAllowed}
                 >
-                  <FontAwesomeIcon icon={faPencil} />
+                  Edit Identity
-                </IconButton>
+                </DropdownMenuItem>
-              </Tooltip>
+              )}
-            );
-          }}
             </OrgPermissionCan>
+            <OrgPermissionCan I={OrgPermissionActions.Delete} a={OrgPermissionSubjects.Identity}>
+              {(isAllowed) => (
+                <DropdownMenuItem
+                  className={twMerge(
+                    isAllowed
+                      ? "hover:!bg-red-500 hover:!text-white"
+                      : "pointer-events-none cursor-not-allowed opacity-50"
+                  )}
+                  onClick={async () => {
+                    handlePopUpOpen("deleteIdentity", {
+                      identityId,
+                      name: data.identity.name
+                    });
+                  }}
+                  icon={<FontAwesomeIcon icon={faTrash} />}
+                  disabled={!isAllowed}
+                >
+                  Delete Identity
+                </DropdownMenuItem>
+              )}
+            </OrgPermissionCan>
+          </DropdownMenuContent>
+        </DropdownMenu>
       </div>
       <div className="pt-4">
         <div className="mb-4">

frontend/src/pages/organization/IdentityDetailsByIDPage/components/IdentityTokenListModal.tsx

@@ -1,270 +0,0 @@
-import { useEffect, useState } from "react";
-import { Controller, useForm } from "react-hook-form";
-import { useTranslation } from "react-i18next";
-import { faCheck, faCopy, faKey, faXmark } from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { zodResolver } from "@hookform/resolvers/zod";
-import { format } from "date-fns";
-import { z } from "zod";
-
-import { createNotification } from "@app/components/notifications";
-import {
-  Button,
-  EmptyState,
-  FormControl,
-  IconButton,
-  Input,
-  Modal,
-  ModalContent,
-  Table,
-  TableContainer,
-  TableSkeleton,
-  TBody,
-  Td,
-  Th,
-  THead,
-  Tr
-} from "@app/components/v2";
-import { useToggle } from "@app/hooks";
-import {
-  useCreateTokenIdentityTokenAuth,
-  useGetIdentityTokensTokenAuth,
-  useGetIdentityUniversalAuthClientSecrets
-} from "@app/hooks/api";
-import { UsePopUpState } from "@app/hooks/usePopUp";
-
-const schema = z.object({
-  name: z.string()
-});
-
-export type FormData = z.infer<typeof schema>;
-
-type Props = {
-  popUp: UsePopUpState<["tokenList", "revokeToken"]>;
-  handlePopUpOpen: (popUpName: keyof UsePopUpState<["revokeToken"]>, data?: object) => void;
-  handlePopUpToggle: (
-    popUpName: keyof UsePopUpState<["tokenList", "revokeToken"]>,
-    state?: boolean
-  ) => void;
-};
-
-export const IdentityTokenListModal = ({ popUp, handlePopUpOpen, handlePopUpToggle }: Props) => {
-  const { t } = useTranslation();
-
-  const [token, setToken] = useState("");
-  const [isClientSecretCopied, setIsClientSecretCopied] = useToggle(false);
-  const [isClientIdCopied, setIsClientIdCopied] = useToggle(false);
-
-  const popUpData = popUp?.tokenList?.data as {
-    identityId: string;
-    name: string;
-  };
-
-  const { data: tokens } = useGetIdentityTokensTokenAuth(popUpData?.identityId ?? "");
-  const { data, isPending } = useGetIdentityUniversalAuthClientSecrets(popUpData?.identityId ?? "");
-
-  const { mutateAsync: createToken } = useCreateTokenIdentityTokenAuth();
-
-  const {
-    control,
-    handleSubmit,
-    reset,
-    formState: { isSubmitting }
-  } = useForm<FormData>({
-    resolver: zodResolver(schema),
-    defaultValues: {
-      name: ""
-    }
-  });
-
-  useEffect(() => {
-    let timer: NodeJS.Timeout;
-    if (isClientSecretCopied) {
-      timer = setTimeout(() => setIsClientSecretCopied.off(), 2000);
-    }
-
-    return () => clearTimeout(timer);
-  }, [isClientSecretCopied]);
-
-  useEffect(() => {
-    let timer: NodeJS.Timeout;
-    if (isClientIdCopied) {
-      timer = setTimeout(() => setIsClientIdCopied.off(), 2000);
-    }
-
-    return () => clearTimeout(timer);
-  }, [isClientIdCopied]);
-
-  const onFormSubmit = async ({ name }: FormData) => {
-    try {
-      if (!popUpData?.identityId) return;
-
-      const newTokenData = await createToken({
-        identityId: popUpData.identityId,
-        name
-      });
-
-      setToken(newTokenData.accessToken);
-
-      createNotification({
-        text: "Successfully created token",
-        type: "success"
-      });
-    } catch (err) {
-      console.error(err);
-      createNotification({
-        text: "Failed to create token",
-        type: "error"
-      });
-    }
-  };
-
-  const hasToken = Boolean(token);
-
-  return (
-    <Modal
-      isOpen={popUp?.tokenList?.isOpen}
-      onOpenChange={(isOpen) => {
-        handlePopUpToggle("tokenList", isOpen);
-        reset();
-        setToken("");
-      }}
-    >
-      <ModalContent title={`Manage Access Tokens for ${popUpData?.name ?? ""}`}>
-        <h2 className="mb-4">New Token</h2>
-        {hasToken ? (
-          <div>
-            <div className="mb-4 flex items-center justify-between">
-              <p>We will only show this token once</p>
-              <Button
-                colorSchema="secondary"
-                type="submit"
-                onClick={() => {
-                  reset();
-                  setToken("");
-                }}
-              >
-                Got it
-              </Button>
-            </div>
-            <div className="mb-8 flex items-center justify-between rounded-md bg-white/[0.07] p-2 text-base text-gray-400">
-              <p className="mr-4 break-all">{token}</p>
-              <IconButton
-                ariaLabel="copy icon"
-                colorSchema="secondary"
-                className="group relative"
-                onClick={() => {
-                  navigator.clipboard.writeText(token);
-                  setIsClientSecretCopied.on();
-                }}
-              >
-                <FontAwesomeIcon icon={isClientSecretCopied ? faCheck : faCopy} />
-                <span className="absolute -left-8 -top-20 hidden w-28 translate-y-full rounded-md bg-bunker-800 py-2 pl-3 text-center text-sm text-gray-400 group-hover:flex group-hover:animate-fadeIn">
-                  {t("common.click-to-copy")}
-                </span>
-              </IconButton>
-            </div>
-          </div>
-        ) : (
-          <form onSubmit={handleSubmit(onFormSubmit)} className="mb-8">
-            <Controller
-              control={control}
-              name="name"
-              render={({ field, fieldState: { error } }) => (
-                <FormControl label="Name" isError={Boolean(error)} errorText={error?.message}>
-                  <div className="flex">
-                    <Input {...field} placeholder="My Token" />
-                    <Button
-                      className="ml-4"
-                      size="sm"
-                      type="submit"
-                      isLoading={isSubmitting}
-                      isDisabled={isSubmitting}
-                    >
-                      Create
-                    </Button>
-                  </div>
-                </FormControl>
-              )}
-            />
-          </form>
-        )}
-        <h2 className="mb-4">Tokens</h2>
-        <TableContainer>
-          <Table>
-            <THead>
-              <Tr>
-                <Th>name</Th>
-                <Th>Num Uses</Th>
-                <Th>Created At</Th>
-                <Th>Max Expires At</Th>
-                <Th className="w-5" />
-              </Tr>
-            </THead>
-            <TBody>
-              {isPending && <TableSkeleton columns={5} innerKey="identities-tokens" />}
-              {!isPending &&
-                tokens?.map(
-                  ({
-                    id,
-                    createdAt,
-                    name,
-                    accessTokenNumUses,
-                    accessTokenNumUsesLimit,
-                    accessTokenMaxTTL,
-                    isAccessTokenRevoked
-                  }) => {
-                    const expiresAt = new Date(
-                      new Date(createdAt).getTime() + accessTokenMaxTTL * 1000
-                    );
-
-                    return (
-                      <Tr className="h-10 items-center" key={`mi-client-secret-${id}`}>
-                        <Td>{name === "" ? "-" : name}</Td>
-                        <Td>{`${accessTokenNumUses}${
-                          accessTokenNumUsesLimit ? `/${accessTokenNumUsesLimit}` : ""
-                        }`}</Td>
-                        <Td>{format(new Date(createdAt), "yyyy-MM-dd")}</Td>
-                        <Td>
-                          {isAccessTokenRevoked ? "Revoked" : `${format(expiresAt, "yyyy-MM-dd")}`}
-                        </Td>
-                        <Td>
-                          {!isAccessTokenRevoked && (
-                            <IconButton
-                              onClick={() => {
-                                handlePopUpOpen("revokeToken", {
-                                  identityId: popUpData?.identityId,
-                                  tokenId: id,
-                                  name
-                                });
-                              }}
-                              size="lg"
-                              colorSchema="primary"
-                              variant="plain"
-                              ariaLabel="update"
-                            >
-                              <FontAwesomeIcon icon={faXmark} />
-                            </IconButton>
-                          )}
-                        </Td>
-                      </Tr>
-                    );
-                  }
-                )}
-              {!isPending && data && data?.length === 0 && (
-                <Tr>
-                  <Td colSpan={5}>
-                    <EmptyState
-                      title="No tokens have been created for this identity yet"
-                      icon={faKey}
-                    />
-                  </Td>
-                </Tr>
-              )}
-            </TBody>
-          </Table>
-        </TableContainer>
-      </ModalContent>
-    </Modal>
-  );
-};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/IdentityAuthFieldDisplay.tsx

@@ -0,0 +1,20 @@
+import { ReactNode } from "react";
+
+type Props = {
+  label: string;
+  children: ReactNode;
+  className?: string;
+};
+
+export const IdentityAuthFieldDisplay = ({ label, children, className }: Props) => {
+  return (
+    <div className={className}>
+      <span className="text-sm text-mineshaft-400">{label}</span>
+      {children ? (
+        <p className="break-words text-base leading-4">{children}</p>
+      ) : (
+        <p className="text-base italic leading-4 text-bunker-400">Not set</p>
+      )}
+    </div>
+  );
+};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/IdentityTokenAuthTokensTable.tsx

@@ -0,0 +1,239 @@
+import { useState } from "react";
+import { faBan, faEdit, faKey, faPlus } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { format } from "date-fns";
+
+import { createNotification } from "@app/components/notifications";
+import { OrgPermissionCan } from "@app/components/permissions";
+import {
+  Button,
+  DeleteActionModal,
+  EmptyState,
+  IconButton,
+  Pagination,
+  Table,
+  TableContainer,
+  TBody,
+  Td,
+  Th,
+  THead,
+  Tooltip,
+  Tr
+} from "@app/components/v2";
+import { OrgPermissionActions, OrgPermissionSubjects } from "@app/context";
+import { usePopUp } from "@app/hooks";
+import { useRevokeIdentityTokenAuthToken } from "@app/hooks/api";
+import { IdentityAccessToken } from "@app/hooks/api/identities/types";
+import { IdentityTokenModal } from "@app/pages/organization/IdentityDetailsByIDPage/components";
+
+type Props = {
+  tokens: IdentityAccessToken[];
+  identityId: string;
+};
+
+export const IdentityTokenAuthTokensTable = ({ tokens, identityId }: Props) => {
+  const { popUp, handlePopUpOpen, handlePopUpToggle, handlePopUpClose } = usePopUp([
+    "token",
+    "revokeToken"
+  ] as const);
+
+  const [page, setPage] = useState(1);
+  const [perPage, setPerPage] = useState(5);
+
+  const { mutateAsync: revokeToken } = useRevokeIdentityTokenAuthToken();
+
+  const onRevokeTokenSubmit = async ({
+    identityId: parentIdentityId,
+    tokenId,
+    name
+  }: {
+    identityId: string;
+    tokenId: string;
+    name: string;
+  }) => {
+    try {
+      await revokeToken({
+        identityId: parentIdentityId,
+        tokenId
+      });
+
+      handlePopUpClose("revokeToken");
+
+      createNotification({
+        text: `Successfully revoked token ${name ?? ""}`,
+        type: "success"
+      });
+    } catch (err) {
+      console.error(err);
+      const error = err as any;
+      const text = error?.response?.data?.message ?? "Failed to revoke token";
+
+      createNotification({
+        text,
+        type: "error"
+      });
+    }
+  };
+
+  return (
+    <div className="col-span-2 mt-3">
+      <div className="flex items-end justify-between border-b border-mineshaft-500 pb-2">
+        <span className="text-bunker-300">Access Tokens</span>
+        <OrgPermissionCan I={OrgPermissionActions.Edit} a={OrgPermissionSubjects.Identity}>
+          {(isAllowed) => (
+            <Button
+              size="xs"
+              isDisabled={!isAllowed}
+              onClick={() => {
+                handlePopUpOpen("token", {
+                  identityId
+                });
+              }}
+              leftIcon={<FontAwesomeIcon icon={faPlus} />}
+              colorSchema="secondary"
+            >
+              Add Token
+            </Button>
+          )}
+        </OrgPermissionCan>
+      </div>
+      <TableContainer className="mt-4 rounded-none border-none">
+        <Table>
+          {Boolean(tokens?.length) && (
+            <THead>
+              <Tr className="text-xs font-medium">
+                <Th className="py-1 font-normal">Name</Th>
+                <Th className="whitespace-nowrap py-1 font-normal">Number of Uses</Th>
+                <Th className="py-1 font-normal">Expires</Th>
+                <Th className="w-5 py-1 font-normal" />
+              </Tr>
+            </THead>
+          )}
+          <TBody>
+            {tokens
+              .slice((page - 1) * perPage, perPage * page)
+              .map(
+                ({
+                  createdAt,
+                  isAccessTokenRevoked,
+                  name,
+                  accessTokenTTL,
+                  accessTokenNumUsesLimit,
+                  accessTokenNumUses,
+                  id
+                }) => {
+                  let expiresAt;
+                  if (accessTokenTTL > 0) {
+                    expiresAt = new Date(new Date(createdAt).getTime() + accessTokenTTL * 1000);
+                  }
+
+                  return (
+                    <Tr className="text-xs hover:bg-mineshaft-700" key={id}>
+                      <Td>{name || "-"}</Td>
+                      <Td>
+                        {`${accessTokenNumUses}${accessTokenNumUsesLimit ? `/${accessTokenNumUsesLimit}` : ""}`}
+                      </Td>
+                      <Td className="whitespace-nowrap">
+                        {/* eslint-disable-next-line no-nested-ternary */}
+                        {isAccessTokenRevoked
+                          ? "Revoked"
+                          : expiresAt
+                            ? format(expiresAt, "yyyy-MM-dd")
+                            : "-"}
+                      </Td>
+                      <Td>
+                        <div className="flex items-center gap-2">
+                          <OrgPermissionCan
+                            I={OrgPermissionActions.Edit}
+                            a={OrgPermissionSubjects.Identity}
+                          >
+                            {(isAllowed) => (
+                              <Tooltip content={isAllowed ? "Edit Token" : "Access Restricted"}>
+                                <IconButton
+                                  isDisabled={!isAllowed}
+                                  onClick={() => {
+                                    handlePopUpOpen("token", {
+                                      identityId,
+                                      tokenId: id,
+                                      name
+                                    });
+                                  }}
+                                  size="xs"
+                                  variant="plain"
+                                  ariaLabel="Edit token"
+                                >
+                                  <FontAwesomeIcon icon={faEdit} />
+                                </IconButton>
+                              </Tooltip>
+                            )}
+                          </OrgPermissionCan>
+                          {!isAccessTokenRevoked && (
+                            <OrgPermissionCan
+                              I={OrgPermissionActions.Edit}
+                              a={OrgPermissionSubjects.Identity}
+                            >
+                              {(isAllowed) => (
+                                <Tooltip content={isAllowed ? "Revoke Token" : "Access Restricted"}>
+                                  <IconButton
+                                    isDisabled={!isAllowed}
+                                    onClick={() => {
+                                      handlePopUpOpen("revokeToken", {
+                                        identityId,
+                                        tokenId: id,
+                                        name
+                                      });
+                                    }}
+                                    size="xs"
+                                    colorSchema="danger"
+                                    variant="plain"
+                                    ariaLabel="Revoke token"
+                                  >
+                                    <FontAwesomeIcon icon={faBan} />
+                                  </IconButton>
+                                </Tooltip>
+                              )}
+                            </OrgPermissionCan>
+                          )}
+                        </div>
+                      </Td>
+                    </Tr>
+                  );
+                }
+              )}
+          </TBody>
+        </Table>
+        {!tokens?.length && (
+          <EmptyState iconSize="1x" title="No access tokens have been generated" icon={faKey} />
+        )}
+        {tokens.length > 0 && (
+          <Pagination
+            count={tokens.length}
+            page={page}
+            perPage={perPage}
+            perPageList={[5]}
+            onChangePage={(newPage) => setPage(newPage)}
+            onChangePerPage={(newPerPage) => setPerPage(newPerPage)}
+          />
+        )}
+      </TableContainer>
+      <DeleteActionModal
+        isOpen={popUp.revokeToken.isOpen}
+        title={`Are you sure want to revoke ${
+          (popUp?.revokeToken?.data as { name: string })?.name || ""
+        }?`}
+        onChange={(isOpen) => handlePopUpToggle("revokeToken", isOpen)}
+        deleteKey="confirm"
+        onDeleteApproved={() => {
+          const revokeTokenData = popUp?.revokeToken?.data as {
+            identityId: string;
+            tokenId: string;
+            name: string;
+          };
+
+          return onRevokeTokenSubmit(revokeTokenData);
+        }}
+      />
+      <IdentityTokenModal popUp={popUp} handlePopUpToggle={handlePopUpToggle} />
+    </div>
+  );
+};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/IdentityUniversalAuthClientSecretsTable.tsx

@@ -0,0 +1,196 @@
+import { useState } from "react";
+import { faKey, faPlus, faTrash } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { format } from "date-fns";
+
+import { createNotification } from "@app/components/notifications";
+import { OrgPermissionCan } from "@app/components/permissions";
+import {
+  Button,
+  DeleteActionModal,
+  EmptyState,
+  IconButton,
+  Pagination,
+  Table,
+  TableContainer,
+  TBody,
+  Td,
+  Th,
+  THead,
+  Tooltip,
+  Tr
+} from "@app/components/v2";
+import { OrgPermissionActions, OrgPermissionSubjects } from "@app/context";
+import { usePopUp } from "@app/hooks";
+import { useRevokeIdentityUniversalAuthClientSecret } from "@app/hooks/api";
+import { ClientSecretData } from "@app/hooks/api/identities/types";
+import { IdentityClientSecretModal } from "@app/pages/organization/IdentityDetailsByIDPage/components";
+
+type Props = {
+  clientSecrets: ClientSecretData[];
+  identityId: string;
+};
+
+export const IdentityUniversalAuthClientSecretsTable = ({ clientSecrets, identityId }: Props) => {
+  const { popUp, handlePopUpOpen, handlePopUpToggle } = usePopUp([
+    "revokeClientSecret",
+    "clientSecret"
+  ] as const);
+
+  const [page, setPage] = useState(1);
+  const [perPage, setPerPage] = useState(5);
+
+  const { mutateAsync: revokeClientSecret } = useRevokeIdentityUniversalAuthClientSecret();
+
+  const onDeleteClientSecretSubmit = async (clientSecretId: string) => {
+    try {
+      await revokeClientSecret({
+        identityId,
+        clientSecretId
+      });
+
+      handlePopUpToggle("revokeClientSecret", false);
+
+      createNotification({
+        text: "Successfully deleted client secret",
+        type: "success"
+      });
+    } catch (err) {
+      console.error(err);
+      createNotification({
+        text: "Failed to delete client secret",
+        type: "error"
+      });
+    }
+  };
+
+  return (
+    <div className="col-span-2">
+      <div className="flex items-end justify-between border-b border-mineshaft-500 pb-2">
+        <span className="text-bunker-300">Client Secrets</span>
+        <OrgPermissionCan I={OrgPermissionActions.Edit} a={OrgPermissionSubjects.Identity}>
+          {(isAllowed) => (
+            <Button
+              isDisabled={!isAllowed}
+              size="xs"
+              onClick={() => {
+                handlePopUpOpen("clientSecret", {
+                  identityId
+                });
+              }}
+              leftIcon={<FontAwesomeIcon icon={faPlus} />}
+              colorSchema="secondary"
+            >
+              Add Client Secret
+            </Button>
+          )}
+        </OrgPermissionCan>
+      </div>
+      <TableContainer className="mt-4 rounded-none border-none">
+        <Table>
+          {Boolean(clientSecrets?.length) && (
+            <THead>
+              <Tr className="text-xs font-medium">
+                <Th className="py-1 font-normal">Secret</Th>
+                <Th className="py-1 font-normal">Description</Th>
+                <Th className="whitespace-nowrap py-1 font-normal">Number of Uses</Th>
+                <Th className="py-1 font-normal">Expires</Th>
+                <Th className="w-5 py-1 font-normal" />
+              </Tr>
+            </THead>
+          )}
+          <TBody>
+            {clientSecrets
+              .slice((page - 1) * perPage, perPage * page)
+              .map(
+                ({
+                  createdAt,
+                  clientSecretTTL,
+                  description,
+                  clientSecretNumUses,
+                  clientSecretPrefix,
+                  clientSecretNumUsesLimit,
+                  id
+                }) => {
+                  let expiresAt;
+                  if (clientSecretTTL > 0) {
+                    expiresAt = new Date(new Date(createdAt).getTime() + clientSecretTTL * 1000);
+                  }
+
+                  return (
+                    <Tr className="text-xs hover:bg-mineshaft-700" key={id}>
+                      <Td>{clientSecretPrefix}***</Td>
+                      <Td>{description || "-"}</Td>
+                      <Td>
+                        {`${clientSecretNumUses}${clientSecretNumUsesLimit ? `/${clientSecretNumUsesLimit}` : ""}`}
+                      </Td>
+                      <Td className="whitespace-nowrap">
+                        {expiresAt ? format(expiresAt, "yyyy-MM-dd") : "-"}
+                      </Td>
+                      <Td>
+                        <OrgPermissionCan
+                          I={OrgPermissionActions.Edit}
+                          a={OrgPermissionSubjects.Identity}
+                        >
+                          {(isAllowed) => (
+                            <Tooltip content={isAllowed ? "Delete Secret" : "Access Restricted"}>
+                              <IconButton
+                                isDisabled={!isAllowed}
+                                onClick={() => {
+                                  handlePopUpOpen("revokeClientSecret", {
+                                    clientSecretPrefix,
+                                    clientSecretId: id
+                                  });
+                                }}
+                                size="xs"
+                                colorSchema="danger"
+                                variant="plain"
+                                ariaLabel="Delete secret"
+                              >
+                                <FontAwesomeIcon icon={faTrash} />
+                              </IconButton>
+                            </Tooltip>
+                          )}
+                        </OrgPermissionCan>
+                      </Td>
+                    </Tr>
+                  );
+                }
+              )}
+          </TBody>
+        </Table>
+        {!clientSecrets?.length && (
+          <EmptyState iconSize="1x" title="No client secrets have been generated" icon={faKey} />
+        )}
+        {clientSecrets.length > 0 && (
+          <Pagination
+            count={clientSecrets.length}
+            page={page}
+            perPage={perPage}
+            perPageList={[5]}
+            onChangePage={(newPage) => setPage(newPage)}
+            onChangePerPage={(newPerPage) => setPerPage(newPerPage)}
+          />
+        )}
+      </TableContainer>
+      <DeleteActionModal
+        isOpen={popUp.revokeClientSecret.isOpen}
+        title={`Are you sure want to delete the client secret ${
+          (popUp?.revokeClientSecret?.data as { clientSecretPrefix: string })?.clientSecretPrefix ||
+          ""
+        }************?`}
+        onChange={(isOpen) => handlePopUpToggle("revokeClientSecret", isOpen)}
+        deleteKey="confirm"
+        onDeleteApproved={() => {
+          const deleteClientSecretData = popUp?.revokeClientSecret?.data as {
+            clientSecretId: string;
+            clientSecretPrefix: string;
+          };
+
+          return onDeleteClientSecretSubmit(deleteClientSecretData.clientSecretId);
+        }}
+      />
+      <IdentityClientSecretModal popUp={popUp} handlePopUpToggle={handlePopUpToggle} />
+    </div>
+  );
+};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityAuthModal.tsx

@@ -0,0 +1,174 @@
+import { UpgradePlanModal } from "@app/components/license/UpgradePlanModal";
+import { createNotification } from "@app/components/notifications";
+import { DeleteActionModal, Modal, ModalContent } from "@app/components/v2";
+import { useOrganization } from "@app/context";
+import { usePopUp } from "@app/hooks";
+import {
+  IdentityAuthMethod,
+  identityAuthToNameMap,
+  useDeleteIdentityAwsAuth,
+  useDeleteIdentityAzureAuth,
+  useDeleteIdentityGcpAuth,
+  useDeleteIdentityJwtAuth,
+  useDeleteIdentityKubernetesAuth,
+  useDeleteIdentityOidcAuth,
+  useDeleteIdentityTokenAuth,
+  useDeleteIdentityUniversalAuth
+} from "@app/hooks/api";
+
+import { ViewAuthMethodProps } from "./types";
+import { ViewIdentityAwsAuthContent } from "./ViewIdentityAwsAuthContent";
+import { ViewIdentityAzureAuthContent } from "./ViewIdentityAzureAuthContent";
+import { ViewIdentityGcpAuthContent } from "./ViewIdentityGcpAuthContent";
+import { ViewIdentityJwtAuthContent } from "./ViewIdentityJwtAuthContent";
+import { ViewIdentityKubernetesAuthContent } from "./ViewIdentityKubernetesAuthContent";
+import { ViewIdentityOidcAuthContent } from "./ViewIdentityOidcAuthContent";
+import { ViewIdentityTokenAuthContent } from "./ViewIdentityTokenAuthContent";
+import { ViewIdentityUniversalAuthContent } from "./ViewIdentityUniversalAuthContent";
+
+type Props = {
+  identityId: string;
+  authMethod?: IdentityAuthMethod;
+  isOpen: boolean;
+  onOpenChange: (isOpen: boolean) => void;
+  onDeleteAuthMethod: () => void;
+};
+
+type TRevokeOptions = {
+  identityId: string;
+  organizationId: string;
+};
+
+export const Content = ({
+  identityId,
+  authMethod,
+  onDeleteAuthMethod
+}: Pick<Props, "authMethod" | "identityId" | "onDeleteAuthMethod">) => {
+  const { currentOrg } = useOrganization();
+  const orgId = currentOrg?.id || "";
+
+  const { popUp, handlePopUpOpen, handlePopUpToggle } = usePopUp([
+    "revokeAuthMethod",
+    "upgradePlan",
+    "identityAuthMethod"
+  ] as const);
+
+  const { mutateAsync: revokeUniversalAuth } = useDeleteIdentityUniversalAuth();
+  const { mutateAsync: revokeTokenAuth } = useDeleteIdentityTokenAuth();
+  const { mutateAsync: revokeKubernetesAuth } = useDeleteIdentityKubernetesAuth();
+  const { mutateAsync: revokeGcpAuth } = useDeleteIdentityGcpAuth();
+  const { mutateAsync: revokeAwsAuth } = useDeleteIdentityAwsAuth();
+  const { mutateAsync: revokeAzureAuth } = useDeleteIdentityAzureAuth();
+  const { mutateAsync: revokeOidcAuth } = useDeleteIdentityOidcAuth();
+  const { mutateAsync: revokeJwtAuth } = useDeleteIdentityJwtAuth();
+
+  let Component: (props: ViewAuthMethodProps) => JSX.Element;
+  let revokeMethod: (revokeOptions: TRevokeOptions) => Promise<any>;
+
+  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.AWS_AUTH:
+      revokeMethod = revokeAwsAuth;
+      Component = ViewIdentityAwsAuthContent;
+      break;
+    case IdentityAuthMethod.AZURE_AUTH:
+      revokeMethod = revokeAzureAuth;
+      Component = ViewIdentityAzureAuthContent;
+      break;
+    case IdentityAuthMethod.OIDC_AUTH:
+      revokeMethod = revokeOidcAuth;
+      Component = ViewIdentityOidcAuthContent;
+      break;
+    case IdentityAuthMethod.JWT_AUTH:
+      revokeMethod = revokeJwtAuth;
+      Component = ViewIdentityJwtAuthContent;
+      break;
+    default:
+      throw new Error(`Unhandled Auth Method: ${authMethod}`);
+  }
+
+  const handleDeleteAuthMethod = async () => {
+    try {
+      await revokeMethod({
+        identityId,
+        organizationId: orgId
+      });
+
+      createNotification({
+        text: "Successfully removed auth method",
+        type: "success"
+      });
+
+      handlePopUpToggle("revokeAuthMethod", false);
+      onDeleteAuthMethod();
+    } catch {
+      createNotification({
+        text: "Failed to remove auth method",
+        type: "error"
+      });
+    }
+  };
+
+  return (
+    <>
+      <Component
+        identityId={identityId}
+        onDelete={handleDelete}
+        popUp={popUp}
+        handlePopUpOpen={handlePopUpOpen}
+        handlePopUpToggle={handlePopUpToggle}
+      />
+      <DeleteActionModal
+        isOpen={popUp?.revokeAuthMethod?.isOpen}
+        title={`Are you sure want to remove ${identityAuthToNameMap[authMethod]} on this identity?`}
+        onChange={(isOpen) => handlePopUpToggle("revokeAuthMethod", isOpen)}
+        deleteKey="confirm"
+        buttonText="Remove"
+        onDeleteApproved={handleDeleteAuthMethod}
+      />
+      <UpgradePlanModal
+        isOpen={popUp.upgradePlan.isOpen}
+        onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
+        text={(popUp.upgradePlan?.data as { description: string })?.description}
+      />
+    </>
+  );
+};
+
+export const ViewIdentityAuthModal = ({
+  isOpen,
+  onOpenChange,
+  authMethod,
+  identityId
+}: Omit<Props, "onDeleteAuthMethod">) => {
+  if (!identityId || !authMethod) return null;
+
+  return (
+    <Modal isOpen={isOpen} onOpenChange={onOpenChange}>
+      <ModalContent className="max-w-2xl" title={identityAuthToNameMap[authMethod]}>
+        <Content
+          identityId={identityId}
+          authMethod={authMethod}
+          onDeleteAuthMethod={() => onOpenChange(false)}
+        />
+      </ModalContent>
+    </Modal>
+  );
+};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityAwsAuthContent.tsx

@@ -0,0 +1,79 @@
+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";
+import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
+
+export const ViewIdentityAwsAuthContent = ({
+  identityId,
+  handlePopUpToggle,
+  handlePopUpOpen,
+  onDelete,
+  popUp
+}: ViewAuthMethodProps) => {
+  const { data, isPending } = useGetIdentityAwsAuth(identityId);
+
+  if (isPending) {
+    return (
+      <div className="flex w-full items-center justify-center">
+        <Spinner className="text-mineshaft-400" />
+      </div>
+    );
+  }
+
+  if (!data) {
+    return (
+      <EmptyState icon={faBan} title="Could not find AWS Auth associated with this Identity." />
+    );
+  }
+
+  if (popUp.identityAuthMethod.isOpen) {
+    return (
+      <IdentityAwsAuthForm
+        identityId={identityId}
+        isUpdate
+        handlePopUpOpen={handlePopUpOpen}
+        handlePopUpToggle={handlePopUpToggle}
+      />
+    );
+  }
+
+  return (
+    <ViewIdentityContentWrapper
+      onEdit={() => handlePopUpOpen("identityAuthMethod")}
+      onDelete={onDelete}
+    >
+      <IdentityAuthFieldDisplay label="Access Token TLL (seconds)">
+        {data.accessTokenTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max TLL (seconds)">
+        {data.accessTokenMaxTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max Number of Uses">
+        {data.accessTokenNumUsesLimit}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Trusted IPs">
+        {data.accessTokenTrustedIps.map((ip) => ip.ipAddress).join(", ")}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Allowed Principal ARNs">
+        {data.allowedPrincipalArns
+          ?.split(",")
+          .map((arn) => arn.trim())
+          .join(", ")}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Allowed Account IDs">
+        {data.allowedAccountIds
+          ?.split(",")
+          .map((id) => id.trim())
+          .join(", ")}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="STS Endpoint">
+        {data.stsEndpoint}
+      </IdentityAuthFieldDisplay>
+    </ViewIdentityContentWrapper>
+  );
+};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityAzureAuthContent.tsx

@@ -0,0 +1,76 @@
+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";
+import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
+
+export const ViewIdentityAzureAuthContent = ({
+  identityId,
+  handlePopUpToggle,
+  handlePopUpOpen,
+  onDelete,
+  popUp
+}: ViewAuthMethodProps) => {
+  const { data, isPending } = useGetIdentityAzureAuth(identityId);
+
+  if (isPending) {
+    return (
+      <div className="flex w-full items-center justify-center">
+        <Spinner className="text-mineshaft-400" />
+      </div>
+    );
+  }
+
+  if (!data) {
+    return (
+      <EmptyState icon={faBan} title="Could not find Azure Auth associated with this Identity." />
+    );
+  }
+
+  if (popUp.identityAuthMethod.isOpen) {
+    return (
+      <IdentityAzureAuthForm
+        identityId={identityId}
+        isUpdate
+        handlePopUpOpen={handlePopUpOpen}
+        handlePopUpToggle={handlePopUpToggle}
+      />
+    );
+  }
+
+  return (
+    <ViewIdentityContentWrapper
+      onEdit={() => handlePopUpOpen("identityAuthMethod")}
+      onDelete={onDelete}
+    >
+      <IdentityAuthFieldDisplay label="Access Token TLL (seconds)">
+        {data.accessTokenTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max TLL (seconds)">
+        {data.accessTokenMaxTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max Number of Uses">
+        {data.accessTokenNumUsesLimit}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Trusted IPs">
+        {data.accessTokenTrustedIps.map((ip) => ip.ipAddress).join(", ")}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Tenant ID">
+        {data.tenantId}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Resource / Audience">
+        {data.resource}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Allowed Service Principal IDs">
+        {data.allowedServicePrincipalIds
+          ?.split(",")
+          .map((id) => id.trim())
+          .join(", ")}
+      </IdentityAuthFieldDisplay>
+    </ViewIdentityContentWrapper>
+  );
+};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityContentWrapper.tsx

@@ -0,0 +1,69 @@
+import { ReactNode } from "react";
+import { faChevronDown, faEdit, faTrash } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+import { OrgPermissionCan } from "@app/components/permissions";
+import {
+  Button,
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger
+} from "@app/components/v2";
+import { OrgPermissionActions, OrgPermissionSubjects } from "@app/context";
+
+type Props = {
+  children: ReactNode;
+  onEdit: VoidFunction;
+  onDelete: VoidFunction;
+};
+
+export const ViewIdentityContentWrapper = ({ children, onDelete, onEdit }: Props) => {
+  return (
+    <div className="flex flex-col gap-4">
+      <div>
+        <div className="flex items-end justify-between border-b border-mineshaft-500 pb-2">
+          <span className="text-bunker-300">Details</span>
+          <div className="flex items-center gap-2">
+            <DropdownMenu>
+              <DropdownMenuTrigger asChild>
+                <Button
+                  size="xs"
+                  rightIcon={<FontAwesomeIcon className="ml-1" icon={faChevronDown} />}
+                  colorSchema="secondary"
+                >
+                  Options
+                </Button>
+              </DropdownMenuTrigger>
+              <DropdownMenuContent className="min-w-[120px]" align="end">
+                <OrgPermissionCan I={OrgPermissionActions.Edit} a={OrgPermissionSubjects.Identity}>
+                  {(isAllowed) => (
+                    <DropdownMenuItem
+                      isDisabled={!isAllowed}
+                      onClick={onEdit}
+                      icon={<FontAwesomeIcon icon={faEdit} />}
+                    >
+                      Edit
+                    </DropdownMenuItem>
+                  )}
+                </OrgPermissionCan>
+                <OrgPermissionCan I={OrgPermissionActions.Edit} a={OrgPermissionSubjects.Identity}>
+                  {(isAllowed) => (
+                    <DropdownMenuItem
+                      isDisabled={!isAllowed}
+                      onClick={onDelete}
+                      icon={<FontAwesomeIcon icon={faTrash} />}
+                    >
+                      Delete
+                    </DropdownMenuItem>
+                  )}
+                </OrgPermissionCan>
+              </DropdownMenuContent>
+            </DropdownMenu>
+          </div>
+        </div>
+        <div className="mt-3 grid grid-cols-2 gap-3">{children}</div>
+      </div>
+    </div>
+  );
+};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityGcpAuthContent.tsx

@@ -0,0 +1,89 @@
+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";
+import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
+
+export const ViewIdentityGcpAuthContent = ({
+  identityId,
+  handlePopUpToggle,
+  handlePopUpOpen,
+  onDelete,
+  popUp
+}: ViewAuthMethodProps) => {
+  const { data, isPending } = useGetIdentityGcpAuth(identityId);
+
+  if (isPending) {
+    return (
+      <div className="flex w-full items-center justify-center">
+        <Spinner className="text-mineshaft-400" />
+      </div>
+    );
+  }
+
+  if (!data) {
+    return (
+      <EmptyState icon={faBan} title="Could not find GCP Auth associated with this Identity." />
+    );
+  }
+
+  if (popUp.identityAuthMethod.isOpen) {
+    return (
+      <IdentityGcpAuthForm
+        identityId={identityId}
+        isUpdate
+        handlePopUpOpen={handlePopUpOpen}
+        handlePopUpToggle={handlePopUpToggle}
+      />
+    );
+  }
+
+  return (
+    <ViewIdentityContentWrapper
+      onEdit={() => handlePopUpOpen("identityAuthMethod")}
+      onDelete={onDelete}
+    >
+      <IdentityAuthFieldDisplay label="Access Token TLL (seconds)">
+        {data.accessTokenTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max TLL (seconds)">
+        {data.accessTokenMaxTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max Number of Uses">
+        {data.accessTokenNumUsesLimit}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Trusted IPs">
+        {data.accessTokenTrustedIps.map((ip) => ip.ipAddress).join(", ")}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Type">
+        {data.type === "gce" ? "GCP ID Token Auth" : "GCP IAM Auth"}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Allowed Service Account Emails">
+        {data.allowedServiceAccounts
+          ?.split(",")
+          .map((account) => account.trim())
+          .join(", ")}
+      </IdentityAuthFieldDisplay>
+      {data.type === "gce" && (
+        <>
+          <IdentityAuthFieldDisplay className="col-span-2" label="Allowed Projects">
+            {data.allowedProjects
+              ?.split(",")
+              .map((project) => project.trim())
+              .join(", ")}
+          </IdentityAuthFieldDisplay>
+          <IdentityAuthFieldDisplay className="col-span-2" label="Allowed Zones">
+            {data.allowedZones
+              ?.split(",")
+              .map((zone) => zone.trim())
+              .join(", ")}
+          </IdentityAuthFieldDisplay>
+        </>
+      )}
+    </ViewIdentityContentWrapper>
+  );
+};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityJwtAuthContent.tsx

@@ -0,0 +1,152 @@
+import { faBan, faEye } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+import { Badge, EmptyState, Spinner, Tooltip } from "@app/components/v2";
+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 { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
+import { ViewAuthMethodProps } from "./types";
+
+export const ViewIdentityJwtAuthContent = ({
+  identityId,
+  handlePopUpToggle,
+  handlePopUpOpen,
+  onDelete,
+  popUp
+}: ViewAuthMethodProps) => {
+  const { data, isPending } = useGetIdentityJwtAuth(identityId);
+
+  if (isPending) {
+    return (
+      <div className="flex w-full items-center justify-center">
+        <Spinner className="text-mineshaft-400" />
+      </div>
+    );
+  }
+
+  if (!data) {
+    return (
+      <EmptyState icon={faBan} title="Could not find JWT Auth associated with this Identity." />
+    );
+  }
+
+  if (popUp.identityAuthMethod.isOpen) {
+    return (
+      <IdentityJwtAuthForm
+        identityId={identityId}
+        isUpdate
+        handlePopUpOpen={handlePopUpOpen}
+        handlePopUpToggle={handlePopUpToggle}
+      />
+    );
+  }
+
+  return (
+    <ViewIdentityContentWrapper
+      onEdit={() => handlePopUpOpen("identityAuthMethod")}
+      onDelete={onDelete}
+    >
+      <IdentityAuthFieldDisplay label="Access Token TLL (seconds)">
+        {data.accessTokenTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max TLL (seconds)">
+        {data.accessTokenMaxTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max Number of Uses">
+        {data.accessTokenNumUsesLimit}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Trusted IPs">
+        {data.accessTokenTrustedIps.map((ip) => ip.ipAddress).join(", ")}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Configuration Type">
+        {data.configurationType === IdentityJwtConfigurationType.JWKS ? "JWKS" : "Static"}
+      </IdentityAuthFieldDisplay>
+      {data.configurationType === IdentityJwtConfigurationType.JWKS ? (
+        <>
+          <IdentityAuthFieldDisplay className="col-span-2" label="JWKS URL">
+            {data.jwksUrl}
+          </IdentityAuthFieldDisplay>
+          <IdentityAuthFieldDisplay className="col-span-2" label="JWKS CA Certificate">
+            {data.jwksCaCert && (
+              <Tooltip
+                side="right"
+                className="max-w-xl p-2"
+                content={
+                  <p className="break-words rounded bg-mineshaft-600 p-2">{data.jwksCaCert}</p>
+                }
+              >
+                <div className="w-min">
+                  <Badge className="flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
+                    <FontAwesomeIcon icon={faEye} />
+                    <span>Reveal</span>
+                  </Badge>
+                </div>
+              </Tooltip>
+            )}
+          </IdentityAuthFieldDisplay>
+        </>
+      ) : (
+        <IdentityAuthFieldDisplay className="col-span-2" label="Public Keys">
+          {data.publicKeys.length && (
+            <div className="flex flex-wrap gap-1">
+              {data.publicKeys.map((key, index) => (
+                <Tooltip
+                  side="right"
+                  className="max-w-xl p-2"
+                  key={key}
+                  content={
+                    <p className="whitespace-normal break-words rounded bg-mineshaft-600 p-2">
+                      {key}
+                    </p>
+                  }
+                >
+                  <div className="inline-block w-min">
+                    <Badge className="flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
+                      <FontAwesomeIcon icon={faEye} />
+                      <span>Key {index + 1}</span>
+                    </Badge>
+                  </div>
+                </Tooltip>
+              ))}
+            </div>
+          )}
+        </IdentityAuthFieldDisplay>
+      )}
+      <IdentityAuthFieldDisplay className="col-span-2" label="Issuer">
+        {data.boundIssuer}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Subject">
+        {data.boundSubject}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Audiences">
+        {data.boundAudiences
+          ?.split(",")
+          .map((name) => name.trim())
+          .join(", ")}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Claims">
+        {Object.keys(data.boundClaims).length && (
+          <Tooltip
+            side="right"
+            className="max-w-xl p-2"
+            content={
+              <pre className="whitespace-pre-wrap rounded bg-mineshaft-600 p-2">
+                {JSON.stringify(data.boundClaims, null, 2)}
+              </pre>
+            }
+          >
+            <div className="w-min">
+              <Badge className="flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
+                <FontAwesomeIcon icon={faEye} />
+                <span>Reveal</span>
+              </Badge>
+            </div>
+          </Tooltip>
+        )}
+      </IdentityAuthFieldDisplay>
+    </ViewIdentityContentWrapper>
+  );
+};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityKubernetesAuthContent.tsx

@@ -0,0 +1,121 @@
+import { faBan, faEye } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+import { Badge, EmptyState, Spinner, Tooltip } from "@app/components/v2";
+import { 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";
+import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
+
+export const ViewIdentityKubernetesAuthContent = ({
+  identityId,
+  handlePopUpToggle,
+  handlePopUpOpen,
+  onDelete,
+  popUp
+}: ViewAuthMethodProps) => {
+  const { data, isPending } = useGetIdentityKubernetesAuth(identityId);
+
+  if (isPending) {
+    return (
+      <div className="flex w-full items-center justify-center">
+        <Spinner className="text-mineshaft-400" />
+      </div>
+    );
+  }
+
+  if (!data) {
+    return (
+      <EmptyState
+        icon={faBan}
+        title="Could not find Kubernetes Auth associated with this Identity."
+      />
+    );
+  }
+
+  if (popUp.identityAuthMethod.isOpen) {
+    return (
+      <IdentityKubernetesAuthForm
+        identityId={identityId}
+        isUpdate
+        handlePopUpOpen={handlePopUpOpen}
+        handlePopUpToggle={handlePopUpToggle}
+      />
+    );
+  }
+
+  return (
+    <ViewIdentityContentWrapper
+      onEdit={() => handlePopUpOpen("identityAuthMethod")}
+      onDelete={onDelete}
+    >
+      <IdentityAuthFieldDisplay label="Access Token TLL (seconds)">
+        {data.accessTokenTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max TLL (seconds)">
+        {data.accessTokenMaxTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max Number of Uses">
+        {data.accessTokenNumUsesLimit}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Trusted IPs">
+        {data.accessTokenTrustedIps.map((ip) => ip.ipAddress).join(", ")}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay
+        className="col-span-2"
+        label="Kubernetes Host / Base Kubernetes API URL"
+      >
+        {data.kubernetesHost}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Token Reviewer JWT">
+        <Tooltip
+          side="right"
+          className="max-w-xl p-2"
+          content={
+            <p className="break-words rounded bg-mineshaft-600 p-2">{data.tokenReviewerJwt}</p>
+          }
+        >
+          <div className="w-min">
+            <Badge className="flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
+              <FontAwesomeIcon icon={faEye} />
+              <span>Reveal</span>
+            </Badge>
+          </div>
+        </Tooltip>
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Allowed Service Account Names">
+        {data.allowedNames
+          ?.split(",")
+          .map((name) => name.trim())
+          .join(", ")}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Allowed Namespaces">
+        {data.allowedNamespaces
+          ?.split(",")
+          .map((namespace) => namespace.trim())
+          .join(", ")}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Allowed Audience">
+        {data.allowedAudience}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="CA Certificate">
+        {data.caCert && (
+          <Tooltip
+            side="right"
+            className="max-w-xl p-2"
+            content={<p className="break-words rounded bg-mineshaft-600 p-2">{data.caCert}</p>}
+          >
+            <div className="w-min">
+              <Badge className="flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
+                <FontAwesomeIcon icon={faEye} />
+                <span>Reveal</span>
+              </Badge>
+            </div>
+          </Tooltip>
+        )}
+      </IdentityAuthFieldDisplay>
+    </ViewIdentityContentWrapper>
+  );
+};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityOidcAuthContent.tsx

@@ -0,0 +1,116 @@
+import { faBan, faEye } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+import { Badge, EmptyState, Spinner, Tooltip } from "@app/components/v2";
+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 { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
+import { ViewAuthMethodProps } from "./types";
+
+export const ViewIdentityOidcAuthContent = ({
+  identityId,
+  handlePopUpToggle,
+  handlePopUpOpen,
+  onDelete,
+  popUp
+}: ViewAuthMethodProps) => {
+  const { data, isPending } = useGetIdentityOidcAuth(identityId);
+
+  if (isPending) {
+    return (
+      <div className="flex w-full items-center justify-center">
+        <Spinner className="text-mineshaft-400" />
+      </div>
+    );
+  }
+
+  if (!data) {
+    return (
+      <EmptyState icon={faBan} title="Could not find OIDC Auth associated with this Identity." />
+    );
+  }
+
+  if (popUp.identityAuthMethod.isOpen) {
+    return (
+      <IdentityOidcAuthForm
+        identityId={identityId}
+        isUpdate
+        handlePopUpOpen={handlePopUpOpen}
+        handlePopUpToggle={handlePopUpToggle}
+      />
+    );
+  }
+
+  return (
+    <ViewIdentityContentWrapper
+      onEdit={() => handlePopUpOpen("identityAuthMethod")}
+      onDelete={onDelete}
+    >
+      <IdentityAuthFieldDisplay label="Access Token TLL (seconds)">
+        {data.accessTokenTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max TLL (seconds)">
+        {data.accessTokenMaxTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max Number of Uses">
+        {data.accessTokenNumUsesLimit}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Trusted IPs">
+        {data.accessTokenTrustedIps.map((ip) => ip.ipAddress).join(", ")}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="OIDC Discovery URL">
+        {data.oidcDiscoveryUrl}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Issuer">
+        {data.boundIssuer}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="CA Certificate">
+        {data.caCert && (
+          <Tooltip
+            side="right"
+            className="max-w-xl p-2"
+            content={<p className="break-words rounded bg-mineshaft-600 p-2">{data.caCert}</p>}
+          >
+            <div className="w-min">
+              <Badge className="flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
+                <FontAwesomeIcon icon={faEye} />
+                <span>Reveal</span>
+              </Badge>
+            </div>
+          </Tooltip>
+        )}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Subject">
+        {data.boundSubject}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Audiences">
+        {data.boundAudiences
+          ?.split(",")
+          .map((name) => name.trim())
+          .join(", ")}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay className="col-span-2" label="Claims">
+        {Object.keys(data.boundClaims).length && (
+          <Tooltip
+            side="right"
+            className="max-w-xl p-2"
+            content={
+              <pre className="whitespace-pre-wrap rounded bg-mineshaft-600 p-2">
+                {JSON.stringify(data.boundClaims, null, 2)}
+              </pre>
+            }
+          >
+            <div className="w-min">
+              <Badge className="flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
+                <FontAwesomeIcon icon={faEye} />
+                <span>Reveal</span>
+              </Badge>
+            </div>
+          </Tooltip>
+        )}
+      </IdentityAuthFieldDisplay>
+    </ViewIdentityContentWrapper>
+  );
+};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityTokenAuthContent.tsx

@@ -0,0 +1,68 @@
+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";
+import { ViewAuthMethodProps } from "./types";
+import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
+
+export const ViewIdentityTokenAuthContent = ({
+  identityId,
+  handlePopUpToggle,
+  handlePopUpOpen,
+  onDelete,
+  popUp
+}: ViewAuthMethodProps) => {
+  const { data, isPending } = useGetIdentityTokenAuth(identityId);
+  const { data: tokens = [], isPending: clientSecretsPending } =
+    useGetIdentityTokensTokenAuth(identityId);
+
+  if (isPending || clientSecretsPending) {
+    return (
+      <div className="flex w-full items-center justify-center">
+        <Spinner className="text-mineshaft-400" />
+      </div>
+    );
+  }
+
+  if (!data) {
+    return (
+      <EmptyState icon={faBan} title="Could not find Token Auth associated with this Identity." />
+    );
+  }
+
+  if (popUp.identityAuthMethod.isOpen) {
+    return (
+      <IdentityTokenAuthForm
+        identityId={identityId}
+        isUpdate
+        handlePopUpOpen={handlePopUpOpen}
+        handlePopUpToggle={handlePopUpToggle}
+      />
+    );
+  }
+
+  return (
+    <ViewIdentityContentWrapper
+      onEdit={() => handlePopUpOpen("identityAuthMethod")}
+      onDelete={onDelete}
+    >
+      <IdentityAuthFieldDisplay label="Access Token TLL (seconds)">
+        {data.accessTokenTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max TLL (seconds)">
+        {data.accessTokenMaxTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max Number of Uses">
+        {data.accessTokenNumUsesLimit}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Trusted IPs">
+        {data.accessTokenTrustedIps.map((ip) => ip.ipAddress).join(", ")}
+      </IdentityAuthFieldDisplay>
+      <IdentityTokenAuthTokensTable tokens={tokens} identityId={identityId} />
+    </ViewIdentityContentWrapper>
+  );
+};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/ViewIdentityUniversalAuthContent.tsx

@@ -0,0 +1,106 @@
+import { faBan, faCheck, faCopy } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+import { EmptyState, IconButton, Spinner, Tooltip } from "@app/components/v2";
+import { useTimedReset } from "@app/hooks";
+import {
+  useGetIdentityUniversalAuth,
+  useGetIdentityUniversalAuthClientSecrets
+} from "@app/hooks/api";
+import { IdentityUniversalAuthForm } from "@app/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityUniversalAuthForm";
+
+import { IdentityAuthFieldDisplay } from "./IdentityAuthFieldDisplay";
+import { IdentityUniversalAuthClientSecretsTable } from "./IdentityUniversalAuthClientSecretsTable";
+import { ViewAuthMethodProps } from "./types";
+import { ViewIdentityContentWrapper } from "./ViewIdentityContentWrapper";
+
+export const ViewIdentityUniversalAuthContent = ({
+  identityId,
+  handlePopUpToggle,
+  handlePopUpOpen,
+  onDelete,
+  popUp
+}: ViewAuthMethodProps) => {
+  const { data, isPending } = useGetIdentityUniversalAuth(identityId);
+  const { data: clientSecrets = [], isPending: clientSecretsPending } =
+    useGetIdentityUniversalAuthClientSecrets(identityId);
+
+  const [copyTextClientId, isCopyingClientId, setCopyTextClientId] = useTimedReset<string>({
+    initialState: "Copy Client ID to clipboard"
+  });
+
+  if (isPending || clientSecretsPending) {
+    return (
+      <div className="flex w-full items-center justify-center">
+        <Spinner className="text-mineshaft-400" />
+      </div>
+    );
+  }
+
+  if (!data) {
+    return (
+      <EmptyState
+        icon={faBan}
+        title="Could not find Universal Auth associated with this Identity."
+      />
+    );
+  }
+
+  if (popUp.identityAuthMethod.isOpen) {
+    return (
+      <IdentityUniversalAuthForm
+        identityId={identityId}
+        isUpdate
+        handlePopUpOpen={handlePopUpOpen}
+        handlePopUpToggle={handlePopUpToggle}
+      />
+    );
+  }
+
+  return (
+    <ViewIdentityContentWrapper
+      onEdit={() => handlePopUpOpen("identityAuthMethod")}
+      onDelete={onDelete}
+    >
+      <IdentityAuthFieldDisplay label="Access Token TLL (seconds)">
+        {data.accessTokenTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max TLL (seconds)">
+        {data.accessTokenMaxTTL}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Max Number of Uses">
+        {data.accessTokenNumUsesLimit}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Access Token Trusted IPs">
+        {data.accessTokenTrustedIps.map((ip) => ip.ipAddress).join(", ")}
+      </IdentityAuthFieldDisplay>
+      <IdentityAuthFieldDisplay label="Client Secret Trusted IPs">
+        {data.clientSecretTrustedIps.map((ip) => ip.ipAddress).join(", ")}
+      </IdentityAuthFieldDisplay>
+      <div className="col-span-2 my-3">
+        <div className="mb-3 border-b border-mineshaft-500 pb-2">
+          <span className="text-bunker-300">Client ID</span>
+        </div>
+        <div className="flex items-center gap-2">
+          <span className="text-sm">{data.clientId}</span>
+          <Tooltip content={copyTextClientId}>
+            <IconButton
+              ariaLabel="copy icon"
+              variant="plain"
+              onClick={() => {
+                navigator.clipboard.writeText(data.clientId);
+                setCopyTextClientId("Copied");
+              }}
+            >
+              <FontAwesomeIcon icon={isCopyingClientId ? faCheck : faCopy} />
+            </IconButton>
+          </Tooltip>
+        </div>
+      </div>
+      <IdentityUniversalAuthClientSecretsTable
+        clientSecrets={clientSecrets}
+        identityId={identityId}
+      />
+    </ViewIdentityContentWrapper>
+  );
+};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/index.ts

@@ -0,0 +1 @@
+export * from "./ViewIdentityAuthModal";

frontend/src/pages/organization/IdentityDetailsByIDPage/components/ViewIdentityAuthModal/types/index.ts

@@ -0,0 +1,12 @@
+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"]>;
+};

frontend/src/pages/organization/IdentityDetailsByIDPage/components/index.tsx

@@ -2,5 +2,4 @@ export { IdentityAuthenticationSection } from "./IdentityAuthenticationSection/I
 export { IdentityClientSecretModal } from "./IdentityClientSecretModal";
 export { IdentityDetailsSection } from "./IdentityDetailsSection";
 export { IdentityProjectsSection } from "./IdentityProjectsSection/IdentityProjectsSection";
-export { IdentityTokenListModal } from "./IdentityTokenListModal";
 export { IdentityTokenModal } from "./IdentityTokenModal";

frontend/src/pages/secret-manager/SecretDashboardPage/components/SecretListView/SecretListView.tsx

@@ -180,10 +180,12 @@ export const SecretListView = ({
 
       try {
         // personal secret change
+        let personalAction = false;
         if (overrideAction === "deleted") {
           await handleSecretOperation("delete", SecretType.Personal, oldKey, {
             secretId: orgSecret.idOverride
           });
+          personalAction = true;
         } else if (overrideAction && idOverride) {
           await handleSecretOperation("update", SecretType.Personal, oldKey, {
             value: valueOverride,
@@ -191,14 +193,16 @@ export const SecretListView = ({
             secretId: orgSecret.idOverride,
             skipMultilineEncoding: modSecret.skipMultilineEncoding
           });
+          personalAction = true;
         } else if (overrideAction) {
           await handleSecretOperation("create", SecretType.Personal, oldKey, {
             value: valueOverride
           });
+          personalAction = true;
         }
 
         // shared secret change
-        if (!isSharedSecUnchanged) {
+        if (!isSharedSecUnchanged && !personalAction) {
           await handleSecretOperation("update", SecretType.Shared, oldKey, {
             value,
             tags: tagIds,
@@ -232,8 +236,9 @@ export const SecretListView = ({
         });
         handlePopUpClose("secretDetail");
         createNotification({
-          type: isProtectedBranch ? "info" : "success",
+          type: isProtectedBranch && !personalAction ? "info" : "success",
-          text: isProtectedBranch
+          text:
+            isProtectedBranch && !personalAction
               ? "Requested changes have been sent for review"
               : "Successfully saved secrets"
         });
@@ -283,7 +288,12 @@ export const SecretListView = ({
         text: "Failed to delete secret"
       });
     }
-  }, [(popUp.deleteSecret?.data as SecretV3RawSanitized)?.key, environment, secretPath]);
+  }, [
+    (popUp.deleteSecret?.data as SecretV3RawSanitized)?.key,
+    environment,
+    secretPath,
+    isProtectedBranch
+  ]);
 
   // for optimization on minimise re-rendering of secret items
   const onCreateTag = useCallback(() => handlePopUpOpen("createTag"), []);

frontend/src/pages/secret-manager/integrations/GithubOauthCallbackPage/route.tsx

@@ -18,7 +18,7 @@ export const Route = createFileRoute(
   beforeLoad: ({ context, params }) => {
     return {
       breadcrumbs: [
-        ...context.breadcrumbs,
+        ...(context?.breadcrumbs || []),
         {
           label: "Integrations",
           link: linkOptions({

helm-charts/secrets-operator/Chart.yaml

@@ -13,9 +13,9 @@ type: application
 # This is the chart version. This version number should be incremented each time you make changes
 # to the chart and its templates, including the app version.
 # Versions are expected to follow Semantic Versioning (https://semver.org/)
-version: v0.8.5
+version: v0.8.7
 # This is the version number of the application being deployed. This version number should be
 # incremented each time you make changes to the application. Versions are not expected to
 # follow Semantic Versioning. They should reflect the version the application is using.
 # It is recommended to use it with quotes.
-appVersion: "v0.8.5"
+appVersion: "v0.8.7"

helm-charts/secrets-operator/templates/infisicalsecret-crd.yaml

@@ -1,4 +1,3 @@
-{{- if .Values.installCRDs }}
 apiVersion: apiextensions.k8s.io/v1
 kind: CustomResourceDefinition
 metadata:
@@ -262,6 +261,48 @@ spec:
               hostAPI:
                 description: Infisical host to pull secrets from
                 type: string
+              managedKubeSecretReferences:
+                items:
+                  properties:
+                    creationPolicy:
+                      default: Orphan
+                      description: 'The Kubernetes Secret creation policy. Enum with
+                        values: ''Owner'', ''Orphan''. Owner creates the secret and
+                        sets .metadata.ownerReferences of the InfisicalSecret CRD that
+                        created it. Orphan will not set the secret owner. This will
+                        result in the secret being orphaned and not deleted when the
+                        resource is deleted.'
+                      type: string
+                    secretName:
+                      description: The name of the Kubernetes Secret
+                      type: string
+                    secretNamespace:
+                      description: The name space where the Kubernetes Secret is located
+                      type: string
+                    secretType:
+                      default: Opaque
+                      description: 'The Kubernetes Secret type (experimental feature).
+                        More info: https://kubernetes.io/docs/concepts/configuration/secret/#secret-types'
+                      type: string
+                    template:
+                      description: The template to transform the secret data
+                      properties:
+                        data:
+                          additionalProperties:
+                            type: string
+                          description: The template key values
+                          type: object
+                        includeAllSecrets:
+                          description: This injects all retrieved secrets into the top
+                            level of your template. Secrets defined in the template
+                            will take precedence over the injected ones.
+                          type: boolean
+                      type: object
+                  required:
+                  - secretName
+                  - secretNamespace
+                  type: object
+                type: array
               managedSecretReference:
                 properties:
                   creationPolicy:
@@ -338,7 +379,6 @@ spec:
                 - secretNamespace
                 type: object
             required:
-            - managedSecretReference
             - resyncInterval
             type: object
           status:
@@ -426,4 +466,3 @@ status:
     plural: ""
   conditions: []
   storedVersions: []
-{{- end }}

helm-charts/secrets-operator/values.yaml

@@ -32,7 +32,7 @@ controllerManager:
           - ALL
     image:
       repository: infisical/kubernetes-operator
-      tag: v0.8.5
+      tag: v0.8.7
     resources:
       limits:
         cpu: 500m

k8-operator/api/v1alpha1/infisicalsecret_types.go

@@ -134,9 +134,12 @@ type InfisicalSecretSpec struct {
 	// +kubebuilder:validation:Optional
 	Authentication Authentication `json:"authentication"`
 
-	// +kubebuilder:validation:Required
+	// +kubebuilder:validation:Optional
 	ManagedSecretReference ManagedKubeSecretConfig `json:"managedSecretReference"`
 
+	// +kubebuilder:validation:Optional
+	ManagedKubeSecretReferences []ManagedKubeSecretConfig `json:"managedKubeSecretReferences"`
+
 	// +kubebuilder:default:=60
 	ResyncInterval int `json:"resyncInterval"`
 

k8-operator/api/v1alpha1/zz_generated.deepcopy.go

@@ -565,6 +565,13 @@ func (in *InfisicalSecretSpec) DeepCopyInto(out *InfisicalSecretSpec) {
 	out.TokenSecretReference = in.TokenSecretReference
 	out.Authentication = in.Authentication
 	in.ManagedSecretReference.DeepCopyInto(&out.ManagedSecretReference)
+	if in.ManagedKubeSecretReferences != nil {
+		in, out := &in.ManagedKubeSecretReferences, &out.ManagedKubeSecretReferences
+		*out = make([]ManagedKubeSecretConfig, len(*in))
+		for i := range *in {
+			(*in)[i].DeepCopyInto(&(*out)[i])
+		}
+	}
 	out.TLS = in.TLS
 }
 

k8-operator/config/crd/bases/secrets.infisical.com_infisicalsecrets.yaml

@@ -261,6 +261,48 @@ spec:
               hostAPI:
                 description: Infisical host to pull secrets from
                 type: string
+              managedKubeSecretReferences:
+                items:
+                  properties:
+                    creationPolicy:
+                      default: Orphan
+                      description: 'The Kubernetes Secret creation policy. Enum with
+                        values: ''Owner'', ''Orphan''. Owner creates the secret and
+                        sets .metadata.ownerReferences of the InfisicalSecret CRD
+                        that created it. Orphan will not set the secret owner. This
+                        will result in the secret being orphaned and not deleted when
+                        the resource is deleted.'
+                      type: string
+                    secretName:
+                      description: The name of the Kubernetes Secret
+                      type: string
+                    secretNamespace:
+                      description: The name space where the Kubernetes Secret is located
+                      type: string
+                    secretType:
+                      default: Opaque
+                      description: 'The Kubernetes Secret type (experimental feature).
+                        More info: https://kubernetes.io/docs/concepts/configuration/secret/#secret-types'
+                      type: string
+                    template:
+                      description: The template to transform the secret data
+                      properties:
+                        data:
+                          additionalProperties:
+                            type: string
+                          description: The template key values
+                          type: object
+                        includeAllSecrets:
+                          description: This injects all retrieved secrets into the
+                            top level of your template. Secrets defined in the template
+                            will take precedence over the injected ones.
+                          type: boolean
+                      type: object
+                  required:
+                  - secretName
+                  - secretNamespace
+                  type: object
+                type: array
               managedSecretReference:
                 properties:
                   creationPolicy:
@@ -339,7 +381,6 @@ spec:
                 - secretNamespace
                 type: object
             required:
-            - managedSecretReference
             - resyncInterval
             type: object
           status:

k8-operator/config/samples/crd/infisicalsecret/infisicalSecretCrd.yaml

@@ -97,8 +97,8 @@ spec:
         secretsPath: "/path"
         recursive: true
 
-  managedSecretReference:
+  managedSecretReferences:
-    secretName: managed-secret
+    - secretName: managed-secret
       secretNamespace: default
       creationPolicy: "Orphan" ## Owner | Orphan
       # secretType: kubernetes.io/dockerconfigjson

k8-operator/controllers/infisicalsecret/auto_redeployment.go

@@ -1,108 +0,0 @@
-package controllers
-
-import (
-	"context"
-	"fmt"
-	"sync"
-
-	"github.com/Infisical/infisical/k8-operator/api/v1alpha1"
-	"github.com/Infisical/infisical/k8-operator/packages/constants"
-	"github.com/go-logr/logr"
-	v1 "k8s.io/api/apps/v1"
-	corev1 "k8s.io/api/core/v1"
-	"k8s.io/apimachinery/pkg/types"
-	"sigs.k8s.io/controller-runtime/pkg/client"
-)
-
-const DEPLOYMENT_SECRET_NAME_ANNOTATION_PREFIX = "secrets.infisical.com/managed-secret"
-const AUTO_RELOAD_DEPLOYMENT_ANNOTATION = "secrets.infisical.com/auto-reload" // needs to be set to true for a deployment to start auto redeploying
-
-func (r *InfisicalSecretReconciler) ReconcileDeploymentsWithManagedSecrets(ctx context.Context, logger logr.Logger, infisicalSecret v1alpha1.InfisicalSecret) (int, error) {
-	listOfDeployments := &v1.DeploymentList{}
-	err := r.Client.List(ctx, listOfDeployments, &client.ListOptions{Namespace: infisicalSecret.Spec.ManagedSecretReference.SecretNamespace})
-	if err != nil {
-		return 0, fmt.Errorf("unable to get deployments in the [namespace=%v] [err=%v]", infisicalSecret.Spec.ManagedSecretReference.SecretNamespace, err)
-	}
-
-	managedKubeSecretNameAndNamespace := types.NamespacedName{
-		Namespace: infisicalSecret.Spec.ManagedSecretReference.SecretNamespace,
-		Name:      infisicalSecret.Spec.ManagedSecretReference.SecretName,
-	}
-
-	managedKubeSecret := &corev1.Secret{}
-	err = r.Client.Get(ctx, managedKubeSecretNameAndNamespace, managedKubeSecret)
-	if err != nil {
-		return 0, fmt.Errorf("unable to fetch Kubernetes secret to update deployment: %v", err)
-	}
-
-	var wg sync.WaitGroup
-	// Iterate over the deployments and check if they use the managed secret
-	for _, deployment := range listOfDeployments.Items {
-		deployment := deployment
-		if deployment.Annotations[AUTO_RELOAD_DEPLOYMENT_ANNOTATION] == "true" && r.IsDeploymentUsingManagedSecret(deployment, infisicalSecret) {
-			// Start a goroutine to reconcile the deployment
-			wg.Add(1)
-			go func(d v1.Deployment, s corev1.Secret) {
-				defer wg.Done()
-				if err := r.ReconcileDeployment(ctx, logger, d, s); err != nil {
-					logger.Error(err, fmt.Sprintf("unable to reconcile deployment with [name=%v]. Will try next requeue", deployment.ObjectMeta.Name))
-				}
-			}(deployment, *managedKubeSecret)
-		}
-	}
-
-	wg.Wait()
-
-	return 0, nil
-}
-
-// Check if the deployment uses managed secrets
-func (r *InfisicalSecretReconciler) IsDeploymentUsingManagedSecret(deployment v1.Deployment, infisicalSecret v1alpha1.InfisicalSecret) bool {
-	managedSecretName := infisicalSecret.Spec.ManagedSecretReference.SecretName
-	for _, container := range deployment.Spec.Template.Spec.Containers {
-		for _, envFrom := range container.EnvFrom {
-			if envFrom.SecretRef != nil && envFrom.SecretRef.LocalObjectReference.Name == managedSecretName {
-				return true
-			}
-		}
-		for _, env := range container.Env {
-			if env.ValueFrom != nil && env.ValueFrom.SecretKeyRef != nil && env.ValueFrom.SecretKeyRef.LocalObjectReference.Name == managedSecretName {
-				return true
-			}
-		}
-	}
-	for _, volume := range deployment.Spec.Template.Spec.Volumes {
-		if volume.Secret != nil && volume.Secret.SecretName == managedSecretName {
-			return true
-		}
-	}
-
-	return false
-}
-
-// This function ensures that a deployment is in sync with a Kubernetes secret by comparing their versions.
-// If the version of the secret is different from the version annotation on the deployment, the annotation is updated to trigger a restart of the deployment.
-func (r *InfisicalSecretReconciler) ReconcileDeployment(ctx context.Context, logger logr.Logger, deployment v1.Deployment, secret corev1.Secret) error {
-	annotationKey := fmt.Sprintf("%s.%s", DEPLOYMENT_SECRET_NAME_ANNOTATION_PREFIX, secret.Name)
-	annotationValue := secret.Annotations[constants.SECRET_VERSION_ANNOTATION]
-
-	if deployment.Annotations[annotationKey] == annotationValue &&
-		deployment.Spec.Template.Annotations[annotationKey] == annotationValue {
-		logger.Info(fmt.Sprintf("The [deploymentName=%v] is already using the most up to date managed secrets. No action required.", deployment.ObjectMeta.Name))
-		return nil
-	}
-
-	logger.Info(fmt.Sprintf("Deployment is using outdated managed secret. Starting re-deployment [deploymentName=%v]", deployment.ObjectMeta.Name))
-
-	if deployment.Spec.Template.Annotations == nil {
-		deployment.Spec.Template.Annotations = make(map[string]string)
-	}
-
-	deployment.Annotations[annotationKey] = annotationValue
-	deployment.Spec.Template.Annotations[annotationKey] = annotationValue
-
-	if err := r.Client.Update(ctx, &deployment); err != nil {
-		return fmt.Errorf("failed to update deployment annotation: %v", err)
-	}
-	return nil
-}

k8-operator/controllers/infisicalsecret/conditions.go

@@ -21,14 +21,14 @@ func (r *InfisicalSecretReconciler) SetReadyToSyncSecretsConditions(ctx context.
 			Type:    "secrets.infisical.com/ReadyToSyncSecrets",
 			Status:  metav1.ConditionFalse,
 			Reason:  "Error",
-			Message: "Failed to sync secrets. This can be caused by invalid service token or an invalid API host that is set. Check operator logs for more info",
+			Message: fmt.Sprintf("Failed to sync secrets. This can be caused by invalid access token or an invalid API host that is set. Error: %v", errorToConditionOn),
 		})
 
 		meta.SetStatusCondition(&infisicalSecret.Status.Conditions, metav1.Condition{
 			Type:    "secrets.infisical.com/AutoRedeployReady",
 			Status:  metav1.ConditionFalse,
 			Reason:  "Stopped",
-			Message: "Auto redeployment has been stopped because the operator failed to sync secrets",
+			Message: fmt.Sprintf("Auto redeployment has been stopped because the operator failed to sync secrets. Error: %v", errorToConditionOn),
 		})
 	} else {
 		meta.SetStatusCondition(&infisicalSecret.Status.Conditions, metav1.Condition{

k8-operator/controllers/infisicalsecret/infisicalsecret_controller.go

@@ -13,6 +13,8 @@ import (
 	"sigs.k8s.io/controller-runtime/pkg/event"
 	"sigs.k8s.io/controller-runtime/pkg/predicate"
 
+	defaultErrors "errors"
+
 	secretsv1alpha1 "github.com/Infisical/infisical/k8-operator/api/v1alpha1"
 	"github.com/Infisical/infisical/k8-operator/packages/api"
 	controllerhelpers "github.com/Infisical/infisical/k8-operator/packages/controllerhelpers"
@@ -35,8 +37,6 @@ func (r *InfisicalSecretReconciler) GetLogger(req ctrl.Request) logr.Logger {
 	return r.BaseLogger.WithValues("infisicalsecret", req.NamespacedName)
 }
 
-var resourceVariablesMap map[string]util.ResourceVariables = make(map[string]util.ResourceVariables)
-
 //+kubebuilder:rbac:groups=secrets.infisical.com,resources=infisicalsecrets,verbs=get;list;watch;create;update;patch;delete
 //+kubebuilder:rbac:groups=secrets.infisical.com,resources=infisicalsecrets/status,verbs=get;update;patch
 //+kubebuilder:rbac:groups=secrets.infisical.com,resources=infisicalsecrets/finalizers,verbs=update
@@ -71,6 +71,30 @@ func (r *InfisicalSecretReconciler) Reconcile(ctx context.Context, req ctrl.Requ
 		}
 	}
 
+	// It's important we don't directly modify the CRD object, so we create a copy of it and move existing data into it.
+	managedKubeSecretReferences := infisicalSecretCRD.Spec.ManagedKubeSecretReferences
+
+	if infisicalSecretCRD.Spec.ManagedSecretReference.SecretName != "" && managedKubeSecretReferences != nil && len(managedKubeSecretReferences) > 0 {
+		errMessage := "InfisicalSecret CRD cannot have both managedSecretReference and managedKubeSecretReferences"
+		logger.Error(defaultErrors.New(errMessage), errMessage)
+		return ctrl.Result{}, defaultErrors.New(errMessage)
+	}
+
+	if infisicalSecretCRD.Spec.ManagedSecretReference.SecretName != "" {
+		logger.Info("\n\n\nThe field `managedSecretReference` will be deprecated in the near future, please use `managedKubeSecretReferences` instead.\n\nRefer to the documentation for more information: https://infisical.com/docs/integrations/platforms/kubernetes/infisical-secret-crd\n\n\n")
+
+		if managedKubeSecretReferences == nil {
+			managedKubeSecretReferences = []secretsv1alpha1.ManagedKubeSecretConfig{}
+		}
+		managedKubeSecretReferences = append(managedKubeSecretReferences, infisicalSecretCRD.Spec.ManagedSecretReference)
+	}
+
+	if len(managedKubeSecretReferences) == 0 {
+		errMessage := "InfisicalSecret CRD must have at least one managed secret reference set in the `managedKubeSecretReferences` field"
+		logger.Error(defaultErrors.New(errMessage), errMessage)
+		return ctrl.Result{}, defaultErrors.New(errMessage)
+	}
+
 	// Remove finalizers if they exist. This is to support previous InfisicalSecret CRD's that have finalizers on them.
 	// In order to delete secrets with finalizers, we first remove the finalizers so we can use the simplified and improved deletion process
 	if !infisicalSecretCRD.ObjectMeta.DeletionTimestamp.IsZero() && len(infisicalSecretCRD.ObjectMeta.Finalizers) > 0 {
@@ -127,7 +151,7 @@ func (r *InfisicalSecretReconciler) Reconcile(ctx context.Context, req ctrl.Requ
 		api.API_CA_CERTIFICATE = ""
 	}
 
-	err = r.ReconcileInfisicalSecret(ctx, logger, infisicalSecretCRD)
+	err = r.ReconcileInfisicalSecret(ctx, logger, infisicalSecretCRD, managedKubeSecretReferences)
 	r.SetReadyToSyncSecretsConditions(ctx, &infisicalSecretCRD, err)
 
 	if err != nil {
@@ -138,7 +162,7 @@ func (r *InfisicalSecretReconciler) Reconcile(ctx context.Context, req ctrl.Requ
 		}, nil
 	}
 
-	numDeployments, err := controllerhelpers.ReconcileDeploymentsWithManagedSecrets(ctx, r.Client, logger, infisicalSecretCRD.Spec.ManagedSecretReference)
+	numDeployments, err := controllerhelpers.ReconcileDeploymentsWithMultipleManagedSecrets(ctx, r.Client, logger, managedKubeSecretReferences)
 	r.SetInfisicalAutoRedeploymentReady(ctx, logger, &infisicalSecretCRD, numDeployments, err)
 	if err != nil {
 		logger.Error(err, fmt.Sprintf("unable to reconcile auto redeployment. Will requeue after [requeueTime=%v]", requeueTime))

k8-operator/controllers/infisicalsecret/infisicalsecret_helper.go

@@ -165,10 +165,10 @@ var infisicalSecretTemplateFunctions = template.FuncMap{
 	},
 }
 
-func (r *InfisicalSecretReconciler) createInfisicalManagedKubeSecret(ctx context.Context, logger logr.Logger, infisicalSecret v1alpha1.InfisicalSecret, secretsFromAPI []model.SingleEnvironmentVariable, ETag string) error {
+func (r *InfisicalSecretReconciler) createInfisicalManagedKubeSecret(ctx context.Context, logger logr.Logger, infisicalSecret v1alpha1.InfisicalSecret, managedSecretReference v1alpha1.ManagedKubeSecretConfig, secretsFromAPI []model.SingleEnvironmentVariable, ETag string) error {
 	plainProcessedSecrets := make(map[string][]byte)
-	secretType := infisicalSecret.Spec.ManagedSecretReference.SecretType
+	secretType := managedSecretReference.SecretType
-	managedTemplateData := infisicalSecret.Spec.ManagedSecretReference.Template
+	managedTemplateData := managedSecretReference.Template
 
 	if managedTemplateData == nil || managedTemplateData.IncludeAllSecrets {
 		for _, secret := range secretsFromAPI {
@@ -226,8 +226,8 @@ func (r *InfisicalSecretReconciler) createInfisicalManagedKubeSecret(ctx context
 	// create a new secret as specified by the managed secret spec of CRD
 	newKubeSecretInstance := &corev1.Secret{
 		ObjectMeta: metav1.ObjectMeta{
-			Name:        infisicalSecret.Spec.ManagedSecretReference.SecretName,
+			Name:        managedSecretReference.SecretName,
-			Namespace:   infisicalSecret.Spec.ManagedSecretReference.SecretNamespace,
+			Namespace:   managedSecretReference.SecretNamespace,
 			Annotations: annotations,
 			Labels:      labels,
 		},
@@ -235,7 +235,7 @@ func (r *InfisicalSecretReconciler) createInfisicalManagedKubeSecret(ctx context
 		Data: plainProcessedSecrets,
 	}
 
-	if infisicalSecret.Spec.ManagedSecretReference.CreationPolicy == "Owner" {
+	if managedSecretReference.CreationPolicy == "Owner" {
 		// Set InfisicalSecret instance as the owner and controller of the managed secret
 		err := ctrl.SetControllerReference(&infisicalSecret, newKubeSecretInstance, r.Scheme)
 		if err != nil {
@@ -252,8 +252,8 @@ func (r *InfisicalSecretReconciler) createInfisicalManagedKubeSecret(ctx context
 	return nil
 }
 
-func (r *InfisicalSecretReconciler) updateInfisicalManagedKubeSecret(ctx context.Context, logger logr.Logger, infisicalSecret v1alpha1.InfisicalSecret, managedKubeSecret corev1.Secret, secretsFromAPI []model.SingleEnvironmentVariable, ETag string) error {
+func (r *InfisicalSecretReconciler) updateInfisicalManagedKubeSecret(ctx context.Context, logger logr.Logger, managedSecretReference v1alpha1.ManagedKubeSecretConfig, managedKubeSecret corev1.Secret, secretsFromAPI []model.SingleEnvironmentVariable, ETag string) error {
-	managedTemplateData := infisicalSecret.Spec.ManagedSecretReference.Template
+	managedTemplateData := managedSecretReference.Template
 
 	plainProcessedSecrets := make(map[string][]byte)
 	if managedTemplateData == nil || managedTemplateData.IncludeAllSecrets {
@@ -337,7 +337,7 @@ func (r *InfisicalSecretReconciler) updateResourceVariables(infisicalSecret v1al
 	infisicalSecretResourceVariablesMap[string(infisicalSecret.UID)] = resourceVariables
 }
 
-func (r *InfisicalSecretReconciler) ReconcileInfisicalSecret(ctx context.Context, logger logr.Logger, infisicalSecret v1alpha1.InfisicalSecret) error {
+func (r *InfisicalSecretReconciler) ReconcileInfisicalSecret(ctx context.Context, logger logr.Logger, infisicalSecret v1alpha1.InfisicalSecret, managedKubeSecretReferences []v1alpha1.ManagedKubeSecretConfig) error {
 
 	resourceVariables := r.getResourceVariables(infisicalSecret)
 	infisicalClient := resourceVariables.InfisicalClient
@@ -361,10 +361,11 @@ func (r *InfisicalSecretReconciler) ReconcileInfisicalSecret(ctx context.Context
 		})
 	}
 
+	for _, managedSecretReference := range managedKubeSecretReferences {
 		// Look for managed secret by name and namespace
 		managedKubeSecret, err := util.GetKubeSecretByNamespacedName(ctx, r.Client, types.NamespacedName{
-		Name:      infisicalSecret.Spec.ManagedSecretReference.SecretName,
+			Name:      managedSecretReference.SecretName,
-		Namespace: infisicalSecret.Spec.ManagedSecretReference.SecretNamespace,
+			Namespace: managedSecretReference.SecretNamespace,
 		})
 
 		if err != nil && !k8Errors.IsNotFound(err) {
@@ -420,13 +421,24 @@ func (r *InfisicalSecretReconciler) ReconcileInfisicalSecret(ctx context.Context
 			logger.Info(fmt.Sprintf("ReconcileInfisicalSecret: Fetched secrets via machine identity [type=%v]", authDetails.AuthStrategy))
 
 		} else {
-		return errors.New("no authentication method provided yet. Please configure a authentication method then try again")
+			return errors.New("no authentication method provided. Please configure a authentication method then try again")
+		}
+
+		if !updateDetails.Modified {
+			logger.Info("ReconcileInfisicalSecret: No secrets modified so reconcile not needed")
+			continue
 		}
 
 		if managedKubeSecret == nil {
-		return r.createInfisicalManagedKubeSecret(ctx, logger, infisicalSecret, plainTextSecretsFromApi, updateDetails.ETag)
+			if err := r.createInfisicalManagedKubeSecret(ctx, logger, infisicalSecret, managedSecretReference, plainTextSecretsFromApi, updateDetails.ETag); err != nil {
+				return fmt.Errorf("failed to create managed secret [err=%s]", err)
+			}
 		} else {
-		return r.updateInfisicalManagedKubeSecret(ctx, logger, infisicalSecret, *managedKubeSecret, plainTextSecretsFromApi, updateDetails.ETag)
+			if err := r.updateInfisicalManagedKubeSecret(ctx, logger, managedSecretReference, *managedKubeSecret, plainTextSecretsFromApi, updateDetails.ETag); err != nil {
+				return fmt.Errorf("failed to update managed secret [err=%s]", err)
+			}
+		}
 	}
 
+	return nil
 }

k8-operator/packages/controllerhelpers/controllerhelpers.go

@@ -59,6 +59,17 @@ func ReconcileDeploymentsWithManagedSecrets(ctx context.Context, client controll
 	return 0, nil
 }
 
+func ReconcileDeploymentsWithMultipleManagedSecrets(ctx context.Context, client controllerClient.Client, logger logr.Logger, managedSecrets []v1alpha1.ManagedKubeSecretConfig) (int, error) {
+	for _, managedSecret := range managedSecrets {
+		_, err := ReconcileDeploymentsWithManagedSecrets(ctx, client, logger, managedSecret)
+		if err != nil {
+			logger.Error(err, fmt.Sprintf("unable to reconcile deployments with managed secret [name=%v]", managedSecret.SecretName))
+			return 0, err
+		}
+	}
+	return 0, nil
+}
+
 // Check if the deployment uses managed secrets
 func IsDeploymentUsingManagedSecret(deployment v1.Deployment, managedSecret v1alpha1.ManagedKubeSecretConfig) bool {
 	managedSecretName := managedSecret.SecretName