Fleet UI: Hide install modals' details button if no details to display (#34954)

frontend/components/ActivityDetails/InstallDetails/SoftwareInstallDetailsModal/SoftwareInstallDetailsModal.tests.tsx

@@ -247,10 +247,10 @@ describe("SoftwareInstallDetailsModal", () => {
       expect(screen.getByText("Post-install success")).toBeInTheDocument();
     });
 
-    it("does not render output textareas if script outputs are empty", async () => {
+    it("does not render details button if details (script outputs) are empty", async () => {
       mockServer.use(getSoftwareInstallHandlerNoOutputs);
       const renderWithServer = createCustomRenderer({ withBackendMock: true });
-      const { user } = renderWithServer(
+      renderWithServer(
         <SoftwareInstallDetailsModal
           details={baseDetails}
           hostSoftware={baseHostSoftware}
@@ -258,16 +258,10 @@ describe("SoftwareInstallDetailsModal", () => {
         />
       );
 
-      const detailsBtn = await screen.findByRole("button", {
-        name: /Details/i,
-      });
-      await user.click(detailsBtn);
-
       expect(
-        screen.queryByText(/Install script output:/i)
-      ).not.toBeInTheDocument();
-      expect(
-        screen.queryByText(/Post-install script output:/i)
+        screen.queryByRole("button", {
+          name: /Details/i,
+        })
       ).not.toBeInTheDocument();
     });
 

frontend/components/ActivityDetails/InstallDetails/SoftwareInstallDetailsModal/SoftwareInstallDetailsModal.tsx

@@ -270,15 +270,23 @@ export const SoftwareInstallDetailsModal = ({
       },
     ];
 
+    // Only show details button if there's details to display
+    const showDetailsButton =
+      (!!swInstallResult?.post_install_script_output ||
+        !!swInstallResult?.output) &&
+      swInstallResult?.status !== "pending_install";
+
     return (
       <>
-        <RevealButton
-          isShowing={showInstallDetails}
-          showText="Details"
-          hideText="Details"
-          caretPosition="after"
-          onClick={toggleInstallDetails}
-        />
+        {showDetailsButton && (
+          <RevealButton
+            isShowing={showInstallDetails}
+            showText="Details"
+            hideText="Details"
+            caretPosition="after"
+            onClick={toggleInstallDetails}
+          />
+        )}
         {showInstallDetails &&
           outputs.map(
             ({ label, value }) =>
@@ -364,10 +372,7 @@ export const SoftwareInstallDetailsModal = ({
         />
 
         {hostSoftware && !excludeVersions && renderInventoryVersionsSection()}
-
-        {swInstallResult?.status !== "pending_install" &&
-          isInstalledByFleet &&
-          renderInstallDetailsSection()}
+        {isInstalledByFleet && renderInstallDetailsSection()}
       </div>
     );
   };

frontend/components/ActivityDetails/InstallDetails/SoftwareIpaInstallDetailsModal/SoftwareIpaInstallDetailsModal.tsx

@@ -317,6 +317,11 @@ export const SoftwareIpaInstallDetailsModal = ({
   };
 
   const renderInstallDetailsSection = () => {
+    // Hide section if there's no details to display
+    if (!swInstallResult?.result && !swInstallResult?.payload) {
+      return null;
+    }
+
     return (
       <>
         <RevealButton

frontend/components/ActivityDetails/InstallDetails/SoftwareScriptDetailsModal/SoftwareScriptDetailsModal.tsx

@@ -228,9 +228,13 @@ export const SoftwareInstallDetailsModal = ({
   );
 
   const renderScriptDetailsSection = () => {
-    if (swInstallResult?.status !== "pending_install") {
-      return (
-        <>
+    // Only show details button if there's details to display
+    const showDetailsButton =
+      swInstallResult?.status !== "pending_install" && swInstallResult?.output;
+
+    return (
+      <>
+        {showDetailsButton && (
           <RevealButton
             isShowing={showInstallDetails}
             showText="Details"
@@ -238,14 +242,14 @@ export const SoftwareInstallDetailsModal = ({
             caretPosition="after"
             onClick={toggleInstallDetails}
           />
-          {showInstallDetails && swInstallResult?.output && (
-            <Textarea label="Script output:" variant="code">
-              {swInstallResult.output}
-            </Textarea>
-          )}
-        </>
-      );
-    }
+        )}
+        {showInstallDetails && swInstallResult?.output && (
+          <Textarea label="Script output:" variant="code">
+            {swInstallResult.output}
+          </Textarea>
+        )}
+      </>
+    );
   };
 
   const hostDisplayname =

frontend/components/ActivityDetails/InstallDetails/SoftwareUninstallDetailsModal/SoftwareUninstallDetailsModal.tsx

@@ -223,6 +223,11 @@ const SoftwareUninstallDetailsModal = ({
       return <DataError description="No data returned." />;
     }
 
+    // Only show details button if there's details to display
+    const showDetailsButton =
+      (!!uninstallResult?.script_contents || !!uninstallResult?.output) &&
+      uninstallStatus !== "pending_uninstall";
+
     return (
       <div className={`${baseClass}__modal-content`}>
         <StatusMessage
@@ -236,7 +241,7 @@ const SoftwareUninstallDetailsModal = ({
           isMyDevicePage={!!deviceAuthToken}
           contactUrl={contactUrl}
         />
-        {uninstallStatus !== "pending_uninstall" && (
+        {showDetailsButton && (
           <RevealButton
             isShowing={showDetails}
             showText="Details"

frontend/components/ActivityDetails/InstallDetails/VppInstallDetailsModal/VppInstallDetailsModal.tsx

@@ -323,6 +323,11 @@ export const VppInstallDetailsModal = ({
   };
 
   const renderInstallDetailsSection = () => {
+    // Hide section if there's no details to display
+    if (!vppCommandResult?.result && !vppCommandResult?.payload) {
+      return null;
+    }
+
     return (
       <>
         <RevealButton