Enforce better modal behavior for edit view dialogs

Author: StephenMcConnel

src/BloomBrowserUI/bookEdit/ProcessVideoProgressDialog.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { ProgressDialog } from "../react_components/Progress/ProgressDialog";
-import { post, postDataWithConfig } from "../utils/bloomApi";
+import { post, postBoolean, postDataWithConfig } from "../utils/bloomApi";
 import { useL10n } from "../react_components/l10nHooks";
 import { ShowEditViewDialog } from "./workspaceRoot";
 import WebSocketManager from "../utils/WebSocketManager";
@@ -13,6 +13,10 @@ const ProcessVideoProgressDialog: React.FunctionComponent<{
     const importStarted = React.useRef(false);
     const importFinished = React.useRef(false);
 
+    React.useEffect(() => {
+        postBoolean("editView/setModalState", isOpen);
+    }, [isOpen]);
+
     const finishImport = (importedPath?: string) => {
         if (importFinished.current) {
             return;

src/BloomBrowserUI/bookEdit/bookAndPageSettings/BookAndPageSettingsDialog.tsx

@@ -15,6 +15,7 @@ import {
 } from "../../react_components/BloomDialog/commonDialogComponents";
 import {
     post,
+    postBoolean,
     postJson,
     useApiBoolean,
     useApiObject,
@@ -82,6 +83,14 @@ export const BookAndPageSettingsDialog: React.FunctionComponent<{
         dialogFrameProvidedExternally: false,
     });
 
+    React.useEffect(() => {
+        if (propsForBloomDialog.open === undefined) {
+            return;
+        }
+
+        postBoolean("editView/setModalState", propsForBloomDialog.open);
+    }, [propsForBloomDialog.open]);
+
     const appearanceUIOptions: IAppearanceUIOptions =
         useApiObject<IAppearanceUIOptions>(
             "book/settings/appearanceUIOptions",

src/BloomBrowserUI/react_components/BookGridSetup/BookGridSetupDialog.tsx

@@ -11,7 +11,11 @@ import {
     DialogCancelButton,
     DialogOkButton,
 } from "../BloomDialog/commonDialogComponents";
-import { useWatchApiData, useApiString } from "../../utils/bloomApi";
+import {
+    useWatchApiData,
+    useApiString,
+    postBoolean,
+} from "../../utils/bloomApi";
 import { ShowEditViewDialog } from "../../bookEdit/workspaceRoot";
 import { BookGridSetup } from "./BookGridSetup";
 import { css } from "@emotion/react";
@@ -39,6 +43,14 @@ export const BookGridSetupDialog: React.FunctionComponent<{
         props.initialLinks,
     );
 
+    React.useEffect(() => {
+        if (propsForBloomDialog.open === undefined) {
+            return;
+        }
+
+        postBoolean("editView/setModalState", propsForBloomDialog.open);
+    }, [propsForBloomDialog.open]);
+
     const unfilteredBooks = useWatchApiData<Array<IBookInfo>>(
         `collections/books?realTitle=true`,
         [],