Display iPad screenshot in lock modal (#38475)

…ot based on the device platform

<!-- Add the related story/sub-task/bug number, like Resolves #123, or
remove if NA -->
**Related issue:** Resolves #38473

# Checklist for submitter

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

- [x] Changes file added for user-visible changes in `changes/`,
`orbit/changes/` or `ee/fleetd-chrome/changes`.
See [Changes
files](https://github.com/fleetdm/fleet/blob/main/docs/Contributing/guides/committing-changes.md#changes-files)
for more information.


- [ ] QA'd all new/changed functionality manually

changes/38473-add-ipad-screenshot-in-lock-modal

@@ -0,0 +1 @@
+Updated lock modal for iPad hosts to display iPad screenshot in the end user experience section

frontend/pages/hosts/details/HostDetailsPage/modals/LockModal/LockModal.tsx

@@ -14,10 +14,17 @@ import CustomLink from "components/CustomLink";
 import Card from "components/Card";
 
 import IphoneLockPreview from "../../../../../../../assets/images/iphone-lock-preview.png";
+import IpadLockPreview from "../../../../../../../assets/images/ipad-lock-preview.png";
 
 const baseClass = "lock-modal";
 
-const IosOrIpadLockPreview = () => {
+const IosOrIpadLockPreview = ({ platform }: { platform: string }) => {
+  const isIPad = platform === "ipados";
+  const previewImage = isIPad ? IpadLockPreview : IphoneLockPreview;
+  const altText = isIPad
+    ? "iPad with a lock screen message"
+    : "iPhone with a lock screen message";
+
   return (
     <Card
       color="grey"
@@ -34,7 +41,7 @@ const IosOrIpadLockPreview = () => {
         />
         .
       </p>
-      <img src={IphoneLockPreview} alt="iPhone with a lock screen message" />
+      <img src={previewImage} alt={altText} />
     </Card>
   );
 };
@@ -118,7 +125,9 @@ const LockModal = ({
             </Checkbox>
           </div>
         </div>
-        {isIPadOrIPhone(platform) && <IosOrIpadLockPreview />}
+        {isIPadOrIPhone(platform) && (
+          <IosOrIpadLockPreview platform={platform} />
+        )}
         <div className="modal-cta-wrap">
           <Button
             type="button"