feat(azure-client-secrets-rotation): add show credentials modal

backend/src/ee/services/secret-rotation-v2/secret-rotation-v2-service.ts

@@ -815,14 +815,6 @@ export const secretRotationV2ServiceFactory = ({
     return expandSecretRotation(secretRotation, kmsService);
   };
 
-  const getMaxGeneratedCredentialsLength = (rotationType: SecretRotation): number => {
-    if (rotationType === SecretRotation.AzureClientSecret) {
-      return 1;
-    }
-
-    return MAX_GENERATED_CREDENTIALS_LENGTH;
-  };
-
   const rotateGeneratedCredentials = async (
     secretRotation: TSecretRotationV2Raw,
     {
@@ -866,7 +858,7 @@ export const secretRotationV2ServiceFactory = ({
         kmsService
       });
 
-      const inactiveIndex = (activeIndex + 1) % getMaxGeneratedCredentialsLength(type as SecretRotation);
+      const inactiveIndex = (activeIndex + 1) % MAX_GENERATED_CREDENTIALS_LENGTH;
 
       const inactiveCredentials = generatedCredentials[inactiveIndex];
 

frontend/src/components/secret-rotations-v2/ViewSecretRotationV2GeneratedCredentials/ViewAzureClientSecretRotationGeneratedCredentials.tsx

@@ -0,0 +1,38 @@
+import { CredentialDisplay } from "@app/components/secret-rotations-v2/ViewSecretRotationV2GeneratedCredentials/shared/CredentialDisplay";
+import { TAzureClientSecretRotationGeneratedCredentialsResponse } from "@app/hooks/api/secretRotationsV2/types/azure-client-secret-rotation";
+
+import { ViewRotationGeneratedCredentialsDisplay } from "./shared";
+
+type Props = {
+  generatedCredentialsResponse: TAzureClientSecretRotationGeneratedCredentialsResponse;
+};
+
+export const ViewAzureClientSecretRotationGeneratedCredentials = ({
+  generatedCredentialsResponse: { generatedCredentials, activeIndex }
+}: Props) => {
+  const inactiveIndex = activeIndex === 0 ? 1 : 0;
+
+  const activeCredentials = generatedCredentials[activeIndex];
+  const inactiveCredentials = generatedCredentials[inactiveIndex];
+
+  return (
+    <ViewRotationGeneratedCredentialsDisplay
+      activeCredentials={
+        <>
+          <CredentialDisplay label="Client ID">{activeCredentials?.clientId}</CredentialDisplay>
+          <CredentialDisplay isSensitive label="Client Secret">
+            {activeCredentials?.clientSecret}
+          </CredentialDisplay>
+        </>
+      }
+      inactiveCredentials={
+        <>
+          <CredentialDisplay label="Client ID">{inactiveCredentials?.clientId}</CredentialDisplay>
+          <CredentialDisplay isSensitive label="Client Secret">
+            {inactiveCredentials?.clientSecret}
+          </CredentialDisplay>
+        </>
+      }
+    />
+  );
+};

frontend/src/components/secret-rotations-v2/ViewSecretRotationV2GeneratedCredentials/ViewSecretRotationV2GeneratedCredentials.tsx

@@ -4,6 +4,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { format } from "date-fns";
 
 import { ViewAuth0ClientSecretRotationGeneratedCredentials } from "@app/components/secret-rotations-v2/ViewSecretRotationV2GeneratedCredentials/ViewAuth0ClientSecretRotationGeneratedCredentials";
+import { ViewAzureClientSecretRotationGeneratedCredentials } from "@app/components/secret-rotations-v2/ViewSecretRotationV2GeneratedCredentials/ViewAzureClientSecretRotationGeneratedCredentials";
 import { Modal, ModalContent, Spinner } from "@app/components/v2";
 import { SECRET_ROTATION_MAP } from "@app/helpers/secretRotationsV2";
 import {
@@ -67,6 +68,13 @@ const Content = ({ secretRotation }: ContentProps) => {
         />
       );
       break;
+    case SecretRotation.AzureClientSecret:
+      Component = (
+        <ViewAzureClientSecretRotationGeneratedCredentials
+          generatedCredentialsResponse={generatedCredentialsResponse}
+        />
+      );
+      break;
     default:
       throw new Error("Unhandled View Generated Credential Rotation Type");
   }