Standardized

src/components/WeatherModal/WeatherModal.tsx

@@ -14,25 +14,27 @@ export function WeatherModal({
 	closeWeatherModal,
 	weatherModalOpened,
 }: any) {
-	const { data: personal, isFetched: personalIsFetched } = useQueryAPI({
+	const { data: personalData, isFetched: personalIsFetched } = useQueryAPI({
 		endpoint: 'api/personalData',
 	});
-	const [personalData, setPersonalData] = useState<any>([]);
 	const { data: hourly } = useWeatherAPI({
 		endpoint: 'hourly',
 		office: points?.properties.gridId,
 		x: points?.properties.gridX,
 		y: points?.properties.gridY,
 	});
-	useEffect(() => {
-		if (personal && personalIsFetched) {
-			setPersonalData(personal);
-		}
-	}, [personal, personalIsFetched]);
+	const [personal, setPersonal] = useState<any>([]);
 	const [hourlyForecast, setHourlyForecast] = useState<any>([]);
 	const [sunset, setSunset] = useState(100);
 	const { theme, isMobile, setProviderLabel, setSearchValue, setProviderURL } =
 		useCommonHooks();
+
+	useEffect(() => {
+		if (personalData && personalIsFetched) {
+			setPersonal(personalData);
+		}
+	}, [personalData, personalIsFetched]);
+
 	useEffect(() => {
 		if (hourly) {
 			setHourlyForecast(hourly.properties.periods.slice(1, 13));
@@ -51,6 +53,7 @@ export function WeatherModal({
 					);
 		}
 	}, [hourlyForecast]);
+
 	return (
 		<Modal.Root
 			fullScreen={isMobile}
@@ -84,7 +87,7 @@ export function WeatherModal({
 								Weather Forecast for{' '}
 							</Text>
 							<Text fz={18} fw={600}>
-								{personalData?.[0]?.physicalAddress}
+								{personal?.[0]?.physicalAddress}
 							</Text>
 						</Group>
 					</Modal.Title>