Table visualization renderer (#79455)

* Implement toExpressionAst fn

* Implement table vis renderer, move legacy codebase

* Update legacy paths

* Update types

* Fix filtering

* Update styles

* Remove legacy tests

* Update docs

* Update tests

* Fix tests

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>

docs/development/plugins/expressions/public/kibana-plugin-plugins-expressions-public.iinterpreterrenderhandlers.md

@@ -18,5 +18,6 @@ export interface IInterpreterRenderHandlers
 |  [event](./kibana-plugin-plugins-expressions-public.iinterpreterrenderhandlers.event.md) | <code>(event: any) =&gt; void</code> |  |
 |  [onDestroy](./kibana-plugin-plugins-expressions-public.iinterpreterrenderhandlers.ondestroy.md) | <code>(fn: () =&gt; void) =&gt; void</code> |  |
 |  [reload](./kibana-plugin-plugins-expressions-public.iinterpreterrenderhandlers.reload.md) | <code>() =&gt; void</code> |  |
+|  [uiState](./kibana-plugin-plugins-expressions-public.iinterpreterrenderhandlers.uistate.md) | <code>PersistedState</code> |  |
 |  [update](./kibana-plugin-plugins-expressions-public.iinterpreterrenderhandlers.update.md) | <code>(params: any) =&gt; void</code> |  |
 

docs/development/plugins/expressions/public/kibana-plugin-plugins-expressions-public.iinterpreterrenderhandlers.uistate.md

@@ -0,0 +1,11 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [kibana-plugin-plugins-expressions-public](./kibana-plugin-plugins-expressions-public.md) &gt; [IInterpreterRenderHandlers](./kibana-plugin-plugins-expressions-public.iinterpreterrenderhandlers.md) &gt; [uiState](./kibana-plugin-plugins-expressions-public.iinterpreterrenderhandlers.uistate.md)
+
+## IInterpreterRenderHandlers.uiState property
+
+<b>Signature:</b>
+
+```typescript
+uiState?: PersistedState;
+```

docs/development/plugins/expressions/server/kibana-plugin-plugins-expressions-server.iinterpreterrenderhandlers.md

@@ -18,5 +18,6 @@ export interface IInterpreterRenderHandlers
 |  [event](./kibana-plugin-plugins-expressions-server.iinterpreterrenderhandlers.event.md) | <code>(event: any) =&gt; void</code> |  |
 |  [onDestroy](./kibana-plugin-plugins-expressions-server.iinterpreterrenderhandlers.ondestroy.md) | <code>(fn: () =&gt; void) =&gt; void</code> |  |
 |  [reload](./kibana-plugin-plugins-expressions-server.iinterpreterrenderhandlers.reload.md) | <code>() =&gt; void</code> |  |
+|  [uiState](./kibana-plugin-plugins-expressions-server.iinterpreterrenderhandlers.uistate.md) | <code>PersistedState</code> |  |
 |  [update](./kibana-plugin-plugins-expressions-server.iinterpreterrenderhandlers.update.md) | <code>(params: any) =&gt; void</code> |  |
 

docs/development/plugins/expressions/server/kibana-plugin-plugins-expressions-server.iinterpreterrenderhandlers.uistate.md

@@ -0,0 +1,11 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [kibana-plugin-plugins-expressions-server](./kibana-plugin-plugins-expressions-server.md) &gt; [IInterpreterRenderHandlers](./kibana-plugin-plugins-expressions-server.iinterpreterrenderhandlers.md) &gt; [uiState](./kibana-plugin-plugins-expressions-server.iinterpreterrenderhandlers.uistate.md)
+
+## IInterpreterRenderHandlers.uiState property
+
+<b>Signature:</b>
+
+```typescript
+uiState?: PersistedState;
+```

src/plugins/expressions/common/expression_renderers/types.ts

@@ -17,6 +17,8 @@
  * under the License.
  */
 
+import { PersistedState } from 'src/plugins/visualizations/public';
+
 export interface ExpressionRenderDefinition<Config = unknown> {
   /**
    * Technical name of the renderer, used as ID to identify renderer in
@@ -68,4 +70,5 @@ export interface IInterpreterRenderHandlers {
   reload: () => void;
   update: (params: any) => void;
   event: (event: any) => void;
+  uiState?: PersistedState;
 }

src/plugins/expressions/public/public.api.md

@@ -11,6 +11,7 @@ import { EnvironmentMode } from '@kbn/config';
 import { EventEmitter } from 'events';
 import { Observable } from 'rxjs';
 import { PackageInfo } from '@kbn/config';
+import { PersistedState } from 'src/plugins/visualizations/public';
 import { Plugin as Plugin_2 } from 'src/core/public';
 import { PluginInitializerContext as PluginInitializerContext_2 } from 'src/core/public';
 import React from 'react';
@@ -883,6 +884,8 @@ export interface IInterpreterRenderHandlers {
     // (undocumented)
     reload: () => void;
     // (undocumented)
+    uiState?: PersistedState;
+    // (undocumented)
     update: (params: any) => void;
 }
 

src/plugins/expressions/server/server.api.md

@@ -9,6 +9,7 @@ import { CoreStart } from 'src/core/server';
 import { Ensure } from '@kbn/utility-types';
 import { EventEmitter } from 'events';
 import { Observable } from 'rxjs';
+import { PersistedState } from 'src/plugins/visualizations/public';
 import { Plugin as Plugin_2 } from 'src/core/server';
 import { PluginInitializerContext } from 'src/core/server';
 import { UnwrapPromiseOrReturn } from '@kbn/utility-types';
@@ -717,6 +718,8 @@ export interface IInterpreterRenderHandlers {
     // (undocumented)
     reload: () => void;
     // (undocumented)
+    uiState?: PersistedState;
+    // (undocumented)
     update: (params: any) => void;
 }
 

src/plugins/vis_type_table/public/index.ts

@@ -16,7 +16,6 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import './index.scss';
 import { PluginInitializerContext } from 'kibana/public';
 import { TableVisPlugin as Plugin } from './plugin';
 

src/plugins/vis_type_table/public/_table_vis.scss → src/plugins/vis_type_table/public/legacy/_table_vis.scss

@@ -4,8 +4,10 @@
 .table-vis {
   display: flex;
   flex-direction: column;
-  flex: 1 0 100%;
+  flex: 1 1 0;
   overflow: auto;
+
+  @include euiScrollBar;
 }
 
 .table-vis-container {

src/plugins/vis_type_table/public/agg_table/agg_table.js → src/plugins/vis_type_table/public/legacy/agg_table/agg_table.js

@@ -17,9 +17,9 @@
  * under the License.
  */
 import _ from 'lodash';
-import { CSV_SEPARATOR_SETTING, CSV_QUOTE_VALUES_SETTING } from '../../../share/public';
+import { CSV_SEPARATOR_SETTING, CSV_QUOTE_VALUES_SETTING } from '../../../../share/public';
 import aggTableTemplate from './agg_table.html';
-import { getFormatService } from '../services';
+import { getFormatService } from '../../services';
 import { i18n } from '@kbn/i18n';
 
 export function KbnAggTable(config, RecursionHelper) {

src/plugins/vis_type_table/public/agg_table/agg_table.test.js → src/plugins/vis_type_table/public/legacy/agg_table/agg_table.test.js

@@ -24,14 +24,14 @@ import 'angular-mocks';
 import sinon from 'sinon';
 import { round } from 'lodash';
 
-import { getFieldFormatsRegistry } from '../../../data/public/test_utils';
-import { coreMock } from '../../../../core/public/mocks';
-import { initAngularBootstrap } from '../../../kibana_legacy/public';
-import { setUiSettings } from '../../../data/public/services';
-import { UI_SETTINGS } from '../../../data/public/';
-import { CSV_SEPARATOR_SETTING, CSV_QUOTE_VALUES_SETTING } from '../../../share/public';
-
-import { setFormatService } from '../services';
+import { getFieldFormatsRegistry } from '../../../../data/public/test_utils';
+import { coreMock } from '../../../../../core/public/mocks';
+import { initAngularBootstrap } from '../../../../kibana_legacy/public';
+import { setUiSettings } from '../../../../data/public/services';
+import { UI_SETTINGS } from '../../../../data/public/';
+import { CSV_SEPARATOR_SETTING, CSV_QUOTE_VALUES_SETTING } from '../../../../share/public';
+
+import { setFormatService } from '../../services';
 import { getInnerAngular } from '../get_inner_angular';
 import { initTableVisLegacyModule } from '../table_vis_legacy_module';
 import { tabifiedData } from './tabified_data';

src/plugins/vis_type_table/public/agg_table/agg_table_group.test.js → src/plugins/vis_type_table/public/legacy/agg_table/agg_table_group.test.js

@@ -22,11 +22,11 @@ import angular from 'angular';
 import 'angular-mocks';
 import expect from '@kbn/expect';
 
-import { getFieldFormatsRegistry } from '../../../data/public/test_utils';
-import { coreMock } from '../../../../core/public/mocks';
-import { initAngularBootstrap } from '../../../kibana_legacy/public';
-import { setUiSettings } from '../../../data/public/services';
-import { setFormatService } from '../services';
+import { getFieldFormatsRegistry } from '../../../../data/public/test_utils';
+import { coreMock } from '../../../../../core/public/mocks';
+import { initAngularBootstrap } from '../../../../kibana_legacy/public';
+import { setUiSettings } from '../../../../data/public/services';
+import { setFormatService } from '../../services';
 import { getInnerAngular } from '../get_inner_angular';
 import { initTableVisLegacyModule } from '../table_vis_legacy_module';
 import { tabifiedData } from './tabified_data';

src/plugins/vis_type_table/public/get_inner_angular.ts → src/plugins/vis_type_table/public/legacy/get_inner_angular.ts

@@ -33,7 +33,7 @@ import {
   PrivateProvider,
   watchMultiDecorator,
   KbnAccessibleClickProvider,
-} from '../../kibana_legacy/public';
+} from '../../../kibana_legacy/public';
 
 initAngularBootstrap();
 

src/plugins/vis_type_table/public/paginated_table/paginated_table.test.ts → src/plugins/vis_type_table/public/legacy/paginated_table/paginated_table.test.ts

@@ -25,11 +25,7 @@ import 'angular-mocks';
 
 import { getAngularModule } from '../get_inner_angular';
 import { initTableVisLegacyModule } from '../table_vis_legacy_module';
-import { coreMock } from '../../../../core/public/mocks';
-
-jest.mock('../../../kibana_legacy/public/angular/angular_config', () => ({
-  configureAppAngularModule: () => {},
-}));
+import { coreMock } from '../../../../../core/public/mocks';
 
 interface Sort {
   columnIndex: number;

src/plugins/vis_type_table/public/paginated_table/rows.js → src/plugins/vis_type_table/public/legacy/paginated_table/rows.js

@@ -44,15 +44,18 @@ export function KbnRows($compile) {
             }
 
             $scope.filter({
-              data: [
-                {
-                  table: $scope.table,
-                  row: $scope.rows.findIndex((r) => r === row),
-                  column: $scope.table.columns.findIndex((c) => c.id === column.id),
-                  value,
-                },
-              ],
-              negate,
+              name: 'filterBucket',
+              data: {
+                data: [
+                  {
+                    table: $scope.table,
+                    row: $scope.rows.findIndex((r) => r === row),
+                    column: $scope.table.columns.findIndex((c) => c.id === column.id),
+                    value,
+                  },
+                ],
+                negate,
+              },
             });
           };
 

src/plugins/vis_type_table/public/table_vis.html → src/plugins/vis_type_table/public/legacy/table_vis.html

@@ -15,7 +15,7 @@
 
   <div ng-if="tableGroups" class="table-vis-container" data-test-subj="tableVis">
     <kbn-agg-table-group
-      filter="vis.API.events.filter"
+      filter="filter"
       dimensions="dimensions"
       group="tableGroups"
       export-title="visState.title"

src/plugins/vis_type_table/public/table_vis_controller.test.ts → src/plugins/vis_type_table/public/legacy/table_vis_controller.test.ts

@@ -24,24 +24,19 @@ import $ from 'jquery';
 
 import { getAngularModule } from './get_inner_angular';
 import { initTableVisLegacyModule } from './table_vis_legacy_module';
-import { getTableVisTypeDefinition } from './table_vis_type';
-import { Vis } from '../../visualizations/public';
-import { stubFields } from '../../data/public/stubs';
-import { tableVisResponseHandler } from './table_vis_response_handler';
-import { coreMock } from '../../../core/public/mocks';
-import { IAggConfig, search } from '../../data/public';
-import { getStubIndexPattern } from '../../data/public/test_utils';
-// TODO: remove linting disable
-import { searchServiceMock } from '../../data/public/search/mocks';
+import { tableVisTypeDefinition } from '../table_vis_type';
+import { Vis } from '../../../visualizations/public';
+import { stubFields } from '../../../data/public/stubs';
+import { tableVisResponseHandler } from '../table_vis_response_handler';
+import { coreMock } from '../../../../core/public/mocks';
+import { IAggConfig, search } from '../../../data/public';
+import { getStubIndexPattern } from '../../../data/public/test_utils';
+import { searchServiceMock } from '../../../data/public/search/mocks';
 
 const { createAggConfigs } = searchServiceMock.createStartContract().aggs;
 
 const { tabifyAggResponse } = search;
 
-jest.mock('../../kibana_legacy/public/angular/angular_config', () => ({
-  configureAppAngularModule: () => {},
-}));
-
 interface TableVisScope extends IScope {
   [key: string]: any;
 }
@@ -112,10 +107,6 @@ describe('Table Vis - Controller', () => {
       coreMock.createSetup()
     );
   });
-  const tableVisTypeDefinition = getTableVisTypeDefinition(
-    coreMock.createSetup(),
-    coreMock.createPluginInitializerContext()
-  );
 
   function getRangeVis(params?: object) {
     return ({