diff --git a/src/plugins/controls/public/constants.ts b/src/plugins/controls/public/constants.ts index 0773dd7ea9076..1be94fcc6ae11 100644 --- a/src/plugins/controls/public/constants.ts +++ b/src/plugins/controls/public/constants.ts @@ -7,3 +7,5 @@ */ export const MIN_POPOVER_WIDTH = 300; + +export const CHANGE_CHECK_DEBOUNCE = 100; diff --git a/src/plugins/controls/public/control_group/embeddable/control_group_container.tsx b/src/plugins/controls/public/control_group/embeddable/control_group_container.tsx index ce78cdc5d1195..dcb74fd606154 100644 --- a/src/plugins/controls/public/control_group/embeddable/control_group_container.tsx +++ b/src/plugins/controls/public/control_group/embeddable/control_group_container.tsx @@ -106,7 +106,7 @@ export class ControlGroupContainer extends Container< public onFiltersPublished$: Subject; public onControlRemoved$: Subject; - /** This currently reports the **entire** control group input on unsaved changes */ + /** This currently reports the **entire** persistable control group input on unsaved changes */ public unsavedChanges: BehaviorSubject; public fieldFilterPredicate: FieldFilterPredicate | undefined; @@ -130,7 +130,7 @@ export class ControlGroupContainer extends Container< this.onFiltersPublished$ = new Subject(); this.onControlRemoved$ = new Subject(); - // start diffing dashboard state + // start diffing control group state this.unsavedChanges = new BehaviorSubject(undefined); const diffingMiddleware = startDiffingControlGroupState.bind(this)(); diff --git a/src/plugins/controls/public/control_group/external_api/control_group_renderer.tsx b/src/plugins/controls/public/control_group/external_api/control_group_renderer.tsx index d236a49f661cb..b5e024815e7ab 100644 --- a/src/plugins/controls/public/control_group/external_api/control_group_renderer.tsx +++ b/src/plugins/controls/public/control_group/external_api/control_group_renderer.tsx @@ -6,6 +6,7 @@ * Side Public License, v 1. */ +import { isEqual, pick } from 'lodash'; import React, { forwardRef, useEffect, @@ -14,28 +15,31 @@ import React, { useRef, useState, } from 'react'; -import { isEqual } from 'lodash'; import { v4 as uuidv4 } from 'uuid'; -import { compareFilters } from '@kbn/es-query'; -import type { Filter, TimeRange, Query } from '@kbn/es-query'; import { EmbeddableFactory } from '@kbn/embeddable-plugin/public'; +import type { Filter, Query, TimeRange } from '@kbn/es-query'; +import { compareFilters } from '@kbn/es-query'; import { + getDefaultControlGroupInput, + getDefaultControlGroupPersistableInput, + persistableControlGroupInputKeys, +} from '../../../common'; +import { ControlGroupContainer } from '../embeddable/control_group_container'; +import { ControlGroupContainerFactory } from '../embeddable/control_group_container_factory'; +import { + ControlGroupCreationOptions, ControlGroupInput, - CONTROL_GROUP_TYPE, ControlGroupOutput, - ControlGroupCreationOptions, + CONTROL_GROUP_TYPE, } from '../types'; import { - ControlGroupAPI, AwaitingControlGroupAPI, buildApiFromControlGroupContainer, + ControlGroupAPI, } from './control_group_api'; -import { getDefaultControlGroupInput } from '../../../common'; import { controlGroupInputBuilder, ControlGroupInputBuilder } from './control_group_input_builder'; -import { ControlGroupContainer } from '../embeddable/control_group_container'; -import { ControlGroupContainerFactory } from '../embeddable/control_group_container_factory'; export interface ControlGroupRendererProps { filters?: Filter[]; @@ -87,7 +91,13 @@ export const ControlGroupRenderer = forwardRef { return new Observable((observer) => { if (observer.closed) return; diff --git a/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts b/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts index f2e62a21d6c09..480ce26afad6c 100644 --- a/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts +++ b/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts @@ -5,7 +5,7 @@ * in compliance with, at your election, the Elastic License 2.0 or the Server * Side Public License, v 1. */ -import { cloneDeep, identity, omit, pickBy } from 'lodash'; +import { cloneDeep, identity, omit, pick, pickBy } from 'lodash'; import { BehaviorSubject, combineLatestWith, distinctUntilChanged, map, Subject } from 'rxjs'; import { v4 } from 'uuid'; @@ -14,7 +14,7 @@ import { CONTROL_GROUP_TYPE, getDefaultControlGroupInput, getDefaultControlGroupPersistableInput, - PersistableControlGroupInput, + persistableControlGroupInputKeys, } from '@kbn/controls-plugin/common'; import { ControlGroupContainerFactory, @@ -214,11 +214,6 @@ export const initializeDashboard = async ({ }), 'controlGroupInput' ); - const initialControlGroupInput: PersistableControlGroupInput | {} = { - ...(loadDashboardReturn?.dashboardInput?.controlGroupInput ?? {}), - ...(sessionStorageInput?.controlGroupInput ?? {}), - ...(overrideInput?.controlGroupInput ?? {}), - }; // Back up any view mode passed in explicitly. if (overrideInput?.viewMode) { @@ -405,6 +400,11 @@ export const initializeDashboard = async ({ create: ControlGroupContainerFactory['create']; }; const { filters, query, timeRange, viewMode, id } = initialDashboardInput; + const initialControlGroupInput: ControlGroupInput | {} = { + ...(loadDashboardReturn?.dashboardInput?.controlGroupInput ?? {}), + ...(sessionStorageInput?.controlGroupInput ?? {}), + ...(overrideInput?.controlGroupInput ?? {}), + }; const fullControlGroupInput = { id: `control_group_${id ?? 'new_dashboard'}`, ...getDefaultControlGroupInput(), @@ -418,10 +418,18 @@ export const initializeDashboard = async ({ if (controlGroup) { controlGroup.updateInputAndReinitialize(fullControlGroupInput); } else { + const lastSavedControlGroupInput = pick( + { + ...(loadDashboardReturn?.dashboardInput?.controlGroupInput ?? {}), + ...(overrideInput?.controlGroupInput ?? {}), + }, + persistableControlGroupInputKeys + ); const newControlGroup = await controlsGroupFactory?.create(fullControlGroupInput, this, { - lastSavedInput: - loadDashboardReturn?.dashboardInput.controlGroupInput ?? - getDefaultControlGroupPersistableInput(), + lastSavedInput: { + ...getDefaultControlGroupPersistableInput(), + ...lastSavedControlGroupInput, + }, }); if (!newControlGroup || isErrorEmbeddable(newControlGroup)) { throw new Error('Error in control group startup');