Always create new items in the current collection (#24986)

frontend/src/metabase/components/NewItemMenu/NewItemMenu.tsx

@@ -66,7 +66,6 @@ const NewItemMenu = ({
         link: Urls.newQuestion({
           mode: "notebook",
           creationType: "custom_question",
-          collectionId,
         }),
         event: `${analyticsContext};New Question Click;`,
         onClose: onCloseNavbar,
@@ -80,7 +79,6 @@ const NewItemMenu = ({
         link: Urls.newQuestion({
           type: "native",
           creationType: "native_question",
-          collectionId,
         }),
         event: `${analyticsContext};New SQL Query Click;`,
         onClose: onCloseNavbar,
@@ -110,7 +108,6 @@ const NewItemMenu = ({
 
     return items;
   }, [
-    collectionId,
     hasDataAccess,
     hasNativeWrite,
     hasDatabaseWithJsonEngine,

frontend/src/metabase/nav/components/AppBar/AppBarLarge.tsx

@@ -55,14 +55,14 @@ const AppBarLarge = ({
           {isQuestionLineageVisible ? (
             <QuestionLineage />
           ) : isCollectionPathVisible ? (
-            <CollectionBreadcrumbs collectionId={collectionId} />
+            <CollectionBreadcrumbs />
           ) : null}
         </AppBarInfoContainer>
       </AppBarLeftContainer>
       {(isSearchVisible || isNewButtonVisible || isProfileLinkVisible) && (
         <AppBarRightContainer>
           {isSearchVisible && <SearchBar />}
-          {isNewButtonVisible && <NewItemButton />}
+          {isNewButtonVisible && <NewItemButton collectionId={collectionId} />}
           {isProfileLinkVisible && (
             <AppBarProfileLinkContainer>
               <ProfileLink user={currentUser} onLogout={onLogout} />

frontend/src/metabase/nav/components/AppBar/AppBarSmall.tsx

 import React, { useCallback, useState } from "react";
-import { CollectionId, User } from "metabase-types/api";
+import { User } from "metabase-types/api";
 import AppBarLogo from "./AppBarLogo";
 import AppBarToggle from "./AppBarToggle";
 import SearchBar from "../SearchBar";
@@ -19,7 +19,6 @@ import {
 
 export interface AppBarSmallProps {
   currentUser: User;
-  collectionId?: CollectionId;
   isNavBarOpen?: boolean;
   isNavBarVisible?: boolean;
   isSearchVisible?: boolean;
@@ -33,7 +32,6 @@ export interface AppBarSmallProps {
 
 const AppBarSmall = ({
   currentUser,
-  collectionId,
   isNavBarOpen,
   isNavBarVisible,
   isSearchVisible,
@@ -96,7 +94,7 @@ const AppBarSmall = ({
           {isQuestionLineageVisible ? (
             <QuestionLineage />
           ) : isCollectionPathVisible ? (
-            <CollectionBreadcrumbs collectionId={collectionId} />
+            <CollectionBreadcrumbs />
           ) : null}
         </AppBarSubheader>
       )}

frontend/src/metabase/nav/components/NewItemButton/NewItemButton.tsx

 import React from "react";
 import { t } from "ttag";
 import NewItemMenu from "metabase/containers/NewItemMenu";
+import { CollectionId } from "metabase-types/api";
 import { NewButton, NewButtonText } from "./NewItemButton.styled";
 
-const NewItemButton = () => {
+export interface NewItemButtonProps {
+  collectionId?: CollectionId;
+}
+
+const NewItemButton = ({ collectionId }: NewItemButtonProps) => {
   return (
     <NewItemMenu
       trigger={
@@ -16,6 +21,7 @@ const NewItemButton = () => {
           <NewButtonText>{t`New`}</NewButtonText>
         </NewButton>
       }
+      collectionId={collectionId}
       analyticsContext={"NavBar"}
     />
   );

frontend/src/metabase/nav/containers/AppBar/AppBar.tsx

 import { connect } from "react-redux";
 import { withRouter } from "react-router";
 import _ from "underscore";
+import Collections from "metabase/entities/collections";
 import { logout } from "metabase/auth/actions";
 import { closeNavbar, getIsNavbarOpen, toggleNavbar } from "metabase/redux/app";
 import {
-  getCollectionId,
   getIsCollectionPathVisible,
   getIsNewButtonVisible,
   getIsProfileLinkVisible,
@@ -12,13 +12,13 @@ import {
   getIsSearchVisible,
   RouterProps,
 } from "metabase/selectors/app";
+import { getUser } from "metabase/selectors/user";
 import { State } from "metabase-types/store";
 import AppBar from "../../components/AppBar";
-import { getUser } from "metabase/selectors/user";
 
 const mapStateToProps = (state: State, props: RouterProps) => ({
   currentUser: getUser(state),
-  collectionId: getCollectionId(state),
+  collectionId: Collections.selectors.getInitialCollectionId(state, props),
   isNavBarOpen: getIsNavbarOpen(state),
   isSearchVisible: getIsSearchVisible(state),
   isNewButtonVisible: getIsNewButtonVisible(state),

frontend/src/metabase/nav/containers/CollectionBreadcrumbs/CollectionBreadcrumbs.tsx

 import Collections from "metabase/entities/collections";
-import { CollectionId } from "metabase-types/api";
+import { getCollectionId } from "metabase/selectors/app";
 import { State } from "metabase-types/store";
 import CollectionBreadcrumbs from "../../components/CollectionBreadcrumbs";
 
-export interface PathBreadcrumbsProps {
-  collectionId: CollectionId;
-}
-
 const collectionProps = {
-  id: (state: State, { collectionId }: PathBreadcrumbsProps) =>
-    collectionId ?? "root",
+  id: (state: State) => getCollectionId(state) ?? "root",
   loadingAndErrorWrapper: false,
   properties: ["name", "authority_level"],
 };

frontend/test/metabase/scenarios/collections/collections.cy.spec.js

@@ -446,6 +446,22 @@ describe("scenarios > collection defaults", () => {
         cy.findByText("First collection");
       });
     });
+
+    it("should create new collections within the current collection", () => {
+      getCollectionIdFromSlug("third_collection", collection_id => {
+        visitCollection(collection_id);
+        cy.findByText("New").click();
+
+        popover().within(() => {
+          cy.findByText("Collection").click();
+        });
+
+        modal().within(() => {
+          cy.findByText("Collection it's saved in").should("be.visible");
+          cy.findByText("Third collection").should("be.visible");
+        });
+      });
+    });
   });
 });