diff --git a/invokeai/frontend/web/src/features/gallery/components/ImageGrid/GallerySearch.tsx b/invokeai/frontend/web/src/features/gallery/components/ImageGrid/GallerySearch.tsx index 3990495106..bb2fe8ff29 100644 --- a/invokeai/frontend/web/src/features/gallery/components/ImageGrid/GallerySearch.tsx +++ b/invokeai/frontend/web/src/features/gallery/components/ImageGrid/GallerySearch.tsx @@ -1,7 +1,7 @@ import { IconButton, Input, InputGroup, InputRightElement, Spinner } from '@invoke-ai/ui-library'; import { useAppSelector } from 'app/store/storeHooks'; import { selectListImagesQueryArgs } from 'features/gallery/store/gallerySelectors'; -import type { ChangeEvent } from 'react'; +import type { ChangeEvent, KeyboardEvent } from 'react'; import { useCallback } from 'react'; import { useTranslation } from 'react-i18next'; import { PiXBold } from 'react-icons/pi'; @@ -27,6 +27,16 @@ export const GallerySearch = ({ searchTerm, onChangeSearchTerm, onResetSearchTer [onChangeSearchTerm] ); + const handleKeydown = useCallback( + (e: KeyboardEvent) => { + // exit search mode on escape + if (e.key === 'Escape') { + onResetSearchTerm(); + } + }, + [onResetSearchTerm] + ); + return ( {isPending && (