diff --git a/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/DeleteSoftwareModal/DeleteSoftwareModal.tsx b/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/DeleteSoftwareModal/DeleteSoftwareModal.tsx
index 0dd80fd42e..883ec4e7f6 100644
--- a/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/DeleteSoftwareModal/DeleteSoftwareModal.tsx
+++ b/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/DeleteSoftwareModal/DeleteSoftwareModal.tsx
@@ -19,7 +19,8 @@ const DELETE_SW_INSTALLED_DURING_SETUP_ERROR_MSG =
interface IDeleteSoftwareModalProps {
softwareId: number;
teamId: number;
- softwareInstallerName?: string;
+ softwareTitleName?: string;
+ softwareDisplayName?: string;
onExit: () => void;
onSuccess: () => void;
gitOpsModeEnabled?: boolean;
@@ -28,7 +29,8 @@ interface IDeleteSoftwareModalProps {
const DeleteSoftwareModal = ({
softwareId,
teamId,
- softwareInstallerName,
+ softwareTitleName,
+ softwareDisplayName,
onExit,
onSuccess,
gitOpsModeEnabled,
@@ -71,21 +73,24 @@ const DeleteSoftwareModal = ({
)}
- Software won't be uninstalled from existing hosts, but any
- pending installs and uninstalls{" "}
- {softwareInstallerName ? (
- <>
- for {softwareInstallerName} {" "}
- >
- ) : (
- ""
- )}
- will be canceled.
-
-
- Installs or uninstalls currently running on a host will still
- complete, but results won't appear in Fleet.
+ Are you sure you want to delete{" "}
+ {softwareDisplayName || softwareTitleName} ?
+
+
+ Software won't be uninstalled from existing hosts, but any
+ pending installs and uninstalls will be canceled.
+ {" "}
+
+ Installs or uninstalls currently running on a host will still
+ complete, but results won't appear in Fleet.
+
+
+ Installed software will appear as{" "}
+ {softwareTitleName} in software inventories and
+ will use the default icon.
+
+
You cannot undo this action.
{
- it("renders with the correct modal title for package, FileUploader, Preview tabs, save button", () => {
+ it("renders with the correct modal title for software, FileUploader, Preview tabs, save button", () => {
const render = createCustomRenderer({ withBackendMock: true });
render( );
- expect(screen.getByText(/edit package/i)).toBeInTheDocument();
+ expect(screen.getByText(/edit software/i)).toBeInTheDocument();
expect(screen.getByText("Choose file")).toBeInTheDocument();
expect(screen.getByText("Preview")).toBeInTheDocument();
expect(screen.getByText("Fleet")).toBeInTheDocument();
diff --git a/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/EditIconModal/EditIconModal.tsx b/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/EditIconModal/EditIconModal.tsx
index f78e119d08..9a6d06551b 100644
--- a/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/EditIconModal/EditIconModal.tsx
+++ b/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/EditIconModal/EditIconModal.tsx
@@ -588,7 +588,7 @@ const EditIconModal = ({
helpText={
<>
Optional. If left blank, Fleet will use{" "}
- {previewInfo.name} .
+ {software.name} .
>
}
autofocus
@@ -745,7 +745,7 @@ const EditIconModal = ({
return (
<>
diff --git a/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/EditSoftwareModal/EditSoftwareModal.tsx b/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/EditSoftwareModal/EditSoftwareModal.tsx
index adbf09f442..4eba4eb4db 100644
--- a/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/EditSoftwareModal/EditSoftwareModal.tsx
+++ b/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/EditSoftwareModal/EditSoftwareModal.tsx
@@ -338,7 +338,7 @@ const EditSoftwareModal = ({
<>
diff --git a/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/SoftwareInstallerCard/SoftwareInstallerCard.tsx b/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/SoftwareInstallerCard/SoftwareInstallerCard.tsx
index c1c4222042..a379516b04 100644
--- a/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/SoftwareInstallerCard/SoftwareInstallerCard.tsx
+++ b/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/SoftwareInstallerCard/SoftwareInstallerCard.tsx
@@ -155,6 +155,7 @@ export const SoftwareActionButtons = ({
interface ISoftwareInstallerCardProps {
softwareTitleName: string;
+ softwareDisplayName: string;
isScriptPackage?: boolean;
isIosOrIpadosApp?: boolean;
name: string;
@@ -183,6 +184,7 @@ interface ISoftwareInstallerCardProps {
// of packages we should consider refactoring this to be more dynamic.
const SoftwareInstallerCard = ({
softwareTitleName,
+ softwareDisplayName,
isScriptPackage = false,
isIosOrIpadosApp = false,
name,
@@ -383,7 +385,8 @@ const SoftwareInstallerCard = ({
setShowDeleteModal(false)}
onSuccess={onDeleteSuccess}
diff --git a/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/SoftwareTitleDetailsPage.tsx b/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/SoftwareTitleDetailsPage.tsx
index 948d9cc885..e79ef01cf9 100644
--- a/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/SoftwareTitleDetailsPage.tsx
+++ b/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/SoftwareTitleDetailsPage.tsx
@@ -142,6 +142,7 @@ const SoftwareTitleDetailsPage = ({
const {
softwareTitleName,
+ softwareDisplayName,
softwarePackage,
name,
version,
@@ -157,6 +158,7 @@ const SoftwareTitleDetailsPage = ({
return (
{
describe("getPackageCardInfo", () => {
- it("returns the correct data for a software package", () => {
+ it("returns the correct data for a software package (and without a custom display_name)", () => {
const softwareTitle: ISoftwareTitleDetails = {
id: 1,
name: "Test Software",
+ // display_name: undefined
icon_url: "https://example.com/icon.png",
versions: [{ id: 1, version: "1.0.0", vulnerabilities: [] }],
software_package: {
@@ -38,6 +39,7 @@ describe("SoftwareTitleDetailsPage helpers", () => {
expect(packageCardInfo).toEqual({
softwarePackage: softwareTitle.software_package,
name: "TestPackage.pkg", // packages should display the package name not the software title name
+ softwareDisplayName: "Test Software",
version: "1.0.0",
addedTimestamp: "2021-01-01T00:00:00Z",
softwareTitleName: "Test Software",
@@ -51,7 +53,7 @@ describe("SoftwareTitleDetailsPage helpers", () => {
isSelfService: true,
});
});
- it("returns the correct data for an app store app", () => {
+ it("returns the correct data for an app store app (and with a custom display name)", () => {
const softwareTitle: ISoftwareTitleDetails = {
id: 1,
name: "Test Software",
@@ -83,6 +85,7 @@ describe("SoftwareTitleDetailsPage helpers", () => {
expect(packageCardInfo).toEqual({
softwarePackage: softwareTitle.app_store_app,
name: "Test Software", // apps should display the software title name (backend should ensure the app name and software title name match)
+ softwareDisplayName: "Test App",
version: "1.0.1",
addedTimestamp: "2020-01-01T00:00:00.000Z",
softwareTitleName: "Test Software",
diff --git a/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/helpers.ts b/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/helpers.ts
index e3c4c92140..f31e4b4da2 100644
--- a/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/helpers.ts
+++ b/frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/helpers.ts
@@ -26,6 +26,7 @@ export const getInstallerCardInfo = (softwareTitle: ISoftwareTitleDetails) => {
return {
softwareTitleName: softwareTitle.name,
+ softwareDisplayName: softwareTitle.display_name || softwareTitle.name,
softwarePackage: installerData,
name: (isPackage && installerData.name) || softwareTitle.name,
version:
diff --git a/frontend/pages/SoftwarePage/components/cards/SoftwareDetailsSummary/SoftwareDetailsSummary.tsx b/frontend/pages/SoftwarePage/components/cards/SoftwareDetailsSummary/SoftwareDetailsSummary.tsx
index 846717c12b..a92a8078c4 100644
--- a/frontend/pages/SoftwarePage/components/cards/SoftwareDetailsSummary/SoftwareDetailsSummary.tsx
+++ b/frontend/pages/SoftwarePage/components/cards/SoftwareDetailsSummary/SoftwareDetailsSummary.tsx
@@ -110,16 +110,18 @@ const SoftwareDetailsSummary = ({
renderSoftwareIcon()
)}
-
- {ROLLING_ARCH_LINUX_VERSIONS.includes(displayName) ? (
- // wrap a tooltip around the "rolling" suffix
- <>
- {displayName.slice(0, -8)}
-
- >
- ) : (
-
- )}
+
+
+ {ROLLING_ARCH_LINUX_VERSIONS.includes(displayName) ? (
+ // wrap a tooltip around the "rolling" suffix
+ <>
+ {displayName.slice(0, -8)}
+
+ >
+ ) : (
+
+ )}
+
{onClickEditIcon && (
)}
-
+
{!!type && }
diff --git a/frontend/pages/SoftwarePage/components/cards/SoftwareDetailsSummary/_styles.scss b/frontend/pages/SoftwarePage/components/cards/SoftwareDetailsSummary/_styles.scss
index 0842e09ede..7959a23d81 100644
--- a/frontend/pages/SoftwarePage/components/cards/SoftwareDetailsSummary/_styles.scss
+++ b/frontend/pages/SoftwarePage/components/cards/SoftwareDetailsSummary/_styles.scss
@@ -10,20 +10,25 @@
&__info {
flex-grow: 1;
align-self: center;
+ min-width: 0; // Required to truncate name with edit icon
.truncated-tooltip {
font-weight: $regular;
}
}
- h1 {
- font-size: $pad-large;
- font-weight: bold;
+ &__title-edit-icon {
display: flex;
align-items: center;
gap: $pad-medium;
}
+ h1 {
+ font-size: $pad-large;
+ font-weight: bold;
+ overflow: hidden; // Required to truncate name with edit icon
+ }
+
&__description-list {
display: flex;
flex-direction: row;
diff --git a/frontend/pages/policies/ManagePoliciesPage/components/InstallSoftwareModal/InstallSoftwareModal.tsx b/frontend/pages/policies/ManagePoliciesPage/components/InstallSoftwareModal/InstallSoftwareModal.tsx
index e89d7760a2..b8bcb1d9fb 100644
--- a/frontend/pages/policies/ManagePoliciesPage/components/InstallSoftwareModal/InstallSoftwareModal.tsx
+++ b/frontend/pages/policies/ManagePoliciesPage/components/InstallSoftwareModal/InstallSoftwareModal.tsx
@@ -150,7 +150,7 @@ const InstallSoftwareModal = ({
const foundTitle = titlesAvailableForInstall?.find(
(title) => title.id === value
);
- return foundTitle ? foundTitle.name : "";
+ return foundTitle ? foundTitle.display_name || foundTitle.name : "";
};
return {
@@ -171,7 +171,7 @@ const InstallSoftwareModal = ({
)
.map((title) => {
return {
- label: title.name,
+ label: title.display_name || title.name,
value: title.id,
helpText: generateSoftwareOptionHelpText(title),
};
@@ -205,7 +205,7 @@ const InstallSoftwareModal = ({
if (currentSoftware) {
options = [
{
- label: currentSoftware.name,
+ label: currentSoftware.display_name || currentSoftware.name,
value: currentSoftware.id,
helpText: generateSoftwareOptionHelpText(currentSoftware),
},