From 9f7b46c6c71565d3c9a31ab301076ed3695c4585 Mon Sep 17 00:00:00 2001 From: Randi Mays <19175324+randimays@users.noreply.github.com> Date: Fri, 21 Feb 2025 16:12:14 -0600 Subject: [PATCH] Got initial dropdown population working --- .../components/search-form/autosuggest/index.jsx | 12 ++++++++---- .../search-form/location/AddressAutosuggest.jsx | 5 +++-- .../service-type/VAMCServiceAutosuggest.jsx | 1 - .../facility-locator/hooks/useServiceType.jsx | 1 + .../tests/hooks/useServiceType.unit.spec.js | 2 +- src/applications/facility-locator/types/index.js | 4 +--- 6 files changed, 14 insertions(+), 11 deletions(-) diff --git a/src/applications/facility-locator/components/search-form/autosuggest/index.jsx b/src/applications/facility-locator/components/search-form/autosuggest/index.jsx index 7b877085b2cf..c9a6175b0717 100644 --- a/src/applications/facility-locator/components/search-form/autosuggest/index.jsx +++ b/src/applications/facility-locator/components/search-form/autosuggest/index.jsx @@ -13,7 +13,6 @@ import { srClearOnBlur, srKeepOnBlur } from './StateReducer'; function Autosuggest({ // downshift props handleOnSelect, - defaultSelectedItem, initialSelectedItem = null, inputValue, itemToString = toDisplay, @@ -30,7 +29,6 @@ function Autosuggest({ downshiftInputProps, // options for the autosuggest to show options, - minCharacters = 3, // only trigger update after n=3 characters noItemsMessage = 'No results found', shouldShowNoResults = true, // showError - use the usa-input-error class to show the error @@ -44,6 +42,7 @@ function Autosuggest({ isLoading = false, loadingMessage = '', AutosuggestOptionComponent = AutosuggestOption, + showOptionsRestriction = undefined, }) { const { isOpen, @@ -60,7 +59,6 @@ function Autosuggest({ initialSelectedItem, inputId, onSelectedItemChange: handleOnSelect, - defaultSelectedItem, onInputValueChange, inputValue, isItemDisabled, @@ -72,6 +70,12 @@ function Autosuggest({ selectItem(null); }; + let shouldBeShown = isOpen; + + if (showOptionsRestriction !== undefined) { + shouldBeShown = isOpen && showOptionsRestriction; + } + return (
= minCharacters} + isShown={shouldBeShown} itemToString={itemToString} noItemsMessage={noItemsMessage} // to display when no items are found - disabled item getMenuProps={getMenuProps} diff --git a/src/applications/facility-locator/components/search-form/location/AddressAutosuggest.jsx b/src/applications/facility-locator/components/search-form/location/AddressAutosuggest.jsx index 96a27b27a96c..37edd0529552 100644 --- a/src/applications/facility-locator/components/search-form/location/AddressAutosuggest.jsx +++ b/src/applications/facility-locator/components/search-form/location/AddressAutosuggest.jsx @@ -181,11 +181,12 @@ function AddressAutosuggest({ geolocationInProgress={currentQuery.geolocationInProgress} /> )} - /* eslint-enable prettier/prettier */ - minCharacters={MIN_SEARCH_CHARS} keepDataOnBlur showDownCaret={false} shouldShowNoResults + showOptionsRestriction={ + !!inputValue && inputValue.length >= MIN_SEARCH_CHARS + } isLoading={isGeocoding} loadingMessage="Searching..." /> diff --git a/src/applications/facility-locator/components/search-form/service-type/VAMCServiceAutosuggest.jsx b/src/applications/facility-locator/components/search-form/service-type/VAMCServiceAutosuggest.jsx index 24e002117625..9057a2691cca 100644 --- a/src/applications/facility-locator/components/search-form/service-type/VAMCServiceAutosuggest.jsx +++ b/src/applications/facility-locator/components/search-form/service-type/VAMCServiceAutosuggest.jsx @@ -96,7 +96,6 @@ const VAMCServiceAutosuggest = ({ onChange }) => { return ( { if (matched.priorityMatch || matched.secondaryMatch) { return matched; } + return null; }) .filter(v => v) diff --git a/src/applications/facility-locator/tests/hooks/useServiceType.unit.spec.js b/src/applications/facility-locator/tests/hooks/useServiceType.unit.spec.js index 0534fd8c0057..05d0606cd3a2 100644 --- a/src/applications/facility-locator/tests/hooks/useServiceType.unit.spec.js +++ b/src/applications/facility-locator/tests/hooks/useServiceType.unit.spec.js @@ -5,7 +5,7 @@ import vaHealthcareServices from './test-va-healthcare-services.json'; describe('filterMatches (VAMC)', () => { describe('when matches are expected', () => { const getServiceNamesOnly = filteredServices => - filteredServices.map(service => service.hsdatum[0]); + filteredServices.map(service => service[0]); it('should return the correct match for a search term', () => { const results = filterMatches(vaHealthcareServices, 'mental', 'vamc'); diff --git a/src/applications/facility-locator/types/index.js b/src/applications/facility-locator/types/index.js index 94e0723b1f52..4084d5f8ad06 100644 --- a/src/applications/facility-locator/types/index.js +++ b/src/applications/facility-locator/types/index.js @@ -246,7 +246,6 @@ export const SearchFormTypes = { * inputRef: not required, use only if you programmatically need to focus the input or get something from it * isLoading: data is loading - to be shown in place of no results if no results is to be shown * labelSibling: optional element to render next to the label - * minCharacters: optional minimum number of characters to start an action * noItemsMessage: message to show when no items are found (an error) * showDownCaret: optional flag to show the down caret/arrow * showError: optional flag to show the error state @@ -256,9 +255,9 @@ export const SearchFormTypes = { export const AutosuggestProps = { AutosuggestOptionComponent: PropTypes.elementType, clearOnEscape: PropTypes.bool, - defaultSelectedItem: PropTypes.object, downshiftInputProps: PropTypes.object, handleOnSelect: PropTypes.func.isRequired, + initialSelectedItem: PropTypes.object, inputContainerClassName: PropTypes.string, inputError: PropTypes.element, inputId: PropTypes.string, @@ -271,7 +270,6 @@ export const AutosuggestProps = { label: PropTypes.element.isRequired, labelSibling: PropTypes.element, loadingMessage: PropTypes.string, - minCharacters: PropTypes.number, noItemsMessage: PropTypes.string, onClearClick: PropTypes.func.isRequired, onInputValueChange: PropTypes.func.isRequired,