[Lens] Xy expression building

packages/kbn-interpreter/src/common/index.d.ts

@@ -19,4 +19,10 @@
 
 export { Registry } from './lib/registry';
 
-export { fromExpression, Ast } from './lib/ast';
+export {
+  fromExpression,
+  toExpression,
+  Ast,
+  ExpressionArgAST,
+  ExpressionFunctionAST,
+} from './lib/ast';

packages/kbn-interpreter/src/common/lib/ast.d.ts

@@ -17,6 +17,20 @@
  * under the License.
  */
 
-export type Ast = unknown;
+export type ExpressionArgAST = string | boolean | number | Ast;
+
+export interface ExpressionFunctionAST {
+  type: 'function';
+  function: string;
+  arguments: {
+    [key: string]: ExpressionArgAST[];
+  };
+}
+
+export interface Ast {
+  type: 'expression';
+  chain: ExpressionFunctionAST[];
+}
 
 export declare function fromExpression(expression: string): Ast;
+export declare function toExpression(ast: Ast): string;

src/legacy/core_plugins/data/public/expressions/expression_runner.ts

@@ -27,6 +27,12 @@ export interface ExpressionRunnerOptions {
   context?: object;
   getInitialContext?: () => object;
   element?: Element;
+  /**
+   * If an element is specified, but the response of the expression run can't be rendered
+   * because it isn't a valid response or the specified renderer isn't available,
+   * this callback is called with the given result.
+   */
+  onRenderFailure?: (result: Result) => void;
 }
 
 export type ExpressionRunner = (
@@ -37,7 +43,10 @@ export type ExpressionRunner = (
 export const createRunFn = (
   renderersRegistry: RenderFunctionsRegistry,
   interpreterPromise: Promise<Interpreter>
-): ExpressionRunner => async (expressionOrAst, { element, context, getInitialContext }) => {
+): ExpressionRunner => async (
+  expressionOrAst,
+  { element, context, getInitialContext, onRenderFailure }
+) => {
   // TODO: make interpreter initialization synchronous to avoid this
   const interpreter = await interpreterPromise;
   const ast =
@@ -53,7 +62,7 @@ export const createRunFn = (
   });
 
   if (element) {
-    if (response.type === 'render' && response.as) {
+    if (response.type === 'render' && response.as && renderersRegistry.get(response.as) !== null) {
       renderersRegistry.get(response.as).render(element, response.value, {
         onDestroy: fn => {
           // TODO implement
@@ -63,8 +72,9 @@ export const createRunFn = (
         },
       });
     } else {
-      // eslint-disable-next-line no-console
-      console.log('Unexpected result of expression', response);
+      if (onRenderFailure) {
+        onRenderFailure(response);
+      }
     }
   }
 

src/legacy/core_plugins/data/public/expressions/expressions_service.test.tsx

@@ -39,26 +39,30 @@ const waitForInterpreterRun = async () => {
   await new Promise(resolve => setTimeout(resolve));
 };
 
+const RENDERER_ID = 'mockId';
+
 describe('expressions_service', () => {
+  let interpretAstMock: jest.Mocked<Interpreter>['interpretAst'];
   let interpreterMock: jest.Mocked<Interpreter>;
   let renderFunctionMock: jest.Mocked<RenderFunction>;
   let setupPluginsMock: ExpressionsServiceDependencies;
-  const expressionResult: Result = { type: 'render', as: 'abc', value: {} };
+  const expressionResult: Result = { type: 'render', as: RENDERER_ID, value: {} };
 
   let api: ExpressionsSetup;
   let testExpression: string;
   let testAst: Ast;
 
   beforeEach(() => {
-    interpreterMock = { interpretAst: jest.fn(_ => Promise.resolve(expressionResult)) };
+    interpretAstMock = jest.fn(_ => Promise.resolve(expressionResult));
+    interpreterMock = { interpretAst: interpretAstMock };
     renderFunctionMock = ({
       render: jest.fn(),
     } as unknown) as jest.Mocked<RenderFunction>;
     setupPluginsMock = {
       interpreter: {
         getInterpreter: () => Promise.resolve({ interpreter: interpreterMock }),
         renderersRegistry: ({
-          get: () => renderFunctionMock,
+          get: (id: string) => (id === RENDERER_ID ? renderFunctionMock : null),
         } as unknown) as RenderFunctionsRegistry,
       },
     };
@@ -101,6 +105,44 @@ describe('expressions_service', () => {
       );
     });
 
+    it('should return the result of the interpreter run', async () => {
+      const response = await api.run(testAst, {});
+      expect(response).toBe(expressionResult);
+    });
+
+    it('should call on render failure if the response is not valid', async () => {
+      const errorResult = { type: 'error', error: {} };
+      interpretAstMock.mockReturnValue(Promise.resolve(errorResult));
+      const renderFailureSpy = jest.fn();
+      const response = await api.run(testAst, {
+        element: document.createElement('div'),
+        onRenderFailure: renderFailureSpy,
+      });
+      expect(renderFailureSpy).toHaveBeenCalledWith(errorResult);
+      expect(response).toBe(response);
+    });
+
+    it('should call on render failure if the renderer is not known', async () => {
+      const errorResult = { type: 'render', as: 'unknown_id' };
+      interpretAstMock.mockReturnValue(Promise.resolve(errorResult));
+      const renderFailureSpy = jest.fn();
+      const response = await api.run(testAst, {
+        element: document.createElement('div'),
+        onRenderFailure: renderFailureSpy,
+      });
+      expect(renderFailureSpy).toHaveBeenCalledWith(errorResult);
+      expect(response).toBe(response);
+    });
+
+    it('should not call on render failure if the runner does not render', async () => {
+      const errorResult = { type: 'error', error: {} };
+      interpretAstMock.mockReturnValue(Promise.resolve(errorResult));
+      const renderFailureSpy = jest.fn();
+      const response = await api.run(testAst, { onRenderFailure: renderFailureSpy });
+      expect(renderFailureSpy).not.toHaveBeenCalled();
+      expect(response).toBe(response);
+    });
+
     it('should call the render function with the result and element', async () => {
       const element = document.createElement('div');
 

src/legacy/core_plugins/data/public/expressions/expressions_service.ts

@@ -46,6 +46,7 @@ export interface Result {
   type: string;
   as?: string;
   value?: unknown;
+  error?: unknown;
 }
 
 interface RenderHandlers {

x-pack/plugins/canvas/canvas_plugin_src/renderers/dropdown_filter/index.tsx

@@ -4,8 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-// @ts-ignore - Interpreter not typed yet
-import { fromExpression, toExpression } from '@kbn/interpreter/common';
+import { fromExpression, toExpression, Ast } from '@kbn/interpreter/common';
 import { get } from 'lodash';
 import React from 'react';
 import ReactDOM from 'react-dom';
@@ -58,7 +57,7 @@ export const dropdownFilter: RendererFactory<Config> = () => ({
       if (commitValue === '%%CANVAS_MATCH_ALL%%') {
         handlers.setFilter('');
       } else {
-        const newFilterAST = {
+        const newFilterAST: Ast = {
           type: 'expression',
           chain: [
             {

x-pack/plugins/lens/public/editor_frame_plugin/editor_frame/editor_frame.test.tsx

@@ -177,6 +177,47 @@ describe('editor_frame', () => {
         expect.objectContaining({ state: initialState })
       );
     });
+
+    it('should render the resulting expression using the expression renderer', async () => {
+      const instance = mount(
+        <EditorFrame
+          visualizationMap={{
+            testVis: { ...mockVisualization, toExpression: () => 'vis' },
+          }}
+          datasourceMap={{
+            testDatasource: {
+              ...mockDatasource,
+              toExpression: () => 'datasource',
+            },
+          }}
+          initialDatasourceId="testDatasource"
+          initialVisualizationId="testVis"
+          ExpressionRenderer={expressionRendererMock}
+        />
+      );
+
+      await waitForPromises();
+
+      instance.update();
+
+      expect(instance.find(expressionRendererMock).prop('expression')).toMatchInlineSnapshot(`
+Object {
+  "chain": Array [
+    Object {
+      "arguments": Object {},
+      "function": "datasource",
+      "type": "function",
+    },
+    Object {
+      "arguments": Object {},
+      "function": "vis",
+      "type": "function",
+    },
+  ],
+  "type": "expression",
+}
+`);
+    });
   });
 
   describe('state update', () => {

x-pack/plugins/lens/public/editor_frame_plugin/editor_frame/expression_helpers.ts

@@ -0,0 +1,42 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { Ast, fromExpression } from '@kbn/interpreter/common';
+import { Visualization, Datasource, DatasourcePublicAPI } from '../../types';
+
+export function buildExpression(
+  visualization: Visualization | null,
+  visualizationState: unknown,
+  datasource: Datasource,
+  datasourceState: unknown,
+  datasourcePublicAPI: DatasourcePublicAPI
+): Ast | null {
+  if (visualization === null) {
+    return null;
+  }
+  const datasourceExpression = datasource.toExpression(datasourceState);
+  const visualizationExpression = visualization.toExpression(
+    visualizationState,
+    datasourcePublicAPI
+  );
+
+  if (datasourceExpression === null || visualizationExpression === null) {
+    return null;
+  }
+
+  const parsedDatasourceExpression =
+    typeof datasourceExpression === 'string'
+      ? fromExpression(datasourceExpression)
+      : datasourceExpression;
+  const parsedVisualizationExpression =
+    typeof visualizationExpression === 'string'
+      ? fromExpression(visualizationExpression)
+      : visualizationExpression;
+  return {
+    type: 'expression',
+    chain: [...parsedDatasourceExpression.chain, ...parsedVisualizationExpression.chain],
+  };
+}