Group multiple queries into a single query

[clicktodev]

I'm trying to create a query to bundles together multiple queries.
My main goal is to invalidate one query that invalidates the queries called by it.

export function useTrackInfo(trackId) {
	// current method
	const getTrackQuery = useGetTrack(trackId);
	const getTrackAudioAnalysisQuery = useGetTrackAudioAnalysis(trackId);

	// I don't wanna return this because I won't be able to give the trackInfo query a query key for invalidation
	return {
		getTrackQuery,
		getTrackAudioAnalysisQuery,
	};
	// current method

	// Is it possible to achieve something like this?
	// Basically when I invalidate "track-info", both [getTrackQuery, getTrackAudioAnalysisQuery] will be invalidated
	return useQuery(["track-info", trackId], async () => {
		return [getTrackQuery(trackId), getTrackAudioAnalysisQuery(trackId)];
	});

	// I understand It could possible to do something like this but I haven't tried it yet
	useQueries({
		queries: [useGetTrack(trackId), useGetTrackAudioAnalysis(trackId)],
	});
}

[clicktodev]

Invalidating track-info would invalidate getTrackQuery and getTrackAudioAnalysisQuery
In this use case you might say It's unnecessary because the queries are under the same resource track but Imagine if it was a resource that relied on multiple unrelated resources.
Something like a useGroupedQueries hook would seem fitting.