diff --git a/source/frontend/src/components/common/mapFSM/MapStateMachineContext.tsx b/source/frontend/src/components/common/mapFSM/MapStateMachineContext.tsx index f80619568b..4af97f3df4 100644 --- a/source/frontend/src/components/common/mapFSM/MapStateMachineContext.tsx +++ b/source/frontend/src/components/common/mapFSM/MapStateMachineContext.tsx @@ -115,7 +115,9 @@ export const MapStateMachineProvider: React.FC> const geoFilter = getQueryParams(searchCriteria); - if (geoFilter?.latitude && geoFilter?.longitude) { + if (geoFilter?.PID || geoFilter?.PID_PADDED || geoFilter?.PIN) { + return mapSearch.searchMany(geoFilter); + } else if (geoFilter?.latitude && geoFilter?.longitude) { const geoLat = Number(geoFilter.latitude); const geoLng = Number(geoFilter.longitude); return mapSearch.searchOneLocation(geoLat, geoLng); @@ -319,6 +321,7 @@ const getQueryParams = (filter: IPropertyFilter): IGeoSearchParams => { // The map will search for either identifier. const pinOrPidValue = filter.pinOrPid ? filter.pinOrPid?.replace(/-/g, '') : undefined; return { + PID_PADDED: pinOrPidValue, PID: pinOrPidValue, PIN: pinOrPidValue, STREET_ADDRESS_1: filter.address, diff --git a/source/frontend/src/constants/API.ts b/source/frontend/src/constants/API.ts index 764114aabd..969bfbcd97 100644 --- a/source/frontend/src/constants/API.ts +++ b/source/frontend/src/constants/API.ts @@ -41,6 +41,7 @@ export interface IPaginateProperties extends IPaginateParams { export interface IGeoSearchParams { STREET_ADDRESS_1?: string; PID?: string; + PID_PADDED?: string; PIN?: string; SURVEY_PLAN_NUMBER?: string; BBOX?: string; diff --git a/source/frontend/src/features/properties/filter/PropertyFilter.test.tsx b/source/frontend/src/features/properties/filter/PropertyFilter.test.tsx index a7af23c1fa..605d2cfc01 100644 --- a/source/frontend/src/features/properties/filter/PropertyFilter.test.tsx +++ b/source/frontend/src/features/properties/filter/PropertyFilter.test.tsx @@ -1,10 +1,12 @@ import { useKeycloak } from '@react-keycloak/web'; -import axios from 'axios'; +import axios, { AxiosResponse } from 'axios'; import { createMemoryHistory } from 'history'; import configureMockStore from 'redux-mock-store'; import thunk from 'redux-thunk'; import * as API from '@/constants/API'; +import { useApiGeocoder } from '@/hooks/pims-api/useApiGeocoder'; +import { IPagedItems, IProperty } from '@/interfaces'; import filterSlice from '@/store/slices/filter/filterSlice'; import { ILookupCode, lookupCodesSlice } from '@/store/slices/lookupCodes'; import { act, cleanup, fireEvent, render, waitFor } from '@/utils/test-utils'; @@ -18,6 +20,12 @@ const onFilterChange = jest.fn(); //prevent web calls from being made during tests. jest.mock('axios'); jest.mock('@react-keycloak/web'); +jest.mock('@/hooks/pims-api/useApiGeocoder'); + +const mockApiGetSitePidsApi = jest.fn>>, any>(); +(useApiGeocoder as unknown as jest.Mock>).mockReturnValue({ + getSitePidsApi: mockApiGetSitePidsApi, +}); const mockedAxios = axios as jest.Mocked; const mockKeycloak = (claims: string[]) => { diff --git a/source/frontend/src/features/properties/filter/PropertyFilter.tsx b/source/frontend/src/features/properties/filter/PropertyFilter.tsx index 063123a20b..6c6a937152 100644 --- a/source/frontend/src/features/properties/filter/PropertyFilter.tsx +++ b/source/frontend/src/features/properties/filter/PropertyFilter.tsx @@ -7,6 +7,7 @@ import styled from 'styled-components'; import { ResetButton, SearchButton } from '@/components/common/buttons'; import { Form, Input, Select } from '@/components/common/form'; import { TableSort } from '@/components/Table/TableSort'; +import { useGeocoderRepository } from '@/hooks/useGeocoderRepository'; import { useRouterFilter } from '@/hooks/useRouterFilter'; import { FilterBarSchema } from '@/utils/YupSchema'; @@ -49,6 +50,8 @@ export const PropertyFilter: React.FC { const [propertyFilter, setPropertyFilter] = useState(defaultFilter); + const { getSitePids } = useGeocoderRepository(); + useRouterFilter({ filter: propertyFilter, setFilter: filter => { @@ -111,7 +114,6 @@ export const PropertyFilter: React.FC { - setFieldValue('pinOrPid', ''); setFieldValue('latitude', null); setFieldValue('longitude', null); }} @@ -126,9 +128,14 @@ export const PropertyFilter: React.FC { - setFieldValue('latitude', val.latitude); - setFieldValue('longitude', val.longitude); + onSelectionChanged={async val => { + const geocoderPidResponse = await getSitePids(val.siteId); + if (geocoderPidResponse?.pids?.length === 1) { + setFieldValue('pinOrPid', geocoderPidResponse?.pids[0]); + } else { + setFieldValue('latitude', val.latitude); + setFieldValue('longitude', val.longitude); + } }} value={values.address} autoSetting="off" diff --git a/source/frontend/src/features/properties/list/PropertyListView.test.tsx b/source/frontend/src/features/properties/list/PropertyListView.test.tsx index 06296bef4b..b3e70c36ff 100644 --- a/source/frontend/src/features/properties/list/PropertyListView.test.tsx +++ b/source/frontend/src/features/properties/list/PropertyListView.test.tsx @@ -4,6 +4,7 @@ import { createMemoryHistory } from 'history'; import * as API from '@/constants/API'; import Claims from '@/constants/claims'; +import { useApiGeocoder } from '@/hooks/pims-api/useApiGeocoder'; import { useApiProperties } from '@/hooks/pims-api/useApiProperties'; import { IPagedItems, IProperty } from '@/interfaces'; import { mockParcel } from '@/mocks/filterData.mock'; @@ -23,6 +24,11 @@ const mockApiGetPropertiesPagedApi = jest.fn>>, any>(); +(useApiGeocoder as unknown as jest.Mock>).mockReturnValue({ + getSitePidsApi: mockApiGetSitePidsApi, +}); + const mockAxios = new MockAdapter(axios); const history = createMemoryHistory(); diff --git a/source/frontend/src/hooks/repositories/mapLayer/usePimsPropertyLayer.tsx b/source/frontend/src/hooks/repositories/mapLayer/usePimsPropertyLayer.tsx index 42974e1a4a..86c4b66f10 100644 --- a/source/frontend/src/hooks/repositories/mapLayer/usePimsPropertyLayer.tsx +++ b/source/frontend/src/hooks/repositories/mapLayer/usePimsPropertyLayer.tsx @@ -33,6 +33,7 @@ export const usePimsPropertyLayer = () => { const geoserver_params = { STREET_ADDRESS_1: params?.STREET_ADDRESS_1, PID: params?.PID, + PID_PADDED: params?.PID_PADDED, PIN: params?.PIN, SURVEY_PLAN_NUMBER: params?.SURVEY_PLAN_NUMBER, };