[lens] Fix usage of EUI after typescript upgrade (#45404)

* [lens] Fix usage of EUI after typescript upgrade * Use local fix instead of workaround
elastic · Sep 11, 2019 · 234ffb6 · 234ffb6
1 parent 44dcc7e
commit 234ffb6
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 7 deletions.
diff --git a/x-pack/legacy/plugins/lens/public/editor_frame_plugin/editor_frame/suggestion_panel.tsx b/x-pack/legacy/plugins/lens/public/editor_frame_plugin/editor_frame/suggestion_panel.tsx
@@ -18,6 +18,10 @@ import { debouncedComponent } from '../../debounced_component';
 
 const MAX_SUGGESTIONS_DISPLAYED = 5;
 
+// TODO: Remove this <any> when upstream fix is merged https://github.com/elastic/eui/issues/2329
+// eslint-disable-next-line
+const EuiPanelFixed = EuiPanel as React.ComponentType<any>;
+
 export interface SuggestionPanelProps {
   activeDatasourceId: string | null;
   datasourceMap: Record<string, Datasource>;
@@ -55,15 +59,17 @@ const SuggestionPreview = ({
     setExpressionError(false);
   }, [previewExpression]);
 
+  const clickHandler = () => {
+    switchToSuggestion(frame, dispatch, suggestion);
+  };
+
   return (
     <EuiToolTip content={suggestion.title}>
-      <EuiPanel
+      <EuiPanelFixed
         className="lnsSuggestionPanel__button"
         paddingSize="none"
         data-test-subj="lnsSuggestion"
-        onClick={() => {
-          switchToSuggestion(frame, dispatch, suggestion);
-        }}
+        onClick={clickHandler}
       >
         {expressionError ? (
           <div className="lnsSidebar__suggestionIcon">
@@ -94,7 +100,7 @@ const SuggestionPreview = ({
             <EuiIcon size="xxl" type={suggestion.previewIcon} />
           </div>
         )}
-      </EuiPanel>
+      </EuiPanelFixed>
     </EuiToolTip>
   );
 };

diff --git a/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_config_panel.test.tsx b/x-pack/legacy/plugins/lens/public/xy_visualization_plugin/xy_config_panel.test.tsx
@@ -118,15 +118,15 @@ describe('XYConfigPanel', () => {
       .first()
       .prop('options') as EuiButtonGroupProps['options'];
 
-    expect(options.map(({ id }) => id)).toEqual([
+    expect(options!.map(({ id }) => id)).toEqual([
       'bar',
       'bar_stacked',
       'line',
       'area',
       'area_stacked',
     ]);
 
-    expect(options.filter(({ isDisabled }) => isDisabled).map(({ id }) => id)).toEqual([]);
+    expect(options!.filter(({ isDisabled }) => isDisabled).map(({ id }) => id)).toEqual([]);
   });
 
   test('the x dimension panel accepts only bucketed operations', () => {