chore: updates to fix most ts errors in v4.9.5 upgrade (#18)

* fix most vis type errors due to ts 4.9.5 upgrade

* first stab at fix for formula mocks errors

* Revert "first stab at fix for formula mocks errors"

This reverts commit a20a96c.

* fix ripple of type errors from changes

src/dev/code_coverage/ingest_coverage/__tests__/mocks/team_assign_mock.txt

@@ -61,9 +61,6 @@ x-pack/plugins/lens/public/datatable_visualization/expression.tsx kibana-app
 x-pack/plugins/lens/public/datatable_visualization/index.ts kibana-app
 x-pack/plugins/lens/public/datatable_visualization/visualization.test.tsx kibana-app
 x-pack/plugins/lens/public/datatable_visualization/visualization.tsx kibana-app
-x-pack/plugins/lens/public/debounced_component/debounced_component.test.tsx kibana-app
-x-pack/plugins/lens/public/debounced_component/debounced_component.tsx kibana-app
-x-pack/plugins/lens/public/debounced_component/index.ts kibana-app
 x-pack/plugins/lens/public/drag_drop/drag_drop.test.tsx kibana-app
 x-pack/plugins/lens/public/drag_drop/drag_drop.tsx kibana-app
 x-pack/plugins/lens/public/drag_drop/index.ts kibana-app

src/plugins/chart_expressions/expression_legacy_metric/public/__stories__/metric_renderer.stories.tsx

@@ -10,7 +10,7 @@ import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { from } from 'rxjs';
 import { ExpressionValueVisDimension } from '@kbn/visualizations-plugin/common';
-import { Datatable, DatatableColumn } from '@kbn/expressions-plugin/common';
+import { Datatable, DatatableColumn, TextAlignment } from '@kbn/expressions-plugin/common';
 import { Render } from '@kbn/presentation-util-plugin/public/__stories__';
 import { ColorMode, CustomPaletteState } from '@kbn/charts-plugin/common';
 import { getFormatService } from '../__mocks__/format_service';
@@ -209,8 +209,11 @@ storiesOf('renderers/visMetric', module)
               },
               labels: {
                 show: false,
-                // @ts-expect-error upgrade typescript v4.9.5
-                style: { spec: { fontSize: '60px', align: 'left' }, type: 'style', css: '' },
+                style: {
+                  spec: { fontSize: '60px', textAlign: TextAlignment.LEFT },
+                  type: 'style',
+                  css: '',
+                },
                 position: LabelPosition.TOP,
               },
             },

src/plugins/chart_expressions/expression_legacy_metric/public/components/with_auto_scale.tsx

@@ -63,10 +63,13 @@ function hasAutoscaleProps<T>(props: T): props is T & AutoScaleProps {
   return false;
 }
 
-function getWrappedComponentProps<T>(props: T) {
+function getWrappedComponentProps<T>(props: T): T {
   if (hasAutoscaleProps(props)) {
-    const { autoScaleParams, renderComplete, ...rest } = props;
-    return rest;
+    return {
+      ...props,
+      autoScaleParams: undefined,
+      renderComplete: undefined,
+    };
   }
 
   return props;
@@ -132,8 +135,7 @@ export function withAutoScale<T>(WrappedComponent: ComponentType<T>) {
               : {}),
           }}
         >
-          {/* @ts-expect-error upgrade typescript v4.9.5*/}
-          <WrappedComponent {...(restProps as T)} />
+          <WrappedComponent {...restProps} />
         </div>
       </div>
     );

src/plugins/expressions/common/execution/execution_contract.ts

@@ -17,17 +17,19 @@ import { ExpressionAstExpression } from '../ast';
  * `ExecutionContract` is a wrapper around `Execution` class. It provides the
  * same functionality but does not expose Expressions plugin internals.
  */
-export class ExecutionContract<Input = unknown, Output = unknown, InspectorAdapters = unknown> {
+export class ExecutionContract<
+  Input = unknown,
+  Output = unknown,
+  InspectorAdapters extends Adapters = object
+> {
   public get isPending(): boolean {
     const { state, result } = this.execution.state.get();
     const finished = state === 'error' || (state === 'result' && !result?.partial);
     return !finished;
   }
 
-  // @ts-expect-error upgrade typescript v4.9.5
   protected readonly execution: Execution<Input, Output, InspectorAdapters>;
 
-  // @ts-expect-error upgrade typescript v4.9.5
   constructor(execution: Execution<Input, Output, InspectorAdapters>) {
     this.execution = execution;
   }
@@ -82,6 +84,5 @@ export class ExecutionContract<Input = unknown, Output = unknown, InspectorAdapt
    * Get Inspector adapters provided to all functions of expression through
    * execution context.
    */
-  // @ts-expect-error upgrade typescript v4.9.5
   inspect = (): Adapters => this.execution.inspectorAdapters;
 }

src/plugins/vis_types/table/public/components/table_vis_basic.test.tsx

@@ -13,6 +13,7 @@ import { FormattedColumn, TableVisConfig, TableVisUiState } from '../types';
 import { DatatableColumn } from '@kbn/expressions-plugin/common';
 import { createTableVisCell } from './table_vis_cell';
 import { createGridColumns } from './table_vis_columns';
+import { EuiDataGridProps } from '@elastic/eui';
 
 jest.mock('./table_vis_columns', () => ({
   createGridColumns: jest.fn(() => []),
@@ -107,8 +108,8 @@ describe('TableVisBasic', () => {
       undefined
     );
 
-    // @ts-expect-error upgrade typescript v4.9.5
-    const { onSort } = comp.find('EuiDataGrid').prop('sorting');
+    const { onSort } = comp.find('EuiDataGrid').prop<EuiDataGridProps['sorting']>('sorting')!;
+
     // sort the first column
     onSort([{ id: 'first', direction: 'asc' }]);
     expect(uiStateProps.setSort).toHaveBeenCalledWith({ columnIndex: 0, direction: 'asc' });

src/plugins/vis_types/timeseries/public/convert_to_lens/lib/convert/percentile.ts

@@ -49,19 +49,20 @@ export const convertToPercentileColumn = (
     return null;
   }
   const commonColumnParams = createColumn(series, metric, field, { reducedTimeRange, timeShift });
+  const meta: PercentileColumn['meta'] =
+    index !== undefined
+      ? {
+          reference: `${metric.id}.${index}`,
+          ...commonColumnParams.meta,
+        }
+      : commonColumnParams.meta;
+
   return {
     operationType: 'percentile',
     sourceField: field.name,
     ...commonColumnParams,
     params: { ...params, ...getFormat(series) },
-    // @ts-expect-error upgrade typescript v4.9.5
-    meta:
-      index !== undefined
-        ? {
-            reference: `${metric.id}.${index}`,
-            ...commonColumnParams.meta,
-          }
-        : commonColumnParams.meta,
+    meta,
   };
 };
 

src/plugins/vis_types/timeseries/public/convert_to_lens/lib/convert/percentile_rank.ts

@@ -19,6 +19,7 @@ import {
   Column,
   PercentileRanksColumnWithExtendedMeta,
   CommonColumnConverterArgs,
+  PercentileColumn,
 } from './types';
 
 export const isPercentileRanksColumnWithMeta = (
@@ -56,19 +57,19 @@ export const convertToPercentileRankColumn = (
   }
 
   const commonColumnParams = createColumn(series, metric, field, { reducedTimeRange, timeShift });
+  const meta: PercentileColumn['meta'] =
+    index !== undefined
+      ? {
+          reference: `${metric.id}.${index}`,
+          ...commonColumnParams.meta,
+        }
+      : commonColumnParams.meta;
   return {
     operationType: 'percentile_rank',
     sourceField: field.name,
     ...commonColumnParams,
     params: { ...params, ...getFormat(series) },
-    // @ts-expect-error upgrade typescript v4.9.5
-    meta:
-      index !== undefined
-        ? {
-            reference: `${metric.id}.${index}`,
-            ...commonColumnParams.meta,
-          }
-        : commonColumnParams.meta,
+    meta,
   };
 };
 

src/plugins/visualizations/public/convert_to_lens/schemas.ts

@@ -8,7 +8,7 @@
 
 import type { DataView } from '@kbn/data-views-plugin/common';
 import { IAggConfig, METRIC_TYPES, TimefilterContract } from '@kbn/data-plugin/public';
-import { AggBasedColumn, PercentageModeConfig, SchemaConfig } from '../../common';
+import { AggBasedColumn, PercentageModeConfig, SchemaConfig, VisParams } from '../../common';
 import { convertMetricToColumns } from '../../common/convert_to_lens/lib/metrics';
 import {
   getAggIdAndValue,
@@ -133,8 +133,8 @@ const createLayer = (
   };
 };
 
-export const getColumnsFromVis = <T>(
-  vis: Vis<T>,
+export const getColumnsFromVis = <TVisParams extends VisParams>(
+  vis: Vis<TVisParams>,
   timefilter: TimefilterContract,
   dataView: DataView,
   {

src/plugins/visualizations/public/types.ts

@@ -80,7 +80,7 @@ export interface VisToExpressionAstParams {
   abortSignal?: AbortSignal;
 }
 
-export type VisToExpressionAst<TVisParams = VisParams> = (
+export type VisToExpressionAst<TVisParams extends VisParams = VisParams> = (
   vis: Vis<TVisParams>,
   params: VisToExpressionAstParams
 ) => Promise<ExpressionAstExpression> | ExpressionAstExpression;

src/plugins/visualizations/public/vis.ts

@@ -57,7 +57,7 @@ const getSearchSource = async (inputSearchSource: ISearchSource, savedSearchId?:
 
 type PartialVisState = Assign<SerializedVis, { data: Partial<SerializedVisData> }>;
 
-export class Vis<TVisParams = VisParams> {
+export class Vis<TVisParams extends VisParams = VisParams> {
   public readonly type: BaseVisType<TVisParams>;
   public readonly id?: string;
   public title: string = '';
@@ -69,7 +69,6 @@ export class Vis<TVisParams = VisParams> {
 
   constructor(visType: string, visState: SerializedVis<TVisParams> = {} as any) {
     this.type = this.getType(visType);
-    // @ts-expect-error upgrade typescript v4.9.5
     this.params = this.getParams(visState.params);
     this.uiState = new PersistedState(visState.uiState);
     this.id = visState.id;
@@ -192,7 +191,6 @@ export class Vis<TVisParams = VisParams> {
       title: this.title,
       description: this.description,
       type: this.type.name,
-      // @ts-expect-error upgrade typescript v4.9.5
       params: cloneDeep(this.params),
       uiState: this.uiState.toJSON(),
       data: {

src/plugins/visualizations/public/vis_async.ts

@@ -9,7 +9,7 @@
 import type { SerializedVis } from './vis';
 import type { VisParams } from '../common';
 
-export const createVisAsync = async <TVisParams = VisParams>(
+export const createVisAsync = async <TVisParams extends VisParams = VisParams>(
   visType: string,
   visState: SerializedVis<TVisParams> = {} as any
 ) => {
@@ -20,7 +20,6 @@ export const createVisAsync = async <TVisParams = VisParams>(
   const { Vis } = await import('./vis');
   const vis = new Vis(visType, visState);
 
-  // @ts-expect-error upgrade typescript v4.9.5
   await vis.setState(visState);
   return vis;
 };

src/plugins/visualizations/public/vis_editors_registry.ts

@@ -6,6 +6,7 @@
  * Side Public License, v 1.
  */
 
+import { VisParams } from '../common';
 import { VisEditorConstructor } from './visualize_app/types';
 
 const DEFAULT_NAME = 'default';
@@ -17,7 +18,10 @@ export const createVisEditorsRegistry = () => {
     registerDefault: (editor: VisEditorConstructor) => {
       map.set(DEFAULT_NAME, editor);
     },
-    register: <TVisParams>(name: string, editor: VisEditorConstructor<TVisParams>) => {
+    register: <TVisParams extends VisParams>(
+      name: string,
+      editor: VisEditorConstructor<TVisParams>
+    ) => {
       if (name) {
         map.set(name, editor);
       }

src/plugins/visualizations/public/vis_schemas.ts

@@ -14,7 +14,7 @@ import {
 } from '@kbn/data-plugin/common';
 import { search } from '@kbn/data-plugin/public';
 import { Vis, VisToExpressionAstParams } from './types';
-import { SchemaConfig } from '../common/types';
+import { SchemaConfig, VisParams } from '../common/types';
 import { convertToSchemaConfig } from '../common';
 
 const { isDateHistogramBucketAggConfig } = search.aggs;
@@ -76,7 +76,7 @@ const createSchemaConfig = (
   return { ...convertToSchemaConfig(updatedAgg), accessor };
 };
 
-export const getVisSchemas = <TVisParams>(
+export const getVisSchemas = <TVisParams extends VisParams>(
   vis: Vis<TVisParams>,
   params: VisToExpressionAstParams
 ): Schemas => {

src/plugins/visualizations/public/vis_types/base_vis_type.ts

@@ -21,7 +21,7 @@ const defaultOptions: VisTypeOptions = {
   hierarchicalData: false, // we should get rid of this i guess ?
 };
 
-export class BaseVisType<TVisParams = VisParams> {
+export class BaseVisType<TVisParams extends VisParams = VisParams> {
   public readonly name;
   public readonly title;
   public readonly description;

src/plugins/visualizations/public/vis_types/types.ts

@@ -79,7 +79,7 @@ interface CustomEditorConfig {
  * A visualization type definition representing a spec of one specific type of "classical"
  * visualizations (i.e. not Lens visualizations).
  */
-export interface VisTypeDefinition<TVisParams> {
+export interface VisTypeDefinition<TVisParams extends VisParams> {
   /**
    * Visualization unique name
    */

src/plugins/visualizations/public/vis_types/types_service.ts

@@ -10,6 +10,7 @@ import { visTypeAliasRegistry, VisTypeAlias } from './vis_type_alias_registry';
 import { BaseVisType } from './base_vis_type';
 import { VisTypeDefinition } from './types';
 import { VisGroups } from './vis_groups_enum';
+import { VisParams } from '../../common';
 
 /**
  * Vis Types Service
@@ -19,7 +20,9 @@ import { VisGroups } from './vis_groups_enum';
 export class TypesService {
   private types: Record<string, BaseVisType<any>> = {};
 
-  private registerVisualization<TVisParam>(visDefinition: BaseVisType<TVisParam>) {
+  private registerVisualization<TVisParam extends VisParams>(
+    visDefinition: BaseVisType<TVisParam>
+  ) {
     if (this.types[visDefinition.name]) {
       throw new Error('type already exists!');
     }
@@ -32,7 +35,9 @@ export class TypesService {
        * registers a visualization type
        * @param config - visualization type definition
        */
-      createBaseVisualization: <TVisParams>(config: VisTypeDefinition<TVisParams>): void => {
+      createBaseVisualization: <TVisParams extends VisParams>(
+        config: VisTypeDefinition<TVisParams>
+      ): void => {
         const vis = new BaseVisType(config);
         this.registerVisualization(vis);
       },
@@ -51,7 +56,9 @@ export class TypesService {
        * returns specific visualization or undefined if not found
        * @param {string} visualization - id of visualization to return
        */
-      get: <TVisParams>(visualization: string): BaseVisType<TVisParams> | undefined => {
+      get: <TVisParams extends VisParams>(
+        visualization: string
+      ): BaseVisType<TVisParams> | undefined => {
         return this.types[visualization];
       },
       /**

src/plugins/visualizations/public/visualize_app/types.ts

@@ -137,7 +137,7 @@ export type SavedVisInstance = VisInstance;
 export type ByValueVisInstance = VisInstance;
 export type VisualizeEditorVisInstance = SavedVisInstance | ByValueVisInstance;
 
-export type VisEditorConstructor<TVisParams = VisParams> = new (
+export type VisEditorConstructor<TVisParams extends VisParams = VisParams> = new (
   element: HTMLElement,
   vis: Vis<TVisParams>,
   eventEmitter: EventEmitter,

src/plugins/visualizations/public/wizard/agg_based_selection/agg_based_selection.test.tsx

@@ -10,6 +10,7 @@ import React from 'react';
 import { mountWithIntl } from '@kbn/test-jest-helpers';
 import { TypesStart, BaseVisType, VisGroups } from '../../vis_types';
 import { AggBasedSelection } from './agg_based_selection';
+import { VisParams } from '../../../common';
 
 describe('AggBasedSelection', () => {
   const defaultVisTypeParams = {
@@ -47,7 +48,7 @@ describe('AggBasedSelection', () => {
   ] as BaseVisType[];
 
   const visTypes: TypesStart = {
-    get<T>(id: string): BaseVisType<T> {
+    get<T extends VisParams>(id: string): BaseVisType<T> {
       return _visTypes.find((vis) => vis.name === id) as unknown as BaseVisType<T>;
     },
     all: () => _visTypes,

src/plugins/visualizations/public/wizard/group_selection/group_selection.test.tsx

@@ -11,6 +11,7 @@ import { mountWithIntl } from '@kbn/test-jest-helpers';
 import { TypesStart, BaseVisType, VisGroups } from '../../vis_types';
 import { GroupSelection } from './group_selection';
 import { DocLinksStart } from '@kbn/core/public';
+import { VisParams } from '../../../common';
 
 describe('GroupSelection', () => {
   const defaultVisTypeParams = {
@@ -61,7 +62,7 @@ describe('GroupSelection', () => {
 
   const visTypesRegistry = (visTypes: BaseVisType[]): TypesStart => {
     return {
-      get<T>(id: string): BaseVisType<T> {
+      get<T extends VisParams>(id: string): BaseVisType<T> {
         return visTypes.find((vis) => vis.name === id) as unknown as BaseVisType<T>;
       },
       all: () => {