Attempt at saving question #1

metabase · Feb 26, 2024 · ace3337 · ace3337
1 parent 4b80c77
commit ace3337
Show file tree

Hide file tree

Showing 5 changed files with 26 additions and 10 deletions.
diff --git a/frontend/src/metabase/dashboard/components/EmbedMenu/AdminEmbedMenu.tsx b/frontend/src/metabase/dashboard/components/EmbedMenu/AdminEmbedMenu.tsx
@@ -11,6 +11,7 @@ import {
   QuestionPublicLinkPopover,
 } from "metabase/dashboard/components/PublicLinkPopover";
 import { useSelector } from "metabase/lib/redux";
+import { MODAL_TYPES } from "metabase/query_builder/constants";
 import { getSetting } from "metabase/selectors/settings";
 import { Menu, Title, Text, Stack, Center, Icon } from "metabase/ui";
 
@@ -24,6 +25,8 @@ export const AdminEmbedMenu = ({
 }: EmbedMenuProps) => {
   const [menuMode, setMenuMode] = useState<EmbedMenuModes>(null);
 
+  const [opened, setOpened] = useState(false);
+
   const isPublicSharingEnabled = useSelector(state =>
     getSetting(state, "enable-public-sharing"),
   );
@@ -53,8 +56,22 @@ export const AdminEmbedMenu = ({
     );
   }
 
+  const onMenuToggle = (t: boolean) => {
+    if (t && resourceType === "question" && !resource.isSaved()) {
+      onModalOpen(MODAL_TYPES.SAVE_QUESTION_BEFORE_EMBED);
+    } else {
+      setOpened(t);
+    }
+  };
+
   return (
-    <Menu withinPortal position="bottom-start">
+    <Menu
+      withinPortal
+      position="bottom-start"
+      opened={opened}
+      onChange={onMenuToggle}
+      closeOnClickOutside
+    >
       <Menu.Target>{target}</Menu.Target>
 
       <AdminEmbedMenuContainer w="13.75rem" data-testid="embed-header-menu">
@@ -90,7 +107,7 @@ export const AdminEmbedMenu = ({
             </Center>
           }
           disabled={!isEmbeddingEnabled}
-          onClick={onModalOpen}
+          onClick={() => onModalOpen(MODAL_TYPES.EMBED)}
         >
           {isEmbeddingEnabled ? (
             <Title order={4}>{t`Embed`}</Title>

diff --git a/frontend/src/metabase/dashboard/components/EmbedMenu/types.ts b/frontend/src/metabase/dashboard/components/EmbedMenu/types.ts
@@ -1,3 +1,4 @@
+import type { ModalTypeValues } from "metabase/query_builder/constants";
 import type Question from "metabase-lib/Question";
 import type { Dashboard } from "metabase-types/api";
 
@@ -20,5 +21,5 @@ export type ResourceType =
 
 export type EmbedMenuProps = ResourceType & {
   hasPublicLink: boolean;
-  onModalOpen: () => void;
+  onModalOpen: (mode: ModalTypeValues) => void;
 };
diff --git a/frontend/src/metabase/query_builder/components/QueryModals.tsx b/frontend/src/metabase/query_builder/components/QueryModals.tsx
@@ -214,11 +214,11 @@ class QueryModals extends Component<QueryModalsProps> {
             originalQuestion={this.props.originalQuestion}
             onSave={async question => {
               await this.props.onSave(question);
-              onOpenModal(MODAL_TYPES.EMBED);
+              onCloseModal();
             }}
             onCreate={async question => {
               await this.props.onCreate(question);
-              onOpenModal(MODAL_TYPES.EMBED);
+              onCloseModal();
             }}
             onClose={onCloseModal}
             multiStep

diff --git a/frontend/src/metabase/query_builder/components/view/ViewFooter.jsx b/frontend/src/metabase/query_builder/components/view/ViewFooter.jsx
@@ -148,11 +148,7 @@ const ViewFooter = ({
               resource={question}
               resourceType="question"
               hasPublicLink={!!question.publicUUID()}
-              onModalOpen={() =>
-                question.isSaved()
-                  ? onOpenModal("embed")
-                  : onOpenModal("save-question-before-embed")
-              }
+              onModalOpen={onOpenModal}
             />
           ),
           QuestionTimelineWidget.shouldRender({ isTimeseries }) && (

diff --git a/frontend/src/metabase/query_builder/constants.ts b/frontend/src/metabase/query_builder/constants.ts
@@ -20,6 +20,8 @@ export const MODAL_TYPES = {
   CONVERT_QUERY: "convert-query",
 } as const;
 
+export type ModalTypeValues = typeof MODAL_TYPES[keyof typeof MODAL_TYPES];
+
 export const SIDEBAR_SIZES = {
   NORMAL: 355,
   TIMELINE: 300,