>>93693961
>>93694018
Thanks, that was my conclusion as well, I was worrying too much about renders.
Here are my hooks anyway, I have tested useFetchWithCatching in another service hook and it works fine.
import { useFetchWithCaching } from "./useFetchWithCaching";
const API_URL = "https://api.openweathermap.org/data/2.5/weather";
const OPENWEATHER_API_KEY = import.meta.env.VITE_OPENWEATHER_API_KEY;
const buildWeatherUrl = (lat, lon) => {
return `${API_URL}?lat=${lat}&lon=${lon}&appid=${OPENWEATHER_API_KEY}&units=metric`;
};
export const useWeatherService = () => {
const { data, loading, error, fetchData } = useFetchWithCaching();
const getWeatherData = (lat, lon) => {
const url = buildWeatherUrl(lat, lon);
fetchData(url);
};
return { data, loading, error, getWeatherData };
};
import { useState } from "react";
import axios from "axios";
import { withCaching } from "../utils/withCaching";
export const useFetchWithCaching = () => {
const [data, setData] = useState(null);
const [loading, setLoading] = useState(false);
const [error, setError] = useState(null);
const fetchData = withCaching(async (url, params = {}) => {
setLoading(true);
try {
const response = await axios.get(url, params);
setData(response.data);
} catch (error) {
setError(error);
} finally {
setLoading(false);
}
});
return { data, loading, error, fetchData };
};
I know I can simply use the units parameter on the openweather url but I want to save as much API calls as possible.
