Disable Download for Edit button on mobile (BL-13639)

src/components/BookDetail/BookDetailHeaderGroup.tsx

@@ -65,10 +65,10 @@ export const BookDetailHeaderGroup: React.FunctionComponent<{
         ArtifactType.shellbook
     );
     const showTranslateButton =
-        !isEmbedded && // BL-8698, a this point, people embed BL to publish books, not encourage translation.
+        !isEmbedded && // BL-8698, at this point, people embed BL to publish books, not encourage translation.
         shellBookSettings &&
         shellBookSettings.decision && // it's OK to download and translate the book
-        !appHostedMode && // bloomDesktopAVailable would block this normally, but when simulating on a desktop this makes sure.
+        !appHostedMode && // bloomDesktopAvailable would block this normally, but when simulating on a desktop this makes sure.
         bloomDesktopAvailable; // and this platform can run the software for doing it
 
     const bloomReaderSettings = getArtifactVisibilitySettings(

src/components/BookDetail/BookOwnerControlsBox.tsx

@@ -4,7 +4,7 @@ import css from "@emotion/css/macro";
 import { jsx } from "@emotion/core";
 /** @jsx jsx */
 
-import React, { Fragment, useEffect, useState } from "react";
+import React, { Fragment, useContext, useEffect, useState } from "react";
 import { Book } from "../../model/Book";
 import { observer } from "mobx-react-lite";
 
@@ -24,13 +24,16 @@ import {
     IUserBookPermissions,
     useGetPermissions,
 } from "../../connection/LibraryQueryHooks";
+import { OSFeaturesContext } from "../OSFeaturesContext";
 
 export const BookOwnerControlsBox: React.FunctionComponent<{
     book: Book;
     user: User;
     showDownloadDialog: any; // pass down the ref
 }> = observer((props) => {
     const l10n = useIntl();
+    const { bloomDesktopAvailable } = useContext(OSFeaturesContext);
+
     const [firebaseUser, setFirebaseUserUrl] = useState<firebase.User | null>(
         null
     );
@@ -230,6 +233,7 @@ export const BookOwnerControlsBox: React.FunctionComponent<{
                                 align-self: flex-end;
                                 margin-top: 5px;
                             `}
+                            disabled={!bloomDesktopAvailable}
                         >
                             <FormattedMessage
                                 id={"book.detail.editDownload"}