Recents Picker Tab (#42079)

* add recents tab type updates fix unit test change where we filter recents WIP Recents Tab wip recents design updates update recents design to match search use new recents format initial recents implementation fix types * fix e2e tests * update more e2e tests * allow recents filters * update test mocks * add unit tests for recents tab * update e2e tests * add e2e tests for recents picker tab * fix lost access test
metabase · May 14, 2024 · 52d32c1 · 52d32c1
1 parent 47b3f17
commit 52d32c1
Show file tree

Hide file tree

Showing 37 changed files with 612 additions and 46 deletions.
diff --git a/e2e/support/helpers/e2e-collection-helpers.js b/e2e/support/helpers/e2e-collection-helpers.js
@@ -76,14 +76,18 @@ export const moveOpenedCollectionTo = newParent => {
   popover().within(() => cy.findByText("Move").click());
 
   entityPickerModal().within(() => {
+    cy.findByRole("tab", { name: /Collections/ }).click();
     cy.findByText(newParent).click();
     cy.button("Move").click();
   });
 
   entityPickerModal().should("not.exist");
 };
 
-export function pickEntity({ path, select }) {
+export function pickEntity({ path, select, tab }) {
+  if (tab) {
+    cy.findByRole("tab", { name: tab }).click();
+  }
   if (path) {
     cy.findByTestId("nested-item-picker").within(() => {
       for (const [index, name] of path.entries()) {

diff --git a/e2e/test/scenarios/collections/collections.cy.spec.js b/e2e/test/scenarios/collections/collections.cy.spec.js
@@ -72,6 +72,7 @@ describe("scenarios > collection defaults", () => {
       pickEntity({
         path: ["Our analytics", `Collection ${COLLECTIONS_COUNT}`],
         select: true,
+        tab: /Collections/,
       });
 
       cy.findByTestId("new-collection-modal").button("Create").click();
@@ -400,6 +401,7 @@ describe("scenarios > collection defaults", () => {
       });
 
       entityPickerModal().within(() => {
+        cy.findByRole("tab", { name: /Collections/ }).click();
         cy.findByText("Bobby Tables's Personal Collection").click();
         cy.findByText(COLLECTION).click();
         cy.button("Move").should("not.be.disabled");
@@ -425,13 +427,15 @@ describe("scenarios > collection defaults", () => {
       popover().findByText("Move").click();
 
       // we need to do this manually because we need to await the correct number of api requests to keep this from flaking
-      cy.wait([
-        "@getCollectionItems",
-        "@getCollectionItems",
-        "@getCollectionItems",
-      ]);
+
       entityPickerModal().within(() => {
         cy.findByTestId("loading-spinner").should("not.exist");
+        cy.findByRole("tab", { name: /Collections/ }).click();
+        cy.wait([
+          "@getCollectionItems",
+          "@getCollectionItems",
+          "@getCollectionItems",
+        ]);
         // make sure the first collection (current parent) is selected
         findPickerItem("First collection").should(
           "have.attr",
@@ -577,6 +581,7 @@ describe("scenarios > collection defaults", () => {
           popover().findByText("Move").click();
 
           entityPickerModal().within(() => {
+            cy.findByRole("tab", { name: /Collections/ }).click();
             cy.log("parent collection should be selected");
             findPickerItem("First collection").should(
               "have.attr",
@@ -599,6 +604,7 @@ describe("scenarios > collection defaults", () => {
 
           entityPickerModal().within(() => {
             cy.log("parent collection should be selected");
+            cy.findByRole("tab", { name: /Collections/ }).click();
             findPickerItem("Second collection").should(
               "have.attr",
               "data-active",
@@ -623,6 +629,7 @@ describe("scenarios > collection defaults", () => {
 
           entityPickerModal().within(() => {
             cy.log("should disable all moving collections");
+            cy.findByRole("tab", { name: /Collections/ }).click();
             findPickerItem("First collection").should("have.attr", "disabled");
             findPickerItem("Another collection").should(
               "have.attr",

diff --git a/e2e/test/scenarios/dashboard-cards/click-behavior.cy.spec.js b/e2e/test/scenarios/dashboard-cards/click-behavior.cy.spec.js
@@ -26,6 +26,7 @@ import {
   visitDashboard,
   visitEmbeddedPage,
   visitIframe,
+  entityPickerModal,
 } from "e2e/support/helpers";
 import { b64hash_to_utf8 } from "metabase/lib/encoding";
 import {
@@ -1311,6 +1312,7 @@ describe("scenarios > dashboard > dashboard cards > click behavior", () => {
       cy.findAllByTestId("field-set")
         .should("have.length", 2)
         .should("contain.text", POINT_COUNT);
+
       cy.get("@targetDashboardId").then(targetDashboardId => {
         cy.location().should(({ pathname, search }) => {
           expect(pathname).to.equal(`/dashboard/${targetDashboardId}`);
@@ -2148,7 +2150,10 @@ const clickLineChartPoint = () => {
 const addDashboardDestination = () => {
   cy.get("aside").findByText("Go to a custom destination").click();
   cy.get("aside").findByText("Dashboard").click();
-  modal().findByText(TARGET_DASHBOARD.name).click();
+  entityPickerModal()
+    .findByRole("tab", { name: /Dashboards/ })
+    .click();
+  entityPickerModal().findByText(TARGET_DASHBOARD.name).click();
 };
 
 const addUrlDestination = () => {
@@ -2159,7 +2164,10 @@ const addUrlDestination = () => {
 const addSavedQuestionDestination = () => {
   cy.get("aside").findByText("Go to a custom destination").click();
   cy.get("aside").findByText("Saved question").click();
-  modal().findByText(TARGET_QUESTION.name).click();
+  entityPickerModal()
+    .findByRole("tab", { name: /Questions/ })
+    .click();
+  entityPickerModal().findByText(TARGET_QUESTION.name).click();
 };
 
 const addSavedQuestionCreatedAtParameter = () => {

diff --git a/e2e/test/scenarios/dashboard-cards/dashboard-drill.cy.spec.js b/e2e/test/scenarios/dashboard-cards/dashboard-drill.cy.spec.js
@@ -21,6 +21,7 @@ import {
   queryBuilderMain,
   chartPathWithFillColor,
   echartsContainer,
+  entityPickerModal,
 } from "e2e/support/helpers";
 
 const {
@@ -243,8 +244,10 @@ describe("scenarios > dashboard > dashboard drill", () => {
       .parent()
       // eslint-disable-next-line no-unscoped-text-selectors -- deprecated usage
       .within(() => cy.findByText("Dashboard").click());
-    // eslint-disable-next-line no-unscoped-text-selectors -- deprecated usage
-    modal().within(() => cy.findByText("end dash").click());
+    entityPickerModal().within(() => {
+      cy.findByRole("tab", { name: /Dashboards/ }).click();
+      cy.findByText("end dash").click();
+    });
     // eslint-disable-next-line no-unscoped-text-selectors -- deprecated usage
     cy.findByText("Available filters")
       .parent()

diff --git a/e2e/test/scenarios/dashboard-cards/dashboard-sections.cy.spec.js b/e2e/test/scenarios/dashboard-cards/dashboard-sections.cy.spec.js
@@ -126,6 +126,9 @@ function selectQuestion(question) {
     .findAllByText("Select question")
     .first()
     .click({ force: true });
+  entityPickerModal()
+    .findByRole("tab", { name: /Questions/ })
+    .click();
   entityPickerModal().findByText(question).click();
   cy.wait("@cardQuery");
   dashboardGrid().findByText(question).should("exist");

diff --git a/e2e/test/scenarios/dashboard/dashboard-management.cy.spec.js b/e2e/test/scenarios/dashboard/dashboard-management.cy.spec.js
@@ -191,6 +191,14 @@ describe("managing dashboard from the dashboard's edit menu", () => {
                   );
                   cy.findByTestId("collection-picker-button").click();
                 });
+
+                if (user === "admin") {
+                  // admin has recents tab
+                  entityPickerModal()
+                    .findByRole("tab", { name: /Collections/ })
+                    .click();
+                }
+
                 entityPickerModal()
                   .findByText("Create a new collection")
                   .click();

diff --git a/e2e/test/scenarios/dashboard/dashboard.cy.spec.js b/e2e/test/scenarios/dashboard/dashboard.cy.spec.js
@@ -128,6 +128,7 @@ describe("scenarios > dashboard", () => {
       });
 
       entityPickerModal().within(() => {
+        cy.findByRole("tab", { name: /Dashboards/ }).click();
         cy.findByText(dashboardName)
           .closest("button")
           .then($button => {
@@ -219,6 +220,9 @@ describe("scenarios > dashboard", () => {
         cy.button("Yes please!").click();
       });
 
+      entityPickerModal()
+        .findByRole("tab", { name: /Dashboards/ })
+        .click();
       entityPickerModal().findByText("Create a new dashboard").click();
       cy.findByTestId("create-dashboard-on-the-go").within(() => {
         cy.findByPlaceholderText("My new dashboard").type("Foo");
@@ -323,6 +327,7 @@ describe("scenarios > dashboard", () => {
         openDashboardMenu();
         popover().findByText("Move").click();
         entityPickerModal().within(() => {
+          cy.findByRole("tab", { name: /Collections/ }).click();
           cy.findByText("Bobby Tables's Personal Collection").click();
           cy.button("Move").click();
         });
@@ -341,6 +346,7 @@ describe("scenarios > dashboard", () => {
         openDashboardMenu();
         popover().findByText("Move").click();
         entityPickerModal().within(() => {
+          cy.findByRole("tab", { name: /Collections/ }).click();
           cy.findByText("Our analytics").click();
           cy.button("Move").click();
         });

diff --git a/e2e/test/scenarios/models/reproductions/19737-data-picker-not-showing-moved-model.cy.spec.js b/e2e/test/scenarios/models/reproductions/19737-data-picker-not-showing-moved-model.cy.spec.js
@@ -88,6 +88,7 @@ function moveModel(modelName, collectionName) {
   popover().findByText("Move").click();
 
   entityPickerModal().within(() => {
+    cy.findByRole("tab", { name: /Collections/ }).click();
     cy.findByText(collectionName).click();
     cy.button("Move").click();
   });

diff --git a/e2e/test/scenarios/native/data_ref.cy.spec.js b/e2e/test/scenarios/native/data_ref.cy.spec.js
@@ -57,6 +57,7 @@ describe("scenarios > native question > data reference sidebar", () => {
     popover().findByTestId("move-button").click();
 
     entityPickerModal().within(() => {
+      cy.findByRole("tab", { name: /Collections/ }).click();
       cy.findByText("Bobby Tables's Personal Collection").click();
       cy.button("Move").click();
     });

diff --git a/e2e/test/scenarios/native/native_subquery.cy.spec.js b/e2e/test/scenarios/native/native_subquery.cy.spec.js
@@ -78,6 +78,7 @@ describe("scenarios > question > native subquery", () => {
         openQuestionActions();
         cy.findByTestId("move-button").click();
         entityPickerModal().within(() => {
+          cy.findByRole("tab", { name: /Collections/ }).click();
           cy.findByText("Bobby Tables's Personal Collection").click();
           cy.button("Move").click();
         });

diff --git a/e2e/test/scenarios/onboarding/search/recently-viewed.cy.spec.js b/e2e/test/scenarios/onboarding/search/recently-viewed.cy.spec.js
@@ -9,6 +9,8 @@ import {
   openPeopleTable,
   describeEE,
   setTokenFeatures,
+  popover,
+  entityPickerModal,
 } from "e2e/support/helpers";
 
 describe("search > recently viewed", () => {
@@ -75,6 +77,56 @@ describe("search > recently viewed", () => {
   });
 });
 
+describe("Recently Viewed > Entity Picker", () => {
+  beforeEach(() => {
+    restore();
+    cy.signInAsAdmin();
+    cy.visit("/");
+  });
+
+  it("shows recently created collection in entity picker", () => {
+    cy.createCollection({
+      name: "My Fresh Collection",
+    });
+
+    cy.findByTestId("app-bar").button(/New/).click();
+    popover().findByText("Dashboard").click();
+    cy.findByTestId("collection-picker-button").click();
+
+    entityPickerModal().within(() => {
+      cy.findByText("Select a collection").click();
+      cy.findByRole("tab", { name: /Recents/ });
+      cy.findByRole("tab", { name: /Collections/ });
+
+      cy.findByText("Today");
+      cy.findByText("My Fresh Collection");
+    });
+  });
+
+  it("shows recently visited dashboard in entity picker", () => {
+    visitDashboard(ORDERS_DASHBOARD_ID);
+    visitQuestion(ORDERS_QUESTION_ID);
+
+    cy.findByTestId("qb-header").icon("ellipsis").click();
+    popover().findByText("Add to dashboard").click();
+
+    entityPickerModal().within(() => {
+      cy.findByText("Add this question to a dashboard").click();
+      cy.findByRole("tab", { name: /Recents/ });
+      cy.findByRole("tab", { name: /Dashboards/ });
+
+      cy.findByText("Today");
+      cy.findByText("Orders in a dashboard").click();
+      cy.button("Select").click();
+    });
+
+    cy.url().should("contain", `/dashboard/${ORDERS_DASHBOARD_ID}-`);
+    cy.get("#Dashboard-Header-Container").findByText(
+      /You're editing this dashboard/,
+    );
+  });
+});
+
 describeEE("search > recently viewed > enterprise features", () => {
   beforeEach(() => {
     restore();

diff --git a/e2e/test/scenarios/organization/timelines-collection.cy.spec.js b/e2e/test/scenarios/organization/timelines-collection.cy.spec.js
@@ -466,6 +466,7 @@ describe("scenarios > organization > timelines > collection", () => {
       popover().findByText("Move timeline").click();
 
       entityPickerModal().within(() => {
+        cy.findByRole("tab", { name: /Collections/ }).click();
         cy.findByText("Bobby Tables's Personal Collection").click();
         cy.button("Move").click();
         cy.wait("@updateTimeline");

diff --git a/e2e/test/scenarios/question/new.cy.spec.js b/e2e/test/scenarios/question/new.cy.spec.js
@@ -387,7 +387,11 @@ describe("scenarios > question > new", () => {
         .findByLabelText(/Which collection/)
         .click();
 
-      pickEntity({ path: [myPersonalCollectionName], select: true });
+      pickEntity({
+        path: [myPersonalCollectionName],
+        select: true,
+        tab: /Collections/,
+      });
 
       cy.findByTestId("save-question-modal").button("Save").click();
       cy.wait("@createQuestion");