What's the best way for data initialization and reuse state data?
I'm using Refine with supabase. I want to have data initialized when the app first load, save those in state, then map that in my componenents when needed without calling the api again.
I'm thinking of using useContext and useContext.Provider with useState for the data and setData, wrapping that outside my Refine app. Then create another component called DataInitialization to call the data and setData in Context, like this:
// DataInitialization.tsx
const DataInitialization: React.FC = () => {
const { data, isLoading, isError } = useList<TCountry, HttpError>({
resource: 'dataCountryList'
});
const { setData } = useDataCountryList();
useEffect(() => {
if (!isLoading && !isError) {
console.log('Country List pulled', data.data);
setData(data.data);
// Additional API calls and state setting can be done here
}
}, [data, isLoading, isError, setData]);
return null; // This component doesn't render anything
};
export default DataInitialization;
What do you think, is there a better way? Do I really need to install another library? I want to use the existing Refine React Query.
I'm thinking of using useContext and useContext.Provider with useState for the data and setData, wrapping that outside my Refine app. Then create another component called DataInitialization to call the data and setData in Context, like this:
// DataInitialization.tsx
const DataInitialization: React.FC = () => {
const { data, isLoading, isError } = useList<TCountry, HttpError>({
resource: 'dataCountryList'
});
const { setData } = useDataCountryList();
useEffect(() => {
if (!isLoading && !isError) {
console.log('Country List pulled', data.data);
setData(data.data);
// Additional API calls and state setting can be done here
}
}, [data, isLoading, isError, setData]);
return null; // This component doesn't render anything
};
export default DataInitialization;
What do you think, is there a better way? Do I really need to install another library? I want to use the existing Refine React Query.
