diff --git a/src/ReportManager/index.js b/src/ReportManager/index.js index 3f803bfdd..d0a4e77f0 100644 --- a/src/ReportManager/index.js +++ b/src/ReportManager/index.js @@ -17,12 +17,20 @@ import useNavigate from '../hooks/useNavigate'; import { uuid } from '../utils/string'; import DelayedUnmount from '../DelayedUnmount'; +import LoadingOverlay from '../LoadingOverlay'; import ReportDetailView from './ReportDetailView'; import styles from './styles.module.scss'; const ADDED_REPORT_TRANSITION_EFFECT_TIME = 600; +const shouldFetchEventDetails = (eventId, eventStore) => + !eventStore[eventId] + || !eventStore[eventId].event_details + || !eventStore[eventId].files + || !eventStore[eventId].notes + || !eventStore[eventId].updates; + const ReportManager = ({ onReportBeingAdded }) => { const dispatch = useDispatch(); const location = useLocation(); @@ -90,10 +98,10 @@ const ReportManager = ({ onReportBeingAdded }) => { }, [onCancelAddedReport]); useEffect(() => { - if (isNewReport || eventStore[reportId]) { + if (isNewReport) { setIsLoadingReport(false); } - }, [eventStore, isNewReport, reportId]); + }, [isNewReport]); useEffect(() => { if (isNewReport) { @@ -109,7 +117,7 @@ const ReportManager = ({ onReportBeingAdded }) => { }, [isNewReport, location.pathname, location.search, location.state, navigate, newReportTemporalId, reportType]); useEffect(() => { - if (!isNewReport && !eventStore[reportId]) { + if (!isNewReport && shouldFetchEventDetails(reportId, eventStore)) { setIsLoadingReport(true); dispatch(fetchEvent(reportId)) .then(() => setIsLoadingReport(false)) @@ -118,7 +126,7 @@ const ReportManager = ({ onReportBeingAdded }) => { }, [dispatch, eventStore, isNewReport, navigate, reportId]); return - {shouldRenderReportDetailView && { onAddReport={onAddReport} reportData={reportData} reportId={reportId} - />} + /> : } { }); }); - test('fetches the event data if there is an id specified in the URL', async () => { + test('fetches the event data if there is an id specified in the URL and the event is not in the store', async () => { useLocationMock = jest.fn((() => ({ pathname: '/events/123' }))); useLocation.mockImplementation(useLocationMock); @@ -138,6 +138,23 @@ describe('ReportManager', () => { }); }); + test('fetches the event data if there is an id specified in the URL and the event is in the store but is missing properties', async () => { + useLocationMock = jest.fn((() => ({ pathname: '/events/123' }))); + useLocation.mockImplementation(useLocationMock); + + store.data.eventStore = { + 123: { + ...eventWithPoint, + updates: undefined, + }, + }; + renderReportManager(store); + + await waitFor(() => { + expect(capturedRequestURLs.find((item) => item.includes(`${EVENT_API_URL}123`))).toBeDefined(); + }); + }); + test('does not fetch the event data if the id is "new"', async () => { useLocationMock = jest.fn((() => ({ pathname: '/events/new' }))); useLocation.mockImplementation(useLocationMock); @@ -150,7 +167,7 @@ describe('ReportManager', () => { }); }); - test('does not fetch the event data if it is in the event store already', async () => { + test('does not fetch the event data if it is in the event store already and complete', async () => { useLocationMock = jest.fn((() => ({ pathname: '/events/123' }))); useLocation.mockImplementation(useLocationMock); diff --git a/src/SideBar/useReportsFeed/index.js b/src/SideBar/useReportsFeed/index.js index 13620e67a..8b636102c 100644 --- a/src/SideBar/useReportsFeed/index.js +++ b/src/SideBar/useReportsFeed/index.js @@ -28,10 +28,17 @@ const useReportsFeed = () => { return isEqual(restEventFilter, INITIAL_FILTER_STATE); }, [eventFilter]); - const eventParams = useRef(calcEventFilterForRequest( - { params: { exclude_contained: shouldExcludeContained }, format: 'object' }, - feedSort - )); + const eventParams = useRef(calcEventFilterForRequest({ + params: { + exclude_contained: shouldExcludeContained, + include_details: false, + include_files: false, + include_notes: false, + include_updates: false, + page_size: 25, + }, + format: 'object', + }, feedSort)); const geoResrictedUserLocationCoords = useMemo( () => userIsGeoPermRestricted && userLocationCoords, @@ -61,7 +68,13 @@ const useReportsFeed = () => { }, [geoResrictedUserLocationCoords, loadFeedEvents]); useEffect(() => { - const params = {}; + const params = { + include_details: false, + include_files: false, + include_notes: false, + include_updates: false, + page_size: 25, + }; if (shouldExcludeContained) { params.exclude_contained = true; }