Fleet UI: Several display name instances (#40123)

## Issue
Closes #39699 

## Description
- `display_name` is super far reaching and was not caught as needing
updates in several places by design nor dev (original ticket made me
deep dive in the code looking for more missed instances and I found
several)

Fixes:
- during setup experience, if a critical software fails, it shows the
display_name instead of the default name
- when viewing the versions modal from fleet desktop, it shows the
display_name instead of the default name as the modal title (screenshot
below)
- when getting an error message from changing the package type when
editing software, it shows the display_name instead of the default name
(screenshot below)
- ORIGINAL REQUEST: when editing auto updates for an ipados/ios
software, it shows the display_name instead of the default name
(screenshot below)

## Screenshots of fixes
<img width="1296" height="483" alt="Screenshot 2026-02-20 at 3 30 26 PM"
src="https://github.com/user-attachments/assets/d3a8659d-1fcf-4384-8670-202c5681ed72"
/>
<img width="1383" height="485" alt="Screenshot 2026-02-20 at 3 36 18 PM"
src="https://github.com/user-attachments/assets/619467dc-5d18-4edf-98ee-116558fa945e"
/>
<img width="1378" height="381" alt="Screenshot 2026-02-20 at 3 41 38 PM"
src="https://github.com/user-attachments/assets/13550024-bd61-4c09-a136-f3a237f01aaf"
/>



## Testing

- [x] QA'd all new/changed functionality manually
This commit is contained in:
RachelElysia
2026-02-20 16:03:34 -06:00
committed by GitHub
parent eaa3304830
commit 9bc95aba6f
5 changed files with 39 additions and 8 deletions
@@ -22,6 +22,7 @@ import {
CUSTOM_TARGET_OPTIONS,
generateSelectedLabels,
getCustomTarget,
getDisplayedSoftwareName,
generateHelpText,
getTargetType,
} from "pages/SoftwarePage/helpers";
@@ -122,7 +123,13 @@ const EditAutoUpdateConfigModal = ({
renderFlash(
"success",
<>
<strong>{softwareTitle.name}</strong> configuration updated.
<strong>
{getDisplayedSoftwareName(
softwareTitle.name,
softwareTitle.display_name
)}
</strong>{" "}
configuration updated.
</>
);
@@ -209,7 +216,13 @@ const EditAutoUpdateConfigModal = ({
<div className={`form-field`}>
<div className="form-field__label">Auto updates</div>
<div className="form-field__subtitle">
Automatically update <strong>{softwareTitle.name}</strong>{" "}
Automatically update{" "}
<strong>
{getDisplayedSoftwareName(
softwareTitle.name,
softwareTitle.display_name
)}
</strong>{" "}
on all targeted hosts when a new version is available.
</div>
<div>
@@ -4,7 +4,10 @@ import { isAxiosError } from "axios";
import { getErrorReason } from "interfaces/errors";
import { IAppStoreApp, ISoftwarePackage } from "interfaces/software";
import { generateSecretErrMsg } from "pages/SoftwarePage/helpers";
import {
generateSecretErrMsg,
getDisplayedSoftwareName,
} from "pages/SoftwarePage/helpers";
const DEFAULT_ERROR_MESSAGE = "Couldn't edit software. Please try again.";
@@ -23,7 +26,9 @@ export const getErrorMessage = (
} else if (reason.includes("selected package is")) {
return (
<>
Couldn&apos;t edit <b>{software.name}</b>. {reason}
Couldn&apos;t edit{" "}
<b>{getDisplayedSoftwareName(software.name, software.display_name)}</b>.{" "}
{reason}
</>
);
} else if (reason.includes("Secret variable")) {
@@ -1,3 +1,5 @@
import { getDisplayedSoftwareName } from "pages/SoftwarePage/helpers";
import Card from "components/Card";
import { ISetupStep } from "interfaces/setup";
import Icon from "components/Icon";
@@ -40,7 +42,14 @@ const SettingUpYourDevice = ({
<>
<p>
Your organization requires that critical software be installed before
you use your device. <b>{failedSoftware.name}</b> failed to install.
you use your device.{" "}
<b>
{getDisplayedSoftwareName(
failedSoftware.name,
failedSoftware.display_name
)}
</b>{" "}
failed to install.
</p>
<p>
<Icon name="error-outline" color="status-error" size="small" />{" "}
@@ -17,8 +17,8 @@ describe("SoftwareDetailsModal", () => {
<InventoryVersionsModal hostSoftware={mockSoftware} onExit={jest.fn()} />
);
// Modal title
expect(screen.getByText(mockSoftware.name)).toBeVisible();
// Modal title is display_name and not name
expect(screen.getByText("Mock Software")).toBeVisible();
// Version, Type, Bundle identifier, Last opened
expect(screen.getByText("Version")).toBeVisible();
@@ -1,6 +1,7 @@
import React, { useEffect, useRef, useState } from "react";
import { IHostSoftware } from "interfaces/software";
import { getDisplayedSoftwareName } from "pages/SoftwarePage/helpers";
import Modal from "components/Modal";
import ModalFooter from "components/ModalFooter";
@@ -57,7 +58,10 @@ const InventoryVersionsModal = ({
return (
<Modal
title={hostSoftware.name}
title={getDisplayedSoftwareName(
hostSoftware.name,
hostSoftware.display_name
)}
className={baseClass}
onExit={onExit}
width="large"