diff --git a/superset-frontend/src/components/OmniContainer/OmniContainer.test.tsx b/superset-frontend/src/components/OmniContainer/OmniContainer.test.tsx index 0e46993f45eba..61dd7be394a43 100644 --- a/superset-frontend/src/components/OmniContainer/OmniContainer.test.tsx +++ b/superset-frontend/src/components/OmniContainer/OmniContainer.test.tsx @@ -84,40 +84,6 @@ test('Open Omnibar with ctrl + k with featureflag enabled', () => { ).not.toBeVisible(); }); -test('Open Omnibar with ctrl + s with featureflag enabled', () => { - (isFeatureEnabled as jest.Mock).mockImplementation( - (ff: string) => ff === 'OMNIBAR', - ); - const logEvent = jest.fn(); - render( -
- -
, - ); - - expect( - screen.queryByPlaceholderText('Search all dashboards'), - ).not.toBeInTheDocument(); - - // show Omnibar - fireEvent.keyDown(screen.getByTestId('test'), { - ctrlKey: true, - code: 'KeyS', - }); - expect( - screen.queryByPlaceholderText('Search all dashboards'), - ).toBeInTheDocument(); - - // hide Omnibar - fireEvent.keyDown(screen.getByTestId('test'), { - ctrlKey: true, - code: 'KeyS', - }); - expect( - screen.queryByPlaceholderText('Search all dashboards'), - ).not.toBeVisible(); -}); - test('Open Omnibar with Command + k with featureflag enabled', () => { (isFeatureEnabled as jest.Mock).mockImplementation( (ff: string) => ff === 'OMNIBAR', @@ -152,7 +118,7 @@ test('Open Omnibar with Command + k with featureflag enabled', () => { ).not.toBeVisible(); }); -test('Open Omnibar with Command + s with featureflag enabled', () => { +test('Open Omnibar with Cmd/Ctrl-K and close with ESC', () => { (isFeatureEnabled as jest.Mock).mockImplementation( (ff: string) => ff === 'OMNIBAR', ); @@ -169,17 +135,17 @@ test('Open Omnibar with Command + s with featureflag enabled', () => { // show Omnibar fireEvent.keyDown(screen.getByTestId('test'), { - metaKey: true, - code: 'KeyS', + ctrlKey: true, + code: 'KeyK', }); expect( screen.queryByPlaceholderText('Search all dashboards'), ).toBeInTheDocument(); - // hide Omnibar + // Close Omnibar fireEvent.keyDown(screen.getByTestId('test'), { - metaKey: true, - code: 'KeyS', + key: 'Escape', + code: 'Escape', }); expect( screen.queryByPlaceholderText('Search all dashboards'), diff --git a/superset-frontend/src/components/OmniContainer/index.tsx b/superset-frontend/src/components/OmniContainer/index.tsx index 338661f7a43bd..5a18d5e4e44d0 100644 --- a/superset-frontend/src/components/OmniContainer/index.tsx +++ b/superset-frontend/src/components/OmniContainer/index.tsx @@ -31,6 +31,7 @@ const OmniModal = styled(Modal)` .ant-modal-body { padding: 0; + overflow: visible; } `; @@ -47,7 +48,16 @@ export default function OmniContainer({ logEvent }: Props) { function handleKeydown(event: KeyboardEvent) { if (!isFeatureEnabled(FeatureFlag.OMNIBAR)) return; const controlOrCommand = event.ctrlKey || event.metaKey; - const isOk = ['KeyK', 'KeyS'].includes(event.code); // valid keys "s" or "k" + const isOk = ['KeyK'].includes(event.code); + const isEsc = event.key === 'Escape'; + if (isEsc && showOmni.current) { + logEvent(LOG_ACTIONS_OMNIBAR_TRIGGERED, { + show_omni: false, + }); + showOmni.current = false; + setShowModal(false); + return; + } if (controlOrCommand && isOk) { logEvent(LOG_ACTIONS_OMNIBAR_TRIGGERED, { show_omni: !!showOmni.current,