diff --git a/frontend/src/metabase/dashboard/components/DashboardInfoSidebar.styled.tsx b/frontend/src/metabase/dashboard/components/DashboardInfoSidebar/DashboardInfoSidebar.styled.tsx similarity index 100% rename from frontend/src/metabase/dashboard/components/DashboardInfoSidebar.styled.tsx rename to frontend/src/metabase/dashboard/components/DashboardInfoSidebar/DashboardInfoSidebar.styled.tsx diff --git a/frontend/src/metabase/dashboard/components/DashboardInfoSidebar.tsx b/frontend/src/metabase/dashboard/components/DashboardInfoSidebar/DashboardInfoSidebar.tsx similarity index 99% rename from frontend/src/metabase/dashboard/components/DashboardInfoSidebar.tsx rename to frontend/src/metabase/dashboard/components/DashboardInfoSidebar/DashboardInfoSidebar.tsx index 025692966ef2ef46c89182457229c1f3f8cc3b70..c8cf234b4ee9bbebbf09a748673550953053ecd4 100644 --- a/frontend/src/metabase/dashboard/components/DashboardInfoSidebar.tsx +++ b/frontend/src/metabase/dashboard/components/DashboardInfoSidebar/DashboardInfoSidebar.tsx @@ -85,6 +85,7 @@ export function DashboardInfoSidebar({ initialValue={dashboard.description} isDisabled={!canWrite} onChange={handleDescriptionChange} + isOptional isMultiline isMarkdown placeholder={t`Add description`} diff --git a/frontend/src/metabase/dashboard/components/DashboardInfoSidebar/DashboardInfoSidebar.unit.spec.tsx b/frontend/src/metabase/dashboard/components/DashboardInfoSidebar/DashboardInfoSidebar.unit.spec.tsx new file mode 100644 index 0000000000000000000000000000000000000000..a2d87804b5b440fed6e692abe23957561ce0a0f1 --- /dev/null +++ b/frontend/src/metabase/dashboard/components/DashboardInfoSidebar/DashboardInfoSidebar.unit.spec.tsx @@ -0,0 +1,67 @@ +import userEvent from "@testing-library/user-event"; +import { renderWithProviders, screen } from "__support__/ui"; +import { createMockDashboard } from "metabase-types/api/mocks"; +import { setupRevisionsEndpoints } from "__support__/server-mocks/revision"; +import type { Dashboard } from "metabase-types/api"; + +import { DashboardInfoSidebar } from "./DashboardInfoSidebar"; + +interface SetupOpts { + dashboard?: Dashboard; +} + +function setup({ dashboard = createMockDashboard() }: SetupOpts = {}) { + const setDashboardAttribute = jest.fn(); + // TODO: Needs to change this name after https://github.com/metabase/metabase/pull/32357 is merged + const saveDashboardAndCards = jest.fn(); + + setupRevisionsEndpoints([]); + + renderWithProviders( + <DashboardInfoSidebar + dashboard={dashboard} + setDashboardAttribute={setDashboardAttribute} + saveDashboardAndCards={saveDashboardAndCards} + />, + ); + + return { + setDashboardAttribute, + }; +} + +describe("DashboardInfoSidebar", () => { + it("should render the component", () => { + setup(); + + expect(screen.getByText("About")).toBeInTheDocument(); + }); + + it("should allow to set description", () => { + const { setDashboardAttribute } = setup(); + + userEvent.click(screen.getByTestId("editable-text")); + userEvent.type( + screen.getByPlaceholderText("Add description"), + "some description", + ); + userEvent.tab(); + + expect(setDashboardAttribute).toHaveBeenCalledWith( + "description", + "some description", + ); + }); + + it("should allow to clear description", () => { + const { setDashboardAttribute } = setup({ + dashboard: createMockDashboard({ description: "some description" }), + }); + + userEvent.click(screen.getByTestId("editable-text")); + userEvent.clear(screen.getByPlaceholderText("Add description")); + userEvent.tab(); + + expect(setDashboardAttribute).toHaveBeenCalledWith("description", ""); + }); +}); diff --git a/frontend/src/metabase/dashboard/components/DashboardInfoSidebar/index.ts b/frontend/src/metabase/dashboard/components/DashboardInfoSidebar/index.ts new file mode 100644 index 0000000000000000000000000000000000000000..5b16532bd21315f249a874978cb1d09a914b4906 --- /dev/null +++ b/frontend/src/metabase/dashboard/components/DashboardInfoSidebar/index.ts @@ -0,0 +1 @@ +export * from "./DashboardInfoSidebar";