[PE-5881] Reduce data stored in lineup caches

packages/common/src/api/tan-query/types.ts

@@ -1,9 +1,12 @@
+import { EntityType } from '@audius/sdk'
 import {
  DefinedInitialDataOptions,
  UseInfiniteQueryResult,
  UseQueryOptions
 } from '@tanstack/react-query'
 
+import { ID } from '~/models'
+
 import { loadNextPage } from './utils/infiniteQueryLoadNextPage'
 import { UseLineupQueryData } from './utils/useLineupQuery'
 
@@ -20,6 +23,8 @@ export type SelectableQueryOptions<TData, TResult = TData> = Omit<
  'queryKey' | 'queryFn'
 >
 
+export type LineupData = { id: ID; type: EntityType }
+
 export type LineupQueryData = UseLineupQueryData &
  Pick<
  UseInfiniteQueryResult,

packages/common/src/api/tan-query/useAiTracks.ts

@@ -1,18 +1,18 @@
 import { useEffect } from 'react'
 
-import { OptionalId } from '@audius/sdk'
+import { OptionalId, EntityType } from '@audius/sdk'
 import { useInfiniteQuery, useQueryClient } from '@tanstack/react-query'
 import { useDispatch } from 'react-redux'
 
-import { transformAndCleanList, userTrackMetadataFromSDK } from '~/adapters'
+import { userTrackMetadataFromSDK } from '~/adapters/track'
+import { transformAndCleanList } from '~/adapters/utils'
 import { useAudiusQueryContext } from '~/audius-query'
-import { PlaybackSource } from '~/models/Analytics'
-import { UserTrackMetadata } from '~/models/Track'
+import { PlaybackSource } from '~/models'
 import { aiPageLineupActions, aiPageSelectors } from '~/store/pages'
 import { fetchAiUser } from '~/store/pages/ai/slice'
 
 import { QUERY_KEYS } from './queryKeys'
-import { QueryOptions } from './types'
+import { LineupData, QueryOptions } from './types'
 import { useCurrentUserId } from './useCurrentUserId'
 import { primeTrackData } from './utils/primeTrackData'
 import { useLineupQuery } from './utils/useLineupQuery'
@@ -45,7 +45,7 @@ export const useAiTracks = (
  const queryData = useInfiniteQuery({
  queryKey: getAiTracksQueryKey({ handle, pageSize }),
  initialPageParam: 0,
- getNextPageParam: (lastPage: UserTrackMetadata[], allPages) => {
+ getNextPageParam: (lastPage: LineupData[], allPages) => {
  if (lastPage.length < pageSize) return undefined
  return allPages.length * pageSize
  },
@@ -77,7 +77,10 @@ export const useAiTracks = (
  })
  )
 
- return processedTracks
+ return processedTracks.map((t) => ({
+ id: t.track_id,
+ type: EntityType.TRACK
+ }))
  },
  select: (data) => data?.pages.flat(),
  ...options,

packages/common/src/api/tan-query/useLibraryTracks.ts

@@ -1,4 +1,4 @@
-import { Id } from '@audius/sdk'
+import { Id, EntityType } from '@audius/sdk'
 import {
  GetUserLibraryTracksSortMethodEnum,
  GetUserLibraryTracksSortDirectionEnum
@@ -19,7 +19,7 @@ import { removeNullable } from '~/utils'
 import { userTrackMetadataFromSDK } from '../../adapters/track'
 
 import { QUERY_KEYS } from './queryKeys'
-import { QueryOptions } from './types'
+import { QueryOptions, LineupData } from './types'
 import { useCurrentUserId } from './useCurrentUserId'
 import { loadNextPage } from './utils/infiniteQueryLoadNextPage'
 import { primeTrackData } from './utils/primeTrackData'
@@ -107,9 +107,12 @@ export const useLibraryTracks = (
  )
  )
 
- return tracks
+ return tracks.map((t) => ({
+ id: t.track_id,
+ type: EntityType.TRACK
+ }))
  },
- getNextPageParam: (lastPage, allPages) => {
+ getNextPageParam: (lastPage: LineupData[], allPages) => {
  if (lastPage.length < pageSize) return undefined
  return allPages.length * pageSize
  },

packages/common/src/api/tan-query/usePremiumTracks.ts

@@ -1,18 +1,18 @@
-import { OptionalId } from '@audius/sdk'
+import { OptionalId, EntityType } from '@audius/sdk'
 import { useInfiniteQuery, useQueryClient } from '@tanstack/react-query'
 import { useDispatch } from 'react-redux'
 
-import { transformAndCleanList, userTrackMetadataFromSDK } from '~/adapters'
+import { userTrackMetadataFromSDK } from '~/adapters/track'
+import { transformAndCleanList } from '~/adapters/utils'
 import { useAudiusQueryContext } from '~/audius-query'
-import { PlaybackSource } from '~/models/Analytics'
-import { UserTrackMetadata } from '~/models/Track'
+import { PlaybackSource } from '~/models'
 import {
  premiumTracksPageLineupActions,
  premiumTracksPageLineupSelectors
 } from '~/store/pages'
 
 import { QUERY_KEYS } from './queryKeys'
-import { QueryOptions } from './types'
+import { LineupData, QueryOptions } from './types'
 import { useCurrentUserId } from './useCurrentUserId'
 import { primeTrackData } from './utils/primeTrackData'
 import { useLineupQuery } from './utils/useLineupQuery'
@@ -40,26 +40,24 @@ export const usePremiumTracks = (
  const queryData = useInfiniteQuery({
  queryKey: getPremiumTracksQueryKey(pageSize),
  initialPageParam: 0,
- getNextPageParam: (lastPage: UserTrackMetadata[], allPages) => {
+ getNextPageParam: (lastPage: LineupData, allPages) => {
  if (lastPage.length < pageSize) return undefined
  return allPages.length * pageSize
  },
  queryFn: async ({ pageParam }) => {
  const sdk = await audiusSdk()
-
- const { data: tracks } =
+ const { data: tracks = [] } =
  await sdk.full.tracks.getTrendingUSDCPurchaseTracks({
  userId: OptionalId.parse(currentUserId),
  limit: pageSize,
  offset: pageParam
  })
 
- if (!tracks) return []
-
  const processedTracks = transformAndCleanList(
  tracks,
  userTrackMetadataFromSDK
  )
+
  primeTrackData({ tracks: processedTracks, queryClient, dispatch })
 
  // Update lineup when new data arrives
@@ -72,9 +70,12 @@ export const usePremiumTracks = (
  )
  )
 
- return processedTracks
+ return processedTracks.map((t) => ({
+ id: t.track_id,
+ type: EntityType.TRACK
+ }))
  },
- select: (data) => data.pages.flat(),
+ select: (data) => data?.pages.flat(),
  ...options,
  enabled: options?.enabled !== false
  })

packages/common/src/api/tan-query/useProfileReposts.ts

@@ -1,4 +1,4 @@
-import { Id } from '@audius/sdk'
+import { Id, EntityType } from '@audius/sdk'
 import { useInfiniteQuery, useQueryClient } from '@tanstack/react-query'
 import { useDispatch } from 'react-redux'
 
@@ -12,7 +12,7 @@ import {
 } from '~/store/pages'
 
 import { QUERY_KEYS } from './queryKeys'
-import { QueryOptions } from './types'
+import { LineupData, QueryOptions } from './types'
 import { useCurrentUserId } from './useCurrentUserId'
 import { primeUserData } from './utils'
 import { primeCollectionData } from './utils/primeCollectionData'
@@ -43,10 +43,7 @@ export const useProfileReposts = (
  const queryData = useInfiniteQuery({
  queryKey: getProfileRepostsQueryKey({ handle, pageSize }),
  initialPageParam: 0,
- getNextPageParam: (
- lastPage: (UserTrackMetadata | UserCollectionMetadata)[],
- allPages
- ) => {
+ getNextPageParam: (lastPage: LineupData[], allPages) => {
  if (lastPage.length < pageSize) return undefined
  return allPages.length * pageSize
  },
@@ -100,7 +97,12 @@ export const useProfileReposts = (
  })
  )
 
- return reposts
+ // Return only ids
+ return reposts.map((t) =>
+ 'track_id' in t
+ ? { id: t.track_id, type: EntityType.TRACK }
+ : { id: t.playlist_id, type: EntityType.PLAYLIST }
+ )
  },
  select: (data) => {
  return data?.pages?.flat()

packages/common/src/api/tan-query/useProfileTracks.ts

@@ -1,10 +1,9 @@
-import { Id } from '@audius/sdk'
+import { EntityType, Id } from '@audius/sdk'
 import { useInfiniteQuery, useQueryClient } from '@tanstack/react-query'
 import { useDispatch } from 'react-redux'
 
 import { transformAndCleanList, userTrackMetadataFromSDK } from '~/adapters'
 import { useAudiusQueryContext } from '~/audius-query'
-import { UserTrackMetadata } from '~/models'
 import { PlaybackSource } from '~/models/Analytics'
 import {
  profilePageSelectors,
@@ -13,7 +12,7 @@ import {
 import { TracksSortMode } from '~/store/pages/profile/types'
 
 import { QUERY_KEYS } from './queryKeys'
-import { QueryOptions } from './types'
+import { LineupData, QueryOptions } from './types'
 import { useCurrentUserId } from './useCurrentUserId'
 import { primeTrackData } from './utils/primeTrackData'
 import { useLineupQuery } from './utils/useLineupQuery'
@@ -55,7 +54,7 @@ export const useProfileTracks = (
  const queryData = useInfiniteQuery({
  queryKey: getProfileTracksQueryKey({ handle, pageSize, sort, getUnlisted }),
  initialPageParam: 0,
- getNextPageParam: (lastPage: UserTrackMetadata[], allPages) => {
+ getNextPageParam: (lastPage: LineupData[], allPages) => {
  if (lastPage.length < pageSize) return undefined
  return allPages.length * pageSize
  },
@@ -91,7 +90,10 @@ export const useProfileTracks = (
  )
  )
 
- return processedTracks
+ return processedTracks.map((t) => ({
+ id: t.track_id,
+ type: EntityType.TRACK
+ }))
  },
  select: (data) => data?.pages.flat(),
  ...options,

packages/common/src/api/tan-query/useRemixes.ts

@@ -1,12 +1,11 @@
 import { useEffect } from 'react'
 
-import { Id, OptionalId } from '@audius/sdk'
+import { Id, OptionalId, EntityType } from '@audius/sdk'
 import { useInfiniteQuery, useQueryClient } from '@tanstack/react-query'
 import { useDispatch } from 'react-redux'
 
 import { transformAndCleanList, userTrackMetadataFromSDK } from '~/adapters'
 import { useAudiusQueryContext } from '~/audius-query'
-import { UserTrackMetadata } from '~/models'
 import { PlaybackSource } from '~/models/Analytics'
 import {
  remixesPageLineupActions,
@@ -15,7 +14,7 @@ import {
 } from '~/store/pages'
 
 import { QUERY_KEYS } from './queryKeys'
-import { QueryOptions } from './types'
+import { QueryOptions, LineupData } from './types'
 import { useCurrentUserId } from './useCurrentUserId'
 import { primeTrackData } from './utils/primeTrackData'
 import { useLineupQuery } from './utils/useLineupQuery'
@@ -50,7 +49,7 @@ export const useRemixes = (
  const queryData = useInfiniteQuery({
  queryKey: getRemixesQueryKey({ trackId, pageSize }),
  initialPageParam: 0,
- getNextPageParam: (lastPage: UserTrackMetadata[], allPages) => {
+ getNextPageParam: (lastPage: LineupData[], allPages) => {
  if (lastPage.length < pageSize) return undefined
  return allPages.length * pageSize
  },
@@ -81,7 +80,10 @@ export const useRemixes = (
  )
  )
 
- return processedTracks
+ return processedTracks.map((t) => ({
+ id: t.track_id,
+ type: EntityType.TRACK
+ }))
  },
  select: (data) => data.pages.flat(),
  ...options,