From 0c2d4656018c09b34d539bf988d81158d660c83e Mon Sep 17 00:00:00 2001
From: Victor Lyuboslavsky <2685025+getvictor@users.noreply.github.com>
Date: Thu, 11 Dec 2025 09:04:49 -0600
Subject: [PATCH] Fix Okta IdP signing cert. (#37078)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fixing unreleased Okta IdP signing cert issue which prevented from
setting up Okta conditional access.

## Testing

- [x] QA'd all new/changed functionality manually

For unreleased bug fixes in a release candidate, one of:

- [x] Confirmed that the fix is not expected to adversely impact load
test results


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **New Features**
* Enhanced the IdP signing certificate download feature with an
interactive button that provides real-time loading indicators and
improved error handling. Users now receive immediate feedback during the
download process with helpful error messages if any issues occur.

* **Chores**
  * Removed unused import references.

<sub>✏️ Tip: You can customize this high-level summary in your review
settings.</sub>

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: jacobshandling <61553566+jacobshandling@users.noreply.github.com>
---
 .../OktaConditionalAccessModal.tsx            | 36 ++++++++++++++-----
 .../services/entities/conditional_access.ts   |  8 +++++
 2 files changed, 35 insertions(+), 9 deletions(-)

diff --git a/frontend/pages/admin/IntegrationsPage/cards/ConditionalAccess/components/OktaConditionalAccessModal/OktaConditionalAccessModal.tsx b/frontend/pages/admin/IntegrationsPage/cards/ConditionalAccess/components/OktaConditionalAccessModal/OktaConditionalAccessModal.tsx
index 8d5784f29e..0e74f62536 100644
--- a/frontend/pages/admin/IntegrationsPage/cards/ConditionalAccess/components/OktaConditionalAccessModal/OktaConditionalAccessModal.tsx
+++ b/frontend/pages/admin/IntegrationsPage/cards/ConditionalAccess/components/OktaConditionalAccessModal/OktaConditionalAccessModal.tsx
@@ -7,7 +7,6 @@ import { AppContext } from "context/app";
 import configAPI from "services/entities/config";
 import conditionalAccessAPI from "services/entities/conditional_access";
 import { IConfig } from "interfaces/config";
-import endpoints from "utilities/endpoints";
 
 // @ts-ignore
 import InputField from "components/forms/fields/InputField";
@@ -146,6 +145,26 @@ const OktaConditionalAccessModal = ({
     }
   );
 
+  const [isDownloadingCert, setIsDownloadingCert] = useState(false);
+
+  const onDownloadSigningCert = useCallback(async () => {
+    setIsDownloadingCert(true);
+    try {
+      const blob = await conditionalAccessAPI.getIdpSigningCert();
+      const url = URL.createObjectURL(blob);
+      const downloadLink = document.createElement("a");
+      downloadLink.href = url;
+      downloadLink.download = "fleet-idp-signing-cert.pem";
+      downloadLink.click();
+      downloadLink.remove();
+      URL.revokeObjectURL(url);
+    } catch (e: unknown) {
+      renderFlash("error", "Failed to download signing certificate.");
+    } finally {
+      setIsDownloadingCert(false);
+    }
+  }, [renderFlash]);
+
   const onSubmit = async (evt: React.FormEvent<HTMLFormElement>) => {
     evt.preventDefault();
 
@@ -288,15 +307,14 @@ const OktaConditionalAccessModal = ({
               Identity provider (IdP) signature certificate
             </TooltipWrapper>
             <br />
-            <a
-              href={endpoints.CONDITIONAL_ACCESS_IDP_SIGNING_CERT}
-              download="fleet-idp-signing-certificate.pem"
-              className="button button--inverse"
+            <Button
+              variant="inverse"
+              onClick={onDownloadSigningCert}
+              isLoading={isDownloadingCert}
+              disabled={isDownloadingCert}
             >
-              <div className="children-wrapper">
-                Download certificate <Icon name="download" />
-              </div>
-            </a>
+              Download certificate <Icon name="download" />
+            </Button>
           </div>
 
           {/* User Scope Profile */}
diff --git a/frontend/services/entities/conditional_access.ts b/frontend/services/entities/conditional_access.ts
index cc0674ac96..23f8af1299 100644
--- a/frontend/services/entities/conditional_access.ts
+++ b/frontend/services/entities/conditional_access.ts
@@ -32,6 +32,14 @@ const conditionalAccessService = {
       "text"
     );
   },
+  getIdpSigningCert: (): Promise<Blob> => {
+    return sendRequest(
+      "GET",
+      endpoints.CONDITIONAL_ACCESS_IDP_SIGNING_CERT,
+      undefined,
+      "blob"
+    );
+  },
 };
 
 export default conditionalAccessService;