I prefer to create a separate key map per API namespace. It's looks like this:
export const myzoneKeys = { all: ['myzone'] as const, profile: (profileId: string | undefined) => [...myzoneKeys.all, profileId || 'no-profile'] as const, myList: (profileId: string | undefined) => [...myzoneKeys.profile(profileId), 'my-list'] as const, recommendations: (profileId: string | undefined) => [...myzoneKeys.profile(profileId), 'recommendations'] as const, recommendationsDetail: (profileId: string | undefined) => [...myzoneKeys.profile(profileId), 'recommendations-detail'] as const, recentlyWatched: (profileId: string | undefined) => [...myzoneKeys.profile(profileId), 'recently-watched'] as const, recentlyWatchedChannel: (profileId: string | undefined) => [...myzoneKeys.recentlyWatched(profileId), 'channel'] as const, recentlyWatchedProgram: (profileId: string | undefined) => [...myzoneKeys.recentlyWatched(profileId), 'program'] as const, recentlyWatchedRecording: (profileId: string | undefined) => [...myzoneKeys.recentlyWatched(profileId), 'recording'] as const, recentlyWatchedVod: (profileId: string | undefined) => [...myzoneKeys.recentlyWatched(profileId), 'vod'] as const, };
In complex apps, this have several advantages:
all
recentlyWatched
Also, I don't use useQuery across the app. I create custom query hooks in single API packages divided to API namespace and use it in app.
useQuery
I really like this approach. Thanks for sharing.
I think this post explain the concept mentioned by @dikamilo tkdodo.eu/blog/effective-react-que...
Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment's permalink.
Hide child comments as well
Confirm
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
I prefer to create a separate key map per API namespace. It's looks like this:
In complex apps, this have several advantages:
all
keyrecentlyWatched
key, since all other recently watched keys are based on thisAlso, I don't use
useQuery
across the app. I create custom query hooks in single API packages divided to API namespace and use it in app.I really like this approach. Thanks for sharing.
I think this post explain the concept mentioned by @dikamilo tkdodo.eu/blog/effective-react-que...