Move Apple Business instructions out of UI and into guides (#43638)

For the following quick win:
- https://github.com/fleetdm/fleet/issues/43435
This commit is contained in:
Noah Talerman 2026-04-20 14:16:56 -05:00 committed by GitHub
parent db3b2d34cb
commit fa796cdd5a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 32 additions and 139 deletions

View file

@ -233,7 +233,6 @@ const AppleBusinessManagerPage = ({ router }: { router: InjectedRouter }) => {
{showRenewModal && selectedToken.current && (
<RenewAbmModal
tokenId={selectedToken.current.id}
orgName={selectedToken.current.org_name}
onCancel={onCancelRenewToken}
onRenewedToken={onRenewed}
/>

View file

@ -52,73 +52,15 @@ const AddAbmModal = ({ onCancel, onAdded }: IAddAbmModalProps) => {
return (
<Modal className={baseClass} title="Add AB" onExit={onCancel} width="large">
<ol className={`${baseClass}__setup-list`}>
<li>
<span>1.</span>
<p>
Download your public key. <DownloadABMKey baseClass={baseClass} />
</p>
</li>
<li>
<span>2.</span>
<span>
<span>
Sign in to{" "}
<CustomLink
newTab
text="Apple Business"
url="https://business.apple.com"
/>
<br />
If your organization doesn&apos;t have an account, select{" "}
<b>Enroll now</b>.
</span>
</span>
</li>
<li>
<span>3.</span>
<span>
Select your <b>account name</b> at the bottom left of the screen,
then select <b>Preferences</b>.
</span>
</li>
<li>
<span>4.</span>
<span>
In the <b>Your MDM Servers</b> section, select <b>Add</b>.
</span>
</li>
<li>
<span>5.</span>
<span>Enter a name for the server such as &quot;Fleet&quot;.</span>
</li>
<li>
<span>6.</span>
<span>
Under <b>MDM Server Settings</b>, upload the public key downloaded
in the first step and select <b>Save</b>.
</span>
</li>
<li>
<span>7.</span>
<span>
In the <b>Default Device Assignment</b> section, select{" "}
<b>Change</b>, then assign the newly created server as the default
for your Macs, iPhones, and iPads. Then select <b>Done</b>.
</span>
</li>
<li>
<span>8.</span>
<span>
Select newly created server in the sidebar, then select{" "}
<b>Download MDM Server Token</b> on the top.
</span>
</li>
<li>
<span>9.</span>
<span>Upload the downloaded token (.p7m file).</span>
</li>
</ol>
<p>
Follow the step-by-step guide to connect Fleet to Apple Business
Manager.{" "}
<CustomLink
url="https://fleetdm.com/learn-more-about/setup-abm"
text="Learn how"
newTab
/>
</p>
<FileUploader
className={`${baseClass}__file-uploader ${
isUploading ? `${baseClass}__file-uploader--loading` : ""
@ -139,6 +81,7 @@ const AddAbmModal = ({ onCancel, onAdded }: IAddAbmModalProps) => {
>
Add AB
</Button>
<DownloadABMKey baseClass={baseClass} />
</div>
</Modal>
);

View file

@ -1,10 +1,13 @@
.add-abm-modal {
p {
margin: 0;
}
&__request-button {
display: flex;
gap: $pad-small;
align-items: center;
margin-top: $pad-small;
label {
display: flex;
@ -13,33 +16,8 @@
}
}
&__setup-list {
font-size: $x-small;
display: flex;
flex-direction: column;
gap: $pad-large;
padding: 0;
margin: 0;
max-width: 660px;
list-style: none;
li {
display: flex;
flex-direction: row;
gap: $pad-small;
p {
display: flex;
flex-direction: column;
align-items: flex-start;
margin: 0;
}
}
}
&__file-uploader {
margin-top: $pad-medium;
margin-left: $pad-medium;
.file-uploader__message {
color: $ui-fleet-black-75;

View file

@ -14,14 +14,12 @@ const baseClass = "renew-abm-modal";
interface IRenewAbmModalProps {
tokenId: number;
orgName: string;
onCancel: () => void;
onRenewedToken: () => void;
}
const RenewAbmModal = ({
tokenId,
orgName,
onCancel,
onRenewedToken,
}: IRenewAbmModalProps) => {
@ -65,31 +63,24 @@ const RenewAbmModal = ({
width="large"
>
<div className={`${baseClass}__page-content ${baseClass}__setup-content`}>
<p className={`${baseClass}__description`}>
Renew Apple Business for <b>{orgName}</b> by uploading your AB token.{" "}
<p>
Follow the step-by-step guide to renew.{" "}
<CustomLink
url="https://fleetdm.com/learn-more-about/renew-abm"
text="Learn how"
newTab
text="Learn more"
url="https://fleetdm.com/guides/apple-mdm-setup#to-renew-an-abm-token"
/>
</p>
<ul className={`${baseClass}__setup-instructions-list`}>
<li>
<p>
Upload the downloaded token (.p7m file) below.
<FileUploader
className={`${baseClass}__file-uploader`}
accept=".p7m"
buttonMessage="Choose file"
buttonType="brand-inverse-icon"
graphicName="file-p7m"
message="AB token (.p7m)"
onFileUpload={onSelectFile}
fileDetails={tokenFile ? { name: tokenFile.name } : undefined}
/>
</p>
</li>
</ul>
<FileUploader
className={`${baseClass}__file-uploader`}
accept=".p7m"
buttonMessage="Choose file"
buttonType="brand-inverse-icon"
graphicName="file-p7m"
message="AB token (.p7m)"
onFileUpload={onSelectFile}
fileDetails={tokenFile ? { name: tokenFile.name } : undefined}
/>
<div className="modal-cta-wrap">
<Button
className={`${baseClass}__submit-button ${

View file

@ -3,7 +3,7 @@
&__setup-content {
display: flex;
flex-direction: column;
gap: $pad-large;
gap: $pad-medium;
color: $core-fleet-black;
p {
@ -11,25 +11,6 @@
}
}
&__setup-instructions-list {
padding: 0;
margin: 0;
list-style: none;
display: flex;
flex-direction: column;
gap: $pad-large;
li > p {
margin: 0;
}
}
&__file-uploader {
margin-top: $pad-medium;
margin-left: $pad-medium;
}
&__button-wrap {
display: flex;
justify-content: flex-end;

View file

@ -1176,11 +1176,12 @@ module.exports.routes = {
'GET /learn-more-about/audit-logs': '/docs/using-fleet/audit-logs',
'GET /learn-more-about/calendar-events': '/announcements/fleet-in-your-calendar-introducing-maintenance-windows',
'GET /learn-more-about/setup-windows-mdm': '/guides/windows-mdm-setup',
'GET /learn-more-about/setup-abm': '/docs/using-fleet/mdm-setup#apple-business-manager-abm',
'GET /learn-more-about/turn-on-apple-mdm': '/guides/apple-mdm-setup#turn-on-apple-mdm',
'GET /learn-more-about/setup-abm': '/guides/apple-mdm-setup#apple-business-ab',
'GET /learn-more-about/renew-apns': '/guides/apple-mdm-setup#renew-apns',
'GET /learn-more-about/renew-abm': '/guides/apple-mdm-setup#renew-ab',
'GET /learn-more-about/add-vpp': '/guides/apple-mdm-setup#volume-purchasing-program-vpp',
'GET /learn-more-about/renew-vpp': '/guides/apple-mdm-setup#renew-vpp',
'GET /learn-more-about/renew-abm': '/docs/using-fleet/mdm-setup#apple-business-manager-abm',
'GET /learn-more-about/abm-issues': '/guides/apple-mdm-setup#troubleshooting',
'GET /learn-more-about/fleet-server-private-key': '/docs/configuration/fleet-server-configuration#server-private-key',
'GET /learn-more-about/agent-options': '/docs/configuration/agent-configuration',