fix: redux dev tools config (opensearch-project#465)

* redux dev tools config * upgrade typescript to 3.7 * add id to redux store name * missing exports
AMoo-Miki · Dec 2, 2019 · ea1e779 · ea1e779
1 parent f76499b
commit ea1e779
Show file tree

Hide file tree

Showing 7 changed files with 58 additions and 31 deletions.
diff --git a/packages/osd-charts/.npmignore b/packages/osd-charts/.npmignore
@@ -0,0 +1 @@
+src/mocks
diff --git a/packages/osd-charts/package.json b/packages/osd-charts/package.json
@@ -86,8 +86,8 @@
     "@types/storybook__react": "^4.0.2",
     "@types/url-parse": "^1.4.3",
     "@types/uuid": "^3.4.4",
-    "@typescript-eslint/eslint-plugin": "^2.9.0",
-    "@typescript-eslint/parser": "^2.9.0",
+    "@typescript-eslint/eslint-plugin": "^2.10.0",
+    "@typescript-eslint/parser": "^2.10.0",
     "autoprefixer": "^9.6.1",
     "babel-loader": "^8.0.5",
     "canvas": "^2.4.1",
@@ -132,7 +132,7 @@
     "ts-jest": "^24.1.0",
     "ts-loader": "^6.1.2",
     "ts-prune": "^0.3.0",
-    "typescript": "^3.6.3",
+    "typescript": "^3.7.0",
     "utility-types": "^3.9.0",
     "webpack": "^4.29.5",
     "webpack-cli": "^3.3.1",

diff --git a/packages/osd-charts/src/components/chart.tsx b/packages/osd-charts/src/components/chart.tsx
@@ -1,6 +1,11 @@
 import React, { CSSProperties, createRef } from 'react';
 import classNames from 'classnames';
 import { Provider } from 'react-redux';
+import { createStore, Store } from 'redux';
+import Konva from 'konva';
+import { Stage } from 'react-konva';
+import uuid from 'uuid';
+
 import { SpecsParser } from '../specs/specs_parser';
 import { ChartResizer } from './chart_resizer';
 import { Legend } from './legend/legend';
@@ -10,9 +15,6 @@ import { Position } from '../chart_types/xy_chart/utils/specs';
 import { ChartSize, getChartSize } from '../utils/chart_size';
 import { ChartStatus } from './chart_status';
 import { chartStoreReducer, GlobalChartState } from '../state/chart_state';
-import { createStore, Store } from 'redux';
-import uuid from 'uuid';
-import { devToolsEnhancer } from 'redux-devtools-extension';
 import { isInitialized } from '../state/selectors/is_initialized';
 import { createOnElementOutCaller } from '../chart_types/xy_chart/state/selectors/on_element_out_caller';
 import { createOnElementOverCaller } from '../chart_types/xy_chart/state/selectors/on_element_over_caller';
@@ -23,8 +25,6 @@ import { createOnBrushEndCaller } from '../chart_types/xy_chart/state/selectors/
 import { onExternalPointerEvent } from '../state/actions/events';
 import { CursorEvent } from '../specs';
 import { createOnPointerMoveCaller } from '../chart_types/xy_chart/state/selectors/on_pointer_move_caller';
-import Konva from 'konva';
-import { Stage } from 'react-konva';
 
 interface ChartProps {
   /** The type of rendered
@@ -57,17 +57,19 @@ export class Chart extends React.Component<ChartProps, ChartState> {
   private chartStore: Store<GlobalChartState>;
   private chartContainerRef: React.RefObject<HTMLDivElement>;
   private chartStageRef: React.RefObject<Stage>;
+
   constructor(props: any) {
     super(props);
     this.chartContainerRef = createRef();
     this.chartStageRef = createRef();
 
-    const storeReducer = chartStoreReducer(uuid.v4());
-    if (process.env.NODE_ENV !== 'production') {
-      this.chartStore = createStore(storeReducer, devToolsEnhancer({ trace: true }));
-    } else {
-      this.chartStore = createStore(storeReducer);
-    }
+    const id = uuid.v4();
+    const storeReducer = chartStoreReducer(id);
+    const enhancers = (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
+      ? (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({ trace: true, name: `@elastic/charts (id: ${id})` })()
+      : undefined;
+
+    this.chartStore = createStore(storeReducer, enhancers);
     this.state = {
       legendPosition: Position.Right,
     };
@@ -135,7 +137,7 @@ export class Chart extends React.Component<ChartProps, ChartState> {
     const canvasStage = stage.toCanvas({
       width,
       height,
-      callback: () => {},
+      callback: () => undefined,
     });
     // @ts-ignore
     if (canvasStage.msToBlob) {

diff --git a/packages/osd-charts/src/components/chart_resizer.tsx b/packages/osd-charts/src/components/chart_resizer.tsx
@@ -23,7 +23,7 @@ class Resizer extends React.Component<ResizerProps> {
   private containerRef: RefObject<HTMLDivElement>;
   private ro: ResizeObserver;
   private animationFrameID: number | null;
-  private onResizeDebounced: (entries: ResizeObserverEntry[]) => void = () => {};
+  private onResizeDebounced: (entries: ResizeObserverEntry[]) => void = () => undefined;
 
   constructor(props: ResizerProps) {
     super(props);

diff --git a/packages/osd-charts/src/index.ts b/packages/osd-charts/src/index.ts
@@ -20,6 +20,8 @@ export {
   AnnotationDomainType,
   AnnotationDomainTypes,
   CustomSeriesColors,
+  SeriesColorsArray,
+  SeriesColorAccessorFn,
   HistogramModeAlignment,
   HistogramModeAlignments,
   LineAnnotationDatum,

diff --git a/packages/osd-charts/src/specs/settings.tsx b/packages/osd-charts/src/specs/settings.tsx
@@ -133,8 +133,8 @@ export const DEFAULT_SETTINGS_SPEC = {
   theme: LIGHT_THEME,
 };
 
-type SpecProps = Partial<Omit<SettingsSpec, 'chartType' | 'specType' | 'id'>>;
+export type SettingsSpecProps = Partial<Omit<SettingsSpec, 'chartType' | 'specType' | 'id'>>;
 
-export const Settings: React.FunctionComponent<SpecProps> = getConnect()(
+export const Settings: React.FunctionComponent<SettingsSpecProps> = getConnect()(
   specComponentFactory<SettingsSpec, DefaultSettingsProps>(DEFAULT_SETTINGS_SPEC),
 );
diff --git a/packages/osd-charts/yarn.lock b/packages/osd-charts/yarn.lock
@@ -2635,18 +2635,27 @@
   dependencies:
     "@types/yargs-parser" "*"
 
-"@typescript-eslint/eslint-plugin@^2.9.0":
-  version "2.9.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-2.9.0.tgz#fa810282c0e45f6c2310b9c0dfcd25bff97ab7e9"
-  integrity sha512-98rfOt3NYn5Gr9wekTB8TexxN6oM8ZRvYuphPs1Atfsy419SDLYCaE30aJkRiiTCwGEY98vOhFsEVm7Zs4toQQ==
+"@typescript-eslint/eslint-plugin@^2.10.0":
+  version "2.10.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-2.10.0.tgz#c4cb103275e555e8a7e9b3d14c5951eb6d431e70"
+  integrity sha512-rT51fNLW0u3fnDGnAHVC5nu+Das+y2CpW10yqvf6/j5xbuUV3FxA3mBaIbM24CXODXjbgUznNb4Kg9XZOUxKAw==
   dependencies:
-    "@typescript-eslint/experimental-utils" "2.9.0"
+    "@typescript-eslint/experimental-utils" "2.10.0"
     eslint-utils "^1.4.3"
     functional-red-black-tree "^1.0.1"
     regexpp "^3.0.0"
     tsutils "^3.17.1"
 
-"@typescript-eslint/[email protected]", "@typescript-eslint/experimental-utils@^2.5.0":
+"@typescript-eslint/[email protected]":
+  version "2.10.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-2.10.0.tgz#8db1656cdfd3d9dcbdbf360b8274dea76f0b2c2c"
+  integrity sha512-FZhWq6hWWZBP76aZ7bkrfzTMP31CCefVIImrwP3giPLcoXocmLTmr92NLZxuIcTL4GTEOE33jQMWy9PwelL+yQ==
+  dependencies:
+    "@types/json-schema" "^7.0.3"
+    "@typescript-eslint/typescript-estree" "2.10.0"
+    eslint-scope "^5.0.0"
+
+"@typescript-eslint/experimental-utils@^2.5.0":
   version "2.9.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-2.9.0.tgz#bbe99a8d9510240c055fc4b17230dd0192ba3c7f"
   integrity sha512-0lOLFdpdJsCMqMSZT7l7W2ta0+GX8A3iefG3FovJjrX+QR8y6htFlFdU7aOVPL6pDvt6XcsOb8fxk5sq+girTw==
@@ -2655,16 +2664,29 @@
     "@typescript-eslint/typescript-estree" "2.9.0"
     eslint-scope "^5.0.0"
 
-"@typescript-eslint/parser@^2.9.0":
-  version "2.9.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-2.9.0.tgz#2e9cf438de119b143f642a3a406e1e27eb70b7cd"
-  integrity sha512-fJ+dNs3CCvEsJK2/Vg5c2ZjuQ860ySOAsodDPwBaVlrGvRN+iCNC8kUfLFL8cT49W4GSiLPa/bHiMjYXA7EhKQ==
+"@typescript-eslint/parser@^2.10.0":
+  version "2.10.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-2.10.0.tgz#24b2e48384ab6d5a6121e4c4faf8892c79657ad3"
+  integrity sha512-wQNiBokcP5ZsTuB+i4BlmVWq6o+oAhd8en2eSm/EE9m7BgZUIfEeYFd6z3S+T7bgNuloeiHA1/cevvbBDLr98g==
   dependencies:
     "@types/eslint-visitor-keys" "^1.0.0"
-    "@typescript-eslint/experimental-utils" "2.9.0"
-    "@typescript-eslint/typescript-estree" "2.9.0"
+    "@typescript-eslint/experimental-utils" "2.10.0"
+    "@typescript-eslint/typescript-estree" "2.10.0"
     eslint-visitor-keys "^1.1.0"
 
+"@typescript-eslint/[email protected]":
+  version "2.10.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-2.10.0.tgz#89cdabd5e8c774e9d590588cb42fb9afd14dcbd9"
+  integrity sha512-oOYnplddQNm/LGVkqbkAwx4TIBuuZ36cAQq9v3nFIU9FmhemHuVzAesMSXNQDdAzCa5bFgCrfD3JWhYVKlRN2g==
+  dependencies:
+    debug "^4.1.1"
+    eslint-visitor-keys "^1.1.0"
+    glob "^7.1.6"
+    is-glob "^4.0.1"
+    lodash.unescape "4.0.1"
+    semver "^6.3.0"
+    tsutils "^3.17.1"
+
 "@typescript-eslint/[email protected]":
   version "2.9.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-2.9.0.tgz#09138daf8f47d0e494ba7db9e77394e928803017"
@@ -15289,7 +15311,7 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
-typescript@^3.0.1, typescript@^3.6.3:
+typescript@^3.0.1, typescript@^3.7.0:
   version "3.7.2"
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.7.2.tgz#27e489b95fa5909445e9fef5ee48d81697ad18fb"
   integrity sha512-ml7V7JfiN2Xwvcer+XAf2csGO1bPBdRbFCkYBczNZggrBZ9c7G3riSUeJmqEU5uOtXNPMhE3n+R4FA/3YOAWOQ==