diff --git a/packages/grafana-ui/src/components/Logs/LogRowContext.tsx b/packages/grafana-ui/src/components/Logs/LogRowContext.tsx index 360aff6cdf5..aa08fe7ab49 100644 --- a/packages/grafana-ui/src/components/Logs/LogRowContext.tsx +++ b/packages/grafana-ui/src/components/Logs/LogRowContext.tsx @@ -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 { css, cx } from 'emotion'; @@ -202,6 +202,19 @@ export const LogRowContext: React.FunctionComponent = ({ onLoadMoreContext, hasMoreContextRows, }) => { + const handleEscKeyDown = (e: KeyboardEvent): void => { + if (e.keyCode === 27) { + onOutsideClick(); + } + }; + + useEffect(() => { + document.addEventListener('keydown', handleEscKeyDown, false); + return () => { + document.removeEventListener('keydown', handleEscKeyDown, false); + }; + }, []); + return (