From 4353a82c7a9966fa94aa4001dba300238f1e6061 Mon Sep 17 00:00:00 2001 From: Vladislav Denisov Date: Fri, 12 Dec 2025 03:59:05 +0100 Subject: [PATCH] Persist updated values and apply saved dashboard parameters (#7570) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Add support for saving dashboard parameters after clicking the Apply button. Parameters are applied in the following order: URL, dashboard parameters, query parameters. Persist the queued values only when “Done Editing” is clicked, keeping Query and Dashboard editors aligned. --- client/app/pages/dashboards/DashboardPage.jsx | 13 ++-- .../dashboards/components/DashboardHeader.jsx | 26 ++++--- .../pages/dashboards/hooks/useDashboard.js | 66 ++++++++++------- client/app/services/dashboard.js | 71 ++++++++++--------- client/app/services/parameters/Parameter.js | 4 +- 5 files changed, 106 insertions(+), 74 deletions(-) diff --git a/client/app/pages/dashboards/DashboardPage.jsx b/client/app/pages/dashboards/DashboardPage.jsx index 63c796ee4..190e043cb 100644 --- a/client/app/pages/dashboards/DashboardPage.jsx +++ b/client/app/pages/dashboards/DashboardPage.jsx @@ -31,7 +31,8 @@ function DashboardSettings({ dashboardConfiguration }) { updateDashboard({ dashboard_filters_enabled: target.checked })} - data-test="DashboardFiltersCheckbox"> + data-test="DashboardFiltersCheckbox" + > Use Dashboard Level Filters @@ -90,9 +91,9 @@ function DashboardComponent(props) { const [pageContainer, setPageContainer] = useState(null); const [bottomPanelStyles, setBottomPanelStyles] = useState({}); - const onParametersEdit = parameters => { + const onParametersEdit = (parameters) => { const paramOrder = map(parameters, "name"); - updateDashboard({ options: { globalParamOrder: paramOrder } }); + updateDashboard({ options: { ...dashboard.options, globalParamOrder: paramOrder } }); }; useEffect(() => { @@ -175,7 +176,7 @@ function DashboardPage({ dashboardSlug, dashboardId, onError }) { useEffect(() => { Dashboard.get({ id: dashboardId, slug: dashboardSlug }) - .then(dashboardData => { + .then((dashboardData) => { recordEvent("view", "dashboard", dashboardData.id); setDashboard(dashboardData); @@ -207,7 +208,7 @@ routes.register( "Dashboards.LegacyViewOrEdit", routeWithUserSession({ path: "/dashboard/:dashboardSlug", - render: pageProps => , + render: (pageProps) => , }) ); @@ -215,6 +216,6 @@ routes.register( "Dashboards.ViewOrEdit", routeWithUserSession({ path: "/dashboards/:dashboardId([^-]+)(-.*)?", - render: pageProps => , + render: (pageProps) => , }) ); diff --git a/client/app/pages/dashboards/components/DashboardHeader.jsx b/client/app/pages/dashboards/components/DashboardHeader.jsx index b8b27a392..86d7e12ae 100644 --- a/client/app/pages/dashboards/components/DashboardHeader.jsx +++ b/client/app/pages/dashboards/components/DashboardHeader.jsx @@ -22,7 +22,7 @@ import { DashboardStatusEnum } from "../hooks/useDashboard"; import "./DashboardHeader.less"; function getDashboardTags() { - return getTags("api/dashboards/tags").then(tags => map(tags, t => t.name)); + return getTags("api/dashboards/tags").then((tags) => map(tags, (t) => t.name)); } function buttonType(value) { @@ -38,7 +38,7 @@ function DashboardPageTitle({ dashboardConfiguration }) {

updateDashboard({ name })} + onDone={(name) => updateDashboard({ name })} value={dashboard.name} ignoreBlanks /> @@ -53,7 +53,7 @@ function DashboardPageTitle({ dashboardConfiguration }) { isArchived={dashboard.is_archived} canEdit={canEditDashboard} getAvailableTags={getDashboardTags} - onEdit={tags => updateDashboard({ tags })} + onEdit={(tags) => updateDashboard({ tags })} /> ); @@ -89,14 +89,15 @@ function RefreshButton({ dashboardConfiguration }) { placement="bottomRight" overlay={ - {refreshRateOptions.map(option => ( + {refreshRateOptions.map((option) => ( {durationHumanize(option)} ))} {refreshRate && Disable auto refresh} - }> + } + >