diff --git a/client/package-lock.json b/client/package-lock.json index 0b7460b3c..ff37bead2 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -1,12 +1,12 @@ { "name": "foodoasis-client", - "version": "1.0.79", + "version": "1.0.81", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "foodoasis-client", - "version": "1.0.79", + "version": "1.0.81", "license": "GPL-2.0", "dependencies": { "@craco/craco": "^7.0.0", diff --git a/client/package.json b/client/package.json index a9f68092b..76755befa 100644 --- a/client/package.json +++ b/client/package.json @@ -1,7 +1,7 @@ { "name": "foodoasis-client", "description": "React Client for Food Oasis", - "version": "1.0.81", + "version": "1.0.82", "author": "Hack for LA", "license": "GPL-2.0", "private": true, diff --git a/client/src/appReducer.js b/client/src/appReducer.js index 8b9285c53..05d96cf62 100644 --- a/client/src/appReducer.js +++ b/client/src/appReducer.js @@ -136,7 +136,6 @@ function position(state, action) { } } - export function appReducer(state, action) { return { defaultCoordinate: defaultCoordinatesReducer( @@ -166,8 +165,11 @@ export function appReducer(state, action) { action ), listPanel: listPanelReducer(state.listPanel, action), - isListPanelVisible: isListPanelVisibleReducer(state.isListPanelVisible, action), - position: position(state.position, action) + isListPanelVisible: isListPanelVisibleReducer( + state.isListPanelVisible, + action + ), + position: position(state.position, action), }; } @@ -185,7 +187,7 @@ export function getInitialState() { noKnownEligibilityRequirementsFilter: false, listPanel: true, isListPanelVisible: false, - position: '0' + position: "0", }; } @@ -283,4 +285,3 @@ export function usePosition() { const { position } = useAppState(); return position; } - diff --git a/client/src/components/FoodSeeker/SearchResults/AttributionInfo.js b/client/src/components/FoodSeeker/SearchResults/AttributionInfo.js index a32baeefb..8b7a6c642 100644 --- a/client/src/components/FoodSeeker/SearchResults/AttributionInfo.js +++ b/client/src/components/FoodSeeker/SearchResults/AttributionInfo.js @@ -109,7 +109,7 @@ const AttributionInfo = () => { fontSize: "12px", marginLeft: "3px", fontWeight: "700", - paddingRight: "5px" + paddingRight: "5px", }} href="https://apps.mapbox.com/feedback/?owner=mapbox&id=streets-v11&access_token=pk.eyJ1IjoibHVjYXNob21lciIsImEiOiJjazFqcnRjcm0wNmZ1M2JwZXg2eDFzMXd3In0.yYpkKLrFCxF-qyBfZH1a8w#/-118.2439/34.0355/11" target="_blank" diff --git a/client/src/components/FoodSeeker/SearchResults/ResultsMap/ResultsMap.js b/client/src/components/FoodSeeker/SearchResults/ResultsMap/ResultsMap.js index a62fedb83..dbfe535de 100644 --- a/client/src/components/FoodSeeker/SearchResults/ResultsMap/ResultsMap.js +++ b/client/src/components/FoodSeeker/SearchResults/ResultsMap/ResultsMap.js @@ -121,7 +121,9 @@ const ResultsMap = ( ], duration: 2000, }); - dispatch({ type: "TOGGLE_LIST_PANEL" }); + if(isMobile){ + dispatch({ type: "TOGGLE_LIST_PANEL" }); + } if (!e.features || !e.features.length) { dispatch({ type: "RESET_SELECTED_ORGANIZATION" }); } else if (stakeholders) { diff --git a/client/src/components/FoodSeeker/SearchResults/SearchResults.js b/client/src/components/FoodSeeker/SearchResults/SearchResults.js index 9340c83bf..14181cb8a 100644 --- a/client/src/components/FoodSeeker/SearchResults/SearchResults.js +++ b/client/src/components/FoodSeeker/SearchResults/SearchResults.js @@ -10,7 +10,7 @@ import { useSearchCoordinates, useStakeholders, useIsListPanelVisible, - usePosition + usePosition, } from "../../../appReducer"; import Filters from "./ResultsFilters/ResultsFilters"; import List from "./ResultsList/ResultsList"; @@ -18,7 +18,7 @@ import Map from "./ResultsMap/ResultsMap"; import { Desktop, Mobile, Tablet } from "./layouts"; const SearchResults = () => { - const isListPanelVisible = useIsListPanelVisible() + const isListPanelVisible = useIsListPanelVisible(); const mapRef = useRef(null); const { isDesktop, isTablet } = useBreakpoints(); const { selectAll, loading } = useOrganizationBests(); @@ -35,21 +35,18 @@ const SearchResults = () => { const organizationId = new URLSearchParams(location.search).get("id"); const positionDraggable = usePosition(); - useEffect(() => { - const windowHeightPercentage = window.innerHeight / 100; - const triggerHeightTop = 54 * windowHeightPercentage; - - if (positionDraggable.y === 0) { - setShowList(true); - } else if (positionDraggable.y === triggerHeightTop) { - setShowList(false); - } - else { - return - } - console.log(positionDraggable) -}, [positionDraggable]); - + useEffect(() => { + const windowHeightPercentage = window.innerHeight / 100; + const triggerHeightTop = 54 * windowHeightPercentage; + + if (positionDraggable.y === 0) { + setShowList(true); + } else if (positionDraggable.y === triggerHeightTop) { + setShowList(false); + } else { + return; + } + }, [positionDraggable]); // USE EFFECT BASED ON THIS FUNCTION IN Mobile.js // const handleStop = (e, ui) => { @@ -65,11 +62,6 @@ const SearchResults = () => { // setPosition({ x: 0, y: newY * windowHeight }); // }; - - - - - // If path starts with "widget", then set the state variable isWidget to true, // so we stay in widget mode (w/o normal App Header and Footer) useEffect(() => { @@ -150,8 +142,8 @@ const SearchResults = () => { }, [dispatch]); useEffect(() => { - setShowList(true) - }, [isListPanelVisible]) + setShowList(true); + }, [isListPanelVisible]); const filters = ( { const { setToast } = useToasterContext(); const { tenantTimeZone } = useSiteContext(); const position = usePosition(); - const [paddingBottom, setPaddingBottom] = useState(30) + const [paddingBottom, setPaddingBottom] = useState(30); - useEffect(()=> { + useEffect(() => { const windowHeight = window.innerHeight / 100; - if(position.y === (100 / window.innerHeight * 54) * windowHeight || position.y === 0 * windowHeight){ - setPaddingBottom(200) - } - else if(position.y === 17 * windowHeight){ - setPaddingBottom(300) + if ( + position.y === (100 / window.innerHeight) * 54 * windowHeight || + position.y === 0 * windowHeight + ) { + setPaddingBottom(200); + } else if (position.y === 17 * windowHeight) { + setPaddingBottom(300); } - - },[position]) + }, [position]); // USE EFFECT BASED ON THIS FUNCTION IN Mobile.js // const handleStop = (e, ui) => { @@ -117,7 +118,6 @@ const StakeholderDetails = ({ onBackClick, isDesktop }) => { // setPosition({ x: 0, y: newY * windowHeight }); // }; - useEffect(() => { if (selectedOrganization?.id) { analytics.postEvent("viewDetail", { @@ -291,7 +291,13 @@ const StakeholderDetails = ({ onBackClick, isDesktop }) => { stakeholder={selectedOrganization} setToast={setToast} /> - + { textAlign: "right", fontWeight: "bold", fontSize: "14px", - color: {md: theme.palette.common.gray, xs: "#747476"}, + color: { md: theme.palette.common.gray, xs: "#747476" }, position: "relative", cursor: "pointer", - display: {xs: 'block', md: 'none'} + display: { xs: "block", md: "none" }, })} onClick={handleBackButtonClick} > @@ -318,49 +324,57 @@ const StakeholderDetails = ({ onBackClick, isDesktop }) => { sx={(theme) => ({ textAlign: "left", fontWeight: "bold", - fontSize: {md: "18px"}, - color: {md: theme.palette.common.gray, xs: "#747476"}, + fontSize: { md: "18px" }, + color: { md: theme.palette.common.gray, xs: "#747476" }, position: "relative", cursor: "pointer", - display: {md: 'block', xs: 'none'} + display: { md: "block", xs: "none" }, })} onClick={handleBackButtonClick} > Back to Location - {isDesktop && (<> - + + ({ + textAlign: "left", + fontWeight: "bold", + fontSize: { xs: "18px" }, + color: theme.palette.common.gray, + position: "relative", + })} + > + {getCategoryText()} + + + )} + + {isDesktop && ( + ({ - textAlign: "left", - fontWeight: "bold", - fontSize: { xs: "18px" }, - color: theme.palette.common.gray, - position: "relative", + background: theme.palette.common.black, + margin: isDesktop ? "16px 35px 0 65px" : "0 1.5rem", })} - > - {getCategoryText()} - )} - - {isDesktop && ( ({ - background: theme.palette.common.black, - margin: isDesktop ? "16px 35px 0 65px" : "0 1.5rem", - })} - /> )} + /> + )} @@ -369,7 +383,7 @@ const StakeholderDetails = ({ onBackClick, isDesktop }) => { direction="column" justifyContent="flex-start" alignItems="center" - sx={{ marginTop: ".2rem", marginRight: "1rem", height: "100%" }} + sx={{ marginTop: ".2rem", marginRight: "1rem" }} > diff --git a/client/src/components/FoodSeeker/SearchResults/layouts/Mobile.js b/client/src/components/FoodSeeker/SearchResults/layouts/Mobile.js index cd0acabd2..06b548889 100644 --- a/client/src/components/FoodSeeker/SearchResults/layouts/Mobile.js +++ b/client/src/components/FoodSeeker/SearchResults/layouts/Mobile.js @@ -3,10 +3,7 @@ import { useEffect, useState } from "react"; import Draggable from "react-draggable"; import { useFilterPanel } from "appReducer"; import AttributionInfo from "../AttributionInfo"; -import { - useIsListPanelVisible, - useAppDispatch -} from '../../../../appReducer' +import { useAppDispatch } from "../../../../appReducer"; import useFeatureFlag from "hooks/useFeatureFlag"; const overlay = { @@ -29,37 +26,33 @@ const MobileLayout = ({ filters, map, list, showList }) => { y: initialY * (window.innerHeight / 100), }); - const isListPanelVisible = useIsListPanelVisible() - // disable body scroll useEffect(() => { window.scrollTo({ - top: 0 + top: 0, }); - document.body.style.overflow = "hidden" - }, []) - + document.body.style.overflow = "hidden"; + }, []); // List goes up when clicking the map useEffect(() => { setPosition({ x: 0, y: initialY * (window.innerHeight / 100), - }) - }, [isListPanelVisible]) + }); + }, [initialY]); useEffect(() => { dispatch({ type: "POSITION", position: position }); - }, [position]) - + }, [position, dispatch]); useEffect(() => { let newY; if (filterPanelOpen) { newY = 100; } else if (hasAdvancedFilterFeatureFlag) { - newY = showList ? ((100 / window.innerHeight) * 60) : 54; + newY = showList ? (100 / window.innerHeight) * 60 : 54; } else { newY = showList ? 0 : 54; } @@ -90,7 +83,7 @@ const MobileLayout = ({ filters, map, list, showList }) => { display: "flex", flexDirection: "column", position: "relative", - overflow: 'hidden' + overflow: "hidden", }} > {map} @@ -170,9 +163,13 @@ const MobileLayout = ({ filters, map, list, showList }) => {
- +
diff --git a/client/src/services/feature-service.js b/client/src/services/feature-service.js index 6730b1b57..736d72c43 100644 --- a/client/src/services/feature-service.js +++ b/client/src/services/feature-service.js @@ -1,6 +1,6 @@ import axios from "axios"; -const baseUrl = "api/features"; +const baseUrl = "/api/features"; export const getAllFeatures = async () => { try { diff --git a/package-lock.json b/package-lock.json index 086aaf8c3..eaa23a0f9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2651,12 +2651,12 @@ } }, "node_modules/braces": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", - "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz", + "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==", "dev": true, "dependencies": { - "fill-range": "^7.0.1" + "fill-range": "^7.1.1" }, "engines": { "node": ">=8" @@ -3823,9 +3823,9 @@ } }, "node_modules/fill-range": { - "version": "7.0.1", - "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", - "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", + "version": "7.1.1", + "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz", + "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==", "dev": true, "dependencies": { "to-regex-range": "^5.0.1" @@ -14276,12 +14276,12 @@ } }, "braces": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", - "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz", + "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==", "dev": true, "requires": { - "fill-range": "^7.0.1" + "fill-range": "^7.1.1" } }, "buffer": { @@ -15184,9 +15184,9 @@ } }, "fill-range": { - "version": "7.0.1", - "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", - "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", + "version": "7.1.1", + "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz", + "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==", "dev": true, "requires": { "to-regex-range": "^5.0.1" diff --git a/server/package-lock.json b/server/package-lock.json index 70364bf9f..48b4e0855 100644 --- a/server/package-lock.json +++ b/server/package-lock.json @@ -1,12 +1,12 @@ { "name": "foodoasis-web-api", - "version": "1.0.79", + "version": "1.0.81", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "foodoasis-web-api", - "version": "1.0.79", + "version": "1.0.81", "license": "GPL-2.0", "dependencies": { "@aws-sdk/client-location": "^3.499.0", @@ -5250,11 +5250,11 @@ } }, "node_modules/braces": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", - "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz", + "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==", "dependencies": { - "fill-range": "^7.0.1" + "fill-range": "^7.1.1" }, "engines": { "node": ">=8" @@ -7318,9 +7318,9 @@ } }, "node_modules/fill-range": { - "version": "7.0.1", - "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", - "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", + "version": "7.1.1", + "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz", + "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==", "dependencies": { "to-regex-range": "^5.0.1" }, diff --git a/server/package.json b/server/package.json index 12707027e..910808269 100644 --- a/server/package.json +++ b/server/package.json @@ -1,6 +1,6 @@ { "name": "foodoasis-web-api", - "version": "1.0.81", + "version": "1.0.82", "author": "Hack for LA", "description": "Web API Server for Food Oasis", "main": "server.js",