UI: Update AddHostsModal > PlatformWrapper (#9263)

# Addresses #8998 

# Fixes

-  Remove 'Include Fleet Desktop' checkbox from macOS tab
<img width="705" alt="Screenshot 2023-01-10 at 4 41 15 PM"
src="https://user-images.githubusercontent.com/61553566/211691479-6ab63a5c-c543-4550-a381-07b43c872345.png">

- Update copy in 'Fleet Desktop' tooltip (still present on other
platform tabs) and labels above and below text area
<img width="652" alt="Screenshot 2023-01-10 at 4 41 45 PM"
src="https://user-images.githubusercontent.com/61553566/211691521-ae64fd61-4fd8-45f1-9366-ac269834f841.png">

# Checklist for submitter

If some of the following don't apply, delete the relevant line.

- [x] Manual QA for all new/changed functionality

Co-authored-by: Jacob Shandling <jacob@fleetdm.com>

frontend/components/AddHostsModal/PlatformWrapper/PlatformWrapper.tsx

@@ -219,33 +219,33 @@ const PlatformWrapper = ({
     );
   };
 
-  const renderInstallerString = (platform: string) => {
-    return platform === "advanced"
+  const renderInstallerString = (packageType: string) => {
+    return packageType === "advanced"
       ? `fleetctl package --type=YOUR_TYPE --fleet-url=${config?.server_settings.server_url}
 --enroll-secret=${enrollSecret}
 --fleet-certificate=PATH_TO_YOUR_CERTIFICATE/fleet.pem`
-      : `fleetctl package --type=${platform} ${
+      : `fleetctl package --type=${packageType} ${
           includeFleetDesktop ? "--fleet-desktop " : ""
         }--fleet-url=${
           config?.server_settings.server_url
         } --enroll-secret=${enrollSecret}`;
   };
 
-  const renderLabel = (platform: string, installerString: string) => {
+  const renderLabel = (packageType: string, installerString: string) => {
     const onCopyInstaller = (evt: React.MouseEvent) => {
       evt.preventDefault();
 
       stringToClipboard(installerString)
         .then(() =>
-          setCopyMessage((prev) => ({ ...prev, [platform]: "Copied!" }))
+          setCopyMessage((prev) => ({ ...prev, [packageType]: "Copied!" }))
         )
         .catch(() =>
-          setCopyMessage((prev) => ({ ...prev, [platform]: "Copy failed" }))
+          setCopyMessage((prev) => ({ ...prev, [packageType]: "Copy failed" }))
         );
 
       // Clear message after 1 second
       setTimeout(
-        () => setCopyMessage((prev) => ({ ...prev, [platform]: "" })),
+        () => setCopyMessage((prev) => ({ ...prev, [packageType]: "" })),
         1000
       );
 
@@ -254,7 +254,7 @@ const PlatformWrapper = ({
 
     return (
       <>
-        {platform === "plain-osquery" ? (
+        {packageType === "plain-osquery" ? (
           <>
             <p className={`${baseClass}__advanced--heading`}>
               With{" "}
@@ -274,7 +274,7 @@ const PlatformWrapper = ({
           </>
         ) : (
           <span className={`${baseClass}__cta`}>
-            With the{" "}
+            Run this command with the{" "}
             <a
               className={`${baseClass}__command-line-tool`}
               href="https://fleetdm.com/docs/using-fleet/fleetctl-cli"
@@ -288,10 +288,10 @@ const PlatformWrapper = ({
         )}{" "}
         <span className={`${baseClass}__name`}>
           <span className="buttons">
-            {copyMessage[platform] && (
+            {copyMessage[packageType] && (
               <span
                 className={`${baseClass}__copy-message`}
-              >{`${copyMessage[platform]} `}</span>
+              >{`${copyMessage[packageType]} `}</span>
             )}
             <Button
               variant="unstyled"
@@ -306,8 +306,8 @@ const PlatformWrapper = ({
     );
   };
 
-  const renderTab = (platform: string) => {
-    if (platform === "advanced") {
+  const renderTab = (packageType: string) => {
+    if (packageType === "advanced") {
       return (
         <div className={baseClass}>
           <div className={`${baseClass}__advanced`}>
@@ -315,16 +315,16 @@ const PlatformWrapper = ({
             <div className={`${baseClass}__advanced--installer`}>
               <InputField
                 disabled
-                inputWrapperClass={`${baseClass}__installer-input ${baseClass}__installer-input-${platform}`}
+                inputWrapperClass={`${baseClass}__installer-input ${baseClass}__installer-input-${packageType}`}
                 name="installer"
-                label={renderLabel(platform, renderInstallerString(platform))}
+                label={renderLabel(
+                  packageType,
+                  renderInstallerString(packageType)
+                )}
                 type={"textarea"}
-                value={renderInstallerString(platform)}
+                value={renderInstallerString(packageType)}
               />
-              <p>
-                Generates an installer that your devices will use to connect to
-                Fleet.
-              </p>
+              <p>Distribute your package to add hosts to Fleet.</p>
             </div>
             <RevealButton
               className={baseClass}
@@ -394,35 +394,36 @@ const PlatformWrapper = ({
         </div>
       );
     }
+
     return (
       <>
-        <Checkbox
-          name="include-fleet-desktop"
-          onChange={(value: boolean) => setIncludeFleetDesktop(value)}
-          value={includeFleetDesktop}
-        >
-          <>
-            Include&nbsp;
-            <TooltipWrapper
-              tipContent={
-                "<p>Lightweight application that allows end users to see information about their device.</p>"
-              }
-            >
-              Fleet Desktop
-            </TooltipWrapper>
-          </>
-        </Checkbox>
+        {packageType !== "pkg" && (
+          <Checkbox
+            name="include-fleet-desktop"
+            onChange={(value: boolean) => setIncludeFleetDesktop(value)}
+            value={includeFleetDesktop}
+          >
+            <>
+              Include&nbsp;
+              <TooltipWrapper
+                tipContent={
+                  "Include Fleet Desktop if your’re adding workstations."
+                }
+              >
+                Fleet Desktop
+              </TooltipWrapper>
+            </>
+          </Checkbox>
+        )}
         <InputField
           disabled
-          inputWrapperClass={`${baseClass}__installer-input ${baseClass}__installer-input-${platform}`}
+          inputWrapperClass={`${baseClass}__installer-input ${baseClass}__installer-input-${packageType}`}
           name="installer"
-          label={renderLabel(platform, renderInstallerString(platform))}
+          label={renderLabel(packageType, renderInstallerString(packageType))}
           type={"textarea"}
-          value={renderInstallerString(platform)}
+          value={renderInstallerString(packageType)}
         />
-        <span>
-          Generates an installer that your devices will use to connect to Fleet.
-        </span>
+        <span>Distribute your package to add hosts to Fleet.</span>
       </>
     );
   };