diff --git a/src/components/Common/SearchByMultipleFields.tsx b/src/components/Common/SearchByMultipleFields.tsx index 242266ae23e..7cd3550b3ba 100644 --- a/src/components/Common/SearchByMultipleFields.tsx +++ b/src/components/Common/SearchByMultipleFields.tsx @@ -47,6 +47,7 @@ interface SearchByMultipleFieldsProps { clearSearch?: { value: boolean; params?: string[] }; enableOptionButtons?: boolean; onFieldChange?: (options: SearchOption) => void; + autoFocus?: boolean; } const KeyboardShortcutHint = ({ open }: { open: boolean }) => { @@ -90,6 +91,7 @@ const SearchByMultipleFields: React.FC = ({ clearSearch, onFieldChange, enableOptionButtons = true, + autoFocus = false, }) => { const { t } = useTranslation(); const [selectedOptionIndex, setSelectedOptionIndex] = @@ -175,12 +177,6 @@ const SearchByMultipleFields: React.FC = ({ return () => document.removeEventListener("keydown", handleKeyDown); }, [focusedIndex, open, handleOptionChange, options]); - useEffect(() => { - if (inputRef.current) { - inputRef.current.focus(); - } - }, [selectedOptionIndex]); - useEffect(() => { if (selectedOption.value !== searchValue) { onSearch(selectedOption.key, searchValue); @@ -224,6 +220,12 @@ const SearchByMultipleFields: React.FC = ({ } }, [selectedOption, searchValue, t, inputClassName, open]); + useEffect(() => { + if (autoFocus) { + inputRef.current?.focus(); + } + }, [autoFocus, open, selectedOptionIndex]); + return (
diff --git a/src/pages/Encounters/EncounterList.tsx b/src/pages/Encounters/EncounterList.tsx index 9e371ae44de..9af50a0ebca 100644 --- a/src/pages/Encounters/EncounterList.tsx +++ b/src/pages/Encounters/EncounterList.tsx @@ -261,6 +261,7 @@ export function EncounterList({ onFieldChange={handleFieldChange} onSearch={handleSearch} className="w-full border-none shadow-none" + autoFocus />