Fix i18n, package.json merge conflict, fix embeddable parenting.

Author: ThomThomson

package.json

@@ -91,13 +91,13 @@
     "yarn": "^1.21.1"
   },
   "dependencies": {
-    "@babel/runtime": "^7.12.5",
     "@dnd-kit/core": "^3.1.1",
     "@dnd-kit/sortable": "^4.0.0",
     "@dnd-kit/utilities": "^2.0.0",
-    "@elastic/apm-rum": "^5.8.0",
-    "@elastic/apm-rum-react": "^1.2.11",
-    "@elastic/charts": "33.2.2",
+    "@babel/runtime": "^7.12.5",
+    "@elastic/apm-rum": "^5.9.1",
+    "@elastic/apm-rum-react": "^1.3.1",
+    "@elastic/charts": "34.2.1",
     "@elastic/datemath": "link:bazel-bin/packages/elastic-datemath",
     "@elastic/elasticsearch": "npm:@elastic/elasticsearch-canary@^8.0.0-canary.20",
     "@elastic/ems-client": "7.15.0",

src/plugins/presentation_util/public/components/controls/__stories__/controls_service_stub.ts

@@ -22,7 +22,7 @@ export const getControlsServiceStub = () => {
   );
 
   // cast to unknown because the stub cannot use the embeddable start contract to transform the EmbeddableFactoryDefinition into an EmbeddableFactory
-  const optionsListControlFactory = (optionsListFactoryStub as unknown) as InputControlFactory;
+  const optionsListControlFactory = optionsListFactoryStub as unknown as InputControlFactory;
   optionsListControlFactory.getDefaultInput = () => ({});
   controlsServiceStub.registerInputControlType(optionsListControlFactory);
   return controlsServiceStub;

src/plugins/presentation_util/public/components/controls/control_group/component/control_group_component.tsx

@@ -70,10 +70,10 @@ export const ControlGroup = ({ controlGroupContainer, openFlyout }: ControlGroup
 
   const [draggingId, setDraggingId] = useState<string | null>(null);
 
-  const draggingIndex = useMemo(() => (draggingId ? controlIds.indexOf(draggingId) : -1), [
-    controlIds,
-    draggingId,
-  ]);
+  const draggingIndex = useMemo(
+    () => (draggingId ? controlIds.indexOf(draggingId) : -1),
+    [controlIds, draggingId]
+  );
 
   const sensors = useSensors(
     useSensor(PointerSensor),

src/plugins/presentation_util/public/components/controls/control_group/component/control_group_sortable_item.tsx

@@ -34,19 +34,11 @@ export type SortableControlProps = ControlFrameProps & {
  */
 export const SortableControl = (frameProps: SortableControlProps) => {
   const { embeddableId } = frameProps;
-  const {
-    over,
-    listeners,
-    isSorting,
-    transform,
-    transition,
-    attributes,
-    isDragging,
-    setNodeRef,
-  } = useSortable({
-    id: embeddableId,
-    animateLayoutChanges: () => true,
-  });
+  const { over, listeners, isSorting, transform, transition, attributes, isDragging, setNodeRef } =
+    useSortable({
+      id: embeddableId,
+      animateLayoutChanges: () => true,
+    });
 
   frameProps.dragInfo = { ...frameProps.dragInfo, isOver: over?.id === embeddableId, isDragging };
 

src/plugins/presentation_util/public/components/controls/control_group/control_group_strings.ts

@@ -9,6 +9,10 @@
 import { i18n } from '@kbn/i18n';
 
 export const ControlGroupStrings = {
+  getEmbeddableTitle: () =>
+    i18n.translate('presentationUtil.inputControls.controlGroup.title', {
+      defaultMessage: 'Control group',
+    }),
   floatingActions: {
     getEditButtonTitle: () =>
       i18n.translate('presentationUtil.inputControls.controlGroup.floatingActions.edit', {

src/plugins/presentation_util/public/components/controls/control_group/embeddable/control_group_container_factory.ts

@@ -14,7 +14,6 @@
  * Side Public License, v 1.
  */
 
-import { i18n } from '@kbn/i18n';
 import {
   Container,
   ContainerOutput,
@@ -27,15 +26,16 @@ import { ControlGroupInput } from '../../types';
 import { ControlGroupContainer } from './control_group_container';
 import { ControlsService } from '../../controls_service';
 import { PresentationOverlaysService } from '../../../../services/overlays';
+import { ControlGroupStrings } from '../control_group_strings';
 
 export type DashboardContainerFactory = EmbeddableFactory<
   ControlGroupInput,
   ContainerOutput,
   ControlGroupContainer
 >;
 export class ControlGroupContainerFactory
-  implements
-    EmbeddableFactoryDefinition<ControlGroupInput, ContainerOutput, ControlGroupContainer> {
+  implements EmbeddableFactoryDefinition<ControlGroupInput, ContainerOutput, ControlGroupContainer>
+{
   public readonly isContainerType = true;
   public readonly type = CONTROL_GROUP_TYPE;
   public readonly controlsService: ControlsService;
@@ -52,9 +52,7 @@ export class ControlGroupContainerFactory
   public isEditable = async () => false;
 
   public readonly getDisplayName = () => {
-    return i18n.translate('dashboard.factory.displayName', {
-      defaultMessage: 'Dashboard',
-    });
+    return ControlGroupStrings.getEmbeddableTitle();
   };
 
   public getDefaultInput(): Partial<ControlGroupInput> {

src/plugins/presentation_util/public/components/controls/control_types/options_list/options_list_editor.tsx

@@ -81,11 +81,10 @@ export const OptionsListEditor = ({
     })();
   }, [state.indexPattern, fetchFields]);
 
-  useEffect(() => setValidState(Boolean(state.field) && Boolean(state.indexPattern)), [
-    state.field,
-    setValidState,
-    state.indexPattern,
-  ]);
+  useEffect(
+    () => setValidState(Boolean(state.field) && Boolean(state.indexPattern)),
+    [state.field, setValidState, state.indexPattern]
+  );
 
   return (
     <>

src/plugins/presentation_util/public/components/controls/control_types/options_list/options_list_embeddable.tsx

@@ -15,7 +15,7 @@ import { tap, debounceTime, map, distinctUntilChanged } from 'rxjs/operators';
 
 import { esFilters } from '../../../../../../data/public';
 import { OptionsListStrings } from './options_list_strings';
-import { Embeddable } from '../../../../../../embeddable/public';
+import { Embeddable, IContainer } from '../../../../../../embeddable/public';
 import { InputControlInput, InputControlOutput } from '../../types';
 import { OptionsListComponent, OptionsListComponentState } from './options_list_component';
 
@@ -88,9 +88,10 @@ export class OptionsListEmbeddable extends Embeddable<
   constructor(
     input: OptionsListEmbeddableInput,
     output: InputControlOutput,
-    private fetchData: OptionsListDataFetcher
+    private fetchData: OptionsListDataFetcher,
+    parent?: IContainer
   ) {
-    super(input, output);
+    super(input, output, parent);
     this.fetchData = fetchData;
 
     // populate default selections from input

src/plugins/presentation_util/public/components/controls/control_types/options_list/options_list_embeddable_factory.tsx

@@ -7,7 +7,7 @@
  */
 
 import React from 'react';
-import { EmbeddableFactoryDefinition } from '../../../../../../embeddable/public';
+import { EmbeddableFactoryDefinition, IContainer } from '../../../../../../embeddable/public';
 import {
   ControlEditorProps,
   GetControlEditorComponentProps,
@@ -24,7 +24,8 @@ import {
 } from './options_list_embeddable';
 
 export class OptionsListEmbeddableFactory
-  implements EmbeddableFactoryDefinition, IEditableControlFactory {
+  implements EmbeddableFactoryDefinition, IEditableControlFactory
+{
   public type = OPTIONS_LIST_CONTROL;
 
   constructor(
@@ -37,8 +38,8 @@ export class OptionsListEmbeddableFactory
     this.fetchData = fetchData;
   }
 
-  public create(initialInput: OptionsListEmbeddableInput) {
-    return Promise.resolve(new OptionsListEmbeddable(initialInput, {}, this.fetchData));
+  public create(initialInput: OptionsListEmbeddableInput, parent?: IContainer) {
+    return Promise.resolve(new OptionsListEmbeddable(initialInput, {}, this.fetchData, parent));
   }
 
   public getControlEditor = ({

yarn.lock

@@ -1374,15 +1374,15 @@
     opentracing "^0.14.3"
     promise-polyfill "^8.1.3"
 
-"@elastic/apm-rum-react@^1.2.11":
+"@elastic/apm-rum-react@^1.3.1":
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/@elastic/apm-rum-react/-/apm-rum-react-1.3.1.tgz#2b1a5cfe3763538d7e655816a333162696f906c9"
   integrity sha512-nJebgxMUWsWWz93v39ok0DwFGUvv9qZkA+oElUzCKyVvWpgHsWE2pvgjthrvay64qzfEg5QeM56ywaef9V13rw==
   dependencies:
     "@elastic/apm-rum" "^5.9.1"
     hoist-non-react-statics "^3.3.0"
 
-"@elastic/apm-rum@^5.8.0", "@elastic/apm-rum@^5.9.1":
+"@elastic/apm-rum@^5.9.1":
   version "5.9.1"
   resolved "https://registry.yarnpkg.com/@elastic/apm-rum/-/apm-rum-5.9.1.tgz#23b12650d443ec0a5f7c6b7b4039334e42d2fe8a"
   integrity sha512-NJAdzxXxf+LeCI0Dz3P+RMVY66C8sAztIg4tvnrhvBqxf8d7se+FpYw3oYjw3BZ8UDycmXEaIqEGcynUUndgqA==
@@ -1396,10 +1396,10 @@
   dependencies:
     object-hash "^1.3.0"
 
-"@elastic/charts@33.2.2":
-  version "33.2.2"
-  resolved "https://registry.yarnpkg.com/@elastic/charts/-/charts-33.2.2.tgz#403c46eebe71f4ca7e5c9c1a135eec66869961cc"
-  integrity sha512-g+z1T8s6m7eySaxcY7R6yqUHUstUtEIH0P4FineKWdZ5L6IkxBNrhM7r0FaddIurNxvBy/SGQorhmFZAksWhiQ==
+"@elastic/charts@34.2.1":
+  version "34.2.1"
+  resolved "https://registry.yarnpkg.com/@elastic/charts/-/charts-34.2.1.tgz#90ac2a32cb47b371f5d814c9181e59aa3d55c029"
+  integrity sha512-C4qERgrcobaTDH2QLmdog0sM5FhWQot6QdsDTFASsSuWtj+a5Ujvex1tlBgiwcuIDP/1OY/tvWhiod8YhmAomg==
   dependencies:
     "@popperjs/core" "^2.4.0"
     chroma-js "^2.1.0"
@@ -1411,7 +1411,6 @@
     d3-interpolate "^1.4.0"
     d3-scale "^1.0.7"
     d3-shape "^1.3.4"
-    newtype-ts "^0.2.4"
     prop-types "^15.7.2"
     re-reselect "^3.4.0"
     react-redux "^7.1.0"
@@ -14106,11 +14105,6 @@ forwarded@~0.1.2:
   resolved "https://registry.yarnpkg.com/forwarded/-/forwarded-0.1.2.tgz#98c23dab1175657b8c0573e8ceccd91b0ff18c84"
   integrity sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ=
 
-fp-ts@^1.0.0:
-  version "1.12.0"
-  resolved "https://registry.yarnpkg.com/fp-ts/-/fp-ts-1.12.0.tgz#d333310e4ac104cdcb6bea47908e381bb09978e7"
-  integrity sha512-fWwnAgVlTsV26Ruo9nx+fxNHIm6l1puE1VJ/C0XJ3nRQJJJIgRHYw6sigB3MuNFZL1o4fpGlhwFhcbxHK0RsOA==
-
 fp-ts@^2.3.1:
   version "2.8.6"
   resolved "https://registry.yarnpkg.com/fp-ts/-/fp-ts-2.8.6.tgz#1a0e6c3f29f5b0fbfa3120f034ea266aa73c811b"
@@ -19588,11 +19582,6 @@ monitor-event-loop-delay@^1.0.0:
   resolved "https://registry.yarnpkg.com/monitor-event-loop-delay/-/monitor-event-loop-delay-1.0.0.tgz#b5ab78165a3bb93f2b275c50d01430c7f155d1f7"
   integrity sha512-YRIr1exCIfBDLZle8WHOfSo7Xg3M+phcZfq9Fx1L6Abo+atGp7cge5pM7PjyBn4s1oZI/BRD4EMrzQBbPpVb5Q==
 
-monocle-ts@^1.0.0:
-  version "1.7.1"
-  resolved "https://registry.yarnpkg.com/monocle-ts/-/monocle-ts-1.7.1.tgz#03a615938aa90983a4fa29749969d30f72d80ba1"
-  integrity sha512-X9OzpOyd/R83sYex8NYpJjUzi/MLQMvGNVfxDYiIvs+QMXMEUDwR61MQoARFN10Cqz5h/mbFSPnIQNUIGhYd2Q==
-
 moo-color@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/moo-color/-/moo-color-1.0.2.tgz#837c40758d2d58763825d1359a84e330531eca64"
@@ -19882,14 +19871,6 @@ nested-error-stacks@^2.0.0, nested-error-stacks@^2.1.0:
   resolved "https://registry.yarnpkg.com/nested-error-stacks/-/nested-error-stacks-2.1.0.tgz#0fbdcf3e13fe4994781280524f8b96b0cdff9c61"
   integrity sha512-AO81vsIO1k1sM4Zrd6Hu7regmJN1NSiAja10gc4bX3F0wd+9rQmcuHQaHVQCYIEC8iFXnE+mavh23GOt7wBgug==
 
-newtype-ts@^0.2.4:
-  version "0.2.4"
-  resolved "https://registry.yarnpkg.com/newtype-ts/-/newtype-ts-0.2.4.tgz#a02a8f160a3d179f871848d687a93de73a964a41"
-  integrity sha512-HrzPdG0+0FK1qHbc3ld/HXu252OYgmN993bFxUtZ6NFCLUk1eq+yKwdvP07BblXQibGqMWNXBUrNoLUq23Ma2Q==
-  dependencies:
-    fp-ts "^1.0.0"
-    monocle-ts "^1.0.0"
-
 next-line@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/next-line/-/next-line-1.1.0.tgz#fcae57853052b6a9bae8208e40dd7d3c2d304603"