From 42a3e787c599355d56fee50b9f500b8a894e4457 Mon Sep 17 00:00:00 2001
From: Aleksandr Lesnenko <alxnddr@users.noreply.github.com>
Date: Sat, 9 Jul 2022 04:00:53 +0400
Subject: [PATCH] Fix dashboard bugs (#23812)
* fix missing enter full-screen button
* fix dashboard background trimmed in the dark mode
* update specs
---
frontend/src/metabase/css/dashboard.css | 1 +
.../dashboard/components/DashboardActions.jsx | 22 +++++++++++--------
.../scenarios/sharing/public.cy.spec.js | 3 +++
3 files changed, 17 insertions(+), 9 deletions(-)
diff --git a/frontend/src/metabase/css/dashboard.css b/frontend/src/metabase/css/dashboard.css
index be3fa78f72a..d629b7b63a6 100644
--- a/frontend/src/metabase/css/dashboard.css
+++ b/frontend/src/metabase/css/dashboard.css
@@ -23,6 +23,7 @@
/* Fullscreen mode */
.Dashboard.Dashboard--fullscreen {
min-height: 100vh;
+ height: auto;
}
.Dashboard.Dashboard--fullscreen .Header-button {
diff --git a/frontend/src/metabase/dashboard/components/DashboardActions.jsx b/frontend/src/metabase/dashboard/components/DashboardActions.jsx
index 8fac8b43b0f..af0e433cf66 100644
--- a/frontend/src/metabase/dashboard/components/DashboardActions.jsx
+++ b/frontend/src/metabase/dashboard/components/DashboardActions.jsx
@@ -9,7 +9,7 @@ import MetabaseSettings from "metabase/lib/settings";
import NightModeIcon from "metabase/components/icons/NightModeIcon";
import RefreshWidget from "metabase/dashboard/components/RefreshWidget";
import Tooltip from "metabase/components/Tooltip";
-import Button from "metabase/core/components/Button";
+import FullscreenIcon from "metabase/components/icons/FullscreenIcon";
import { DashboardHeaderButton } from "metabase/dashboard/containers/DashboardHeader.styled";
@@ -137,20 +137,24 @@ export const getDashboardActions = (
);
}
- if (!isEditing && !isEmpty && isFullscreen) {
+ if (!isEditing && !isEmpty && (isPublic || isFullscreen)) {
// option click to enter fullscreen without making the browser go fullscreen
buttons.push(
- <Tooltip key="fullscreen" tooltip={t`Exit fullscreen`}>
+ <Tooltip
+ key="fullscreen"
+ tooltip={isFullscreen ? t`Exit fullscreen` : t`Enter fullscreen`}
+ >
<span
data-metabase-event={"Dashboard;Fullscreen Mode;" + !isFullscreen}
>
- <Button
+ <DashboardHeaderButton
onClick={e => onFullscreenChange(!isFullscreen, !e.altKey)}
- borderless
- icon="contract"
- iconSize={16}
- onlyIcon
- />
+ >
+ <FullscreenIcon
+ className="text-brand-hover"
+ isFullscreen={isFullscreen}
+ />
+ </DashboardHeaderButton>
</span>
</Tooltip>,
);
diff --git a/frontend/test/metabase/scenarios/sharing/public.cy.spec.js b/frontend/test/metabase/scenarios/sharing/public.cy.spec.js
index 4918d6af2df..886fe5b91c1 100644
--- a/frontend/test/metabase/scenarios/sharing/public.cy.spec.js
+++ b/frontend/test/metabase/scenarios/sharing/public.cy.spec.js
@@ -194,6 +194,9 @@ describe("scenarios > public", () => {
cy.contains("Add filter").click();
cy.contains(COUNT_DOOHICKEY);
+
+ // Enter full-screen button
+ cy.icon("expand");
});
}),
);
--
GitLab