only show tab when user has starter packs

src/components/StarterPack/ProfileStarterPacks.tsx

@@ -6,20 +6,17 @@ import {
   View,
   ViewStyle,
 } from 'react-native'
-import {msg, Trans} from '@lingui/macro'
+import {AppBskyGraphGetActorStarterPacks} from '@atproto/api'
-import {useLingui} from '@lingui/react'
+import {Trans} from '@lingui/macro'
+import {InfiniteData, UseInfiniteQueryResult} from '@tanstack/react-query'
 
-import {cleanError} from '#/lib/strings/errors'
 import {useTheme} from '#/lib/ThemeContext'
 import {logger} from '#/logger'
 import {isNative, isWeb} from '#/platform/detection'
 import {usePalette} from 'lib/hooks/usePalette'
-import {useActorStarterPacksQuery} from 'state/queries/actor-starter-packs'
 import {usePreferencesQuery} from 'state/queries/preferences'
 import {FeedLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder'
-import {ErrorMessage} from 'view/com/util/error/ErrorMessage'
 import {List, ListRef} from 'view/com/util/List'
-import {LoadMoreRetryBtn} from 'view/com/util/LoadMoreRetryBtn'
 import {Text} from 'view/com/util/text/Text'
 import {StarterPackCard} from '#/components/StarterPack/StarterPackCard'
 
@@ -33,7 +30,10 @@ interface SectionRef {
 }
 
 interface ProfileFeedgensProps {
-  did: string
+  starterPacksQuery: UseInfiniteQueryResult<
+    InfiniteData<AppBskyGraphGetActorStarterPacks.OutputSchema, unknown>,
+    Error
+  >
   scrollElRef: ListRef
   headerOffset: number
   enabled?: boolean
@@ -46,47 +46,40 @@ export const ProfileStarterPacks = React.forwardRef<
   SectionRef,
   ProfileFeedgensProps
 >(function ProfileFeedgensImpl(
-  {did, scrollElRef, headerOffset, enabled, style, testID, setScrollViewTag},
+  {
+    starterPacksQuery: query,
+    scrollElRef,
+    headerOffset,
+    enabled,
+    style,
+    testID,
+    setScrollViewTag,
+  },
   ref,
 ) {
   const pal = usePalette('default')
-  const {_} = useLingui()
   const theme = useTheme()
   const [isPTRing, setIsPTRing] = React.useState(false)
-
+  const {data: pages, refetch, isFetching, hasNextPage, fetchNextPage} = query
-  const {
-    data,
-    isFetching,
-    isError,
-    isFetched,
-    fetchNextPage,
-    refetch,
-    hasNextPage,
-    error,
-  } = useActorStarterPacksQuery({
-    did,
-  })
   const {data: preferences} = usePreferencesQuery()
 
-  const isEmpty = !isFetching && data?.pages.length === 0
+  const isEmpty = pages?.pages.length === 0
 
   const items = React.useMemo(() => {
     let items: any[] = []
-    if (isError && isEmpty) {
+    if (isEmpty) {
       items = items.concat([ERROR_ITEM])
     }
-    if (!isFetched && isFetching) {
+    if (isEmpty) {
-      items = items.concat([LOADING])
-    } else if (isEmpty) {
       items = items.concat([EMPTY])
-    } else if (data?.pages) {
+    } else if (pages?.pages) {
-      items = data?.pages.flatMap(page => page.starterPacks)
+      items = pages?.pages.flatMap(page => page.starterPacks)
     }
-    if (isError && !isEmpty) {
+    if (!isEmpty) {
       items = items.concat([LOAD_MORE_ERROR_ITEM])
     }
     return items
-  }, [isError, isEmpty, isFetched, isFetching, data])
+  }, [isEmpty, pages])
 
   React.useImperativeHandle(ref, () => ({
     scrollToTop: () => {},
@@ -103,18 +96,14 @@ export const ProfileStarterPacks = React.forwardRef<
   }, [refetch, setIsPTRing])
 
   const onEndReached = React.useCallback(async () => {
-    if (isFetching || !hasNextPage || isError) return
+    if (isFetching || !hasNextPage) return
 
     try {
       await fetchNextPage()
     } catch (err) {
       logger.error('Failed to load more starter packs', {message: err})
     }
-  }, [isFetching, hasNextPage, isError, fetchNextPage])
+  }, [isFetching, hasNextPage, fetchNextPage])
-
-  const onPressRetryLoadMore = React.useCallback(() => {
-    fetchNextPage()
-  }, [fetchNextPage])
 
   const renderItem = React.useCallback(
     ({item, index}: ListRenderItemInfo<any>) => {
@@ -128,19 +117,6 @@ export const ProfileStarterPacks = React.forwardRef<
             </Text>
           </View>
         )
-      } else if (item === ERROR_ITEM) {
-        return (
-          <ErrorMessage message={cleanError(error)} onPressTryAgain={refetch} />
-        )
-      } else if (item === LOAD_MORE_ERROR_ITEM) {
-        return (
-          <LoadMoreRetryBtn
-            label={_(
-              msg`There was an issue fetching your lists. Tap here to try again.`,
-            )}
-            onPress={onPressRetryLoadMore}
-          />
-        )
       } else if (item === LOADING) {
         return <FeedLoadingPlaceholder />
       }
@@ -155,7 +131,7 @@ export const ProfileStarterPacks = React.forwardRef<
       }
       return null
     },
-    [error, refetch, onPressRetryLoadMore, pal, preferences, _],
+    [pal, preferences],
   )
 
   React.useEffect(() => {

src/view/screens/Profile.tsx

@@ -2,6 +2,7 @@ import React, {useCallback, useMemo} from 'react'
 import {StyleSheet} from 'react-native'
 import {
   AppBskyActorDefs,
+  AppBskyGraphGetActorStarterPacks,
   moderateProfile,
   ModerationOpts,
   RichText as RichTextAPI,
@@ -9,7 +10,11 @@ import {
 import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 import {useFocusEffect} from '@react-navigation/native'
-import {useQueryClient} from '@tanstack/react-query'
+import {
+  InfiniteData,
+  UseInfiniteQueryResult,
+  useQueryClient,
+} from '@tanstack/react-query'
 
 import {cleanError} from '#/lib/strings/errors'
 import {useProfileShadow} from '#/state/cache/profile-shadow'
@@ -29,6 +34,7 @@ import {combinedDisplayName} from 'lib/strings/display-names'
 import {isInvalidHandle} from 'lib/strings/handles'
 import {colors, s} from 'lib/styles'
 import {listenSoftReset} from 'state/events'
+import {useActorStarterPacksQuery} from 'state/queries/actor-starter-packs'
 import {PagerWithHeader} from 'view/com/pager/PagerWithHeader'
 import {ProfileHeader, ProfileHeaderLoading} from '#/screens/Profile/Header'
 import {ProfileFeedSection} from '#/screens/Profile/Sections/Feed'
@@ -70,6 +76,7 @@ export function ProfileScreen({route}: Props) {
   } = useProfileQuery({
     did: resolvedDid,
   })
+  const starterPacksQuery = useActorStarterPacksQuery({did: resolvedDid})
 
   const onPressTryAgain = React.useCallback(() => {
     if (resolveError) {
@@ -87,7 +94,7 @@ export function ProfileScreen({route}: Props) {
   }, [queryClient, profile?.viewer?.blockedBy, resolvedDid])
 
   // Most pushes will happen here, since we will have only placeholder data
-  if (isLoadingDid || isLoadingProfile) {
+  if (isLoadingDid || isLoadingProfile || starterPacksQuery.isLoading) {
     return (
       <CenteredView>
         <ProfileHeaderLoading />
@@ -109,6 +116,7 @@ export function ProfileScreen({route}: Props) {
     return (
       <ProfileScreenLoaded
         profile={profile}
+        starterPacksQuery={starterPacksQuery}
         moderationOpts={moderationOpts}
         isPlaceholderProfile={isPlaceholderProfile}
         hideBackButton={!!route.params.hideBackButton}
@@ -132,11 +140,16 @@ function ProfileScreenLoaded({
   isPlaceholderProfile,
   moderationOpts,
   hideBackButton,
+  starterPacksQuery,
 }: {
   profile: AppBskyActorDefs.ProfileViewDetailed
   moderationOpts: ModerationOpts
   hideBackButton: boolean
   isPlaceholderProfile: boolean
+  starterPacksQuery: UseInfiniteQueryResult<
+    InfiniteData<AppBskyGraphGetActorStarterPacks.OutputSchema, unknown>,
+    Error
+  >
 }) {
   const profile = useProfileShadow(profileUnshadowed)
   const {hasSession, currentAccount} = useSession()
@@ -185,10 +198,13 @@ function ProfileScreenLoaded({
   const showMediaTab = !hasLabeler
   const showLikesTab = isMe
   const showFeedsTab = isMe || (profile.associated?.feedgens || 0) > 0
-  const showStarterPacksTab = isMe || true
+  const showStarterPacksTab =
+    isMe || !!starterPacksQuery.data?.pages?.[0].starterPacks.length
   const showListsTab =
     hasSession && (isMe || (profile.associated?.lists || 0) > 0)
 
+  console.log(starterPacksQuery.data?.pages)
+
   const sectionTitles = [
     showFiltersTab ? _(msg`Labels`) : undefined,
     showListsTab && hasLabeler ? _(msg`Lists`) : undefined,
@@ -433,7 +449,7 @@ function ProfileScreenLoaded({
           ? ({headerHeight, isFocused, scrollElRef}) => (
               <ProfileStarterPacks
                 ref={starterPacksSectionRef}
-                did={profile.did}
+                starterPacksQuery={starterPacksQuery}
                 scrollElRef={scrollElRef as ListRef}
                 headerOffset={headerHeight}
                 enabled={isFocused}