diff --git a/src/components/Albums/component.tsx b/src/components/Albums/component.tsx
index 84c736fe..67422e63 100644
--- a/src/components/Albums/component.tsx
+++ b/src/components/Albums/component.tsx
@@ -1,6 +1,6 @@
import { ActivityIndicator, RefreshControl } from 'react-native'
import { Separator, useTheme, XStack, YStack } from 'tamagui'
-import React, { RefObject, useEffect, useRef } from 'react'
+import React, { RefObject, useCallback, useEffect, useRef } from 'react'
import { Text } from '../Global/helpers/text'
import { FlashList, FlashListRef } from '@shopify/flash-list'
import { UseInfiniteQueryResult } from '@tanstack/react-query'
@@ -45,6 +45,14 @@ export default function Albums({
(letter) => (pendingLetterRef.current = letter.toUpperCase()),
)
+ const ItemSeparatorComponent = useCallback(
+ ({ leadingItem, trailingItem }: { leadingItem: unknown; trailingItem: unknown }) =>
+ typeof leadingItem === 'string' || typeof trailingItem === 'string' ? null : (
+
+ ),
+ [],
+ )
+
// Effect for handling the pending alphabet selector letter
useEffect(() => {
if (isString(pendingLetterRef.current) && albumsInfiniteQuery.data) {
@@ -115,7 +123,7 @@ export default function Albums({
ListFooterComponent={
albumsInfiniteQuery.isFetchingNextPage ? : null
}
- ItemSeparatorComponent={() => }
+ ItemSeparatorComponent={ItemSeparatorComponent}
refreshControl={
indices.indexOf(value) === index)
}, [showAlphabeticalSelector, artists])
+ const ItemSeparatorComponent = useCallback(
+ ({ leadingItem, trailingItem }: { leadingItem: unknown; trailingItem: unknown }) =>
+ typeof leadingItem === 'string' || typeof trailingItem === 'string' ? null : (
+
+ ),
+ [],
+ )
+
// Effect for handling the pending alphabet selector letter
useEffect(() => {
if (isString(pendingLetterRef.current) && artists) {
@@ -107,7 +115,7 @@ export default function Artists({
? item.toString()
: item.Id!
}
- ItemSeparatorComponent={() => }
+ ItemSeparatorComponent={ItemSeparatorComponent}
ListEmptyComponent={
diff --git a/src/components/Library/tab-bar.tsx b/src/components/Library/tab-bar.tsx
index 40f5a6f3..d523c2fe 100644
--- a/src/components/Library/tab-bar.tsx
+++ b/src/components/Library/tab-bar.tsx
@@ -26,18 +26,12 @@ function LibraryTabBar(props: MaterialTopTabBarProps) {
{[''].includes(props.state.routes[props.state.index].name) ? null : (
{props.state.routes[props.state.index].name === 'Playlists' ? (
+ typeof leadingItem === 'string' || typeof trailingItem === 'string' ? null : (
+
+ ),
+ [],
+ )
+
// Effect for handling the pending alphabet selector letter
useEffect(() => {
if (isString(pendingLetterRef.current) && tracksInfiniteQuery.data) {
@@ -136,7 +144,7 @@ export default function Tracks({
}
+ ItemSeparatorComponent={ItemSeparatorComponent}
numColumns={1}
data={tracksInfiniteQuery.data}
keyExtractor={keyExtractor}