From 655862d95924205912444095e0f9ff2646da6de6 Mon Sep 17 00:00:00 2001 From: eireland Date: Wed, 31 Jan 2024 15:04:53 -0800 Subject: [PATCH 1/2] Moves showMapButton to app state instead of just render state --- src/components/App.tsx | 1 + src/components/location-picker.tsx | 7 +++---- src/types.ts | 1 + 3 files changed, 5 insertions(+), 4 deletions(-) diff --git a/src/components/App.tsx b/src/components/App.tsx index cb16fa6..71d54af 100755 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -60,6 +60,7 @@ export const App = () => { draft.zoomMap = newState.zoomMap; draft.frequencies = newState.frequencies; draft.didUserSelectDate = newState.didUserSelectDate; + draft.showMapButton = newState.showMapButton; draft.isMapOpen = newState.isMapOpen; const startDateStr = newState.startDate; diff --git a/src/components/location-picker.tsx b/src/components/location-picker.tsx index e85dfa0..eb42618 100644 --- a/src/components/location-picker.tsx +++ b/src/components/location-picker.tsx @@ -14,8 +14,7 @@ import "./location-picker.scss"; export const LocationPicker = () => { const {state, setState} = useStateContext(); - const {units, location, weatherStation, weatherStationDistance, startDate, endDate} = state; - const [showMapButton, setShowMapButton] = useState(false); + const {units, location, weatherStation, weatherStationDistance, startDate, endDate, showMapButton} = state; const [isEditing, setIsEditing] = useState(false); const [locationPossibilities, setLocationPossibilities] = useState([]); const [showSelectionList, setShowSelectionList] = useState(false); @@ -137,10 +136,10 @@ export const LocationPicker = () => { const placeNameSelected = (place: IPlace | undefined) => { setState(draft => { draft.location = place; + draft.showMapButton = true; }); setShowSelectionList(false); setIsEditing(false); - setShowMapButton(true); setLocationPossibilities([]); setHoveredIndex(null); setArrowedIndex(-1); @@ -273,8 +272,8 @@ export const LocationPicker = () => { geoLocSearch(lat, long).then((currPosName) => { setState(draft => { draft.location = {name: currPosName, latitude: lat, longitude: long}; + draft.showMapButton = true; }); - setShowMapButton(true); setIsEditing(false); setShowSelectionList(false); }); diff --git a/src/types.ts b/src/types.ts index d6b5b84..3510a60 100644 --- a/src/types.ts +++ b/src/types.ts @@ -124,6 +124,7 @@ export interface IState { didUserSelectDate: boolean; isMapOpen: boolean; zoomMap: boolean; + showMapButton?: boolean; } export const unitMap: UnitMap = { From 956dee07c575a9c5666950538d7d6c4981400cb9 Mon Sep 17 00:00:00 2001 From: eireland Date: Wed, 31 Jan 2024 15:19:43 -0800 Subject: [PATCH 2/2] Removes saving showMapButton state from app state and instead just detect whether a location has been selected. --- src/components/App.tsx | 1 - src/components/location-picker.tsx | 13 ++++++++++--- src/types.ts | 1 - 3 files changed, 10 insertions(+), 5 deletions(-) diff --git a/src/components/App.tsx b/src/components/App.tsx index 71d54af..cb16fa6 100755 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -60,7 +60,6 @@ export const App = () => { draft.zoomMap = newState.zoomMap; draft.frequencies = newState.frequencies; draft.didUserSelectDate = newState.didUserSelectDate; - draft.showMapButton = newState.showMapButton; draft.isMapOpen = newState.isMapOpen; const startDateStr = newState.startDate; diff --git a/src/components/location-picker.tsx b/src/components/location-picker.tsx index eb42618..6f1e028 100644 --- a/src/components/location-picker.tsx +++ b/src/components/location-picker.tsx @@ -14,7 +14,8 @@ import "./location-picker.scss"; export const LocationPicker = () => { const {state, setState} = useStateContext(); - const {units, location, weatherStation, weatherStationDistance, startDate, endDate, showMapButton} = state; + const {units, location, weatherStation, weatherStationDistance, startDate, endDate} = state; + const [showMapButton, setShowMapButton] = useState(false); const [isEditing, setIsEditing] = useState(false); const [locationPossibilities, setLocationPossibilities] = useState([]); const [showSelectionList, setShowSelectionList] = useState(false); @@ -67,6 +68,12 @@ export const LocationPicker = () => { } }, [isEditing]); + useEffect(() => { + if (location) { + setShowMapButton(true); + } + }, [location]); + useEffect(() => { const _startDate = startDate ? startDate : new Date( -5364662060); // 1/1/1750 const _endDate = endDate ? endDate : new Date(Date.now()); @@ -136,10 +143,10 @@ export const LocationPicker = () => { const placeNameSelected = (place: IPlace | undefined) => { setState(draft => { draft.location = place; - draft.showMapButton = true; }); setShowSelectionList(false); setIsEditing(false); + setShowMapButton(true); setLocationPossibilities([]); setHoveredIndex(null); setArrowedIndex(-1); @@ -272,8 +279,8 @@ export const LocationPicker = () => { geoLocSearch(lat, long).then((currPosName) => { setState(draft => { draft.location = {name: currPosName, latitude: lat, longitude: long}; - draft.showMapButton = true; }); + setShowMapButton(true); setIsEditing(false); setShowSelectionList(false); }); diff --git a/src/types.ts b/src/types.ts index 3510a60..d6b5b84 100644 --- a/src/types.ts +++ b/src/types.ts @@ -124,7 +124,6 @@ export interface IState { didUserSelectDate: boolean; isMapOpen: boolean; zoomMap: boolean; - showMapButton?: boolean; } export const unitMap: UnitMap = {