Explore: adds an ability to exit log row context with ESC key (#24205)

* Chore: adds event listeners allowing to exit log row context with ESC key

* Chore: updates LogRows styles to prevent it from rendering context provider inappropriately

* Revert "Chore: updates LogRows styles to prevent it from rendering context provider inappropriately"

This reverts commit 59b06424c4.
This commit is contained in:
Lukas Siatka 2020-05-20 10:42:35 +02:00 committed by GitHub
parent 5a6026a8c0
commit de46dc7af0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,4 +1,4 @@
import React, { useContext, useRef, useState, useLayoutEffect } from 'react'; import React, { useContext, useRef, useState, useLayoutEffect, useEffect } from 'react';
import { LogRowModel } from '@grafana/data'; import { LogRowModel } from '@grafana/data';
import { css, cx } from 'emotion'; import { css, cx } from 'emotion';
@ -202,6 +202,19 @@ export const LogRowContext: React.FunctionComponent<LogRowContextProps> = ({
onLoadMoreContext, onLoadMoreContext,
hasMoreContextRows, hasMoreContextRows,
}) => { }) => {
const handleEscKeyDown = (e: KeyboardEvent): void => {
if (e.keyCode === 27) {
onOutsideClick();
}
};
useEffect(() => {
document.addEventListener('keydown', handleEscKeyDown, false);
return () => {
document.removeEventListener('keydown', handleEscKeyDown, false);
};
}, []);
return ( return (
<ClickOutsideWrapper onClick={onOutsideClick}> <ClickOutsideWrapper onClick={onOutsideClick}>
<div> <div>