Enhance dashboard parameter handling: persist updated values and apply saved parameters

client/app/pages/dashboards/DashboardPage.jsx

@@ -92,7 +92,7 @@ function DashboardComponent(props) {
   const [bottomPanelStyles, setBottomPanelStyles] = useState({});
   const onParametersEdit = parameters => {
     const paramOrder = map(parameters, "name");
-    updateDashboard({ options: { globalParamOrder: paramOrder } });
+    updateDashboard({ options: { ...dashboard.options, globalParamOrder: paramOrder } });
   };
 
   useEffect(() => {

client/app/pages/dashboards/components/DashboardHeader.jsx

@@ -252,7 +252,11 @@ function DashboardEditControl({ dashboardConfiguration, headerExtra }) {
     doneBtnClickedWhileSaving,
     dashboardStatus,
     retrySaveDashboardLayout,
+    saveDashboardParameters,
   } = dashboardConfiguration;
+  const handleDoneEditing = () => {
+    saveDashboardParameters().then(() => setEditingLayout(false));
+  };
   let status;
   if (dashboardStatus === DashboardStatusEnum.SAVED) {
     status = <span className="save-status">Saved</span>;
@@ -277,7 +281,7 @@ function DashboardEditControl({ dashboardConfiguration, headerExtra }) {
           Retry
         </Button>
       ) : (
-        <Button loading={doneBtnClickedWhileSaving} type="primary" onClick={() => setEditingLayout(false)}>
+        <Button loading={doneBtnClickedWhileSaving} type="primary" onClick={handleDoneEditing}>
           {!doneBtnClickedWhileSaving && <i className="fa fa-check m-r-5" aria-hidden="true" />} Done Editing
         </Button>
       )}

client/app/pages/dashboards/hooks/useDashboard.js

@@ -154,6 +154,21 @@ function useDashboard(dashboardData) {
     [refreshing, loadDashboard]
   );
 
+  const saveDashboardParameters = useCallback(() => {
+    const currentDashboard = dashboardRef.current;
+
+    return updateDashboard({
+      options: {
+        ...currentDashboard.options,
+        parameters: map(globalParameters, p => p.toSaveableObject()),
+      },
+    }).catch(error => {
+      console.error("Failed to persist parameter values:", error);
+      notification.error("Parameter values could not be saved. Your changes may not be persisted.");
+      throw error;
+    });
+  }, [globalParameters, updateDashboard]);
+
   const archiveDashboard = useCallback(() => {
     recordEvent("archive", "dashboard", dashboard.id);
     Dashboard.delete(dashboard).then(updatedDashboard =>
@@ -238,6 +253,7 @@ function useDashboard(dashboardData) {
     setRefreshRate,
     disableRefreshRate,
     ...editModeHandler,
+    saveDashboardParameters,
     gridDisabled,
     setGridDisabled,
     fullscreen,

client/app/services/dashboard.js

@@ -210,10 +210,14 @@ Dashboard.prototype.getParametersDefs = function getParametersDefs() {
         });
     }
   });
+  const mergedValues = {
+    ..._.mapValues(globalParams, p => p.value),
+    ...Object.fromEntries((this.options.parameters || []).map(param => [param.name, param.value])),
+  };
   const resultingGlobalParams = _.values(
     _.each(globalParams, param => {
-      param.setValue(param.value); // apply global param value to all locals
-      param.fromUrlParams(queryParams); // try to initialize from url (may do nothing)
+      param.setValue(mergedValues[param.name]); // apply merged value
+      param.fromUrlParams(queryParams); // allow param-specific parsing logic
     })
   );