From 7c6dd6935612ca40c503af73af41446dca1e1605 Mon Sep 17 00:00:00 2001 From: Tiago Gomes Date: Mon, 14 Feb 2022 18:31:35 +0000 Subject: [PATCH] Remove: unnecessary variables --- src/actions/searchOffersActions.js | 6 --- .../HomePage/SearchArea/SearchArea.js | 23 ++++----- .../OfferItemsContainer.js | 9 ++-- .../SearchResultsWidget/SearchResultsUtils.js | 4 ++ .../SearchResultsWidget}/useLoadMoreOffers.js | 48 ++++++++----------- src/reducers/searchOffersReducer.js | 6 --- 6 files changed, 40 insertions(+), 56 deletions(-) create mode 100644 src/components/HomePage/SearchResultsArea/SearchResultsWidget/SearchResultsUtils.js rename src/{hooks => components/HomePage/SearchResultsArea/SearchResultsWidget}/useLoadMoreOffers.js (70%) diff --git a/src/actions/searchOffersActions.js b/src/actions/searchOffersActions.js index 041557aff..10e839aea 100644 --- a/src/actions/searchOffersActions.js +++ b/src/actions/searchOffersActions.js @@ -1,7 +1,6 @@ import { INITIAL_JOB_TYPE, INITIAL_JOB_DURATION, INITIAL_ERROR } from "../reducers/searchOffersReducer"; export const OfferSearchTypes = Object.freeze({ - SET_SUBMIT_NUMBER: "SET_SUBMIT_NUMBER", SET_SEARCH_VALUE: "SET_SEARCH_VALUE", SET_JOB_DURATION: "SET_JOB_DURATION", SET_JOB_TYPE: "SET_JOB_TYPE", @@ -17,11 +16,6 @@ export const OfferSearchTypes = Object.freeze({ ADMIN_ENABLE_OFFER: "ADMIN_ENABLE_OFFER", }); -export const setSubmitNumber = (submitNumber) => ({ - type: OfferSearchTypes.SET_SUBMIT_NUMBER, - submitNumber, -}); - export const setLoadingOffers = (loading) => ({ type: OfferSearchTypes.SET_OFFERS_LOADING, loading, diff --git a/src/components/HomePage/SearchArea/SearchArea.js b/src/components/HomePage/SearchArea/SearchArea.js index 06b311550..4800ceec7 100644 --- a/src/components/HomePage/SearchArea/SearchArea.js +++ b/src/components/HomePage/SearchArea/SearchArea.js @@ -11,9 +11,9 @@ import { setFields, setShowJobDurationSlider, setTechs, - setSubmitNumber, } from "../../../actions/searchOffersActions"; import { INITIAL_JOB_TYPE, INITIAL_JOB_DURATION } from "../../../reducers/searchOffersReducer"; +import { SearchResultsConstants } from "../SearchResultsArea/SearchResultsWidget/SearchResultsUtils"; import { Paper } from "@material-ui/core"; import SearchBar from "./SearchBar"; @@ -33,7 +33,6 @@ export const AdvancedSearchController = ({ enableAdvancedSearchDefault, showJobDurationSlider, setShowJobDurationSlider, jobMinDuration, jobMaxDuration, setJobDuration, jobType, setJobType, fields, setFields, technologies, setTechs, resetAdvancedSearchFields, onSubmit, searchValue, setSearchValue, searchOffers, onMobileClose, - submitNumber, setSubmitNumber, }) => { const advancedSearchProps = useAdvancedSearch({ @@ -54,12 +53,18 @@ export const AdvancedSearchController = ({ const submitForm = useCallback((e) => { if (e) e.preventDefault(); - searchOffers({ value: searchValue, jobMinDuration, jobMaxDuration, jobType, fields, technologies }); - setSubmitNumber(submitNumber + 1); - + searchOffers({ + value: searchValue, + jobMinDuration, + jobMaxDuration, + jobType, + fields, + technologies, + limit: SearchResultsConstants.initialLimit, + }); if (onSubmit) onSubmit(); - }, [fields, jobMaxDuration, jobMinDuration, jobType, onSubmit, searchOffers, searchValue, setSubmitNumber, submitNumber, technologies]); + }, [fields, jobMaxDuration, jobMinDuration, jobType, onSubmit, searchOffers, searchValue, technologies]); return { ...advancedSearchProps, @@ -76,7 +81,7 @@ export const AdvancedSearchController = ({ }; }; -export const SearchArea = ({ onSubmit, searchOffers, searchValue, submitNumber, setSubmitNumber, +export const SearchArea = ({ onSubmit, searchOffers, searchValue, jobMinDuration = INITIAL_JOB_DURATION, jobMaxDuration = INITIAL_JOB_DURATION + 1, jobType = INITIAL_JOB_TYPE, fields, technologies, showJobDurationSlider, setShowJobDurationSlider, advanced: enableAdvancedSearchDefault = false, setSearchValue, setJobDuration, setJobType, setFields, setTechs, resetAdvancedSearchFields, onMobileClose }) => { @@ -95,7 +100,6 @@ export const SearchArea = ({ onSubmit, searchOffers, searchValue, submitNumber, enableAdvancedSearchDefault, showJobDurationSlider, setShowJobDurationSlider, jobMinDuration, jobMaxDuration, setJobDuration, jobType, setJobType, fields, setFields, technologies, setTechs, resetAdvancedSearchFields, onSubmit, searchValue, setSearchValue, searchOffers, onMobileClose, - submitNumber, setSubmitNumber, }, AdvancedSearchControllerContext ); @@ -144,7 +148,6 @@ SearchArea.propTypes = { jobMinDuration: PropTypes.number, jobMaxDuration: PropTypes.number, jobType: PropTypes.string, - setSubmitNumber: PropTypes.func, setSearchValue: PropTypes.func.isRequired, setJobDuration: PropTypes.func.isRequired, setJobType: PropTypes.func.isRequired, @@ -160,7 +163,6 @@ SearchArea.propTypes = { }; export const mapStateToProps = ({ offerSearch }) => ({ - submitNumber: offerSearch.submitNumber, searchValue: offerSearch.searchValue, jobType: offerSearch.jobType, jobMinDuration: offerSearch.jobDuration[0], @@ -172,7 +174,6 @@ export const mapStateToProps = ({ offerSearch }) => ({ export const mapDispatchToProps = (dispatch) => ({ searchOffers: (filters) => dispatch(searchOffers(filters)), - setSubmitNumber: (submitNumber) => dispatch((setSubmitNumber(submitNumber))), setSearchValue: (value) => dispatch(setSearchValue(value)), setJobDuration: (_, value) => dispatch(setJobDuration(...value)), setJobType: (e) => dispatch(setJobType(e.target.value)), diff --git a/src/components/HomePage/SearchResultsArea/SearchResultsWidget/OfferItemsContainer.js b/src/components/HomePage/SearchResultsArea/SearchResultsWidget/OfferItemsContainer.js index a25201993..6055a2858 100644 --- a/src/components/HomePage/SearchResultsArea/SearchResultsWidget/OfferItemsContainer.js +++ b/src/components/HomePage/SearchResultsArea/SearchResultsWidget/OfferItemsContainer.js @@ -8,9 +8,10 @@ import useSearchResultsWidgetStyles from "./searchResultsWidgetStyles"; import { Tune } from "@material-ui/icons"; import clsx from "clsx"; import LoadingOfferItem from "./LoadingOfferItem"; -import useLoadMoreOffers from "../../../../hooks/useLoadMoreOffers"; +import useLoadMoreOffers from "./useLoadMoreOffers"; import { connect } from "react-redux"; import { addSnackbar } from "../../../../actions/notificationActions"; +import { SearchResultsConstants } from "./SearchResultsUtils"; const useAdvancedSearchButtonStyles = makeStyles((theme) => ({ root: { @@ -71,10 +72,6 @@ const OfferItemsContainer = ({ if (node) setLastOfferNode(node); }, []); - useEffect(() => { - setOffset(offers?.length); - }, [offers]); - useEffect(() => { if (loading || infiniteScrollLoading) { @@ -93,7 +90,7 @@ const OfferItemsContainer = ({ if (observer.current) observer.current.disconnect(); observer.current = new IntersectionObserver((entries) => { if (entries[0].isIntersecting && hasMore) { - setOffset((previousOffset) => previousOffset + 5); + setOffset((previousOffset) => previousOffset + SearchResultsConstants.fetchNewOffersLimit); setFetchMoreOffers(true); } else { setFetchMoreOffers(false); diff --git a/src/components/HomePage/SearchResultsArea/SearchResultsWidget/SearchResultsUtils.js b/src/components/HomePage/SearchResultsArea/SearchResultsWidget/SearchResultsUtils.js new file mode 100644 index 000000000..c6e14036b --- /dev/null +++ b/src/components/HomePage/SearchResultsArea/SearchResultsWidget/SearchResultsUtils.js @@ -0,0 +1,4 @@ +export const SearchResultsConstants = { + initialLimit: 5, + fetchNewOffersLimit: 5, +}; diff --git a/src/hooks/useLoadMoreOffers.js b/src/components/HomePage/SearchResultsArea/SearchResultsWidget/useLoadMoreOffers.js similarity index 70% rename from src/hooks/useLoadMoreOffers.js rename to src/components/HomePage/SearchResultsArea/SearchResultsWidget/useLoadMoreOffers.js index 4baf8ce30..7cc3f1a74 100644 --- a/src/hooks/useLoadMoreOffers.js +++ b/src/components/HomePage/SearchResultsArea/SearchResultsWidget/useLoadMoreOffers.js @@ -1,13 +1,12 @@ import { useEffect, useState } from "react"; import { useSelector, useDispatch } from "react-redux"; -import { - setSearchOffers, -} from "../actions/searchOffersActions"; -import Offer from "../components/HomePage/SearchResultsArea/Offer/Offer"; -import { parseFiltersToURL } from "../utils"; -import config from "../config"; -import ErrorTypes from "../utils/ErrorTypes"; +import { setSearchOffers } from "../../../../actions/searchOffersActions"; +import Offer from "../Offer/Offer"; +import { parseFiltersToURL } from "../../../../utils"; +import config from "../../../../config"; +import ErrorTypes from "../../../../utils/ErrorTypes"; +import { SearchResultsConstants } from "./SearchResultsUtils"; const { API_HOSTNAME } = config; @@ -25,31 +24,27 @@ export default ({ offset, setOffset, fetchMoreOffers }) => { const filters = { offset, - limit: 5, + limit: SearchResultsConstants.fetchNewOffersLimit, ...offerSearch, }; - const oldOffers = useSelector((state) => state.offerSearch.offers); + const offers = useSelector((state) => state.offerSearch.offers); const initialOffersLoading = useSelector((state) => state.offerSearch.loading); - const submitNumber = useSelector((state) => state.offerSearch.submitNumber); const [hasMore, setHasMore] = useState(true); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); - const [offers, setOffers] = useState(oldOffers); const [fetchedOffsets, setFetchedOffsets] = useState([]); useEffect(() => { - setOffers(oldOffers); - }, [oldOffers]); - - useEffect(() => { - setOffset(0); - setHasMore(true); - setError(null); - setLoading(false); - setFetchedOffsets([]); - }, [setOffset, submitNumber]); + if (initialOffersLoading) { + setOffset(0); + setHasMore(true); + setError(null); + setLoading(false); + setFetchedOffsets([]); + } + }, [setOffset, initialOffersLoading]); useEffect(() => { @@ -72,17 +67,16 @@ export default ({ offset, setOffset, fetchMoreOffers }) => { } const offersData = await res.json(); - const oldOfferIds = [...oldOffers.map((oldOffer) => oldOffer._id)]; - const newOffers = [...oldOffers]; + const offerIds = [...offers.map((offer) => offer._id)]; + const newOffers = [...offers]; offersData.forEach((offerData) => { - if (!oldOfferIds.includes(offerData._id)) + if (!offerIds.includes(offerData._id)) newOffers.push(new Offer(offerData)); }); setHasMore(offersData.length > 0); dispatch(setSearchOffers(newOffers)); - setOffers(newOffers); setLoading(false); setError(null); @@ -106,8 +100,8 @@ export default ({ offset, setOffset, fetchMoreOffers }) => { } }, [ - dispatch, fetchMoreOffers, filters, oldOffers, initialOffersLoading, offset, - fetchedOffsets, submitNumber, hasMore, loading, offers, + dispatch, fetchMoreOffers, filters, initialOffersLoading, + fetchedOffsets, loading, offers, ]); return { offers, hasMore, loading, error }; diff --git a/src/reducers/searchOffersReducer.js b/src/reducers/searchOffersReducer.js index 0ebbad8ec..8a4becf71 100644 --- a/src/reducers/searchOffersReducer.js +++ b/src/reducers/searchOffersReducer.js @@ -8,7 +8,6 @@ export const JOB_MIN_DURATION = 1; export const JOB_MAX_DURATION = 12; const initialState = { - submitNumber: 0, searchValue: "", jobType: INITIAL_JOB_TYPE, filterJobDuration: false, @@ -23,11 +22,6 @@ const initialState = { export default (state = initialState, action) => { switch (action.type) { - case OfferSearchTypes.SET_SUBMIT_NUMBER: - return { - ...state, - submitNumber: action.submitNumber, - }; case OfferSearchTypes.SET_OFFERS_SEARCH_RESULT: return { ...state,