[Embeddables Rebuild] Move titles API (#179202)

Moves the titles API and state comparators away from the embeddable plugin and to the presentation-publishing package.

examples/embeddable_examples/public/react_embeddables/eui_markdown/eui_markdown_react_embeddable.tsx

@@ -9,12 +9,15 @@
 import { EuiMarkdownEditor, EuiMarkdownFormat } from '@elastic/eui';
 import { css } from '@emotion/react';
 import {
-  initializeReactEmbeddableTitles,
   ReactEmbeddableFactory,
   registerReactEmbeddableFactory,
 } from '@kbn/embeddable-plugin/public';
 import { i18n } from '@kbn/i18n';
-import { useInheritedViewMode, useStateFromPublishingSubject } from '@kbn/presentation-publishing';
+import {
+  initializeTitles,
+  useInheritedViewMode,
+  useStateFromPublishingSubject,
+} from '@kbn/presentation-publishing';
 import { euiThemeVars } from '@kbn/ui-theme';
 import React from 'react';
 import { BehaviorSubject } from 'rxjs';
@@ -40,7 +43,7 @@ const markdownEmbeddableFactory: ReactEmbeddableFactory<
     /**
      * initialize state (source of truth)
      */
-    const { titlesApi, titleComparators, serializeTitles } = initializeReactEmbeddableTitles(state);
+    const { titlesApi, titleComparators, serializeTitles } = initializeTitles(state);
     const content$ = new BehaviorSubject(state.content);
 
     /**

examples/embeddable_examples/public/react_embeddables/eui_markdown/types.ts

@@ -6,12 +6,10 @@
  * Side Public License, v 1.
  */
 
-import {
-  DefaultEmbeddableApi,
-  SerializedReactEmbeddableTitles,
-} from '@kbn/embeddable-plugin/public';
+import { DefaultEmbeddableApi } from '@kbn/embeddable-plugin/public';
+import { SerializedTitles } from '@kbn/presentation-publishing';
 
-export type MarkdownEditorSerializedState = SerializedReactEmbeddableTitles & {
+export type MarkdownEditorSerializedState = SerializedTitles & {
   content: string;
 };
 

examples/embeddable_examples/public/react_embeddables/field_list/field_list_react_embeddable.tsx

@@ -18,13 +18,12 @@ import {
   DATA_VIEW_SAVED_OBJECT_TYPE,
 } from '@kbn/data-views-plugin/public';
 import {
-  initializeReactEmbeddableTitles,
   ReactEmbeddableFactory,
   registerReactEmbeddableFactory,
 } from '@kbn/embeddable-plugin/public';
 import { FieldFormatsStart } from '@kbn/field-formats-plugin/public';
 import { i18n } from '@kbn/i18n';
-import { useBatchedPublishingSubjects } from '@kbn/presentation-publishing';
+import { initializeTitles, useBatchedPublishingSubjects } from '@kbn/presentation-publishing';
 import { LazyDataViewPicker, withSuspense } from '@kbn/presentation-util-plugin/public';
 import { euiThemeVars } from '@kbn/ui-theme';
 import {
@@ -83,8 +82,7 @@ export const registerFieldListFactory = (
     },
     buildEmbeddable: async (initialState, buildApi) => {
       const subscriptions = new Subscription();
-      const { titlesApi, titleComparators, serializeTitles } =
-        initializeReactEmbeddableTitles(initialState);
+      const { titlesApi, titleComparators, serializeTitles } = initializeTitles(initialState);
 
       const allDataViews = await dataViews.getIdsWithTitle();
       const selectedDataViewId$ = new BehaviorSubject<string | undefined>(

examples/embeddable_examples/public/react_embeddables/field_list/types.ts

@@ -6,12 +6,10 @@
  * Side Public License, v 1.
  */
 
-import {
-  DefaultEmbeddableApi,
-  SerializedReactEmbeddableTitles,
-} from '@kbn/embeddable-plugin/public';
+import { DefaultEmbeddableApi } from '@kbn/embeddable-plugin/public';
+import { SerializedTitles } from '@kbn/presentation-publishing';
 
-export type FieldListSerializedStateState = SerializedReactEmbeddableTitles & {
+export type FieldListSerializedStateState = SerializedTitles & {
   dataViewId?: string;
   selectedFieldNames?: string[];
 };

examples/embeddable_examples/public/react_embeddables/search/build_search_embeddable.tsx

@@ -12,19 +12,16 @@ import { EuiCallOut } from '@elastic/eui';
 import { BehaviorSubject } from 'rxjs';
 import { TimeRange } from '@kbn/es-query';
 import type { DataView } from '@kbn/data-plugin/common';
-import { useBatchedPublishingSubjects } from '@kbn/presentation-publishing';
-import {
-  EmbeddableStateComparators,
-  ReactEmbeddableApiRegistration,
-} from '@kbn/embeddable-plugin/public/react_embeddable_system/types';
+import { StateComparators, useBatchedPublishingSubjects } from '@kbn/presentation-publishing';
+import { ReactEmbeddableApiRegistration } from '@kbn/embeddable-plugin/public/react_embeddable_system/types';
 import { Api, State, Services } from './types';
 import { getCount } from './get_count';
 
 export const buildSearchEmbeddable = async (
   state: State,
   buildApi: (
     apiRegistration: ReactEmbeddableApiRegistration<State, Api>,
-    comparators: EmbeddableStateComparators<State>
+    comparators: StateComparators<State>
   ) => Api,
   services: Services
 ) => {

packages/presentation/presentation_publishing/comparators/index.ts

@@ -0,0 +1,10 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+export type { ComparatorFunction, ComparatorDefinition, StateComparators } from './types';
+export { getInitialValuesFromComparators, runComparators } from './state_comparators';

packages/presentation/presentation_publishing/comparators/state_comparators.ts

@@ -0,0 +1,44 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { StateComparators } from './types';
+
+const defaultComparator = <T>(a: T, b: T) => a === b;
+
+export const getInitialValuesFromComparators = <StateType extends object = object>(
+  comparators: StateComparators<StateType>,
+  comparatorKeys: Array<keyof StateType>
+) => {
+  const initialValues: Partial<StateType> = {};
+  for (const key of comparatorKeys) {
+    const comparatorSubject = comparators[key][0]; // 0th element of tuple is the subject
+    initialValues[key] = comparatorSubject?.value;
+  }
+  return initialValues;
+};
+
+export const runComparators = <StateType extends object = object>(
+  comparators: StateComparators<StateType>,
+  comparatorKeys: Array<keyof StateType>,
+  lastSavedState: StateType | undefined,
+  latestState: Partial<StateType>
+) => {
+  if (!lastSavedState) {
+    // if we have no last saved state, everything is considered a change
+    return latestState;
+  }
+  const latestChanges: Partial<StateType> = {};
+  for (const key of comparatorKeys) {
+    const customComparator = comparators[key]?.[2]; // 2nd element of the tuple is the custom comparator
+    const comparator = customComparator ?? defaultComparator;
+    if (!comparator(lastSavedState?.[key], latestState[key], lastSavedState, latestState)) {
+      latestChanges[key] = latestState[key];
+    }
+  }
+  return Object.keys(latestChanges).length > 0 ? latestChanges : undefined;
+};

packages/presentation/presentation_publishing/comparators/types.ts

@@ -0,0 +1,26 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { PublishingSubject } from '../publishing_subject';
+
+export type ComparatorFunction<StateType, KeyType extends keyof StateType> = (
+  last: StateType[KeyType] | undefined,
+  current: StateType[KeyType] | undefined,
+  lastState?: Partial<StateType>,
+  currentState?: Partial<StateType>
+) => boolean;
+
+export type ComparatorDefinition<StateType, KeyType extends keyof StateType> = [
+  PublishingSubject<StateType[KeyType]>,
+  (value: StateType[KeyType]) => void,
+  ComparatorFunction<StateType, KeyType>?
+];
+
+export type StateComparators<StateType> = {
+  [KeyType in keyof StateType]: ComparatorDefinition<StateType, KeyType>;
+};

packages/presentation/presentation_publishing/index.ts

@@ -14,27 +14,34 @@ export interface EmbeddableApiContext {
   embeddable: unknown;
 }
 
+export {
+  getInitialValuesFromComparators,
+  runComparators,
+  type ComparatorDefinition,
+  type ComparatorFunction,
+  type StateComparators,
+} from './comparators';
 export {
   apiCanAccessViewMode,
   getInheritedViewMode,
   getViewModeSubject,
   useInheritedViewMode,
   type CanAccessViewMode,
 } from './interfaces/can_access_view_mode';
-export {
-  apiPublishesPhaseEvents,
-  type PublishesPhaseEvents,
-  type PhaseEvent,
-  type PhaseEventType,
-} from './interfaces/publishes_phase_events';
+export { apiHasDisableTriggers, type HasDisableTriggers } from './interfaces/has_disable_triggers';
 export { hasEditCapabilities, type HasEditCapabilities } from './interfaces/has_edit_capabilities';
 export { apiHasParentApi, type HasParentApi } from './interfaces/has_parent_api';
+export {
+  apiHasSupportedTriggers,
+  type HasSupportedTriggers,
+} from './interfaces/has_supported_triggers';
 export {
   apiHasType,
   apiIsOfType,
   type HasType,
   type HasTypeDisplayName,
 } from './interfaces/has_type';
+export { apiHasUniqueId, type HasUniqueId } from './interfaces/has_uuid';
 export {
   apiPublishesBlockingError,
   useBlockingError,
@@ -55,6 +62,12 @@ export {
   useDisabledActionIds,
   type PublishesDisabledActionIds,
 } from './interfaces/publishes_disabled_action_ids';
+export {
+  apiPublishesPhaseEvents,
+  type PhaseEvent,
+  type PhaseEventType,
+  type PublishesPhaseEvents,
+} from './interfaces/publishes_phase_events';
 export {
   apiPublishesTimeRange,
   apiPublishesUnifiedSearch,
@@ -64,35 +77,16 @@ export {
   type PublishesUnifiedSearch,
   type PublishesWritableUnifiedSearch,
 } from './interfaces/publishes_unified_search';
-export {
-  apiPublishesPanelDescription,
-  apiPublishesWritablePanelDescription,
-  useDefaultPanelDescription,
-  usePanelDescription,
-  type PublishesPanelDescription,
-  type PublishesWritablePanelDescription,
-} from './interfaces/publishes_panel_description';
-export {
-  getPanelTitle,
-  apiPublishesPanelTitle,
-  apiPublishesWritablePanelTitle,
-  useDefaultPanelTitle,
-  useHidePanelTitle,
-  usePanelTitle,
-  type PublishesPanelTitle,
-  type PublishesWritablePanelTitle,
-} from './interfaces/publishes_panel_title';
 export {
   apiPublishesSavedObjectId,
   useSavedObjectId,
   type PublishesSavedObjectId,
 } from './interfaces/publishes_saved_object_id';
-export { apiHasUniqueId, type HasUniqueId } from './interfaces/has_uuid';
-export { apiHasDisableTriggers, type HasDisableTriggers } from './interfaces/has_disable_triggers';
 export {
-  apiHasSupportedTriggers,
-  type HasSupportedTriggers,
-} from './interfaces/has_supported_triggers';
+  apiPublishesUnsavedChanges,
+  useUnsavedChanges,
+  type PublishesUnsavedChanges,
+} from './interfaces/publishes_unsaved_changes';
 export {
   apiPublishesViewMode,
   apiPublishesWritableViewMode,
@@ -102,13 +96,24 @@ export {
   type ViewMode,
 } from './interfaces/publishes_view_mode';
 export {
-  type PublishesUnsavedChanges,
-  apiPublishesUnsavedChanges,
-  useUnsavedChanges,
-} from './interfaces/publishes_unsaved_changes';
+  apiPublishesPanelDescription,
+  apiPublishesWritablePanelDescription,
+  useDefaultPanelDescription,
+  usePanelDescription,
+  type PublishesPanelDescription,
+  type PublishesWritablePanelDescription,
+} from './interfaces/titles/publishes_panel_description';
+export {
+  apiPublishesPanelTitle,
+  apiPublishesWritablePanelTitle,
+  getPanelTitle,
+  type PublishesPanelTitle,
+  type PublishesWritablePanelTitle,
+} from './interfaces/titles/publishes_panel_title';
+export { initializeTitles, type SerializedTitles } from './interfaces/titles/titles_api';
 export {
   useBatchedPublishingSubjects,
-  useStateFromPublishingSubject,
   usePublishingSubject,
+  useStateFromPublishingSubject,
   type PublishingSubject,
 } from './publishing_subject';

packages/presentation/presentation_publishing/interfaces/publishes_panel_description.ts → packages/presentation/presentation_publishing/interfaces/titles/publishes_panel_description.ts

@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 
-import { PublishingSubject, useStateFromPublishingSubject } from '../publishing_subject';
+import { PublishingSubject, useStateFromPublishingSubject } from '../../publishing_subject';
 
 export interface PublishesPanelDescription {
   panelDescription: PublishingSubject<string | undefined>;

packages/presentation/presentation_publishing/interfaces/publishes_panel_title.ts → packages/presentation/presentation_publishing/interfaces/titles/publishes_panel_title.ts

@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 
-import { PublishingSubject, useStateFromPublishingSubject } from '../publishing_subject';
+import { PublishingSubject } from '../../publishing_subject';
 
 export interface PublishesPanelTitle {
   panelTitle: PublishingSubject<string | undefined>;
@@ -44,24 +44,3 @@ export const apiPublishesWritablePanelTitle = (
     typeof (unknownApi as PublishesWritablePanelTitle).setHidePanelTitle === 'function'
   );
 };
-
-/**
- * A hook that gets this API's panel title as a reactive variable which will cause re-renders on change.
- */
-export const usePanelTitle = (api: Partial<PublishesPanelTitle> | undefined) => {
-  const title = useStateFromPublishingSubject(api?.panelTitle);
-  const defaultTitle = useStateFromPublishingSubject(api?.defaultPanelTitle);
-  return title || defaultTitle;
-};
-
-/**
- * A hook that gets this API's hide panel title setting as a reactive variable which will cause re-renders on change.
- */
-export const useHidePanelTitle = (api: Partial<PublishesPanelTitle> | undefined) =>
-  useStateFromPublishingSubject(api?.hidePanelTitle);
-
-/**
- * A hook that gets this API's default title as a reactive variable which will cause re-renders on change.
- */
-export const useDefaultPanelTitle = (api: Partial<PublishesPanelTitle> | undefined) =>
-  useStateFromPublishingSubject(api?.defaultPanelTitle);