From e6fffd9d6e2a7a60a8ae482071e25a5c15d73371 Mon Sep 17 00:00:00 2001 From: Peter Date: Wed, 17 Jul 2024 23:17:11 +0200 Subject: [PATCH] remove nominatim entry from auto suggestion. we still have first result from nominatim when pressing enter --- src/sidebar/search/AddressInput.tsx | 47 ++++++++----------- .../AddressInputAutocomplete.module.css | 5 -- .../search/AddressInputAutocomplete.tsx | 28 ----------- 3 files changed, 20 insertions(+), 60 deletions(-) diff --git a/src/sidebar/search/AddressInput.tsx b/src/sidebar/search/AddressInput.tsx index dd44bfb8..7011e8ef 100644 --- a/src/sidebar/search/AddressInput.tsx +++ b/src/sidebar/search/AddressInput.tsx @@ -4,7 +4,6 @@ import { Bbox, GeocodingHit } from '@/api/graphhopper' import Autocomplete, { AutocompleteItem, GeocodingItem, - MoreResultsItem, SelectCurrentLocationItem, } from '@/sidebar/search/AddressInputAutocomplete' @@ -18,8 +17,8 @@ import { useMediaQuery } from 'react-responsive' import PopUp from '@/sidebar/search/PopUp' import PlainButton from '@/PlainButton' import { onCurrentLocationSelected } from '@/map/MapComponent' -import {toLonLat} from "ol/proj"; -import {getMap} from "@/map/map"; +import { toLonLat } from 'ol/proj' +import { getMap } from '@/map/map' export interface AddressInputProps { point: QueryPoint @@ -49,7 +48,7 @@ export default function AddressInput(props: AddressInputProps) { const [geocoder] = useState( new Geocoder(getApi(), (query, provider, hits) => { const items: AutocompleteItem[] = hits.map(hit => { - const obj = provider === 'nominatim' ? nominatimHitToItem(hit) : hitToItem(hit) + const obj = hitToItem(hit) return new GeocodingItem( obj.mainText, obj.secondText, @@ -58,15 +57,11 @@ export default function AddressInput(props: AddressInputProps) { ) }) - if (provider !== 'nominatim' && getApi().supportsGeocoding()) { - items.push(new MoreResultsItem(query)) - setAutocompleteItems(items) - } else { - // TODO autocompleteItems is empty here because query point changed from outside somehow - // const res = autocompleteItems.length > 1 ? autocompleteItems.slice(0, autocompleteItems.length - 2) : autocompleteItems - // res.concat(items) - setAutocompleteItems(items) - } + // TODO autocompleteItems is empty here because query point changed from outside somehow + // const res = autocompleteItems.length > 1 ? autocompleteItems.slice(0, autocompleteItems.length - 2) : autocompleteItems + // res.concat(items) + + setAutocompleteItems(items) }) ) // if item is selected we need to clear the autocompletion list @@ -120,17 +115,19 @@ export default function AddressInput(props: AddressInputProps) { } else if (autocompleteItems.length > 0) { const index = highlightedResult >= 0 ? highlightedResult : 0 const item = autocompleteItems[index] - if(highlightedResult < 0) { + if (highlightedResult < 0) { // by default use the first result, otherwise the highlighted one - getApi().geocode(text, 'nominatim').then(result => { - if (result && result.hits.length > 0) { - const hit: GeocodingHit = result.hits[0] - const res = nominatimHitToItem(hit) - props.onAddressSelected(res.mainText + ', ' + res.secondText, hit.point) - } else if (item instanceof GeocodingItem) { - props.onAddressSelected(item.toText(), item.point) - } - }) + getApi() + .geocode(text, 'nominatim') + .then(result => { + if (result && result.hits.length > 0) { + const hit: GeocodingHit = result.hits[0] + const res = nominatimHitToItem(hit) + props.onAddressSelected(res.mainText + ', ' + res.secondText, hit.point) + } else if (item instanceof GeocodingItem) { + props.onAddressSelected(item.toText(), item.point) + } + }) } else if (item instanceof GeocodingItem) { props.onAddressSelected(item.toText(), item.point) } @@ -231,10 +228,6 @@ export default function AddressInput(props: AddressInputProps) { } else if (item instanceof SelectCurrentLocationItem) { hideSuggestions() onCurrentLocationSelected(props.onAddressSelected) - } else if (item instanceof MoreResultsItem) { - // do not hide autocomplete items - const coordinate = textToCoordinate(item.search) - if (!coordinate) geocoder.request(item.search, biasCoord, 'nominatim') } searchInput.current!.blur() }} diff --git a/src/sidebar/search/AddressInputAutocomplete.module.css b/src/sidebar/search/AddressInputAutocomplete.module.css index 2be629c7..ffe61366 100644 --- a/src/sidebar/search/AddressInputAutocomplete.module.css +++ b/src/sidebar/search/AddressInputAutocomplete.module.css @@ -47,10 +47,6 @@ width: 100%; } -.moreResultsEntry { - padding: 0.5em 0em; -} - .geocodingEntry { display: flex; flex-direction: column; @@ -62,7 +58,6 @@ font-weight: bold; } -.moreResultsText, .secondaryText { text-overflow: ellipsis; white-space: nowrap; diff --git a/src/sidebar/search/AddressInputAutocomplete.tsx b/src/sidebar/search/AddressInputAutocomplete.tsx index 90b78bcd..c850bc46 100644 --- a/src/sidebar/search/AddressInputAutocomplete.tsx +++ b/src/sidebar/search/AddressInputAutocomplete.tsx @@ -26,14 +26,6 @@ export class GeocodingItem implements AutocompleteItem { export class SelectCurrentLocationItem implements AutocompleteItem {} -export class MoreResultsItem implements AutocompleteItem { - search: string - - constructor(search: string) { - this.search = search - } -} - export interface AutocompleteProps { items: AutocompleteItem[] highlightedItem: AutocompleteItem @@ -57,29 +49,9 @@ function mapToComponent(item: AutocompleteItem, isHighlighted: boolean, onSelect return else if (item instanceof SelectCurrentLocationItem) return - else if (item instanceof MoreResultsItem) - return else throw Error('Unsupported item type: ' + typeof item) } -export function MoreResultsEntry({ - item, - isHighlighted, - onSelect, -}: { - item: MoreResultsItem - isHighlighted: boolean - onSelect: (item: MoreResultsItem) => void -}) { - return ( - onSelect(item)}> -
- {tr('search_with_nominatim')} -
- - ) -} - export function SelectCurrentLocation({ item, isHighlighted,