Search for the same tract ID as already selected does not unselect it

This commit is contained in:
Carlos Felix 2024-12-10 12:09:39 -05:00 committed by Carlos Felix
commit ba2e5eca45
2 changed files with 14 additions and 7 deletions

View file

@ -393,7 +393,8 @@ const J40Map = ({location}: IJ40Interface) => {
{/* This is the first overlayed row on the map: Search and Geolocation */} {/* This is the first overlayed row on the map: Search and Geolocation */}
<div className={styles.mapHeaderRow}> <div className={styles.mapHeaderRow}>
<MapSearch goToPlace={goToPlace} mapRef={mapRef} selectFeatureOnMap={selectFeatureOnMap}/> <MapSearch goToPlace={goToPlace} mapRef={mapRef} selectFeatureOnMap={selectFeatureOnMap}
selectedFeatureId={selectedFeatureId}/>
{/* Geolocate Icon */} {/* Geolocate Icon */}
<div className={styles.geolocateBox}> <div className={styles.geolocateBox}>

View file

@ -18,6 +18,7 @@ interface IMapSearch {
goToPlace(bounds: LngLatBoundsLike):void; goToPlace(bounds: LngLatBoundsLike):void;
mapRef:RefObject<MapRef>; mapRef:RefObject<MapRef>;
selectFeatureOnMap: (feature: any) => void; selectFeatureOnMap: (feature: any) => void;
selectedFeatureId: string;
} }
interface ISearchTractRecord { interface ISearchTractRecord {
@ -26,7 +27,7 @@ interface ISearchTractRecord {
INTPTLON10: string; INTPTLON10: string;
} }
const MapSearch = ({goToPlace, mapRef, selectFeatureOnMap}:IMapSearch) => { const MapSearch = ({goToPlace, mapRef, selectFeatureOnMap, selectedFeatureId}:IMapSearch) => {
// State to hold if the search results are empty or not: // State to hold if the search results are empty or not:
const [isSearchResultsNull, setIsSearchResultsNull] = useState(false); const [isSearchResultsNull, setIsSearchResultsNull] = useState(false);
const intl = useIntl(); const intl = useIntl();
@ -82,6 +83,10 @@ const MapSearch = ({goToPlace, mapRef, selectFeatureOnMap}:IMapSearch) => {
* @param {string} tract the 11 digit tract ID as a string * @param {string} tract the 11 digit tract ID as a string
*/ */
const searchForTract = async (tract: string) => { const searchForTract = async (tract: string) => {
// We create a bounding box just to get the tract in the view box.
// The size is not important.
const BOUNDING_BOX_SIZE_DD = 0.1;
/** /**
* Wait for the map to be done loading and moving. * Wait for the map to be done loading and moving.
* @param {function()} callback the callback to run after the map is ready * @param {function()} callback the callback to run after the map is ready
@ -97,14 +102,15 @@ const MapSearch = ({goToPlace, mapRef, selectFeatureOnMap}:IMapSearch) => {
} }
}; };
setIsSearchResultsNull(true);
// We create a bounding box just to get the tract in the view box.
// The size is not important.
const BOUNDING_BOX_SIZE_DD = 0.1;
if (tractSearch) {
// Convert 10 digit tracts to 11. // Convert 10 digit tracts to 11.
const searchTerm = tract.length == 10 ? '0' + tract : tract; const searchTerm = tract.length == 10 ? '0' + tract : tract;
// If the search is for the same tract then do nothing.
if (selectedFeatureId == searchTerm) return;
setIsSearchResultsNull(true);
if (tractSearch) {
const result = tractSearch.search(searchTerm); const result = tractSearch.search(searchTerm);
if (result.length > 0) { if (result.length > 0) {
const searchTractRecord = result[0] as ISearchTractRecord; const searchTractRecord = result[0] as ISearchTractRecord;