Changed union type differentiating from a differentiator field to a t…

…ype guard
elastic · Apr 23, 2020 · c5227d4 · c5227d4
1 parent 74ba7a3
commit c5227d4
Show file tree

Hide file tree

Showing 4 changed files with 61 additions and 32 deletions.
diff --git a/examples/embeddable_examples/public/plugin.ts b/examples/embeddable_examples/public/plugin.ts
@@ -110,6 +110,7 @@ export class EmbeddableExamplesPlugin
       new TodoComboEmbeddableFactory(async () => ({
         savedObjectsClient: (await core.getStartServices())[0].savedObjects.client,
         getEmbeddableFactory: (await core.getStartServices())[1].embeddable.getEmbeddableFactory,
+        openModal: (await core.getStartServices())[0].overlays.openModal,
       }))
     );
   }

diff --git a/examples/embeddable_examples/public/todo/combo/todo_combo_component.tsx b/examples/embeddable_examples/public/todo/combo/todo_combo_component.tsx
@@ -24,7 +24,12 @@ import { EuiAvatar } from '@elastic/eui';
 import { EuiIcon } from '@elastic/eui';
 import { EuiFlexGrid } from '@elastic/eui';
 import { withEmbeddableSubscription } from '../../../../../src/plugins/embeddable/public';
-import { TodoComboEmbeddable, TodoComboInput, TodoComboOutput } from './todo_combo_embeddable';
+import {
+  TodoComboEmbeddable,
+  TodoComboInput,
+  TodoComboOutput,
+  isRefInput,
+} from './todo_combo_embeddable';
 
 interface Props {
   embeddable: TodoComboEmbeddable;
@@ -47,10 +52,8 @@ function wrapSearchTerms(task?: string, search?: string) {
   );
 }
 
-export function TodoComboEmbeddableComponentInner({
-  input: { inputType, search },
-  output: { savedAttributes },
-}: Props) {
+export function TodoComboEmbeddableComponentInner({ input, output: { savedAttributes } }: Props) {
+  const search = input?.search;
   const icon = savedAttributes?.icon;
   const title = savedAttributes?.title;
   const task = savedAttributes?.task;
@@ -66,7 +69,9 @@ export function TodoComboEmbeddableComponentInner({
       <EuiFlexItem>
         <EuiFlexGrid columns={2}>
           <EuiFlexItem>
-            <EuiText data-test-subj="todoEmbeddableTitle">BY {inputType}</EuiText>
+            <EuiText data-test-subj="todoEmbeddableTitle">
+              BY {isRefInput(input) ? 'Reference' : 'value'}
+            </EuiText>
           </EuiFlexItem>
           <EuiFlexItem>
             <EuiText data-test-subj="todoEmbeddableTitle">

diff --git a/examples/embeddable_examples/public/todo/combo/todo_combo_embeddable.tsx b/examples/embeddable_examples/public/todo/combo/todo_combo_embeddable.tsx
@@ -31,18 +31,17 @@ import { TodoSavedObjectAttributes } from '../../../common';
 import { TodoComboEmbeddableComponent } from './todo_combo_component';
 
 export const TODO_COMBO_EMBEDDABLE = 'todo_Combo';
-
 export type TodoComboInput = TodoComboValInput | TodoComboRefInput;
 
-interface TodoComboValInput extends EmbeddableInput {
-  inputType: 'value';
-  attributes: TodoSavedObjectAttributes;
+interface TodoComboInheritedInput extends EmbeddableInput {
   search?: string;
 }
 
-interface TodoComboRefInput extends SavedObjectEmbeddableInput {
-  inputType: 'reference';
-  search?: string;
+type TodoComboValInput = TodoSavedObjectAttributes & TodoComboInheritedInput;
+type TodoComboRefInput = SavedObjectEmbeddableInput & TodoComboInheritedInput;
+
+export function isRefInput(input: TodoComboInput): input is TodoComboRefInput {
+  return (input as TodoComboRefInput).savedObjectId !== undefined;
 }
 
 export interface TodoComboOutput extends EmbeddableOutput {
@@ -87,7 +86,7 @@ export class TodoComboEmbeddable extends Embeddable<TodoComboInput, TodoComboOut
 
     this.subscription = this.getInput$().subscribe(async () => {
       let savedAttributes: TodoSavedObjectAttributes | undefined;
-      if (this.input.inputType === 'reference') {
+      if (isRefInput(this.input)) {
         if (this.savedObjectId !== this.input.savedObjectId) {
           this.savedObjectId = this.input.savedObjectId;
           const todoSavedObject = await this.savedObjectsClient.get<TodoSavedObjectAttributes>(
@@ -98,7 +97,7 @@ export class TodoComboEmbeddable extends Embeddable<TodoComboInput, TodoComboOut
         }
       } else {
         this.savedObjectId = undefined;
-        savedAttributes = this.input.attributes;
+        savedAttributes = this.input;
       }
 
       this.updateOutput({
@@ -117,7 +116,7 @@ export class TodoComboEmbeddable extends Embeddable<TodoComboInput, TodoComboOut
   }
 
   public async reload() {
-    if (this.input.inputType === 'reference') {
+    if (isRefInput(this.input)) {
       this.savedObjectId = this.input.savedObjectId;
       const todoSavedObject = await this.savedObjectsClient.get<TodoSavedObjectAttributes>(
         'todo',

diff --git a/examples/embeddable_examples/public/todo/combo/todo_combo_embeddable_factory.tsx b/examples/embeddable_examples/public/todo/combo/todo_combo_embeddable_factory.tsx
@@ -17,9 +17,10 @@
  * under the License.
  */
 import { i18n } from '@kbn/i18n';
-import { SavedObjectsClientContract } from 'kibana/public';
+import { SavedObjectsClientContract, OverlayStart } from 'kibana/public';
 import { TodoSavedObjectAttributes } from 'examples/embeddable_examples/common';
-import uuid from 'uuid';
+import React from 'react';
+import { EuiConfirmModal } from '@elastic/eui';
 import {
   IContainer,
   EmbeddableStart,
@@ -32,10 +33,12 @@ import {
   TodoComboEmbeddable,
   TODO_COMBO_EMBEDDABLE,
 } from './todo_combo_embeddable';
+import { toMountPoint } from '../../../../../src/plugins/kibana_react/public';
 
 interface StartServices {
   getEmbeddableFactory: EmbeddableStart['getEmbeddableFactory'];
   savedObjectsClient: SavedObjectsClientContract;
+  openModal: OverlayStart['openModal'];
 }
 
 export class TodoComboEmbeddableFactory
@@ -48,9 +51,9 @@ export class TodoComboEmbeddableFactory
     > {
   public readonly type = TODO_COMBO_EMBEDDABLE;
   public readonly savedObjectMetaData = {
-    name: 'Todo',
+    name: 'todo_Combo',
     includeFields: ['task', 'icon', 'title'],
-    type: 'todo',
+    type: 'todo_Combo',
     getIconForSavedObject: () => 'pencil',
   };
 
@@ -64,7 +67,6 @@ export class TodoComboEmbeddableFactory
     'SIMPLICITY',
     'Perfection',
     'FORMAT',
-    'YOU',
     'HUMILITY',
     'Ambition',
     'Speed',
@@ -101,19 +103,41 @@ export class TodoComboEmbeddableFactory
       task,
       icon: 'pencil',
     };
-    if (Math.random() > 0.5) {
-      const { savedObjectsClient } = await this.getStartServices();
-      const savedObject = await savedObjectsClient.create(this.type, attributes);
-      return {
-        inputType: 'reference',
-        savedObjectId: savedObject.id,
+    const { openModal, savedObjectsClient } = await this.getStartServices();
+    return new Promise<Partial<TodoComboInput>>(resolve => {
+      const byRef = async () => {
+        const savedObject = await savedObjectsClient.create(this.type, attributes);
+        resolve({
+          savedObjectId: savedObject.id,
+        });
       };
-    } else {
-      return {
-        inputType: 'value',
-        attributes,
+      const byVal = async () => {
+        resolve({
+          ...attributes,
+        });
       };
-    }
+      const overlay = openModal(
+        toMountPoint(
+          <EuiConfirmModal
+            title="By reference or by val???"
+            onCancel={() => {
+              byRef();
+              overlay.close();
+            }}
+            onConfirm={() => {
+              byVal();
+              overlay.close();
+            }}
+            cancelButtonText="by reference"
+            confirmButtonText="by val"
+            defaultFocusedButton="confirm"
+          >
+            <p>You&rsquo;re about to do something.</p>
+            <p>Are you sure you want to do this?</p>
+          </EuiConfirmModal>
+        )
+      );
+    });
   }
 
   public createFromSavedObject = (