architecting complex calendar app
I'm building a complex calendar app and need some help with react-query implementation.. Users can 'subscribe' to multiple calendars, a calendar from a person, a room and a class. Each different calendartype has their own api endpoint. This api-endpoint receives a startdate/enddate and class/room/person id
I'm using a calendar component which returns the fromDate and ToDate that is visible in that view. So for ex 2023-07-03 - 2023-07-09. We need to get data for these dates.
Also this calendar component needs 1 array for all the events with a predefined structure.
So now I need to call for example 3 different apis, with same start/enddate but with different ids and different url.
For now I have a custom hook, which receives a list of objects (type of calendar and their id: roomXYZ, roomapi and the start/enddate), i map over the Ids and generate a queryKey and queryFn using useQueries. And now I also have to select / map and transform the api response to the calendar component type.
This custom hook is getting quite big now and I also didnt get it to work right yet. I was wondering if I'm on the right track?
Or should I split the 3 apis (class/room/person) to their own hook? and merge them in the Reactcomponent?
Any help is appreciated 🙂 I'm fairly new to react-query..
0 Replies