forked from elastic/kibana
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[Canvas] Expression error (elastic#103048)
* Basic setup of error plugin. * Removed not used `function` files at `error` expression. * Moved related components from canvas. * Changed imports of components. * Fixed renderer and storybook. * Fixed types errors. * Added limits. * Removed useless translations and fixed .i18nrc.json * added `done` handler call. * Added more fixes fo i18nc. * Added docs. * More fixes of i18nrc. * Fixed async functions. Written current code, based on storybookjs/storybook#7745 * Fixed one test with Expression input. After changing the way of rendering in stories, all elements are mounting and componentDidMount is involved. The previous snapshot was without mounted `monaco` editor. * Fixed storybook error. * More fixes. * removed unused translations. * Removed handlers and changed the way of handling `resize` and calling `done`. * Fixed i18n error. * Fixed storybook. * Replaced Popover with EuiPopover. * Moved `Popover` back to `canvas` * Removed `Popover` export from presentation_utils components. * Moved error_component and debug_component from presentation_util to expression_error. * Fixed translations and imports. * Moved `debug renderer` to `expression_error` plugin. * Fixed error. * Fixed lazy exports. * Fixed imports * Fixed storybook snapshot. * Removed `.i18nrc.json`. * Fixed color of `error`. * Exported concrete elements from popover. Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> # Conflicts: # packages/kbn-optimizer/limits.yml # src/plugins/expression_error/public/components/debug/debug.tsx
- Loading branch information
1 parent
1ce67c9
commit 645bc3f
Showing
59 changed files
with
538 additions
and
218 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -112,3 +112,4 @@ pageLoadAssetSize: | |
visTypePie: 35583 | ||
expressionRevealImage: 25675 | ||
cases: 144442 | ||
expressionError: 22127 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
/* | ||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
* or more contributor license agreements. Licensed under the Elastic License | ||
* 2.0 and the Server Side Public License, v 1; you may not use this file except | ||
* in compliance with, at your election, the Elastic License 2.0 or the Server | ||
* Side Public License, v 1. | ||
*/ | ||
|
||
// eslint-disable-next-line import/no-commonjs | ||
module.exports = require('@kbn/storybook').defaultConfig; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
# expressionRevealImage | ||
|
||
Expression Error plugin adds an `error` renderer to the expression plugin. The renderer will display the error image. | ||
|
||
--- | ||
|
||
## Development | ||
|
||
See the [kibana contributing guide](https://github.com/elastic/kibana/blob/master/CONTRIBUTING.md) for instructions setting up your development environment. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
/* | ||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
* or more contributor license agreements. Licensed under the Elastic License | ||
* 2.0 and the Server Side Public License, v 1; you may not use this file except | ||
* in compliance with, at your election, the Elastic License 2.0 or the Server | ||
* Side Public License, v 1. | ||
*/ | ||
export const PLUGIN_ID = 'expressionError'; | ||
export const PLUGIN_NAME = 'expressionError'; | ||
|
||
export const JSON = 'JSON'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
/* | ||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
* or more contributor license agreements. Licensed under the Elastic License | ||
* 2.0 and the Server Side Public License, v 1; you may not use this file except | ||
* in compliance with, at your election, the Elastic License 2.0 or the Server | ||
* Side Public License, v 1. | ||
*/ | ||
|
||
export * from './constants'; |
18 changes: 18 additions & 0 deletions
18
src/plugins/expression_error/common/types/expression_renderers.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
/* | ||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
* or more contributor license agreements. Licensed under the Elastic License | ||
* 2.0 and the Server Side Public License, v 1; you may not use this file except | ||
* in compliance with, at your election, the Elastic License 2.0 or the Server | ||
* Side Public License, v 1. | ||
*/ | ||
|
||
export type OriginString = 'bottom' | 'left' | 'top' | 'right'; | ||
|
||
export interface ErrorRendererConfig { | ||
error: Error; | ||
} | ||
|
||
export interface NodeDimensions { | ||
width: number; | ||
height: number; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
/* | ||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
* or more contributor license agreements. Licensed under the Elastic License | ||
* 2.0 and the Server Side Public License, v 1; you may not use this file except | ||
* in compliance with, at your election, the Elastic License 2.0 or the Server | ||
* Side Public License, v 1. | ||
*/ | ||
|
||
export * from './expression_renderers'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,13 @@ | ||
/* | ||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
* or more contributor license agreements. Licensed under the Elastic License | ||
* 2.0 and the Server Side Public License, v 1; you may not use this file except | ||
* in compliance with, at your election, the Elastic License 2.0 or the Server | ||
* Side Public License, v 1. | ||
*/ | ||
|
||
module.exports = { | ||
preset: '@kbn/test', | ||
rootDir: '../../..', | ||
roots: ['<rootDir>/src/plugins/expression_error'], | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
{ | ||
"id": "expressionError", | ||
"version": "1.0.0", | ||
"kibanaVersion": "kibana", | ||
"server": false, | ||
"ui": true, | ||
"requiredPlugins": ["expressions", "presentationUtil"], | ||
"optionalPlugins": [], | ||
"requiredBundles": [] | ||
} |
File renamed without changes.
5 changes: 3 additions & 2 deletions
5
...nents/debug/__stories__/debug.stories.tsx → ...nents/debug/__stories__/debug.stories.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
5 changes: 3 additions & 2 deletions
5
.../components/debug/__stories__/helpers.tsx → .../components/debug/__stories__/helpers.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
10 changes: 10 additions & 0 deletions
10
src/plugins/expression_error/public/components/debug/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
/* | ||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
* or more contributor license agreements. Licensed under the Elastic License | ||
* 2.0 and the Server Side Public License, v 1; you may not use this file except | ||
* in compliance with, at your election, the Elastic License 2.0 or the Server | ||
* Side Public License, v 1. | ||
*/ | ||
|
||
// eslint-disable-next-line import/no-default-export | ||
export { Debug as default } from './debug'; |
52 changes: 52 additions & 0 deletions
52
src/plugins/expression_error/public/components/debug_component.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,52 @@ | ||
/* | ||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
* or more contributor license agreements. Licensed under the Elastic License | ||
* 2.0 and the Server Side Public License, v 1; you may not use this file except | ||
* in compliance with, at your election, the Elastic License 2.0 or the Server | ||
* Side Public License, v 1. | ||
*/ | ||
|
||
import React, { useState, useEffect, useCallback } from 'react'; | ||
import { useResizeObserver } from '@elastic/eui'; | ||
import { IInterpreterRenderHandlers } from '../../../expressions'; | ||
import { withSuspense } from '../../../presentation_util/public'; | ||
import { NodeDimensions } from '../../common/types'; | ||
import { LazyDebugComponent } from '.'; | ||
|
||
const Debug = withSuspense(LazyDebugComponent); | ||
|
||
interface DebugComponentProps { | ||
onLoaded: IInterpreterRenderHandlers['done']; | ||
parentNode: HTMLElement; | ||
payload: any; | ||
} | ||
|
||
function DebugComponent({ onLoaded, parentNode, payload }: DebugComponentProps) { | ||
const parentNodeDimensions = useResizeObserver(parentNode); | ||
const [dimensions, setDimensions] = useState<NodeDimensions>({ | ||
width: parentNode.offsetWidth, | ||
height: parentNode.offsetHeight, | ||
}); | ||
|
||
const updateDebugView = useCallback(() => { | ||
setDimensions({ | ||
width: parentNode.offsetWidth, | ||
height: parentNode.offsetHeight, | ||
}); | ||
onLoaded(); | ||
}, [parentNode, onLoaded]); | ||
|
||
useEffect(() => { | ||
updateDebugView(); | ||
}, [parentNodeDimensions, updateDebugView]); | ||
|
||
return ( | ||
<div style={dimensions}> | ||
<Debug payload={payload} /> | ||
</div> | ||
); | ||
} | ||
|
||
// default export required for React.Lazy | ||
// eslint-disable-next-line import/no-default-export | ||
export { DebugComponent as default }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
10 changes: 10 additions & 0 deletions
10
src/plugins/expression_error/public/components/error/index.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
/* | ||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
* or more contributor license agreements. Licensed under the Elastic License | ||
* 2.0 and the Server Side Public License, v 1; you may not use this file except | ||
* in compliance with, at your election, the Elastic License 2.0 or the Server | ||
* Side Public License, v 1. | ||
*/ | ||
|
||
// eslint-disable-next-line import/no-default-export | ||
export { Error as default } from './error'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
67 changes: 67 additions & 0 deletions
67
src/plugins/expression_error/public/components/error_component.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,67 @@ | ||
/* | ||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
* or more contributor license agreements. Licensed under the Elastic License | ||
* 2.0 and the Server Side Public License, v 1; you may not use this file except | ||
* in compliance with, at your election, the Elastic License 2.0 or the Server | ||
* Side Public License, v 1. | ||
*/ | ||
|
||
import React, { useState, useEffect, useCallback } from 'react'; | ||
import { EuiIcon, useResizeObserver, EuiPopover } from '@elastic/eui'; | ||
import { IInterpreterRenderHandlers } from '../../../expressions'; | ||
import { withSuspense } from '../../../presentation_util/public'; | ||
import { ErrorRendererConfig } from '../../common/types'; | ||
import { LazyErrorComponent } from '.'; | ||
|
||
const Error = withSuspense(LazyErrorComponent); | ||
|
||
interface ErrorComponentProps extends ErrorRendererConfig { | ||
onLoaded: IInterpreterRenderHandlers['done']; | ||
parentNode: HTMLElement; | ||
} | ||
|
||
function ErrorComponent({ onLoaded, parentNode, error }: ErrorComponentProps) { | ||
const getButtonSize = (node: HTMLElement) => Math.min(node.clientHeight, node.clientWidth); | ||
const parentNodeDimensions = useResizeObserver(parentNode); | ||
|
||
const [buttonSize, setButtonSize] = useState<number>(getButtonSize(parentNode)); | ||
const [isPopoverOpen, setPopoverOpen] = useState<boolean>(false); | ||
|
||
const handlePopoverClick = () => setPopoverOpen(!isPopoverOpen); | ||
const closePopover = () => setPopoverOpen(false); | ||
|
||
const updateErrorView = useCallback(() => { | ||
setButtonSize(getButtonSize(parentNode)); | ||
onLoaded(); | ||
}, [parentNode, onLoaded]); | ||
|
||
useEffect(() => { | ||
updateErrorView(); | ||
}, [parentNodeDimensions, updateErrorView]); | ||
|
||
return ( | ||
<div className="canvasRenderError"> | ||
<EuiPopover | ||
closePopover={closePopover} | ||
button={ | ||
<EuiIcon | ||
className="canvasRenderError__icon" | ||
onClick={handlePopoverClick} | ||
style={{ | ||
height: buttonSize, | ||
width: buttonSize, | ||
}} | ||
type="alert" | ||
/> | ||
} | ||
isOpen={isPopoverOpen} | ||
> | ||
<Error payload={{ error }} /> | ||
</EuiPopover> | ||
</div> | ||
); | ||
} | ||
|
||
// default export required for React.Lazy | ||
// eslint-disable-next-line import/no-default-export | ||
export { ErrorComponent as default }; |
Oops, something went wrong.