diff --git a/app/javascript/components/tpi/AscorDropdown.js b/app/javascript/components/tpi/AscorDropdown.js index 98559bc04..344ab0521 100644 --- a/app/javascript/components/tpi/AscorDropdown.js +++ b/app/javascript/components/tpi/AscorDropdown.js @@ -15,7 +15,7 @@ import chevronIconBlack from 'images/icon_chevron_dark/chevron_down_black-1.svg' const ESCAPE_KEY = 27; const ENTER_KEY = 13; -const AscorSelector = ({ banks, selectedOption }) => { +const AscorSelector = ({ countries, selectedOption }) => { const [searchValue, setSearchValue] = useState(''); const [isOpen, setIsOpen] = useState(false); const inputEl = useRef(null); @@ -32,18 +32,18 @@ const AscorSelector = ({ banks, selectedOption }) => { return searchResults; }; - const searchResults = useMemo(() => (searchValue ? fuse(banks) : []), [searchValue]); + const searchResults = useMemo(() => (searchValue ? fuse(countries) : []), [searchValue]); const options = useMemo(() => (searchValue - ? searchResults : banks), - [searchValue, banks]); + ? searchResults : countries), + [searchValue, countries]); const input = () => ( setSearchValue(e.target.value)} - placeholder="Type or select bank" + placeholder="Type or select country" /> ); @@ -172,7 +172,7 @@ const AscorSelector = ({ banks, selectedOption }) => { }; AscorSelector.propTypes = { - banks: PropTypes.array.isRequired, + countries: PropTypes.array.isRequired, selectedOption: PropTypes.string.isRequired }; diff --git a/app/views/tpi/ascor/index.html.erb b/app/views/tpi/ascor/index.html.erb index 781543ec4..8fe75487e 100644 --- a/app/views/tpi/ascor/index.html.erb +++ b/app/views/tpi/ascor/index.html.erb @@ -7,7 +7,7 @@
- <%= react_component("AscorDropdown", { banks: @countries_json, selectedOption: 'All countries' }) %> + <%= react_component("AscorDropdown", { countries: @countries_json, selectedOption: 'All countries' }) %>