diff --git a/frontend/components/ActivityDetails/InstallDetails/AppInstallDetails/AppInstallDetails.tsx b/frontend/components/ActivityDetails/InstallDetails/AppInstallDetails/AppInstallDetails.tsx
index c4991f0fd7..dd1de5a727 100644
--- a/frontend/components/ActivityDetails/InstallDetails/AppInstallDetails/AppInstallDetails.tsx
+++ b/frontend/components/ActivityDetails/InstallDetails/AppInstallDetails/AppInstallDetails.tsx
@@ -90,6 +90,12 @@ export const AppInstallDetails = ({
subordinate = status === "pending" ? " when it comes online" : "";
}
+ const formattedHost = host_display_name ? (
+ {host_display_name}
+ ) : (
+ "the host"
+ );
+
const showCommandResponse = isStatusNotNow || status !== "pending";
return (
@@ -98,8 +104,7 @@ export const AppInstallDetails = ({
- The response from
{host_display_name} :
+ The response from {formattedHost}:
diff --git a/frontend/components/ActivityDetails/InstallDetails/SoftwareInstallDetails/SoftwareInstallDetails.tsx b/frontend/components/ActivityDetails/InstallDetails/SoftwareInstallDetails/SoftwareInstallDetails.tsx
index 27480cd8e5..61c2d5f04f 100644
--- a/frontend/components/ActivityDetails/InstallDetails/SoftwareInstallDetails/SoftwareInstallDetails.tsx
+++ b/frontend/components/ActivityDetails/InstallDetails/SoftwareInstallDetails/SoftwareInstallDetails.tsx
@@ -1,6 +1,7 @@
import React from "react";
import { useQuery } from "react-query";
+import { IActivityDetails } from "interfaces/activity";
import {
ISoftwareInstallResult,
ISoftwareInstallResults,
@@ -21,17 +22,28 @@ import {
const baseClass = "software-install-details";
+// TODO: Expand to include more details as needed
+export type IPackageInstallDetails = Pick<
+ IActivityDetails,
+ "install_uuid" | "host_display_name"
+>;
+
const StatusMessage = ({
result: { host_display_name, software_package, software_title, status },
}: {
result: ISoftwareInstallResult;
}) => {
+ const formattedHost = host_display_name ? (
+
{host_display_name}
+ ) : (
+ "the host"
+ );
return (
Fleet {getInstallDetailsStatusPredicate(status)} {software_title} {" "}
- ({software_package}) on {host_display_name}
+ ({software_package}) on {formattedHost}
{status === "pending" ? " when it comes online" : ""}.
@@ -56,18 +68,17 @@ const Output = ({
};
export const SoftwareInstallDetails = ({
- installUuid,
-}: {
- installUuid: string;
-}) => {
+ host_display_name = "",
+ install_uuid = "",
+}: IPackageInstallDetails) => {
const { data: result, isLoading, isError } = useQuery<
ISoftwareInstallResults,
Error,
ISoftwareInstallResult
>(
- ["softwareInstallResults", installUuid],
+ ["softwareInstallResults", install_uuid],
() => {
- return softwareAPI.getSoftwareInstallResult(installUuid);
+ return softwareAPI.getSoftwareInstallResult(install_uuid);
},
{
refetchOnWindowFocus: false,
@@ -88,7 +99,11 @@ export const SoftwareInstallDetails = ({
return (
<>
-
+
{result.status !== "pending" && (
<>
{result.pre_install_query_output && (
@@ -106,10 +121,10 @@ export const SoftwareInstallDetails = ({
};
export const SoftwareInstallDetailsModal = ({
- installUuid,
+ details,
onCancel,
}: {
- installUuid: string;
+ details: IPackageInstallDetails;
onCancel: () => void;
}) => {
return (
@@ -121,7 +136,7 @@ export const SoftwareInstallDetailsModal = ({
>
<>
-
+
diff --git a/frontend/pages/DashboardPage/cards/ActivityFeed/ActivityFeed.tsx b/frontend/pages/DashboardPage/cards/ActivityFeed/ActivityFeed.tsx
index 3a5d520d27..c9e6b08af9 100644
--- a/frontend/pages/DashboardPage/cards/ActivityFeed/ActivityFeed.tsx
+++ b/frontend/pages/DashboardPage/cards/ActivityFeed/ActivityFeed.tsx
@@ -37,7 +37,10 @@ const ActivityFeed = ({
const [pageIndex, setPageIndex] = useState(0);
const [showShowQueryModal, setShowShowQueryModal] = useState(false);
const [showScriptDetailsModal, setShowScriptDetailsModal] = useState(false);
- const [installedSoftwareUuid, setInstalledSoftwareUuid] = useState("");
+ const [
+ packageInstallDetails,
+ setPackageInstallDetails,
+ ] = useState(null);
const [
appInstallDetails,
setAppInstallDetails,
@@ -88,7 +91,6 @@ const ActivityFeed = ({
activityType: ActivityType,
details: IActivityDetails
) => {
- console.log("activityType", activityType);
switch (activityType) {
case ActivityType.LiveQuery:
queryShown.current = details.query_sql ?? "";
@@ -102,10 +104,10 @@ const ActivityFeed = ({
setShowScriptDetailsModal(true);
break;
case ActivityType.InstalledSoftware:
- setInstalledSoftwareUuid(details.install_uuid ?? "");
+ setPackageInstallDetails({ ...details });
break;
case ActivityType.InstalledAppStoreApp:
- setAppInstallDetails(details);
+ setAppInstallDetails({ ...details });
break;
default:
break;
@@ -197,10 +199,10 @@ const ActivityFeed = ({
onCancel={() => setShowScriptDetailsModal(false)}
/>
)}
- {installedSoftwareUuid && (
+ {packageInstallDetails && (
setInstalledSoftwareUuid("")}
+ details={packageInstallDetails}
+ onCancel={() => setPackageInstallDetails(null)}
/>
)}
{appInstallDetails && (
diff --git a/frontend/pages/hosts/details/HostDetailsPage/HostDetailsPage.tsx b/frontend/pages/hosts/details/HostDetailsPage/HostDetailsPage.tsx
index 2f2c88a5bd..a55744bc33 100644
--- a/frontend/pages/hosts/details/HostDetailsPage/HostDetailsPage.tsx
+++ b/frontend/pages/hosts/details/HostDetailsPage/HostDetailsPage.tsx
@@ -62,7 +62,10 @@ import {
AppInstallDetailsModal,
IAppInstallDetails,
} from "components/ActivityDetails/InstallDetails/AppInstallDetails/AppInstallDetails";
-import { SoftwareInstallDetailsModal } from "components/ActivityDetails/InstallDetails/SoftwareInstallDetails";
+import {
+ SoftwareInstallDetailsModal,
+ IPackageInstallDetails,
+} from "components/ActivityDetails/InstallDetails/SoftwareInstallDetails/SoftwareInstallDetails";
import HostSummaryCard from "../cards/HostSummary";
import AboutCard from "../cards/About";
@@ -172,7 +175,10 @@ const HostDetailsPage = ({
const [selectedPolicy, setSelectedPolicy] = useState(
null
);
- const [softwareInstallUuid, setSoftwareInstallUuid] = useState("");
+ const [
+ packageInstallDetails,
+ setPackageInstallDetails,
+ ] = useState(null);
const [
appInstallDetails,
setAppInstallDetails,
@@ -577,7 +583,7 @@ const HostDetailsPage = ({
setScriptDetailsId(details?.script_execution_id || "");
break;
case "installed_software":
- setSoftwareInstallUuid(details?.install_uuid || "");
+ setPackageInstallDetails({ ...details });
break;
case "installed_app_store_app":
setAppInstallDetails({ ...details });
@@ -618,7 +624,7 @@ const HostDetailsPage = ({
}, [refetchPastActivities, refetchUpcomingActivities]);
const onCancelSoftwareInstallDetailsModal = useCallback(() => {
- setSoftwareInstallUuid("");
+ setPackageInstallDetails(null);
}, []);
const onCancelAppInstallDetailsModal = useCallback(() => {
@@ -1026,9 +1032,9 @@ const HostDetailsPage = ({
onCancel={onCancelScriptDetailsModal}
/>
)}
- {!!softwareInstallUuid && (
+ {!!packageInstallDetails && (
)}
diff --git a/frontend/pages/hosts/details/cards/Software/SoftwareDetailsModal/SoftwareDetailsModal.tsx b/frontend/pages/hosts/details/cards/Software/SoftwareDetailsModal/SoftwareDetailsModal.tsx
index f8373d8c14..2fff0a4fb4 100644
--- a/frontend/pages/hosts/details/cards/Software/SoftwareDetailsModal/SoftwareDetailsModal.tsx
+++ b/frontend/pages/hosts/details/cards/Software/SoftwareDetailsModal/SoftwareDetailsModal.tsx
@@ -149,7 +149,8 @@ const InstallDetailsContent = ({
} else if (hasHostSoftwarePackageLastInstall(software)) {
return (
);
}